/* Tipografía de interfaz: las mismas fuentes locales que los documentos. */
@font-face {
  font-family: "Platform Arial";
  src: url("../assets/fonts/arial/Arial-Regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Platform Arial";
  src: url("../assets/fonts/arial/Arial-Bold.ttf") format("truetype");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: "Platform Arial";
  src: url("../assets/fonts/arial/Arial-Italic.ttf") format("truetype");
  font-style: italic;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Platform Arial";
  src: url("../assets/fonts/arial/Arial-BoldItalic.ttf") format("truetype");
  font-style: italic;
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: "Platform Ticket";
  src: url("../assets/fonts/tickets/Ticket-Regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Platform Ticket";
  src: url("../assets/fonts/tickets/Ticket-Medium.ttf") format("truetype");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: "Platform Ticket";
  src: url("../assets/fonts/tickets/Ticket-SemiBold.ttf") format("truetype");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: "Platform Ticket";
  src: url("../assets/fonts/tickets/Ticket-Bold.ttf") format("truetype");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: "Platform Ticket";
  src: url("../assets/fonts/tickets/Ticket-ExtraBold.ttf") format("truetype");
  font-style: normal;
  font-weight: 800 900;
  font-display: swap;
}
@font-face {
  font-family: "Platform Ticket";
  src: url("../assets/fonts/tickets/Ticket-Oblique.ttf") format("truetype");
  font-style: italic;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Platform Ticket";
  src: url("../assets/fonts/tickets/Ticket-MediumOblique.ttf") format("truetype");
  font-style: italic;
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: "Platform Ticket";
  src: url("../assets/fonts/tickets/Ticket-SemiBoldOblique.ttf") format("truetype");
  font-style: italic;
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: "Platform Ticket";
  src: url("../assets/fonts/tickets/Ticket-BoldOblique.ttf") format("truetype");
  font-style: italic;
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: "Platform Ticket";
  src: url("../assets/fonts/tickets/Ticket-ExtraBoldOblique.ttf") format("truetype");
  font-style: italic;
  font-weight: 800 900;
  font-display: swap;
}

:root {
  --font-sans: "Platform Arial", Arial, Helvetica, sans-serif;
  --font-body: var(--font-sans);
  --font-heading: "Platform Ticket", Georgia, serif;
  --interface-title-color: var(--ui-primary, var(--primary, #1565c0));
  --interface-subtitle-color: #30343a;
  font-family: var(--font-body);
}

html[data-theme="dark"] { --interface-subtitle-color: #d4d7dc; }
body { font-family: var(--font-body); }
button, input, select, textarea, option { font-family: var(--font-body); }

/* La prioridad unifica los encabezados aunque cada módulo conserve sus tamaños. */
body :is(
  h1, h2, h3, [role="heading"], #quickAttendanceTitle,
  .brand-copy > strong, .brand-identity > strong, .legal-brand,
  .ui-classroom-card__title > strong, .ui-content-card__title,
  .savings-card-title, .field-journal-card-title,
  .schools-directory-title, .account-page-title, .module-title, .section-title
):not(:where(
  [contenteditable], [contenteditable] *, .ql-editor *, .ProseMirror *,
  .planning-paper-preview *, .planning-document-preview *,
  .field-journal-note-content *, .evaluation-item-content *
)) {
  font-family: var(--font-heading) !important;
  font-weight: 700 !important;
  color: var(--interface-title-color) !important;
  letter-spacing: normal !important;
}

body :is(h1, h2, #quickAttendanceTitle):not(:where(
  [contenteditable], [contenteditable] *, .ql-editor *, .ProseMirror *,
  .planning-paper-preview *, .planning-document-preview *,
  .field-journal-note-content *, .evaluation-item-content *
)) { font-weight: 800 !important; }

body :is(
  h4, h5, h6, .subtitle, .subheading, .ui-content-card__subtitle,
  .brand-copy > small, .brand-identity > small,
  .savings-card-description, .tickets-editor-identity > p,
  .diagnosis-document-subtitle, #quickAttendanceContext, #evaluationStudentsDialogContext,
  :is(
    .module-heading, .section-heading, .dialog-title-row,
    .classroom-dialog-heading, .student-dialog-heading, .evaluation-dialog-heading,
    .attendance-export-heading, .planning-web-heading, .field-journal-module-heading,
    .school-hub-heading, .schedules-module-heading, .documents-heading,
    .civic-module-heading, .agenda-module-heading, .account-page-heading,
    .module-context-bar
  ) > p,
  :is(
    .module-heading, .section-heading, .dialog-title-row,
    .classroom-dialog-heading, .student-dialog-heading, .evaluation-dialog-heading,
    .attendance-export-heading, .planning-web-heading, .field-journal-module-heading,
    .school-hub-heading, .schedules-module-heading, .documents-heading,
    .civic-module-heading, .agenda-module-heading, .account-page-heading,
    .module-context-bar
  ) > div > p
):not(:where(
  [contenteditable], [contenteditable] *, .ql-editor *, .ProseMirror *,
  .planning-paper-preview *, .planning-document-preview *,
  .field-journal-note-content *, .evaluation-item-content *
)) {
  font-family: var(--font-heading) !important;
  font-weight: 500 !important;
  color: var(--interface-subtitle-color) !important;
  letter-spacing: normal !important;
}

/* Los encabezados sobre una superficie primaria conservan el contraste del control. */
#autoCoevalDetailPanel .ui-content-card__header {
  --interface-title-color: var(--ui-on-primary, #ffffff);
  --interface-subtitle-color: var(--ui-on-primary, #ffffff);
}

/* Directorio de todos los módulos: nombres en mayúsculas y primario más profundo en claro. */
#schoolHubView #moduleGrid .module-card h3 {
  font-family: var(--font-body) !important;
  font-size: .76rem;
  text-transform: uppercase;
}
@media (max-width: 700px) {
  #schoolHubView #moduleGrid .module-card h3 {
    font-size: .68rem;
  }
}
html:not([data-theme="dark"]) #schoolHubView #moduleGrid .module-card h3 {
  --interface-title-color: color-mix(in srgb, var(--ui-primary, var(--primary, #1565c0)) 76%, #000000);
}

/* El cuerpo del campo mantiene Arial Regular, también cuando envuelve otros controles. */
.ui-labeled-field__control,
.ui-labeled-field__control :is(input, textarea, select, option, button, [contenteditable="true"]),
.ui-labeled-field__control::placeholder,
.ui-labeled-field__control :is(input, textarea)::placeholder {
  font-family: var(--font-body) !important;
  font-weight: 400 !important;
  font-style: normal !important;
}

/* Las confirmaciones de acciones destructivas usan el rojo semántico del tema. */
dialog.is-danger,
:is([role="dialog"], [role="alertdialog"]).is-danger,
.student-action-dialog.is-danger,
.subject-delete-dialog,
#subjectDeleteDialog,
#attendanceDeleteCommentDialog,
#fieldJournalDeleteDialog,
#gradeClearChoiceDialog,
#gradeGroupClearConfirmDialog,
#gradebookArchivePeriodConfirmDialog,
#activityArchiveConfirmDialog {
  --interface-title-color: var(--ui-danger, var(--danger, #b3261e));
}

/* La categoría breve del encabezado destructivo permanece neutra según el tema. */
:is(
  dialog.is-danger,
  [role="dialog"].is-danger,
  [role="alertdialog"].is-danger,
  .student-action-dialog.is-danger,
  .subject-delete-dialog,
  #subjectDeleteDialog,
  #attendanceDeleteCommentDialog,
  #fieldJournalDeleteDialog,
  #gradeClearChoiceDialog,
  #gradeGroupClearConfirmDialog,
  #gradebookArchivePeriodConfirmDialog,
  #activityArchiveConfirmDialog
) .eyebrow {
  color: #000000 !important;
}
html[data-theme="dark"] :is(
  dialog.is-danger,
  [role="dialog"].is-danger,
  [role="alertdialog"].is-danger,
  .student-action-dialog.is-danger,
  .subject-delete-dialog,
  #subjectDeleteDialog,
  #attendanceDeleteCommentDialog,
  #fieldJournalDeleteDialog,
  #gradeClearChoiceDialog,
  #gradeGroupClearConfirmDialog,
  #gradebookArchivePeriodConfirmDialog,
  #activityArchiveConfirmDialog
) .eyebrow {
  color: #ffffff !important;
}

/* El título interno del bloque conserva un color neutro incluso dentro de una confirmación. */
.ui-dialog-block__heading {
  --interface-title-color: #000000;
}
html[data-theme="dark"] .ui-dialog-block__heading {
  --interface-title-color: var(--ui-text, #f0f0f0);
}

/* Sección y cantidad de estudiantes en todos los selectores compartidos de aulas. */
.ui-classroom-card .ui-classroom-card__copy > small {
  font-family: Arial, Helvetica, sans-serif !important;
  font-weight: 400 !important;
  color: var(--ui-text-muted) !important;
}