/*
 * Design tokens — Implus Accounting
 *
 * Fase 10: reemplaza la paleta/tipografía provisionales de la Fase 1
 * (no existía manual de marca todavía) por las reales, citadas literalmente
 * del manual de marca del cliente:
 * /mnt/data/Documentos/enriqueTorres/implusAccounting/manual-marca-implus.html
 * (secciones "02 Paleta de color" y "03 Tipografía"). El sitio público tiene
 * una dirección visual fija (premium/oscura), no se adapta al tema del sistema.
 */

:root {
    /* Color — superficies (cita: manual, sección 02) */
    --ia-bg-primary: #0A1829;      /* Azul Profundo — "Fondo principal de marca" */
    --ia-bg-secondary: #0C283D;    /* Azul Naval — "Superficies, tarjetas y bloques secundarios" */
    --ia-bg-light: #F3EEE7;        /* Marfil — "fondos claros en impresos", reutilizado como fondo claro del sitio */
    --ia-bg-light-alt: #DCDAD6;    /* derivado (90% Marfil + 10% Azul Naval) — no está en el manual, calculado para conservar el ritmo de bandas claras/alternas */

    /*
     * Color — acentos. El manual define dos, sin asignarlos a un rol de
     * "botón CTA" específico: Oro Contable ("cifras destacadas... detalles
     * premium") y Teal Confianza ("enlaces y detalles activos"). Se
     * reutiliza --ia-accent (y sus derivados) como el acento POR DEFECTO,
     * mapeado a Oro — evita tener que tocar los 100+ usos existentes de
     * var(--ia-accent) en el sitio. Teal se añade como acento SECUNDARIO,
     * aplicado deliberadamente en enlaces/estados activos (ver app.css).
     *
     * Ajuste a pedido del cliente (posterior a la Fase 10): el Oro
     * Contable original del manual (#A8875F) se veía apagado/marrón, así
     * que se probó un dorado brillante (#D4AF37) — mucho para el gusto
     * del cliente. Valor final: punto medio matemático entre ambos
     * (#BE9B4B = promedio RGB de #A8875F y #D4AF37), más dorado que el
     * original pero sin la saturación del brillante. Desviación
     * deliberada del valor literal del manual, a pedido explícito del
     * cliente — no un ajuste de accesibilidad.
     */
    --ia-accent: #BE9B4B;          /* Dorado, punto medio — CTA/acento por defecto */
    --ia-accent-contrast: #0A1829; /* texto sobre el acento dorado (~6.8:1 sobre #BE9B4B) */
    --ia-border: rgba(10, 24, 41, 0.14);      /* mismo patrón que --line del manual, adaptado a fondo claro */
    --ia-border-dark: rgba(243, 238, 231, 0.14); /* cita literal --line del manual, para fondo oscuro */
    --ia-muted: #7a7a7a;

    /*
     * --ia-accent (#BE9B4B) da ~2.3:1 sobre fondos claros — no cumple
     * WCAG AA (mínimo 3:1 para íconos/texto grande, 4.5:1 para texto
     * normal) ni siquiera para texto grande. Para texto/íconos en fondo
     * claro se usa esta variante oscurecida y calculada, nunca
     * --ia-accent directamente. Cumple 4.5:1 en ambos fondos claros del
     * sitio (~6:1 sobre Marfil, ~5:1 sobre --ia-bg-light-alt).
     */
    --ia-accent-on-light: #6A572A;

    /*
     * Acento secundario (Teal). El Teal Confianza profundo (#2D6167) da
     * solo ~2.6:1 sobre --ia-bg-primary — no cumple AA ni para texto
     * grande. Se usa la variante clara que el propio manual ya define
     * (--teal-brand-light) para texto/íconos sobre fondo oscuro (~4.6:1).
     * Sobre fondo claro (Marfil), el teal profundo sí cumple directo
     * (~6:1), así que ahí se usa la variante oscura.
     */
    --ia-accent-teal: #4E8A8F;          /* Teal claro — cita literal --teal-brand-light del manual, para fondo oscuro */
    --ia-accent-teal-on-light: #2D6167; /* Teal Confianza — cita literal del manual, para fondo claro */

    /*
     * Verde Pizarra: el manual lo define como "contenedor del isotipo;
     * superficie intermedia entre azul y teal" — uso EXCLUSIVO del logo/
     * favicon (ver atoms/logo.blade.php y favicon.svg). No reutilizar
     * como fondo de sección general.
     */
    --ia-brand-teal-slate: #1F4651;

    /* Color — texto */
    --ia-text-on-dark: #F3EEE7;
    --ia-text-on-dark-muted: rgba(243, 238, 231, 0.78); /* cita literal .voice-card p del manual */
    --ia-text-on-light: #0A1829;
    --ia-text-on-light-muted: rgba(10, 24, 41, 0.65);   /* cita literal del manual (texto sobre el swatch Marfil) */

    /* Tipografía (cita: manual, sección 03) */
    --ia-font-heading-display: 'Playfair Display', Georgia, 'Times New Roman', serif; /* "Logotipo y titulares de gran formato EXCLUSIVAMENTE" */
    --ia-font-heading: 'Baloo 2', 'Trebuchet MS', sans-serif;                          /* "H1/H2/Rótulo" — Baloo 2 Semibold/Bold */
    --ia-font-body: 'Baloo 2', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

    /* Radios y sombras — el manual no los especifica, se conservan sin cambios */
    --ia-radius-pill: 999px;
    --ia-radius-card: 12px;
    --ia-shadow-card: 0 10px 30px -12px rgba(10, 24, 41, 0.25);
    --ia-shadow-card-dark: 0 10px 30px -12px rgba(0, 0, 0, 0.5);

    /* Espaciado de secciones (bandas full-width) */
    --ia-section-py: clamp(3.5rem, 6vw, 6rem);
    /* Fase 11: nivel "grande" — transiciones de mayor jerarquía (justo
       después del hero, antes del CTA final) para que el ritmo vertical
       deje de ser uniforme en todas las secciones por igual. */
    --ia-section-py-lg: clamp(5rem, 9vw, 9rem);

    /*
     * Auditoría WCAG mobile: el rojo por defecto de Bootstrap (#dc3545,
     * usado en el asterisco de campos obligatorios vía .text-danger y en
     * los mensajes de error .invalid-feedback del formulario de
     * contacto) da solo ~3.9:1 sobre Marfil — no cumple AA (4.5:1) para
     * texto normal. Se sobreescriben las variables de Bootstrap con un
     * rojo más oscuro (~6.2:1 sobre Marfil) sin tocar cada uso a mano.
     */
    --bs-danger-rgb: 165, 40, 52;
    --bs-form-invalid-color: #A52834;
}
