/* Onfarmanet SAS · FarmaGuard — Design System: TOKENS (única fuente de verdad).
 * Dirección v4 «Estación clínica de sello» (rediseño 2026-08-13, veredicto del dueño): shell de
 * rail lateral + identidad «Sello clínico»: neutros DERIVADOS DEL TEAL de marca (papel, tinta y
 * bordes con el matiz de la marca — nada de gris-azul genérico), papel milimetrado bajo los
 * charts, espina de severidad en filas de casos, sello-escudo en estados vacíos, cohortes
 * honestas. UNA sola familia tipográfica (Inter) en 4 pesos reales, escala de 7 tamaños en px
 * ENTEROS (11·12·13·14·17·24·32; 40 solo display de landing), grilla de 4px estricta.
 * Contrato: docs/DESIGN-SYSTEM.md (vivo). Valores espejados en deploy/landing (inline) y en la
 * extensión (ds.css / overlay.ts); la paridad la verifica `scripts/validar_ds.py`. Los NEUTROS
 * v4 divergen del espejo A PROPÓSITO (ESPEJO_DELIBERADO): el popup se alinea en su propio ciclo
 * (0.3.9+) y el overlay es contrato clínico congelado — sus tokens no se tocan desde aquí.
 *
 * VOCABULARIO DE SUFIJOS (contrato de naming — no inventar sinónimos):
 *   -strong / -deep  = más oscuro (énfasis / máxima profundidad de la familia)
 *   -soft / -tint    = fondo lavado de la familia (tint = el más tenue)
 *   -line            = borde de la familia (acompaña a -soft)
 *   -text            = variante AA (≥4.5:1) para TEXTO sobre blanco
 *   -raised / -sunken= elevación de superficie (arriba / hundida)
 *   Regla: familia primero, modificador después (--danger-soft, jamás --soft-danger). */

/* ── Tipografía self-hosted (Inter variable, subset latin, woff2). Sin request externo →
 *    privacidad + performance + CSP-safe. La url() relativa la reescribe el manifest de WhiteNoise. */
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("./fonts/inter-latin-wght-normal.260c81a4759b.woff2") format("woff2");
}

:root {
  /* ── Marca (identidad teal; CONGELADA por el gate 10-C) ── */
  --brand: #0b7a6b;
  --brand-strong: #0a6457;
  --brand-deep: #073f37;
  --brand-soft: #e3f1ee;
  --brand-tint: #f0f7f5;

  /* ── Neutros del sello (derivados del teal: la identidad la cargan los neutros) ──
   * papel #f3f7f5 · tinta #10201c · sunken #e7efeb · border #d9e5e0 (mockups v4 medidos: AA
   * computado 0 fallos en 90 corridas). --ink-subtle es el gris MÁS claro que sigue dando ≥4.5:1
   * sobre papel y sobre raised (los rótulos de KPI y de columna viven en él). */
  --ink: #10201c;
  --ink-muted: #3f5d55;
  --ink-subtle: #587169;
  --surface: #f3f7f5;
  --surface-raised: #fdfefd;
  --surface-sunken: #e7efeb;
  --border: #d9e5e0;
  --border-strong: #c3d4cd;
  /* Banda oscura: SOLO páginas sin sesión (landing, auth, errores) — la consola usa el rail. */
  --banda: #0c2420;
  --banda-text: #b9cfc8;
  --banda-muted: #8db3a9;  /* rótulos en versalitas sobre la banda (AA ≥4.5 medido) */
  --banda-accent: #6fa99d; /* eyebrow/acento sobre la banda */

  /* ── Foco (alias de marca: cambiar el teal = una línea) ── */
  --ring: var(--brand);
  --ring-glow: 0 0 0 3px rgba(11, 122, 107, 0.22);

  /* ── Severidad / estado clínico (semántica separada de la marca; CONGELADA gate 10-C) ──
   * *-fill/-border: vívido. *-text: variante AA sobre blanco (≥4.5:1). Espejados en la extensión.
   * --danger-deep: SOLO para el relleno CRITICAL de charts (CRITICAL y HIGH eran indistinguibles
   * en barras — auditoría DS 2026-07-30); los badges siguen siendo la fuente semántica del color. */
  --danger: #c0392b;   --danger-text: #a32319;   --danger-soft: #fdecea;   --danger-line: #f3c4bd;
  --danger-deep: #8e2317;
  --warning: #e67e22;  --warning-text: #8a5304;  --warning-soft: #fdf1e7;  --warning-line: #f6d4b3;
  --caution: #d4a012;  --caution-text: #7a5b00;  --caution-soft: #fbf4dd;  --caution-line: #ecdca0;
  --success: #27ae60;  --success-text: #0b7a4e;  --success-soft: #e7f6ee;  --success-line: #b9e3cb;
  --info: var(--brand); --info-text: #095e52;    --info-soft: var(--brand-soft); --info-line: #bfe0d9;

  /* ── Tipografía: UNA familia, 4 pesos reales, 7 tamaños ENTEROS ──
   * Escala v4 (censo: v1 tenía 10 tamaños con 12.08/14.4/14.5 y pesos sintetizados 550/650).
   * En rem sobre 16px para respetar la preferencia del navegador; a 16px dan px enteros. Los
   * line-height van ADIMENSIONALES, calibrados para caer en múltiplos de 4 con la raíz por
   * defecto (16/16/20/20/24/32/40) — y escalar CON la preferencia (r15: en px fijos, una raíz
   * agrandada solapaba líneas y la promesa del rem era decorativa). */
  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  --fs-2xs: 0.6875rem;  /* 11px · versalitas de rótulo (KPI, columna, eyebrow) */
  --fs-xs: 0.75rem;     /* 12px · meta, hints, pie */
  --fs-sm: 0.8125rem;   /* 13px · títulos de card, celdas secundarias, botones sm */
  --fs-base: 0.875rem;  /* 14px · cuerpo, tablas, nav */
  --fs-md: var(--fs-base);
  --fs-lg: 1.0625rem;   /* 17px · marca, funnel numeral, tarjetas de landing */
  --fs-xl: 1.5rem;      /* 24px · H1 de vista, KPI secundario */
  --fs-2xl: 2rem;       /* 32px · numeral KPI display (el display 40 vive SOLO en la landing, inline) */
  --lh-body: 1.4286;    /* 20/14 */
  --lh-tight: 1.3333;   /* 32/24 */
  --measure: 66ch;
  --tracking-tight: -0.02em;
  --tracking-num: -0.03em; /* numerales display 700 */
  --tracking-wide: 0.06em; /* versalitas de rótulo */
  --tracking-wider: 0.08em; /* eyebrow: la versalita más chica (11px) pide más aire */

  /* ── Espaciado (escala 4px estricta; el 20 existe SOLO como gap de .topbar__inner) ── */
  --s-1: 4px;  --s-2: 8px;  --s-3: 12px; --s-4: 16px;
  --s-5: 24px; --s-6: 32px; --s-7: 48px; --s-8: 64px;

  /* ── Radios: 2 de chrome (8 / píldora) + 4px SOLO en extremos de dato (barras) ── */
  --r-xs: 4px; --r-sm: 8px; --r-md: 8px; --r-lg: 8px; --r-pill: 999px;

  /* ── Elevación: UNA sombra de reposo (hairline-first) + una flotante para popovers ── */
  --shadow-xs: 0 1px 2px rgba(16, 32, 28, 0.06);
  --shadow-sm: var(--shadow-xs);
  --shadow-md: var(--shadow-xs);
  --shadow-lg: 0 18px 40px -12px rgba(16, 32, 28, 0.18), 0 4px 10px -4px rgba(16, 32, 28, 0.08);

  /* ── Motion: UN compuesto de uso (micro-cambios); duración/curva separadas por si crece ── */
  --duration-fast: 120ms;
  --easing-standard: cubic-bezier(0.2, 0.6, 0.2, 1);
  --ease: var(--duration-fast) var(--easing-standard);

  /* ── Layout: rail 232 + lienzo 1200 (consola); 720/960 para hoja documental sin nav ── */
  --rail-w: 232px;
  --container: 1200px;
  --container-narrow: 720px;
  --container-prose: 960px;
  --topbar-h: 56px;
}
