/* ══════════════════════════════════════════════════════════════════════════════════════════════
   LA LETRA DE NUNIO · Selawik, servida desde nuestro propio servidor
   ──────────────────────────────────────────────────────────────────────────────────────────────
   🔴 POR QUÉ HACÍA FALTA: el CSS declaraba `'Segoe UI', -apple-system, Roboto, sans-serif`, que
      es una pila del SISTEMA. Cada computador ponía la letra que tuviera —Segoe UI en Windows,
      otra en Linux— así que la misma pantalla se veía distinta según quién la mirara, y las
      capturas no coincidían con lo que veía Pablo.
   🔴 POR QUÉ SELAWIK Y NO OTRA: la publicó Microsoft con licencia libre (SIL OFL) como sustituta
      **métricamente compatible** de Segoe UI — un texto ocupa exactamente el mismo espacio. No es
      «parecida»: está hecha para ocupar su lugar sin descolocar nada. Segoe UI misma no se puede
      servir: es propiedad de Microsoft.
   🔴 DESDE NUESTRO SERVIDOR, no de Google ni de ningún CDN: tres archivos de 43 KB en /fonts/.
      Nada que pedirle a internet, nada que falle si se cae.
   ⚠️ `font-display: swap`: el texto se lee DE INMEDIATO con la letra del sistema y cambia cuando
      llega la nuestra. Sin esto la pantalla queda en blanco mientras baja.
   ══════════════════════════════════════════════════════════════════════════════════════════════ */

@font-face {                                  /* normal */
  font-family: 'Selawik';
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src: url('/fonts/selawk.ttf') format('truetype');
}
@font-face {                                  /* medio */
  font-family: 'Selawik';
  font-weight: 600;
  font-style: normal;
  font-display: swap;
  src: url('/fonts/selawksb.ttf') format('truetype');
}
@font-face {                                  /* fuerte */
  font-family: 'Selawik';
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  src: url('/fonts/selawkb.ttf') format('truetype');
}

/* 🔴 LA PILA, con el sistema DETRÁS: si por lo que sea la letra no llega, la pantalla sigue
   legible con la del sistema en vez de caer en la de fábrica del navegador. */
/* 🔴 POPPINS EN TODA LA APP (Pablo la aprobó el 05/10, viendo la opción B al lado de la A).
   Antes acá decía Selawik y Poppins vivía solo en `--letra-titulo`. Esta línea es el único
   lugar donde se decide: cambiarla de vuelta a Selawik devuelve la app entera a como estaba.
   ⚠️ Selawik queda DETRÁS en la pila, no se borra: si Poppins no llegara, la pantalla sigue
      legible con ella y recién después cae en la del sistema. */
:root { --letra: 'Poppins', 'Selawik', 'Segoe UI', -apple-system, Roboto, sans-serif; }

/* ══════════════════════════════════════════════════════════════════════════════════════════════
   LA ESCALA DE TAMAÑOS · cinco pasos, UN solo número para moverlos todos
   ──────────────────────────────────────────────────────────────────────────────────────────────
   🔴 VIVE ACÁ Y NO EN `nunio-sistema.css` por un motivo concreto: el Dashboard carga esta hoja y
      no aquella. Pablo pidió que la escala aplique «a las 26 pantallas y al Dashboard por igual»,
      y con los tamaños allá el Dashboard era el único que no subía.
   🔴 `--escala` ES EL ÚNICO NÚMERO QUE HAY QUE TOCAR. Subirlo agranda las cinco medidas a la vez,
      conservando la proporción entre ellas. Bajarlo las achica. Nada más hay que cambiar.
   ⚠️ Subido a 1.12 el 05/10 (con Selawik, Pablo veía todo pequeño; antes era 1, sin multiplicar) y
      BAJADO A 1.08 EL 07/10, que Pablo aprobó mirando Métricas. Baja los cinco tamaños a la vez:
      `--t-chico` 14→13,5 · `--t-base` 15,12→14,58 · `--t-titulo` 19,04→18,36 · `--t-cifra` 31,36→30,24.
      Los redondeos a medio píxel los hace el navegador; no se fijan a mano para no perder la
      proporción.
   ══════════════════════════════════════════════════════════════════════════════════════════════ */
:root {
  --escala: 1.08;

  /* los cinco pasos, cada uno por su rol. Entre paréntesis, qué tamaños sueltos absorbió. */
  /* 🔴 11 → 11,2 (Pablo, 07/10). Con `--escala:1.08` el 11 daba 11,88 px, por debajo del piso
     de 12 que el pidio; 11,2 × 1.08 = 12,096. A 1.12 sigue bien (12,54). Es el UNICO tamaño
     suelto que se toco: los fijos de 10 a 11,5 px quedan anotados en la bitacora, sin tocar. */
  --t-micro:  calc(11.2px * var(--escala));   /* etiquetas, pies, contadores   (9 · 10 · 10,5 · 11,5) */
  --t-chico:  calc(12.5px * var(--escala));   /* texto pequeño, tablas densas  (12) */
  --t-base:   calc(13.5px * var(--escala));   /* el texto normal               (13 · 14) */
  --t-titulo: calc(17px   * var(--escala));   /* títulos y encabezados         (15 · 16 · 18 · 19 · 20) */
  --t-cifra:  calc(28px   * var(--escala));   /* los números grandes           (22 a 56) */
}

/* ══════════════════════════════════════════════════════════════════════════════════════════════
   POPPINS · la letra de los títulos, los botones y las pestañas (Pablo, 05/10)
   ──────────────────────────────────────────────────────────────────────────────────────────────
   🔴 CONVIVEN DOS LETRAS, CADA UNA CON SU PAPEL. Poppins es geométrica y ancha: luce en un
      título de seis palabras y cansa en una tabla de cuarenta filas. Selawik es métricamente
      compatible con Segoe UI y está hecha para leerse en párrafo. Por eso:
        Poppins  → títulos de pantalla y de bloque · nombre de la sección · números grandes de
                   las tarjetas · botones · pestañas
        Selawik  → texto de lectura · tablas · chats · campos de formulario
   🔴 `--letra` NO SE TOCA. Se agrega `--letra-titulo` y se le da a los roles de arriba. Si
      algún día hay que pasar TODO a Poppins, se cambia una sola línea: la de `--letra`.
   🔴 SE SIRVE DESDE NUESTRO SERVIDOR, como Selawik: nada que pedirle a Google ni a ningún CDN.
      Licencia SIL OFL 1.1, copiada en /fonts/Poppins-OFL.txt.
   ⚠️ OCHO ARCHIVOS Y NO CUATRO: cada peso viene partido en «latin» y «latin-ext» con su
      `unicode-range`. El español entero cabe en «latin», así que el navegador baja 4 (31 KB) y
      los otros solo si aparece un carácter raro. Un archivo único por peso pesaría el doble.
   ══════════════════════════════════════════════════════════════════════════════════════════════ */

@font-face {                                  /* normal · latin */
  font-family: 'Poppins';
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src: url('/fonts/poppins-400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {                                  /* normal · latin-ext */
  font-family: 'Poppins';
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src: url('/fonts/poppins-400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {                                  /* medio · latin */
  font-family: 'Poppins';
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  src: url('/fonts/poppins-500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {                                  /* medio · latin-ext */
  font-family: 'Poppins';
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  src: url('/fonts/poppins-500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {                                  /* semifuerte · latin */
  font-family: 'Poppins';
  font-weight: 600;
  font-style: normal;
  font-display: swap;
  src: url('/fonts/poppins-600-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {                                  /* semifuerte · latin-ext */
  font-family: 'Poppins';
  font-weight: 600;
  font-style: normal;
  font-display: swap;
  src: url('/fonts/poppins-600-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {                                  /* fuerte · latin */
  font-family: 'Poppins';
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  src: url('/fonts/poppins-700-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {                                  /* fuerte · latin-ext */
  font-family: 'Poppins';
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  src: url('/fonts/poppins-700-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* 🔴 LA PILA, con Selawik DETRÁS y el sistema al final: si Poppins no llega, el título se ve
   con la misma letra que el resto de la pantalla, no con la de fábrica del navegador. */
:root { --letra-titulo: 'Poppins', 'Selawik', 'Segoe UI', -apple-system, Roboto, sans-serif; }

/* ──────────────────────────────────────────────────────────────────────────────────────────────
   DÓNDE SE USA · lista EXPLÍCITA, no un barrido
   ⚠️ Atarla al tamaño («todo lo que use --t-titulo») habría pintado de Poppins los ÍCONOS: de
      los 40 selectores que usan ese token, 17 son contenedores de emoji —`.nav-icon`,
      `.logo-icon`, `.contact-avatar`, `.canal-ico`…— que lo usan para DIMENSIONAR, no para
      titular. Contado, no supuesto. Por eso la lista va a mano.
   ────────────────────────────────────────────────────────────────────────────────────────────── */

/* títulos de pantalla y de bloque */
h1, h2, h3, h4, h5, h6,
/* el nombre de la sección, bajo el logo del menú, y las entradas del menú */
.sidebar-logo .logo-seccion, .nav-item,
/* botones */
.btn, button, .mini, .pri,
/* pestañas — los nombres salen de contar las que existen de verdad en el HTML */
.tab-btn, .catalog-tab-btn, .mt-tab, .rag-tab-btn, .train-tab, .msg-tab, .bt-pestana,
.pestanas a, .pestanas button, [role="tab"],
/* los números grandes de las tarjetas */
.stat-value, .stat-num, .sales-stat-val, .df-num, .mt-num .va, .kpi .v, .numero .val {
  font-family: var(--letra-titulo);
}

/* ⚠️ ESTA REGLA CAMBIÓ DE SENTIDO EL 05/10 Y POR ESO SE REESCRIBE EL COMENTARIO. Nació para
   DEVOLVER los campos a Selawik cuando Poppins vivía solo en los títulos. Ahora `--letra` ES
   Poppins, así que lo que hace es asegurarse de que los campos sigan la letra de la app aunque
   lleven una clase de botón —`.btn` se le pone a veces a un <input type="submit">—. Se deja
   porque es el enganche que mantiene a los campos atados a UNA sola fuente de verdad: el día que
   Pablo quiera separarlos otra vez, se cambia acá y en ningún otro lado. */
input.btn, select.btn, textarea.btn, input, select, textarea { font-family: var(--letra); }