/*
 * Eagle DS — LOS TOKENS: las variables --eds-* (y las --bs-* que el lenguaje redefine), en claro y en oscuro.
 *
 * VERSIÓN: 1.1 · 20 Oct 2026
 *
 * HISTORIAL
 *   1.1  20 Oct 2026  +La familia «SOBRE TINTA» (`--eds-on-ink`, `-2`, `-3` y `--eds-<tono>-on-ink`): el texto CLARO que va
 *                     sobre un fondo oscuro o de color (globos, barras marinas, chips sólidos). Ese fondo sigue oscuro en
 *                     los dos temas, así que el token vale LO MISMO en claro y en oscuro. Hasta hoy esos colores se
 *                     quedaban escritos a mano (core/eagle_ds.py los dejaba: volverlos texto normal los apagaba).
 *   1.0  17 Oct 2026  Sale de eagle-ds.css (sus bloques de variables, sin cambiar un valor). Razón: el CRM (Jinja2, su
 *                     propio <head>) pinta la MISMA barra del ERP y necesita sus variables, pero no la piel de los
 *                     componentes —Jorge pidió que su contenido quedara «exactamente igual» al original (8 Ago 2026)—.
 *                     Con la barra nueva y sin estas variables, el logo blanco quedó sobre fondo blanco.
 *                     Lo cargan base.html, las pantallas de acceso no (traen las suyas en eagle-acceso.css) y el CRM.
 *
 * Doctrina: docs/DISENO_EAGLE.md. La piel de los componentes: eagle-ds.css. La barra: eagle-megamenu.css.
 */
:root {
  /* ---- primitivos de marca (se usan SÓLO a través de los semánticos de abajo) ---- */
  --eds-blue: #086db6; --eds-blue-600: #065d9c; --eds-blue-700: #0a5a95; --eds-blue-50: #e5eff9; --eds-blue-25: #f1f6fc;
  --eds-navy: #1f4e78; --eds-navy-900: #163a5c; --eds-navy-950: #0f2c47; --eds-brand-red: #e01237;

  /* ---- semánticos ---- */
  --eds-bg: #f2f4f7; --eds-surface: #ffffff; --eds-surface-2: #f5f7fa; --eds-surface-3: #e9edf2;
  --eds-border: #dde3ea; --eds-border-strong: #c3ccd7;
  --eds-text: #14212e; --eds-text-2: #3f4d5c; --eds-text-3: #5f6c7b;
  --eds-accent: var(--eds-blue); --eds-accent-hover: var(--eds-blue-600); --eds-accent-soft: var(--eds-blue-50); --eds-link: var(--eds-blue-700);
  --eds-neg: #b00e2e; --eds-neg-soft: #fdecef; --eds-warn: #92400e; --eds-warn-bar: #d97706; --eds-warn-soft: #fff4e0;
  --eds-pos: #15803d; --eds-pos-soft: #e8f6ed; --eds-info: #0b5a96; --eds-info-soft: #e7f1fb; --eds-neutral: #5d6978; --eds-neutral-soft: #eef1f4;
  --eds-thead-bg: #e8eef5; --eds-thead-text: var(--eds-navy); --eds-zebra: #fafbfd; --eds-row-hover: #eef4fb; --eds-row-sel: #dcebfa;

  --eds-font: "IBM Plex Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --eds-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --eds-radius: 6px; --eds-radius-sm: 4px;
  --eds-shadow: 0 1px 2px rgba(16, 24, 40, .06);
  --eds-cell-y: .55rem; --eds-cell-x: .75rem;

  /* ---- Bootstrap toma el lenguaje por sus propias variables ---- */
  --bs-font-sans-serif: var(--eds-font);
  --bs-body-font-family: var(--eds-font);
  --bs-body-color: var(--eds-text);
  --bs-body-bg: var(--eds-bg);
  --bs-primary: #086db6; --bs-primary-rgb: 8, 109, 182;
  --bs-danger: #b00e2e; --bs-danger-rgb: 176, 14, 46;
  --bs-success: #15803d; --bs-success-rgb: 21, 128, 61;
  --bs-warning: #d97706; --bs-warning-rgb: 217, 119, 6;
  --bs-info: #0b5a96; --bs-info-rgb: 11, 90, 150;
  --bs-secondary-color: var(--eds-text-3);
  --bs-border-color: var(--eds-border);
  --bs-link-color: var(--eds-link); --bs-link-color-rgb: 10, 90, 149; --bs-link-hover-color: var(--eds-navy);
  --bs-border-radius: var(--eds-radius); --bs-border-radius-sm: var(--eds-radius-sm);
  --bs-primary-text-emphasis: var(--eds-blue-700); --bs-primary-bg-subtle: var(--eds-blue-50); --bs-primary-border-subtle: #b9d3ec;
  --bs-danger-text-emphasis: var(--eds-neg); --bs-danger-bg-subtle: var(--eds-neg-soft);
  --bs-success-text-emphasis: var(--eds-pos); --bs-success-bg-subtle: var(--eds-pos-soft);
  --bs-warning-text-emphasis: var(--eds-warn); --bs-warning-bg-subtle: var(--eds-warn-soft);
  --bs-info-text-emphasis: var(--eds-info); --bs-info-bg-subtle: var(--eds-info-soft);

  /* lo que base.html ya exponía: se re-apunta al lenguaje nuevo para que las pantallas que lo usan lo hereden */
  --eagle-blue: #086db6; --eagle-blue-dark: #065d9c;
  --color-critico: #b00e2e; --color-bajo: #d97706; --color-ok: #086db6;
}

/* ---- TEMA OSCURO (beta) ----
   Bootstrap 5.3 trae su modo oscuro con data-bs-theme="dark"; pero este archivo redefine en :root las variables --bs-*
   para el tema claro y, cargado después, le ganaba al modo oscuro de Bootstrap. Aquí se redefinen con un selector más
   específico. Lo que una pantalla pinta con colores escritos a mano NO sigue el tema hasta que se migre. */
html[data-eds-tema="oscuro"] {
  color-scheme: dark;
  --eds-bg: #0f1722; --eds-surface: #16202d; --eds-surface-2: #1b2735; --eds-surface-3: #223042;
  --eds-border: #2a3747; --eds-border-strong: #3a4a60;
  --eds-text: #e6edf5; --eds-text-2: #b4c1d0; --eds-text-3: #8d9bad;
  --eds-accent: #4a9be0; --eds-accent-hover: #63aae6; --eds-accent-soft: #19304a; --eds-link: #7db8ec;
  --eds-blue-700: #7db8ec; --eds-blue-50: #19304a; --eds-blue-25: #142536; --eds-navy: #a9c6e4;
  --eds-neg: #ff7a8a; --eds-neg-soft: #3a1820; --eds-warn: #f4b860; --eds-warn-bar: #f59e0b; --eds-warn-soft: #3a2a12;
  --eds-pos: #5fd08b; --eds-pos-soft: #133024; --eds-info: #6cb0ec; --eds-info-soft: #172c42; --eds-neutral: #a3b0bf; --eds-neutral-soft: #223042;
  --eds-thead-bg: #1c2b3d; --eds-thead-text: #a9c6e4; --eds-zebra: #18222f; --eds-row-hover: #1d2a3a; --eds-row-sel: #1d3550;
  --eds-bar: #0b1520; --eds-bar-2: #12243a;
  --bs-body-bg: #0f1722; --bs-body-color: #e6edf5; --bs-emphasis-color: #fff; --bs-heading-color: #e6edf5;
  --bs-secondary-color: #8d9bad; --bs-secondary-bg: #1b2735; --bs-tertiary-bg: #16202d; --bs-tertiary-color: #8d9bad;
  --bs-border-color: #2a3747; --bs-border-color-translucent: rgba(255, 255, 255, .1);
  --bs-link-color: #7db8ec; --bs-link-color-rgb: 125, 184, 236; --bs-link-hover-color: #a9d0f3;
  --bs-primary-text-emphasis: #7db8ec; --bs-primary-bg-subtle: #19304a; --bs-primary-border-subtle: #24466b;
  --bs-danger-text-emphasis: #ff7a8a; --bs-danger-bg-subtle: #3a1820; --bs-success-text-emphasis: #5fd08b; --bs-success-bg-subtle: #133024;
  --bs-warning-text-emphasis: #f4b860; --bs-warning-bg-subtle: #3a2a12; --bs-info-text-emphasis: #6cb0ec; --bs-info-bg-subtle: #172c42;
  /* El acento es FONDO de botones, pestañas y casillas con letra blanca: en oscuro va el azul profundo (blanco 4.9:1).
     El azul de TEXTO en oscuro es --eds-link (#7db8ec). Hasta la 1.3 era #4a9be0 y daba 2.98:1 en 114 pantallas. */
  --eds-accent: #2b74b9; --eds-accent-hover: #3a82c6;
  --eagle-blue: #2b74b9; --eagle-blue-dark: #3a82c6;
  --bs-primary-rgb: 43, 116, 185; --bs-danger-rgb: 180, 35, 59; --bs-success-rgb: 31, 122, 67; --bs-info-rgb: 43, 116, 185;
}

/* =====================================================================================================================
   LA PALETA COMPLETA (1.2 · 17 Oct 2026) — los colores de TODAS las pantallas pasan por aquí.
   Jorge: «no lo vayas a dejar así, esto tiene que estar bien hecho en todas las pantallas». El guardián en JS corregía
   después de pintar; lo correcto es que cada color escrito a mano en una plantilla sea un TOKEN con su valor claro y su
   valor oscuro. scripts/codemod (ver docs/DISENO_EAGLE.md) cambió 8,472 colores de 370 archivos por estos tokens según
   la PROPIEDAD donde aparecían: un gris como borde es --eds-border, como fondo es --eds-surface-3.
   Cada tono tiene 5 papeles: soft (fondo pastel) · light (fondo/borde medio) · fg (texto y bordes de color) ·
   solid (fondo con texto blanco encima) · strong (texto oscuro sobre soft). En oscuro, fg se ACLARA (para leerse sobre el
   fondo oscuro) y solid se PROFUNDIZA (para que el texto blanco se lea): con un solo valor uno de los dos fallaba.
   Contrastes calculados (scripts/codemod/paleta.py): fg/superficie ≥ 4.5 · blanco/solid ≥ 4.5 · strong/soft ≥ 7, en
   los dos temas.
   ===================================================================================================================== */
:root {
  --eds-text-4: #8a96a6; --eds-ink: #1e293b; --eds-ink-2: #475569;
  --eds-red-soft: #fdecef; --eds-red-light: #f5b5c0; --eds-red-fg: #b00e2e; --eds-red-solid: #b00e2e; --eds-red-strong: #7a0a20;
  --eds-orange-soft: #fff1e6; --eds-orange-light: #fdc7a1; --eds-orange-fg: #c2410c; --eds-orange-solid: #c2410c; --eds-orange-strong: #7c2d12;
  --eds-amber-soft: #fff4e0; --eds-amber-light: #fcd38d; --eds-amber-fg: #92400e; --eds-amber-solid: #b45309; --eds-amber-strong: #78350f;
  --eds-green-soft: #e8f6ed; --eds-green-light: #a7dcb9; --eds-green-fg: #15803d; --eds-green-solid: #15803d; --eds-green-strong: #14532d;
  --eds-teal-soft: #e6f7f6; --eds-teal-light: #99dcd6; --eds-teal-fg: #0f766e; --eds-teal-solid: #0f766e; --eds-teal-strong: #134e4a;
  --eds-blue-soft: #e5eff9; --eds-blue-light: #a9cdee; --eds-blue-fg: #086db6; --eds-blue-solid: #086db6; --eds-blue-strong: #0b3f6e;
  --eds-purple-soft: #f1ecfb; --eds-purple-light: #cbb8f0; --eds-purple-fg: #6d3fc0; --eds-purple-solid: #6d3fc0; --eds-purple-strong: #45247f;
  --eds-pink-soft: #fcebf3; --eds-pink-light: #f3b4d0; --eds-pink-fg: #b0215f; --eds-pink-solid: #b0215f; --eds-pink-strong: #701340;
  /* SOBRE TINTA (1.1): texto claro sobre fondos oscuros o de color; el fondo sigue oscuro en los dos temas → un solo valor. */
  --eds-on-ink: #ffffff; --eds-on-ink-2: #e2e8f0; --eds-on-ink-3: #cbd5e1;
  --eds-red-on-ink: #fca5a5; --eds-orange-on-ink: #fdba74; --eds-amber-on-ink: #fcd34d; --eds-green-on-ink: #86efac;
  --eds-teal-on-ink: #5eead4; --eds-blue-on-ink: #9ec5fe; --eds-purple-on-ink: #d8b4fe; --eds-pink-on-ink: #f9a8d4;
}
html[data-eds-tema="oscuro"] {
  /* ink en oscuro es FONDO de botones y globos con letra blanca: un escalón ARRIBA de la superficie para que se distinga */
  --eds-text-4: #74839a; --eds-ink: #2c3e55; --eds-ink-2: #3a4d66;
  --eds-red-soft: #3a1820; --eds-red-light: #6b2230; --eds-red-fg: #ff8a98; --eds-red-solid: #b4233b; --eds-red-strong: #ffd2d8;
  --eds-orange-soft: #3a2214; --eds-orange-light: #6b3a1c; --eds-orange-fg: #ffa36b; --eds-orange-solid: #b5480f; --eds-orange-strong: #ffd8bf;
  --eds-amber-soft: #3a2a12; --eds-amber-light: #6b4a17; --eds-amber-fg: #f4b860; --eds-amber-solid: #9a5b0a; --eds-amber-strong: #ffe3b8;
  --eds-green-soft: #133024; --eds-green-light: #1e4d36; --eds-green-fg: #5fd08b; --eds-green-solid: #1f7a43; --eds-green-strong: #c9f0d8;
  --eds-teal-soft: #10302e; --eds-teal-light: #1a4a46; --eds-teal-fg: #4fd1c5; --eds-teal-solid: #127068; --eds-teal-strong: #c4f1ec;
  --eds-blue-soft: #19304a; --eds-blue-light: #24466b; --eds-blue-fg: #7db8ec; --eds-blue-solid: #2b74b9; --eds-blue-strong: #cfe4f7;
  --eds-purple-soft: #2a2140; --eds-purple-light: #3f3166; --eds-purple-fg: #b59cf2; --eds-purple-solid: #6a46b8; --eds-purple-strong: #e3d8fb;
  --eds-pink-soft: #3a1729; --eds-pink-light: #62233f; --eds-pink-fg: #f58fbf; --eds-pink-solid: #a8285f; --eds-pink-strong: #fbd3e6;
}