/*
 * VoltLlano — design tokens v8 · paleta v2 del logotipo 2026.
 *
 * Los nombres canónicos empiezan con `--color-`, `--radius-`, `--shadow-`.
 * Los alias `--vl-*` del sitio v7 se retiraron en la tarea 75 · A (B02,
 * auditoría forense web 2026-11-02): ningún CSS ni JS los usaba ya
 * (`scripts/check_orphan_vars.py` lo vigila).
 */
:root {
  /* Paleta v2 VoltLlano — logotipo 2026 (tarea 55 · A, 2026-10-23).
     Fuente: 00_Datos/identidad_visual.json → paleta_v2 (tomada de los
     vectores oficiales del diseñador). Este es el ÚNICO archivo del sitio
     que teclea hex; el resto del sitio usa var(--…). */
  --color-fondo-marca: #262B31;   /* fondo oscuro de marca: pie, cabecera, tarjetas oscuras */
  --color-azul-rayo: #0A79C8;     /* azul de acción: botones y acentos (el rayo del logo pasó a dorado el 2026-10-29) */
  --color-amarillo-rayo: #E8B634; /* rayo dorado del logo 2026-10-29 (plano) */
  --color-dorado-rayo-oscuro: #C68A06;
  --color-dorado-rayo-claro: #FCE36D;
  --color-azul-v: #0B6CBF;        /* sombra de la V */
  --color-verde-l: #51C665;       /* verde de la L */
  --color-verde-llano: #4FC665;   /* verde de «Llano» */
  --color-verde-lineas: #279666;  /* verde de los filetes */
  --color-blanco: #FEFEFE;
  --color-gris-descriptor: #E2E4E6;

  /* Roles del sitio (mismos nombres de siempre, valores v2). */
  --color-primary: var(--color-fondo-marca);
  --color-primary-medium: var(--color-azul-rayo);
  /* Secundario = verde_texto 148067: texto pequeño y blanco sobre banda verde
     cumplen el AA (4,9:1); el verde de filetes 279666 da 3,7:1 (identidad_visual.json
     → decisiones.verde_texto, Andrés 2026-10-23; tarea 75 · B). */
  --color-secondary: var(--color-verde-texto);
  --color-accent: var(--color-verde-l);
  --color-action: var(--color-azul-rayo);
  --color-bg: #FFFFFF;
  --color-bg-alt: #EAF2F9;
  --color-text: #4A4F54;
  --color-text-muted: #5F666C;    /* texto secundario AA (tarea 75 · B): 5,8:1 sobre blanco, 5,2:1 sobre --color-bg-alt */
  --color-gris-secundario: #7A8288; /* el gris v2 queda para bordes, íconos y adornos; para texto no alcanza el AA */
  --color-verde-texto: #148067;   /* verde para texto pequeño sobre fondos claros (identidad_visual.json → decisiones.verde_texto) */
  --color-error: #8F1F1F;
  --color-error-soft: #FEF1F1;
  --color-error-border: #F7C2C2;
  --color-border: #D9E1E8;
  --color-surface: #FFFFFF;
  --color-primary-soft: #DEEAF6;
  --color-secondary-soft: #EDF3E9;
  --color-accent-soft: #E7EFF7;
  /* Texto sobre fondos de marca (tarjetas y formularios oscuros). */
  --color-on-primary: var(--color-blanco);
  /* Mapa de cobertura de inicio (leyenda + puntos de coverage-map.js).
     Tarea 21 · B: antes eran #123a63, #39a845 y #f59e0b sueltos en el HTML,
     fuera de la paleta; el ámbar está retirado (identidad_visual.json). */
  --color-cobertura-principal: var(--color-primary);
  --color-cobertura-expansion: var(--color-accent);
  --color-cobertura-consulta: var(--color-text-muted);
  --shadow-sm: 0 10px 30px rgba(38, 43, 49, 0.06);
  --shadow-md: 0 18px 40px rgba(38, 43, 49, 0.08);
  --radius-sm: 0.75rem;
  --radius-md: 1.25rem;
  --radius-lg: 1.75rem;
  --radius-pill: 999px;
  --container: 76rem;
  --header-height: 4.75rem;
  --vt-sub-alto: 7.25rem;      /* tienda: alto reservado del subencabezado fijo (buscador y departamentos) */
  --vt-inferior-alto: 3.75rem; /* tienda: alto reservado de la barra inferior fija (subir, paginador, pedido) */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --space-9: 6rem;
  --font-sans: "Plus Jakarta Sans", system-ui, sans-serif;
  /* Titulares y marca: Montserrat 600/700 (identidad_visual.json → tipografia.marca). */
  --font-display: "Montserrat", "Plus Jakarta Sans", system-ui, sans-serif;


  /* Ilustraciones SVG heredadas de Netlify v2 (illustrations.css). */
  --ilustracion-glow: 0 20px 40px rgba(38, 43, 49, 0.12);
}
