/* ============================================================================
   IMPULSA TEC — DESIGN TOKENS
   ============================================================================
   Unica fuente de verdad de color, tipografia y espaciado del apartado publico.
   Cargar SIEMPRE antes que ui.css y pages.css.

   No cargar junto a theme.css (dashboards): ambos definen --primary con valores
   distintos y el ultimo en cargar gana.

   Sobre los tokens "-ink": la terracota de marca (#E07A3D) da 2.99:1 con texto
   blanco, por debajo del 4.5:1 de WCAG AA. Por eso el color de marca se usa solo
   en superficies decorativas (degradados, iconos, bordes, rellenos) y las
   variantes -ink cubren todo lo que lleva texto encima. Validado en
   scratchpad/contraste.js.
   ============================================================================ */

:root {
    /* --- Marca: decorativo. Nunca poner texto blanco encima --- */
    --primary: #E07A3D;
    --primary-dark: #C45F24;
    --primary-soft: rgba(224, 122, 61, 0.12);

    /* --- Marca: portante de texto (AA) --- */
    --primary-ink: #AF5220;         /* 5.18:1 con blanco · 4.86:1 sobre crema */
    --primary-ink-dark: #8F4319;    /* hover de botones solidos */

    --secondary: #2F5D50;           /* 7.49:1 con blanco, apto tal cual */
    --secondary-dark: #234A3F;
    --secondary-soft: rgba(47, 93, 80, 0.1);

    --accent: #F0B429;              /* ambar: decorativo o con texto oscuro (7.96:1) */
    --accent-soft: rgba(240, 180, 41, 0.18);

    /* --- Texto --- */
    --text: #1F2A24;                /* 13.91:1 sobre crema */
    --text-light: #5C6B63;          /* 5.27:1 sobre crema */
    --text-on-brand: #1F2A24;       /* texto sobre terracota/ambar: 4.96:1 */

    /* --- Superficies --- */
    --bg: #FBF7F2;
    --bg-soft: #F3EDE4;
    --white: #FFFFFF;
    --border: #E8DFD3;
    --border-strong: #D6C8B4;

    /* --- Estado: relleno decorativo + variante portante de texto --- */
    --success: #2F9E6B;
    --success-ink: #1F7A4F;         /* 4.98:1 sobre crema */
    --success-soft: rgba(47, 158, 107, 0.12);
    --warning: #E09B2D;
    --warning-ink: #8A5B0E;
    --warning-soft: rgba(224, 155, 45, 0.14);
    --danger: #D64545;
    --danger-ink: #B02A2A;          /* 6.13:1 sobre crema */
    --danger-soft: rgba(214, 69, 69, 0.1);

    /* --- Degradados --- */
    --gradient: linear-gradient(135deg, #E07A3D 0%, #F0B429 100%);
    --gradient-ink: linear-gradient(135deg, #AF5220 0%, #C97A12 100%);
    --gradient-warm: linear-gradient(145deg, #FFF8F0 0%, #FBF7F2 45%, #F0E8DC 100%);
    --gradient-hero: linear-gradient(160deg, #FFF9F3 0%, #FBF7F2 50%, #F5EDE3 100%);

    /* --- Sombras: calidas, no grises --- */
    --shadow-sm: 0 2px 8px rgba(31, 42, 36, 0.04);
    --shadow-md: 0 8px 30px rgba(31, 42, 36, 0.06);
    --shadow-lg: 0 16px 48px rgba(31, 42, 36, 0.1);

    /* --- Radios --- */
    --radius-sm: 12px;
    --radius-md: 20px;
    --radius-lg: 28px;
    --radius-full: 999px;

    /* --- Tipografia --- */
    --font: 'Plus Jakarta Sans', 'Inter', system-ui, -apple-system, sans-serif;
    --text-xs: 0.78rem;
    --text-sm: 0.875rem;
    --text-base: 1rem;
    --text-lg: 1.125rem;
    --text-xl: clamp(1.15rem, 2vw, 1.4rem);
    --text-2xl: clamp(1.65rem, 3vw, 2.35rem);
    --text-3xl: clamp(2rem, 4vw, 3.25rem);
    --leading-tight: 1.2;
    --leading-normal: 1.7;

    /* --- Espaciado --- */
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.5rem;
    --space-6: 2rem;
    --space-8: 3rem;
    --space-10: 4rem;
    --space-12: 6rem;

    /* --- Layout --- */
    --nav-height: 72px;
    --container-max: 1200px;

    /* --- Movimiento --- */
    --transition: 0.2s ease;
    --transition-slow: 0.35s ease;

    /* --- Foco visible: obligatorio para navegacion con teclado --- */
    --focus-ring: 0 0 0 3px rgba(224, 122, 61, 0.45);
}

/* Respeta a quien pide menos movimiento (mareos, vestibular). */
@media (prefers-reduced-motion: reduce) {
    :root {
        --transition: 0s;
        --transition-slow: 0s;
    }
}
