/* ==========================================================
   EMTEL Typography System - San Francisco Layer v2.2.39
   Capa final de tipografia, pesos, numeros, tracking y respuesta.

   Nota tecnica:
   - No se incluyen archivos .otf/.ttf de Apple.
   - Se usa San Francisco si el sistema operativo la tiene disponible.
   - En Windows/Linux se aplica fallback compatible y legible.
   ========================================================== */

:root {
  /* Familias canonicas */
  --font-sf-text: "SF Pro Text", "SF Pro", -apple-system, BlinkMacSystemFont, "Segoe UI Variable", "Segoe UI", Roboto, Arial, sans-serif;
  --font-sf-display: "SF Pro Display", "SF Pro", "SF Pro Text", -apple-system, BlinkMacSystemFont, "Segoe UI Variable", "Segoe UI", Roboto, Arial, sans-serif;
  --font-sf-compact: "SF Compact Text", "SF Compact Display", "SF Pro Text", -apple-system, BlinkMacSystemFont, "Segoe UI Variable", "Segoe UI", Roboto, Arial, sans-serif;
  --font-sf-mono: "SF Mono", "SFMono-Regular", ui-monospace, "Cascadia Mono", "Segoe UI Mono", Menlo, Consolas, monospace;

  --font-sans: var(--font-sf-text);
  --font-body: var(--font-sf-text);
  --font-display: var(--font-sf-display);
  --font-compact: var(--font-sf-compact);
  --font-mono: var(--font-sf-mono);

  /* Escala de pesos real de SF Pro */
  --weight-thin: 100;
  --weight-ultralight: 200;
  --weight-light: 300;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;
  --weight-heavy: 800;
  --weight-black: 900;

  /* Uso semantico: evita exceso de negrita */
  --font-body-weight: var(--weight-regular);
  --font-label-weight: var(--weight-medium);
  --font-control-weight: var(--weight-medium);
  --font-button-weight: var(--weight-semibold);
  --font-table-head-weight: var(--weight-semibold);
  --font-table-body-weight: var(--weight-regular);
  --font-title-weight: var(--weight-bold);
  --font-section-weight: var(--weight-bold);
  --font-card-title-weight: var(--weight-semibold);
  --font-kpi-weight: var(--weight-bold);

  /* Escala responsiva compacta para ERP */
  --text-2xs: clamp(.68rem, .66rem + .08vw, .72rem);
  --text-xs: clamp(.73rem, .71rem + .10vw, .78rem);
  --text-sm: clamp(.80rem, .78rem + .12vw, .86rem);
  --text-md: clamp(.88rem, .85rem + .16vw, .95rem);
  --text-base: clamp(.94rem, .90rem + .20vw, 1rem);
  --text-lg: clamp(1.04rem, .98rem + .30vw, 1.18rem);
  --text-xl: clamp(1.18rem, 1.04rem + .72vw, 1.46rem);
  --text-2xl: clamp(1.36rem, 1.13rem + 1.10vw, 1.86rem);
  --text-3xl: clamp(1.58rem, 1.22rem + 1.75vw, 2.34rem);

  --leading-tight: 1.12;
  --leading-title: 1.16;
  --leading-control: 1.22;
  --leading-table: 1.34;
  --leading-body: 1.48;

  --tracking-tight: -.028em;
  --tracking-title: -.022em;
  --tracking-normal: 0;
  --tracking-soft: .006em;
  --tracking-label: .012em;
  --tracking-caps: .055em;

  --font-optical-text: 0;
  --table-font-size: var(--text-sm);
  --table-header-size: var(--text-xs);
  --btn-weight: var(--font-button-weight);
}

html {
  font-size: 16px;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body,
button,
input,
select,
textarea,
.table,
.card,
.app-shell,
.main,
.login-page {
  font-family: var(--font-body);
  font-optical-sizing: auto;
}

body {
  font-size: var(--text-base);
  line-height: var(--leading-body);
  font-weight: var(--font-body-weight);
  letter-spacing: var(--tracking-normal);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4,
.page-title,
.section-heading h1,
.section-heading h2,
.finance-page-heading h2,
.teacher-pay-hero h2,
.card__head h3,
.soft-section-title h3,
.worker-main h3,
.config-tile.refined h3 {
  font-family: var(--font-display);
  font-weight: var(--font-section-weight);
  line-height: var(--leading-title);
  letter-spacing: var(--tracking-title);
  text-wrap: balance;
}

h1, .page-title {
  font-size: var(--text-3xl);
  font-weight: var(--font-title-weight);
  letter-spacing: var(--tracking-tight);
}

h2, .section-heading h2, .finance-page-heading h2, .teacher-pay-hero h2 {
  font-size: var(--text-2xl);
  font-weight: var(--font-title-weight);
}

h3, .card__head h3, .soft-section-title h3, .worker-main h3, .config-tile.refined h3 {
  font-size: var(--text-lg);
  font-weight: var(--font-card-title-weight);
  letter-spacing: -.012em;
}

h4 {
  font-size: var(--text-base);
  font-weight: var(--font-card-title-weight);
}

p, li, dd, .section-subtitle, .card p, .worker-main p, .config-tile.refined p {
  font-size: var(--text-md);
  line-height: var(--leading-body);
  font-weight: var(--weight-regular);
  letter-spacing: var(--tracking-normal);
}

strong, b {
  font-weight: var(--weight-semibold);
}

label,
.field span,
.field label,
.finance-form-grid .field span,
.teacher-pay-toolbar.refined-toolbar .field span,
.teacher-payment-dossier .field span,
.teacher-payment-dossier .modern-check span,
.main .field label > span {
  font-size: var(--text-sm) !important;
  font-weight: var(--font-label-weight) !important;
  line-height: var(--leading-control);
  letter-spacing: var(--tracking-label);
}

input, select, textarea,
.form-control,
.search-field,
.filter-field {
  font-size: var(--text-sm);
  font-weight: var(--weight-regular);
  line-height: var(--leading-control);
  letter-spacing: var(--tracking-normal);
}

input::placeholder,
textarea::placeholder {
  color: #94a3b8;
  font-weight: var(--weight-regular);
}

button,
.btn,
.primary,
.secondary,
.ghost,
.icon-btn,
.tabs button,
.subtabs button,
.student-payment-subtabs button,
.quota-tab,
.action-button,
.finance-action-button {
  font-family: var(--font-compact);
  font-size: var(--text-sm);
  font-weight: var(--font-button-weight) !important;
  line-height: var(--leading-control);
  letter-spacing: var(--tracking-soft);
}

/* Sidebar: SF Compact + menos negrita para evitar ruido visual */
.sidebar,
.sidebar *:not(svg):not(path),
.nav,
.nav *,
.modern-sidebar,
.modern-sidebar *:not(svg):not(path),
.role-session,
.role-session *:not(svg):not(path) {
  font-family: var(--font-compact);
}

.sidebar .nav-item,
.sidebar button,
.modern-sidebar .nav-item,
.modern-sidebar button,
.nav button,
.nav a {
  font-size: var(--text-sm);
  font-weight: var(--weight-medium) !important;
  letter-spacing: var(--tracking-soft);
}

.sidebar .nav-item.is-active,
.sidebar button.is-active,
.modern-sidebar .nav-item.is-active,
.modern-sidebar button.is-active,
.nav button.active,
.nav a.active {
  font-weight: var(--weight-semibold) !important;
}

.brand__mark,
.eyebrow,
.badge,
.status-pill,
.chip,
.program-chip,
.group-pill,
.metric-mini span,
.finance-summary-card small,
.registration-read-table th,
th {
  font-family: var(--font-compact);
  font-size: var(--text-xs);
  font-weight: var(--weight-semibold) !important;
  letter-spacing: var(--tracking-caps) !important;
}

/* Tablas y datos: legibilidad + numeros tabulares */
table,
.data-table,
.registration-read-table,
.teacher-pay-table,
.finance-table,
.spreadsheet-table {
  font-family: var(--font-sf-text);
  font-size: var(--table-font-size);
  line-height: var(--leading-table);
}

td,
.registration-read-table td,
.teacher-pay-table td,
.finance-table td,
.table-main-text,
.readonly-cobros-row .table-main-text {
  font-weight: var(--font-table-body-weight) !important;
  letter-spacing: var(--tracking-normal);
}

th,
.registration-read-table th,
.teacher-pay-table th,
.finance-table th,
.spreadsheet-table th {
  font-weight: var(--font-table-head-weight) !important;
  letter-spacing: var(--tracking-caps) !important;
}

.numeric,
.money,
.amount,
.kpi-value,
.finance-summary-card strong,
.teacher-session-amount,
.teacher-pay-detail-kpis strong,
.payment-plan-preview-card strong,
.quota-tab strong,
input[type="number"],
code,
pre,
.report-output textarea,
.crm-message-card textarea,
#crmMessage,
.whatsapp-preview code,
.raw-wa-field textarea {
  font-variant-numeric: tabular-nums lining-nums;
  font-feature-settings: "tnum" 1, "lnum" 1;
}

code,
pre,
.report-output textarea,
.crm-message-card textarea,
#crmMessage,
.whatsapp-preview code,
.raw-wa-field textarea {
  font-family: var(--font-mono) !important;
  font-size: var(--text-sm);
  line-height: 1.45;
}

.kpi-value,
.teacher-insight-card strong,
.finance-summary-card strong,
.teacher-pay-detail-kpis strong {
  font-family: var(--font-display);
  font-weight: var(--font-kpi-weight) !important;
  letter-spacing: -.024em;
}

small,
.hint,
.muted-text,
.teacher-pay-table td small,
.registration-read-table td small,
.mini-row small,
.teacher-session-overview small,
.teacher-session-date span {
  font-size: var(--text-xs);
  font-weight: var(--weight-regular) !important;
  line-height: 1.34;
  letter-spacing: var(--tracking-normal);
}

/* Ajuste de exceso de negrita heredada */
.card strong,
td strong,
.mini-row strong,
.entity-dialog-grid span,
.detail-card > summary span,
.payment-plan-preview-card span,
.student-payment-card.compact header span,
.voucher-mini-card strong,
.quota-tab span,
.finance-quota-tabs .quota-tab span,
.teacher-turn-pill small,
.bank-copy-grid strong,
.monthly-two-cols span {
  font-weight: var(--weight-semibold) !important;
}

.form-section legend,
.inline-fieldset legend,
.modern-modal legend,
.column-picker summary,
.crm-email-box summary,
.calendar-preview summary,
.detail-card > summary em,
.status-note {
  font-weight: var(--weight-semibold) !important;
}

/* Densidad responsiva: formularios, tablas y vistas financieras */
@media (max-width: 1180px) {
  :root {
    --text-base: clamp(.92rem, .88rem + .18vw, .98rem);
    --text-lg: clamp(1rem, .96rem + .22vw, 1.12rem);
    --text-xl: clamp(1.12rem, 1rem + .55vw, 1.34rem);
    --text-2xl: clamp(1.26rem, 1.08rem + .80vw, 1.64rem);
    --table-row-height: 48px;
    --table-cell-y: .62rem;
    --table-cell-x: .68rem;
  }
}

@media (max-width: 860px) {
  :root {
    --text-xs: .72rem;
    --text-sm: .80rem;
    --text-md: .87rem;
    --text-base: .94rem;
    --text-lg: 1.02rem;
    --text-xl: 1.16rem;
    --text-2xl: 1.32rem;
    --text-3xl: 1.52rem;
    --leading-body: 1.44;
    --tracking-caps: .045em;
    --control-height-md: 42px;
  }

  h1, .page-title, h2, .section-heading h2, .finance-page-heading h2, .teacher-pay-hero h2 {
    letter-spacing: -.018em;
  }

  .section-heading,
  .finance-page-heading,
  .teacher-pay-hero {
    gap: .55rem;
  }

  table,
  .data-table,
  .registration-read-table,
  .teacher-pay-table,
  .finance-table {
    font-size: .79rem;
  }
}

@media (max-width: 560px) {
  :root {
    --text-xs: .70rem;
    --text-sm: .78rem;
    --text-md: .84rem;
    --text-base: .91rem;
    --text-lg: .98rem;
    --text-xl: 1.08rem;
    --text-2xl: 1.20rem;
    --text-3xl: 1.36rem;
    --leading-body: 1.40;
    --table-row-height: 44px;
  }

  button,
  .btn,
  .primary,
  .secondary,
  .ghost,
  .tabs button,
  .subtabs button {
    letter-spacing: 0;
  }
}

/* Documentos internos del ERP tambien heredan la capa San Francisco/fallback. */
.teacher-monthly-document,
.teacher-report-a4-demo,
.monthly-letter-head,
.monthly-memo-grid {
  font-family: var(--font-body) !important;
}
