/* Whistlepath · tokens de diseño
   Fuente: manual de marca v0.1. Modo claro por defecto; oscuro con
   prefers-color-scheme, y [data-theme="light"|"dark"] en <html> fuerza uno u otro. */

:root {
  /* Superficies y texto */
  --bg: #F7F8FA;          /* Tiza */
  --surface: #FFFFFF;
  --sunk: #EEF1F4;
  --fg: #18222F;          /* Pizarra */
  --muted: #5B6675;       /* Acta */
  --line: #D9DEE4;        /* Camiseta */
  --line-strong: #C3CAD3;

  /* Acento (Balón): solo botón principal, punto del logo y último valor */
  --accent: #E8590C;
  --accent-ink: #B8460A;  /* texto/fondo de botón con contraste sobre blanco */
  --on-accent: #FFFFFF;

  /* Estados de verificación: siempre con icono + texto */
  --ok: #2563A8;          /* Verificado */
  --bad: #B4233C;         /* Discrepancia */
  --na: #7A8494;          /* No verificable */
  --bad-bg: #FBEDEF;

  /* Gráficas */
  --chart-bar: #8A94A3;   /* serie neutra; el último valor va en --accent */
  --chart-grid: #E6E9ED;
  --sex-m: #5A55C8;       /* masculino (validado CVD con --sex-f) */
  --sex-f: #B7832A;       /* femenino */
  --on-sex-m: #FFFFFF;
  --on-sex-f: #18222F;

  /* Tipografía */
  --display: "Barlow Condensed", "Arial Narrow", system-ui, sans-serif;
  --body: "Barlow", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, Menlo, monospace;

  /* Forma y espacio */
  --radius: 4px;
  --radius-lg: 6px;
  --gutter: 16px;
  --maxw: 1180px;

  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0F151D; --surface: #17202B; --sunk: #1D2834; --fg: #E8ECF1; --muted: #9AA4B2;
    --line: #2A3644; --line-strong: #3A4757;
    --accent: #FF7A33; --accent-ink: #FF7A33; --on-accent: #0F151D;
    --ok: #6AA3E8; --bad: #E5566F; --na: #8D97A6; --bad-bg: #2A1A22;
    --chart-bar: #5E6A79; --chart-grid: #233040;
    --sex-m: #6F6AD8; --sex-f: #B08A2C; --on-sex-m: #FFFFFF; --on-sex-f: #0F151D;
    color-scheme: dark;
  }
}

:root[data-theme="dark"] {
  --bg: #0F151D; --surface: #17202B; --sunk: #1D2834; --fg: #E8ECF1; --muted: #9AA4B2;
  --line: #2A3644; --line-strong: #3A4757;
  --accent: #FF7A33; --accent-ink: #FF7A33; --on-accent: #0F151D;
  --ok: #6AA3E8; --bad: #E5566F; --na: #8D97A6; --bad-bg: #2A1A22;
  --chart-bar: #5E6A79; --chart-grid: #233040;
  --sex-m: #6F6AD8; --sex-f: #B08A2C; --on-sex-m: #FFFFFF; --on-sex-f: #0F151D;
  color-scheme: dark;
}