/* Marca NovaGest: el único sitio con colores, radios, sombras y tipografía (spec 2026-09-29 §2.3-§2.5 y §2.11).
   Colores de texto y de fondo en hex de 6 cifras, sin alfa, para que tests/marca.test.mjs mida su contraste.
   Tonos que cambian respecto al mock v5 (solo la luz, mismo tono y saturación, lo mínimo para pasar AA):
   --ink-3 claro, --ok-soft claro y --side-ink-3 marino. Tokens nuevos: --line-control, --borde-tarjeta,
   --cielo y el lateral azul entero. --logo-bloque es el fondo medido del PNG del logo blanco. */

@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fuentes/poppins-400.woff2") format("woff2");
}
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fuentes/poppins-500.woff2") format("woff2");
}
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fuentes/poppins-600.woff2") format("woff2");
}

:root {
  color-scheme: light;
  /* Suelo, superficies y tinta */
  --ground: #F4F6F9;
  --surface: #FFFFFF;
  --surface-2: #EEF1F5;
  --ink: #393939;
  --ink-2: #5E6470;
  --ink-3: #686E7B;          /* mock #858B97: 3,16:1 sobre --ground; 11 puntos menos de luz, 4,52:1 sobre --surface-2 */
  --title: #1C244B;
  --line: #E2E6EC;
  --line-2: #CDD3DC;
  --line-control: #8695AB;   /* nuevo: borde de campo; --line-2 da 1,51:1, este 3,04:1 sobre --surface */
  --borde-tarjeta: #FFFFFF;  /* en claro la tarjeta no lleva borde a la vista: va con sombra */
  /* Azul de marca */
  --blue: #0063A2;
  --blue-ink: #0063A2;
  --blue-soft: #E4EFF8;
  --blue-line: #B7D1E6;
  --on-blue: #FFFFFF;
  --cielo: #2681BC;          /* solo el fondo del login: al 65 % hacia --surface, vertical */
  /* Estado */
  --ok: #2E7D4F;
  --ok-soft: #EAF5EE;        /* mock #E1F1E7: 4,31:1 con --ok; 2,5 puntos más de luz, 4,52:1 */
  --warn: #955F00;
  --warn-soft: #FBEFD6;
  --bad: #B3261E;
  --bad-soft: #FBE3E1;
  --bad-fill: #B3261E;
  --on-bad: #FFFFFF;
  --slate: #4D5870;
  --slate-soft: #E3E7EF;
  /* Velo del modal y sombras azuladas (las únicas con alfa) */
  --velo: rgba(28,36,75,.45);
  --sombra: 0 1px 2px rgba(16,47,115,.10), 0 4px 14px rgba(16,47,115,.10);
  --sombra-2: 0 18px 40px -20px rgba(28,36,75,.35);
  /* Forma y letra */
  --r-caja: 0;
  --r-chip: 3px;
  --f: "Poppins", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --gutter: clamp(16px, 4vw, 48px);
  --logo-l: inline-block;
  --logo-d: none;
  /* Lateral, variante azul (por defecto): el pie de su web. Igual en claro y en oscuro. */
  --side-bg: #0063A2;
  --side-hover: #005A93;
  --side-activo: #005083;
  --side-ink: #FFFFFF;
  --side-ink-2: #E0ECF4;
  --side-ink-3: #CCE0EC;
  --side-line: #3382B5;
  --logo-bloque: #0E63A2;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --ground: #0E1322;
    --surface: #161C30;
    --surface-2: #1F2740;
    --ink: #E4E7EE;
    --ink-2: #B3B9C7;
    --ink-3: #8790A3;
    --title: #EEF1F8;
    --line: #283049;
    --line-2: #36405E;
    --line-control: #576797;
    --borde-tarjeta: #283049;
    --blue: #1A78B8;
    --blue-ink: #74B7E8;
    --blue-soft: #15304A;
    --blue-line: #24476A;
    --on-blue: #FFFFFF;
    --cielo: #15304A;
    --ok: #7CC49A;
    --ok-soft: #173327;
    --warn: #E0AE55;
    --warn-soft: #3A2D15;
    --bad: #F08A80;
    --bad-soft: #3E211E;
    --bad-fill: #B3261E;
    --on-bad: #FFFFFF;
    --slate: #A9B3CD;
    --slate-soft: #262B38;
    --velo: rgba(0,0,0,.6);
    --sombra: none;
    --sombra-2: 0 18px 40px -20px rgba(0,0,0,.8);
    --logo-l: none;
    --logo-d: inline-block;
  }
}

/* El mismo bloque, forzado con data-theme="dark" (lo usa la galería). Tiene que ser idéntico al de arriba. */
:root[data-theme="dark"] {
    color-scheme: dark;
    --ground: #0E1322;
    --surface: #161C30;
    --surface-2: #1F2740;
    --ink: #E4E7EE;
    --ink-2: #B3B9C7;
    --ink-3: #8790A3;
    --title: #EEF1F8;
    --line: #283049;
    --line-2: #36405E;
    --line-control: #576797;
    --borde-tarjeta: #283049;
    --blue: #1A78B8;
    --blue-ink: #74B7E8;
    --blue-soft: #15304A;
    --blue-line: #24476A;
    --on-blue: #FFFFFF;
    --cielo: #15304A;
    --ok: #7CC49A;
    --ok-soft: #173327;
    --warn: #E0AE55;
    --warn-soft: #3A2D15;
    --bad: #F08A80;
    --bad-soft: #3E211E;
    --bad-fill: #B3261E;
    --on-bad: #FFFFFF;
    --slate: #A9B3CD;
    --slate-soft: #262B38;
    --velo: rgba(0,0,0,.6);
    --sombra: none;
    --sombra-2: 0 18px 40px -20px rgba(0,0,0,.8);
    --logo-l: none;
    --logo-d: inline-block;
}

/* Lateral, variante marina: como el mock, con el bloque del logo en azul a sangre. */
:root[data-sidebar="marino"] {
  --side-bg: #1C244B;
  --side-hover: #27305C;
  --side-activo: #2B3668;
  --side-ink: #E6E9F2;
  --side-ink-2: #C3C9DA;
  --side-ink-3: #99A2BF;     /* mock #8E98B8: 4,01:1 sobre --side-activo; 3,5 puntos más de luz, 4,52:1 */
  --side-line: #2E3866;
  --logo-bloque: #0E63A2;
}