/* =============================================================
   CÓDICE CUSTOMS CONTROL — DESIGN TOKENS v3.0
   Fuente única de verdad. Ver Codice_Customs_Control_v3.0_Design_System.md
   Nomenclatura (sección 23): --c-*, --s-*, --t-*, --b-*, --r-*
============================================================= */
:root {
    /* --- 1. Color de marca (inmutable) --- */
    --c-brand:              #074A7A;   /* Códice Blue */
    --c-brand-hover:        #063D65;
    --c-brand-active:       #052F4F;
    --c-brand-navy:         #0A1629;   /* Deep Navy / Chrome */
    --c-accent-info:        #2E75B6;   /* Info Blue */
    --c-accent-interactive: #4286C4;   /* Interactive Blue */

    /* --- 2. Superficies — Modelo de capas --- */
    --s-app:                #F8FAFC;   /* Layer 0 — App shell */
    --s-default:            #FFFFFF;   /* Layer 1 — cards, tablas, inputs, modales */
    --s-raised:             #F1F5F9;   /* Layer 1-alt — th, toolbars, nav activo */
    --s-sunken:             #E2E8F0;   /* Layer 2 — paneles anidados */
    --s-inverse:            #0A1629;   /* Modales/tooltips oscuros, sidebar nav */

    /* --- 3. Texto y bordes --- */
    --t-primary:            #111827;
    --t-secondary:          #475569;
    --t-muted:              #64748B;
    --t-disabled:           #94A3B8;
    --b-subtle:             #F1F5F9;
    --b-default:            #E2E8F0;
    --b-strong:             #CBD5E1;
    --b-focus:              #074A7A;

    /* --- 4. Semánticos — tríadas funcionales (solid/text/bg/border) --- */
    --sem-ok-solid:         #16A34A;
    --sem-ok-text:          #15803D;
    --sem-ok-bg:            #F0FDF4;
    --sem-ok-border:        #BBF7D0;

    --sem-warn-solid:       #D97706;
    --sem-warn-text:        #B45309;
    --sem-warn-bg:          #FFFBEB;
    --sem-warn-border:      #FDE68A;

    --sem-err-solid:        #DC2626;
    --sem-err-text:         #B91C1C;
    --sem-err-bg:           #FEF2F2;
    --sem-err-border:       #FECACA;

    --sem-info-solid:       #2E75B6;
    --sem-info-text:        #1B5E7A;
    --sem-info-bg:          #EFF6FF;
    --sem-info-border:      #BAE6FD;

    --sem-neutral-solid:    #64748B;
    --sem-neutral-text:     #475569;
    --sem-neutral-bg:       #F1F5F9;
    --sem-neutral-border:   #E2E8F0;

    /* --- 5. Tipografía — familias --- */
    --font-base: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    --font-mono: 'Roboto Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

    /* --- 5. Tipografía — escala (size / weight / line-height / tracking) --- */
    --fs-display: 40px; --fw-display: 800; --lh-display: 1.1;  --ls-display: -0.03em;
    --fs-h1:      28px; --fw-h1:      700; --lh-h1:      1.2;  --ls-h1:      -0.02em;
    --fs-h2:      22px; --fw-h2:      700; --lh-h2:      1.25; --ls-h2:      -0.015em;
    --fs-h3:      18px; --fw-h3:      600; --lh-h3:      1.35; --ls-h3:      -0.01em;
    --fs-h4:      15px; --fw-h4:      600; --lh-h4:      1.4;  --ls-h4:      0em;
    --fs-body-lg: 15px; --fw-body-lg: 400; --lh-body-lg: 1.6;  --ls-body-lg: 0em;
    --fs-body:    14px; --fw-body:    400; --lh-body:    1.55; --ls-body:    0em;
    --fs-dense:   13px; --fw-dense:   400; --lh-dense:   1.45; --ls-dense:   0em;
    --fs-caption: 12px; --fw-caption: 500; --lh-caption: 1.4;  --ls-caption: 0.02em;
    --fs-label:   12px; --fw-label:   600; --lh-label:   1.2;  --ls-label:   0.08em;
    --fs-micro:   11px; --fw-micro:   500; --lh-micro:   1.3;  --ls-micro:   0.04em;
    --fs-data:    13px; --fw-data:    500; --lh-data:    1.5;  --ls-data:    0.01em;

    /* --- 6. Espaciado (base 4px, ritmo 8px) --- */
    --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
    --sp-5: 20px; --sp-6: 24px; --sp-8: 32px; --sp-10: 40px;
    --sp-12: 48px; --sp-16: 64px;

    /* --- 6. Border radius por tier --- */
    --r-xs: 3px; --r-sm: 6px; --r-md: 8px; --r-lg: 12px; --r-xl: 16px; --r-full: 9999px;

    /* --- 6. Elevación & sombras (solo overlays flotantes reales, CDX-ELEV-01) --- */
    --shadow-sm:    0 1px 2px rgba(16,24,40,.05);
    --shadow-md:    0 4px 12px rgba(16,24,40,.08);
    --shadow-lg:    0 12px 32px rgba(16,24,40,.12);
    --shadow-focus: 0 0 0 2px #FFFFFF, 0 0 0 4px var(--c-brand);

    /* --- 8. Iconografía — dimensiones (stroke 1.75px, outline) --- */
    --icon-stroke: 1.75;
    --icon-sm: 16px; --icon-md: 20px; --icon-lg: 24px;

    /* --- 13. Navegación --- */
    --nav-sidebar-width: 260px;
    --nav-sidebar-collapsed-width: 64px;
    --nav-topbar-height: 56px;
}

/* CDX-TYPE-02 · Tabular-nums obligatorio en toda cifra */
body {
    font-variant-numeric: tabular-nums;
}