/* tokens.css — el sistema de diseño de buscalicitaciones.com (Fase 2, 30-sep-2026).
 *
 * La identidad no cambia: azul marino #1f4068, blanco cálido #faf9f6, títulos en Instrument Serif, texto en Inter y
 * la monoespaciada solo para identificadores (NIF, ids, CPV y expediente). Lo que cambia es que todo sale de aquí:
 * - color con contraste AA (≥ 4,5:1 el texto sobre cualquiera de los fondos de la web) y colores de calidad del dato;
 * - una escala tipográfica de 8 pasos (12/13/14/16/18/22/28/40 px);
 * - espaciado en múltiplos de 4 px; 4 radios; 3 sombras; movimiento corto que respeta prefers-reduced-motion.
 * Contrastes medidos (WCAG 2.1) sobre blanco / blanco cálido / fondo hundido: texto-2 7,0 / 6,7 / 6,3;
 * texto-3 5,3 / 5,1 / 4,8; acento 10,5 / 10,0 / 9,5. El gris #b3b3b3 (2,1:1) queda solo para adornos.
 * Los nombres viejos (--c-*) siguen definidos como alias al final: metodologia.css los usa.
 */

:root {
    /* ── Color: superficies ─────────────────────────────────────────────── */
    --color-fondo: #ffffff;
    --color-fondo-calido: #faf9f6;          /* identidad: cabecera, portada, zonas */
    --color-fondo-hundido: #f4f3ee;         /* filas al pasar, zonas secundarias */
    --color-superficie: #ffffff;            /* tarjetas y paneles */
    --color-resalte: #fff8c5;               /* <mark>: coincidencias de la búsqueda */
    --color-velo: rgba(20, 24, 31, 0.38);   /* fondo tras cajones y hojas */

    /* ── Color: texto ───────────────────────────────────────────────────── */
    --color-texto: #1a1a1a;                 /* 17,4:1 */
    --color-texto-fuerte: #0a0a0a;
    --color-texto-2: #595959;               /* secundario: 7,0:1 */
    --color-texto-3: #6b6b6b;               /* terciario (notas, recuentos): 5,3:1 */
    --color-adorno: #b3b3b3;                /* separadores y adornos; nunca texto */

    /* ── Color: bordes ──────────────────────────────────────────────────── */
    --color-borde: #e8e6df;                 /* separadores */
    --color-borde-fuerte: #c8c5bb;          /* tarjetas activas, cabeceras de tabla */
    --color-borde-control: #8f8a7e;         /* campos de formulario: 3,4:1 (WCAG 1.4.11) */

    /* ── Color: acento (azul marino) ────────────────────────────────────── */
    --color-acento: #1f4068;                /* 10,5:1 */
    --color-acento-hover: #2c5a8e;          /* 7,1:1 */
    --color-acento-suave: #eef2f7;
    --color-acento-borde: #c9d5e4;
    --color-sobre-acento: #ffffff;
    /* La franja tricolor de la identidad (Fase 5): bajo la cabecera de todas las páginas y en la imagen para redes.
       Es identidad y nunca codifica datos (el ocre y el verde ya dicen aviso y PYME) */
    --franja: linear-gradient(90deg, var(--color-acento) 0 33.3%, var(--color-aviso-adorno) 33.3% 66.6%, var(--color-exito) 66.6% 100%);

    /* ── Color: estados ─────────────────────────────────────────────────── */
    --color-exito: #2d5a3d;
    --color-exito-fondo: #ebf3ed;
    --color-exito-borde: #b9d2c0;
    --color-aviso: #7a5c10;                 /* 6,2:1 (antes #8b6914: 4,6 sobre el fondo cálido) */
    --color-aviso-fondo: #fff7e6;
    --color-aviso-borde: #e3c77a;
    --color-aviso-adorno: #d4a72c;          /* franja de la portada */
    --color-peligro: #8b1d1d;
    --color-peligro-fondo: #fdebeb;
    --color-peligro-borde: #e8b4b4;

    /* ── Color: calidad del dato (texto / fondo / borde; texto ≥ 6,3:1 sobre su fondo) ── */
    /* Excluido: no cuenta en las sumas (inverosímil, no cuadra con su aviso, más de 1.000 M€) */
    --calidad-excluido: #8b1d1d;
    --calidad-excluido-fondo: #fdebeb;
    --calidad-excluido-borde: #e8b4b4;
    /* Repetido: la fuente repite el importe en otras filas del mismo contrato */
    --calidad-repetido: #7a4a05;
    --calidad-repetido-fondo: #fdf1dc;
    --calidad-repetido-borde: #e9c98f;
    /* Corregido: coma decimal perdida en origen; cuenta el corregido */
    --calidad-corregido: #1d5560;
    --calidad-corregido-fondo: #e6f1f2;
    --calidad-corregido-borde: #a9cdd2;
    /* IVA: con IVA o sin IVA, como lo publica la fuente. Contorno neutro: es información, no identidad (antes, el
       mismo azul que la etiqueta de la fuente, I1) */
    --calidad-iva: var(--color-texto-2);
    --calidad-iva-fondo: var(--color-superficie);
    --calidad-iva-borde: var(--color-borde-fuerte);
    /* Sin dato: IVA no consta, NIF que no consta (borde discontinuo) */
    --calidad-sin-dato: #595959;
    --calidad-sin-dato-fondo: #f4f3ee;
    --calidad-sin-dato-borde: #a8a49a;
    /* Otras marcas */
    --marca-pyme: #2d5a3d;
    --marca-pyme-fondo: #ebf3ed;
    --marca-pyme-borde: #b9d2c0;
    /* Contrato menor: un procedimiento, no una alerta. Neutro y con el icono de contrato (antes, el mismo ámbar que
       «Importe repetido» y los avisos, I1). El ámbar queda para «Importe repetido» y «Copia de otra fuente» */
    --marca-menor: var(--color-texto-2);
    --marca-menor-fondo: var(--color-fondo-calido);
    --marca-menor-borde: var(--color-borde-fuerte);
    /* Apariciones: el mismo contrato publicado en varias fuentes (paso 3b). Pizarra neutra, ni ámbar ni rojo: aparecer en
       dos fuentes no es un defecto del dato. Texto 8,6:1 sobre su fondo */
    --marca-apariciones: #3d4f5f;
    --marca-apariciones-fondo: #eef0f2;
    --marca-apariciones-borde: #c3cad1;

    /* Los lados de /comparar (Fase 5c): el azul marino, un ocre oscuro (el segundo lado; /comparar no lleva marcas de
       calidad) y un azul pizarra. Barras con 3:1 o más sobre blanco; las cifras del ocre, en su tono de texto (6,2:1) */
    --lado-1: var(--color-acento);
    --lado-1-texto: var(--color-acento);
    --lado-2: #a8811a;                      /* 3,6:1 */
    --lado-2-texto: var(--color-aviso);     /* 6,2:1 */
    --lado-3: #4f6d8c;                      /* 5,4:1 */
    --lado-3-texto: #4f6d8c;

    /* ── Tipografía ─────────────────────────────────────────────────────── */
    --fuente-serif: "Instrument Serif", "Source Serif 4", Georgia, "Times New Roman", serif;
    --fuente-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
    --fuente-mono: "JetBrains Mono", "SF Mono", Consolas, Monaco, monospace;   /* solo NIF, ids, CPV y expediente */

    /* Escala de 8 pasos */
    --fs-12: 0.75rem;
    --fs-13: 0.8125rem;
    --fs-14: 0.875rem;
    --fs-16: 1rem;
    --fs-18: 1.125rem;
    --fs-22: 1.375rem;
    --fs-28: 1.75rem;
    --fs-40: 2.5rem;
    /* Dos pasos de «cifra» (Fase 5): las cifras protagonistas de la portada y las fichas, en serif */
    --fs-48: 3rem;
    --fs-56: 3.5rem;

    --lh-titulo: 1.15;
    --lh-ajustada: 1.35;
    --lh-texto: 1.55;

    --peso-normal: 400;
    --peso-medio: 500;
    --peso-fuerte: 600;

    /* Una sola etiqueta en mayúsculas: 12 px, 600, 0,06 em */
    --rotulo-tam: var(--fs-12);
    --rotulo-peso: 600;
    --rotulo-espaciado: 0.06em;

    /* ── Espacio: múltiplos de 4 px ─────────────────────────────────────── */
    --sp-1: 0.25rem;    /* 4 */
    --sp-2: 0.5rem;     /* 8 */
    --sp-3: 0.75rem;    /* 12 */
    --sp-4: 1rem;       /* 16 */
    --sp-5: 1.25rem;    /* 20 */
    --sp-6: 1.5rem;     /* 24 */
    --sp-8: 2rem;       /* 32 */
    --sp-10: 2.5rem;    /* 40 */
    --sp-12: 3rem;      /* 48 */
    --sp-16: 4rem;      /* 64 */

    /* ── Radios ─────────────────────────────────────────────────────────── */
    --radio-s: 4px;
    --radio-m: 6px;
    --radio-l: 10px;
    --radio-pildora: 999px;

    /* ── Sombras: 3 niveles ─────────────────────────────────────────────── */
    --sombra-1: 0 1px 2px rgba(31, 64, 104, 0.06);
    --sombra-2: 0 2px 4px rgba(31, 64, 104, 0.05), 0 8px 24px rgba(31, 64, 104, 0.10);
    --sombra-3: 0 16px 48px rgba(20, 24, 31, 0.20);

    /* ── Movimiento ─────────────────────────────────────────────────────── */
    --mov-rapido: 120ms;
    --mov-medio: 200ms;
    --mov-curva: cubic-bezier(0.2, 0.8, 0.2, 1);

    /* ── Foco ───────────────────────────────────────────────────────────── */
    --foco-color: #1f4068;
    --foco-anillo: 0 0 0 3px rgba(31, 64, 104, 0.30);

    /* ── Medidas ────────────────────────────────────────────────────────── */
    --ancho-pagina: 1280px;
    --ancho-datos: 1440px;      /* el buscador y el explorador (Fase 5c): las tablas y las tarjetas, a lo ancho */
    --ancho-ficha: 1040px;
    --ancho-lectura: 760px;
    --tactil: 44px;             /* zona táctil recomendada */
    --tactil-min: 24px;         /* mínimo de WCAG 2.5.8 */
    --margen-lateral: 1.5rem;
    /* El margen con las zonas seguras del móvil (la muesca en horizontal, el indicador de inicio abajo): base.html pide
       viewport-fit=cover y estos márgenes apartan el contenido de ellas; el fondo sí llega al borde */
    --margen-izq: max(var(--margen-lateral), env(safe-area-inset-left, 0px));
    --margen-der: max(var(--margen-lateral), env(safe-area-inset-right, 0px));
    --seguro-abajo: env(safe-area-inset-bottom, 0px);

    /* ── Capas ──────────────────────────────────────────────────────────── */
    --z-cabecera: 30;
    --z-menu: 50;
    --z-popover: 70;
    --z-cajon: 1000;
    --z-salto: 1100;
}

@media (max-width: 768px) {
    :root { --margen-lateral: 1rem; }
}

@media (prefers-reduced-motion: reduce) {
    :root {
        --mov-rapido: 0ms;
        --mov-medio: 0ms;
    }
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* ── Alias de los nombres anteriores (metodologia.css y reglas que aún los usan) ─────────────────────── */
:root {
    --c-bg: var(--color-fondo);
    --c-bg-alt: var(--color-fondo-calido);
    --c-bg-card: var(--color-superficie);
    --c-bg-elevated: var(--color-superficie);
    --c-bg-hover: var(--color-fondo-hundido);
    --c-bg-mark: var(--color-resalte);
    --c-text: var(--color-texto);
    --c-text-strong: var(--color-texto-fuerte);
    --c-text-muted: var(--color-texto-2);
    --c-text-subtle: var(--color-texto-3);      /* antes #8a8a8a (3,5:1) */
    --c-text-faint: var(--color-texto-3);       /* antes #b3b3b3 (2,1:1) */
    --c-border: var(--color-borde);
    --c-border-strong: var(--color-borde-fuerte);
    --c-border-focus: var(--color-acento);
    --c-accent: var(--color-acento);
    --c-accent-hover: var(--color-acento-hover);
    --c-accent-soft: var(--color-acento-suave);
    --c-link: var(--color-acento);
    --c-link-hover: var(--color-acento-hover);
    --c-success: var(--color-exito);
    --c-success-bg: var(--color-exito-fondo);
    --c-warning: var(--color-aviso);
    --c-warning-bg: var(--color-aviso-fondo);
    --c-warning-border: var(--color-aviso-adorno);
    --c-danger: var(--color-peligro);
    --c-danger-bg: var(--color-peligro-fondo);
    --c-pyme: var(--marca-pyme);
    --c-menor: var(--marca-menor);
    --c-outlier: var(--calidad-excluido);
    --font-serif: var(--fuente-serif);
    --font-sans: var(--fuente-sans);
    --font-mono: var(--fuente-mono);
    --radius: var(--radio-m);
    --radius-sm: var(--radio-s);
    --shadow-card: var(--sombra-1);
    --shadow-card-hover: var(--sombra-2);
    --shadow-menu: var(--sombra-2);
    --container: var(--ancho-pagina);
}