/* Tokens de color. Valores tomados de Embarcador (tema «Océano» por defecto y
   «Claridad» como tema claro); este archivo es propio, no enlaza nada externo. */
:root {
  color-scheme: dark;
  --azul-oscuro: #1e3a5f;
  --azul-medio: #2c5282;
  --fondo-pagina: linear-gradient(135deg, var(--azul-oscuro), var(--azul-medio));
  --superficie: rgba(255, 255, 255, 0.08);
  --superficie-solida: #1e3550;
  --superficie-fuerte: rgba(255, 255, 255, 0.14);
  --fondo-tenue: rgba(255, 255, 255, 0.05);
  --borde: rgba(255, 255, 255, 0.18);
  --borde-suave: rgba(255, 255, 255, 0.09);
  --borde-fuerte: rgba(255, 255, 255, 0.45);
  --texto: rgba(255, 255, 255, 0.95);
  --texto-tenue: rgba(255, 255, 255, 0.85);
  --texto-sutil: rgba(255, 255, 255, 0.6);
  --acento: var(--azul-medio);
  --acento-suave: color-mix(in srgb, var(--azul-medio) 30%, transparent);
  --acento-sobre: #ffffff;
  /* Color «primario» de los controles (anillo de foco, enlaces, botón relleno). */
  --primario: #abc7ff;
  --sobre-primario: #002f65;
  --encabezado-tabla: color-mix(in srgb, var(--azul-oscuro) 65%, transparent);
  --ok: #7bd88f;
  --ok-fondo: rgba(76, 175, 80, 0.2);
  --error: #ff8a8a;
  --error-fondo: rgba(244, 67, 54, 0.18);
  --aviso: #f7c948;
  --aviso-fondo: rgba(255, 193, 7, 0.16);
  --sombra-color: rgba(0, 0, 0, 0.35);
  --sombra: 0 8px 24px rgba(0, 0, 0, 0.35);
  --sombra-fuerte: 0 16px 48px rgba(0, 0, 0, 0.45);
  --velo: rgba(0, 0, 0, 0.45);
  --barra-superior: color-mix(in srgb, var(--superficie-solida) 78%, transparent);
  --barra-superior-filtro: blur(20px) saturate(180%);
  --placeholder: color-mix(in srgb, var(--texto-tenue) 38%, transparent);
}

:root[data-tema='claridad'] {
  color-scheme: light;
  --azul-oscuro: #f2f8ff;
  --azul-medio: #dbeafa;
  --fondo-pagina: linear-gradient(160deg, #f2f8ff, #dbeafa);
  --superficie: rgba(255, 255, 255, 0.78);
  --superficie-solida: #ffffff;
  --superficie-fuerte: rgba(255, 255, 255, 0.94);
  --fondo-tenue: rgba(60, 60, 67, 0.045);
  --borde: rgba(60, 60, 67, 0.14);
  --borde-suave: rgba(60, 60, 67, 0.08);
  --borde-fuerte: rgba(60, 60, 67, 0.55);
  --texto: rgba(0, 0, 0, 0.88);
  --texto-tenue: rgba(0, 0, 0, 0.74);
  --texto-sutil: rgba(60, 60, 67, 0.78);
  --acento: #0a66c2;
  --acento-suave: #dce9f7;
  --acento-sobre: #ffffff;
  --primario: #0a66c2;
  --sobre-primario: #ffffff;
  --encabezado-tabla: #dce6f3;
  --ok: #116b33;
  --ok-fondo: #ddf0e3;
  --error: #c7261b;
  --error-fondo: #fbe1df;
  --aviso: #8a5a00;
  --aviso-fondo: #fbebcc;
  --sombra-color: rgba(0, 0, 0, 0.1);
  --sombra: 0 4px 12px rgba(0, 0, 0, 0.08);
  --sombra-fuerte: 0 12px 40px rgba(0, 0, 0, 0.12);
  --velo: rgba(0, 0, 0, 0.22);
  --barra-superior: rgba(255, 255, 255, 0.72);
}