/* Shared interface typography. Document field fonts remain controlled by the template editor. */
:root {
  --ui-font: Arial, sans-serif;
  --ui-font-xs: 12px;
  --ui-font-sm: 13px;
  --ui-font-control: 14px;
  --ui-font-body: 16px;
  --ui-font-title: 18px;
  --ui-font-subheading: 20px;
  --ui-font-heading: 22px;
  --ui-font-page: clamp(26px, 3.5vw, 32px);
  --ui-weight-regular: 400;
  --ui-weight-medium: 600;
  --ui-weight-bold: 700;
  --ui-ink: #243247;
  --ui-muted: #526174;
  --ui-heading: #073b78;
  --text-primary: var(--ui-ink);
  --text-secondary: var(--ui-muted);
  --admin-text: var(--ui-ink);
  --admin-muted: var(--ui-muted);
  --official-text: var(--ui-ink);
  --official-muted: var(--ui-muted);
  --staff-text: var(--ui-ink);
  --staff-text-muted: var(--ui-muted);
  --profile-text: var(--ui-ink);
  --profile-muted: var(--ui-muted);
}
body { font-family: var(--ui-font); font-size: var(--ui-font-body); font-weight: var(--ui-weight-regular); line-height: 1.5; color: var(--ui-ink); }
body :is(button, input, select, textarea, summary, dialog, table, option, optgroup, output) { font-family: var(--ui-font); }
body ::file-selector-button { font-family: var(--ui-font); }
body :is(pre, code, kbd, samp, .temporary-password) { font-family: var(--ui-font); }
body :is(h1, h2, h3, h4) { font-family: var(--ui-font); font-weight: var(--ui-weight-bold); line-height: 1.3; }
body h1, body :is(.hero-content, .profile-heading, .official-page-heading, .admin-page-heading, .staff-page-heading, .tracking-header) h1 {
  font-size: var(--ui-font-page);
  line-height: 1.25;
  letter-spacing: -.02em;
  color: var(--ui-heading);
}
body h2, body :is(.profile-section-heading, .official-panel-heading, .admin-panel-heading, .panel-heading, .section-heading) h2 {
  font-size: var(--ui-font-heading);
  line-height: 1.35;
  letter-spacing: normal;
}
body h3 { font-size: var(--ui-font-title); }
body h4 { font-size: var(--ui-font-body); }
body :is(.form-group, .profile-field, .official-form-field, .admin-form-field, .birth-entry) > label {
  font-size: var(--ui-font-control);
  font-weight: var(--ui-weight-medium);
  line-height: 1.5;
}
body :is(.form-group, .profile-field, .official-form-field, .admin-form-field) :is(input, select, textarea) {
  font-family: var(--ui-font);
  font-size: var(--ui-font-body);
  line-height: 1.5;
}
body :is(.main-navigation, .admin-navigation, .official-navigation, .staff-navigation) > a,
body :is(.navigation-logout, .admin-account, .official-account, .staff-account) button {
  font-size: var(--ui-font-control);
  font-weight: var(--ui-weight-medium);
  line-height: 1.4;
}
body :is(.button, .button-link, .primary-action, .official-primary-action, .admin-primary-action,
  .official-secondary-action, .official-danger-action, .profile-button, .profile-edit-shortcut,
  .registration-submit, .registration-back) {
  font-family: var(--ui-font);
  font-size: var(--ui-font-control);
  font-weight: var(--ui-weight-medium);
  line-height: 1.4;
}
body :is(.field-help, .profile-form-help, .template-management-note, .form-help, .guest-note) {
  font-size: var(--ui-font-sm);
  line-height: 1.5;
  color: var(--ui-muted);
}
body :is(.admin-table-container, .official-table-container, .table-container) th {
  font-size: var(--ui-font-sm);
  font-weight: var(--ui-weight-bold);
  line-height: 1.45;
}
body :is(.admin-table-container, .official-table-container, .table-container) td {
  font-size: var(--ui-font-control);
  line-height: 1.5;
}
body :is(.credential-value, .credential-item, .account-badge, .status-badge) { font-variant-numeric: tabular-nums; }

/* Screen interfaces use one semantic type scale. Printable documents keep their own CSS. */
@media screen {
  body :is(h1, h2, h3, h4) {
    font-weight: var(--ui-weight-bold) !important;
  }

  body :is(strong, b) {
    font-weight: var(--ui-weight-medium) !important;
  }

  body :is(h1, h2, h3, h4) :is(strong, b) {
    font-weight: var(--ui-weight-bold) !important;
  }

  body h1,
  body :is(.hero-content, .profile-heading, .official-page-heading, .admin-page-heading, .staff-page-heading, .tracking-header) h1 {
    font-size: var(--ui-font-page) !important;
  }

  body h2,
  body :is(.profile-section-heading, .official-panel-heading, .admin-panel-heading, .panel-heading, .section-heading) h2 {
    font-size: var(--ui-font-heading) !important;
  }

  body h3 { font-size: var(--ui-font-title) !important; }
  body h4 { font-size: var(--ui-font-body) !important; }

  body :is(.backup-card-heading, .backup-procedure-heading, .obi-card) h2 {
    font-size: var(--ui-font-title) !important;
  }

  body :is(.form-group, .profile-field, .official-form-field, .admin-form-field, .birth-entry) > label,
  body :is(.main-navigation, .admin-navigation, .official-navigation, .staff-navigation) > a,
  body :is(.navigation-logout, .admin-account, .official-account, .staff-account) button,
  body .portal-navigation-menu-button,
  body :is(.button, .button-link, .primary-action, .official-primary-action, .admin-primary-action,
    .official-secondary-action, .official-danger-action, .profile-button, .profile-edit-shortcut,
    .registration-submit, .registration-back, .ui-action) {
    font-size: var(--ui-font-control) !important;
    font-weight: var(--ui-weight-medium) !important;
  }

  body :is(label, legend, button, summary) {
    font-weight: var(--ui-weight-medium) !important;
  }

  body ::file-selector-button {
    font-weight: var(--ui-weight-medium) !important;
  }

  body :is(.form-group, .profile-field, .official-form-field, .admin-form-field) :is(input, select, textarea) {
    font-size: var(--ui-font-body) !important;
  }

  body :is(.field-help, .profile-form-help, .template-management-note, .form-help, .guest-note,
    .backup-field-hint) {
    font-size: var(--ui-font-sm) !important;
  }

  body :is(.admin-eyebrow, .official-eyebrow, .staff-eyebrow, .obi-eyebrow,
    .account-badge, .status-badge, .admin-action-badge, .backup-card-badge,
    .backup-history-result, .badge, .template-state, .resident-profile-state,
    .resident-setup-warning, .backup-status-metadata dt, .backup-archive-metadata dt,
    .backup-restore-mode-label, .backup-impact-summary li span,
    .backup-status-card span:not(.backup-status-icon), .backup-procedure-toggle,
    .conversion-candidate-details dt, .report-document-heading span, .obi-signal > span) {
    font-size: var(--ui-font-xs) !important;
    font-weight: var(--ui-weight-medium) !important;
  }

  body :is(.admin-table-container, .official-table-container, .table-container) th {
    font-size: var(--ui-font-sm) !important;
    font-weight: var(--ui-weight-medium) !important;
  }

  body :is(.admin-table-container, .official-table-container, .table-container) td {
    font-size: var(--ui-font-control) !important;
  }

  body :is(.admin-filter-actions a, .status-review-warning a) {
    font-weight: var(--ui-weight-medium) !important;
  }
}

@media (max-width: 600px) {
  body h2, body :is(.profile-section-heading, .official-panel-heading, .admin-panel-heading, .panel-heading, .section-heading) h2 { font-size: var(--ui-font-subheading) !important; }
}
