/* =========================================================
   Eventos Ideice · Tokens del sistema de diseño "Gafete"
   Documentación: docs/sistema-de-diseno.md

   Se carga DESPUÉS de Bootstrap 5.3: además de definir los
   tokens propios, reasigna las variables --bs-* para que los
   componentes de Bootstrap hereden la identidad.
   ========================================================= */

:root {
    /* ---- Paleta institucional (Colores-Tipografia.pdf) — no se modifica ---- */
    --c-orange: #F49A21;
    --c-blue: #057DC1;
    --c-ink: #231F20;

    /* ---- Derivados de la paleta ----
       *-ink  : versión para texto / fondos con texto blanco (AA ≥ 4.5:1)
       *-wash : fondo tenue      *-line : borde sobre el wash            */
    --c-blue-ink: #046399;      /* 6.5:1 sobre blanco */
    --c-blue-deep: #034E78;     /* hover de lo azul */
    --c-blue-wash: #E7F2F9;
    --c-blue-line: #B9DDF0;

    --c-orange-ink: #8A5206;    /* 6.4:1 sobre blanco */
    --c-orange-deep: #D9830F;   /* hover de lo naranja (texto tinta encima) */
    --c-orange-wash: #FEF3E2;
    --c-orange-line: #F6CF94;

    --c-ink-2: #36302F;         /* superficies elevadas sobre tinta (barra lateral) */
    --c-ink-3: #4A4344;

    /* ---- Neutros (fríos, para acompañar al azul) ---- */
    --c-paper: #F3F5F7;         /* fondo de la aplicación */
    --c-surface: #FFFFFF;       /* paneles */
    --c-sunken: #F8F9FA;        /* cabeceras de tabla, zonas hundidas */
    --c-line: #D9DEE3;          /* bordes de panel */
    --c-line-soft: #E9EDF0;     /* separadores internos */
    --c-input-line: #848A91;    /* borde de campos: 3.5:1 sobre blanco y 3.2:1 sobre papel (WCAG 1.4.11) */
    --c-text: var(--c-ink);
    --c-text-2: #5C636A;        /* texto secundario: 5.6:1 sobre papel */
    --c-on-ink: #FFFFFF;
    --c-on-ink-2: rgba(255, 255, 255, 0.72);

    /* ---- Estados ---- */
    --c-ok: #1E7A46;
    --c-ok-wash: #E5F3EB;
    --c-ok-line: #A9D8BC;
    --c-bad: #B42318;
    --c-bad-wash: #FDECEA;
    --c-bad-line: #F1B3AC;

    /* ---- Tipografía ----
       display: Archivo expandida (títulos, nombres, cifras) — con moderación
       body   : Public Sans (texto e interfaz)
       mono   : Martian Mono (códigos, horas, datos)                       */
    --f-display: 'Archivo', 'Arial', sans-serif;
    --f-body: 'Public Sans', 'Segoe UI', system-ui, sans-serif;
    --f-mono: 'Martian Mono', 'Cascadia Mono', ui-monospace, monospace;
    --f-display-stretch: 100%;

    --t-2xs: 0.6875rem;   /* 11px — etiquetas en mayúsculas */
    --t-xs: 0.75rem;      /* 12px */
    --t-sm: 0.8125rem;    /* 13px */
    --t-base: 0.9375rem;  /* 15px — texto */
    --t-md: 1.0625rem;    /* 17px */
    --t-lg: 1.25rem;      /* 20px */
    --t-xl: 1.625rem;     /* 26px — título de página */
    --t-2xl: 2.125rem;    /* 34px */
    --t-3xl: 3rem;        /* 48px — cifras protagonistas */

    --lh-tight: 1.15;
    --lh-base: 1.55;
    --tracking-caps: 0.08em;

    /* ---- Espaciado (base 4px) ---- */
    --s-1: 0.25rem;
    --s-2: 0.5rem;
    --s-3: 0.75rem;
    --s-4: 1rem;
    --s-5: 1.25rem;
    --s-6: 1.5rem;
    --s-7: 2rem;
    --s-8: 2.5rem;
    --s-9: 3.5rem;

    /* ---- Forma y elevación ---- */
    --r-xs: 4px;
    --r-sm: 6px;
    --r-md: 10px;
    --r-lg: 14px;
    --r-pill: 999px;

    --sh-1: 0 1px 2px rgba(35, 31, 32, 0.06);
    --sh-2: 0 4px 16px rgba(35, 31, 32, 0.08);
    --sh-pop: 0 18px 48px rgba(35, 31, 32, 0.18);

    /* ---- Movimiento ---- */
    --m-fast: 120ms;
    --m-base: 200ms;
    --m-swing: 640ms;
    --ease-out: cubic-bezier(0.2, 0.8, 0.2, 1);

    /* ---- Estructura ---- */
    --rail-w: 264px;
    --content-max: 1280px;
    --control-h: 2.625rem;      /* 42px: alto de campos y botones */
    --control-h-sm: 2rem;
    --focus-ring: var(--c-blue-ink);

    /* =====================================================
       Bootstrap 5.3 → tokens
       ===================================================== */
    --bs-body-font-family: var(--f-body);
    --bs-body-font-size: var(--t-base);
    --bs-body-line-height: var(--lh-base);
    --bs-body-color: var(--c-text);
    --bs-body-color-rgb: 35, 31, 32;
    --bs-body-bg: var(--c-paper);
    --bs-body-bg-rgb: 243, 245, 247;
    --bs-emphasis-color: var(--c-ink);
    --bs-heading-color: var(--c-ink);
    --bs-secondary-color: var(--c-text-2);
    --bs-secondary-bg: var(--c-line-soft);
    --bs-tertiary-bg: var(--c-sunken);
    --bs-border-color: var(--c-line);
    --bs-border-color-translucent: rgba(35, 31, 32, 0.12);
    --bs-border-radius: var(--r-md);
    --bs-border-radius-sm: var(--r-sm);
    --bs-border-radius-lg: var(--r-lg);

    --bs-primary: #046399;
    --bs-primary-rgb: 4, 99, 153;
    --bs-secondary: #5C636A;
    --bs-secondary-rgb: 92, 99, 106;
    --bs-success: #1E7A46;
    --bs-success-rgb: 30, 122, 70;
    --bs-danger: #B42318;
    --bs-danger-rgb: 180, 35, 24;
    --bs-warning: #F49A21;
    --bs-warning-rgb: 244, 154, 33;
    --bs-info: #057DC1;
    --bs-info-rgb: 5, 125, 193;
    --bs-dark: #231F20;
    --bs-dark-rgb: 35, 31, 32;
    --bs-light: #F3F5F7;
    --bs-light-rgb: 243, 245, 247;

    --bs-link-color: #046399;
    --bs-link-color-rgb: 4, 99, 153;
    --bs-link-hover-color: #034E78;
    --bs-link-hover-color-rgb: 3, 78, 120;

    --bs-primary-text-emphasis: var(--c-blue-ink);
    --bs-primary-bg-subtle: var(--c-blue-wash);
    --bs-primary-border-subtle: var(--c-blue-line);
    --bs-success-text-emphasis: var(--c-ok);
    --bs-success-bg-subtle: var(--c-ok-wash);
    --bs-success-border-subtle: var(--c-ok-line);
    --bs-danger-text-emphasis: var(--c-bad);
    --bs-danger-bg-subtle: var(--c-bad-wash);
    --bs-danger-border-subtle: var(--c-bad-line);
    --bs-warning-text-emphasis: var(--c-orange-ink);
    --bs-warning-bg-subtle: var(--c-orange-wash);
    --bs-warning-border-subtle: var(--c-orange-line);
    --bs-info-text-emphasis: var(--c-blue-ink);
    --bs-info-bg-subtle: var(--c-blue-wash);
    --bs-info-border-subtle: var(--c-blue-line);

    --bs-focus-ring-color: rgba(4, 99, 153, 0.35);
}
