/* ============================================================
   OSPOS · Tokens de diseño — fuente de verdad única
   Cargar en TODAS las pantallas (partial/header.php y login.php).
   Ver DESIGN_GUIDE.md §1 y SKILL.md.
   ============================================================ */

/* --- Tipografía auto-alojada (sin CDN) -------------------------
   Fuente: Google Fonts, subconjuntos latin + latin-ext, woff2.
   Se descarga UNA vez a public/fonts/; luego funciona sin internet.
   DM Sans es variable: un solo archivo cubre los pesos 400-700.
   ------------------------------------------------------------ */

@font-face {
    font-family: 'DM Sans';
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url('../fonts/dm-sans-var-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: 'DM Sans';
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url('../fonts/dm-sans-var-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('../fonts/poppins-500-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('../fonts/poppins-500-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('../fonts/poppins-600-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('../fonts/poppins-600-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('../fonts/poppins-700-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('../fonts/poppins-700-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* --- Paleta y escala ----------------------------------------- */

:root {
    /* Superficies */
    --ospos-bg:            #F2F6FD;
    --ospos-surface:       #FFFFFF;

    /* Texto */
    --ospos-text:          #1C2B4A;
    --ospos-text-2:        #5A6D94;
    --ospos-text-3:        #55688F;

    /* Texto sobre superficie oscura (panel del login) */
    --ospos-on-dark:       #FFFFFF;
    --ospos-on-dark-2:     #E6ECF8;
    --ospos-on-dark-3:     #C6D3EC;
    --ospos-panel-rule:    #4E6DB0;

    /* Acento plano: estrellas de valoración (panel oscuro del login) */
    --ospos-star:          #F2B705;

    /* Marca */
    --ospos-primary:       #4A6DE8;
    --ospos-primary-hover: #3F60D0;
    --ospos-primary-active:#3755BC;
    --ospos-primary-dark:  #2B4A8C;

    /* Bordes */
    --ospos-border:        #7E92C6;
    --ospos-border-soft:   #D7E0F2;

    /* Estado */
    --ospos-success:       #1FAF62;
    --ospos-success-hover: #178F50;
    --ospos-danger:        #C53030;
    --ospos-danger-bg:     #FEF2F2;
    --ospos-danger-border: #FBD5D5;

    /* Tintes de módulo del selector de inicio ------------------------
       Una familia por módulo: la tarjeta se identifica por su color sin
       depender del icono (que ya es de color). Cada familia trae tres tonos:
       -bg  teja clara · -bd borde de la teja · -fg icono y filetes.
       El fondo de la tarjeta sigue siendo --ospos-surface, para que la
       retícula se lea uniforme.
       Todos son colores planos: sin rgba, sin gradientes. */
    --ospos-m-indigo-bg:   #EEF2FF;  --ospos-m-indigo-bd:   #E0E7FF;  --ospos-m-indigo-fg:   #4338CA;
    --ospos-m-violet-bg:   #F5F3FF;  --ospos-m-violet-bd:   #EDE9FE;  --ospos-m-violet-fg:   #6D28D9;
    --ospos-m-blue-bg:     #EFF6FF;  --ospos-m-blue-bd:     #DBEAFE;  --ospos-m-blue-fg:     #1D4ED8;
    --ospos-m-sky-bg:      #F0F9FF;  --ospos-m-sky-bd:      #E0F2FE;  --ospos-m-sky-fg:      #0369A1;
    --ospos-m-teal-bg:     #F0FDFA;  --ospos-m-teal-bd:     #CCFBF1;  --ospos-m-teal-fg:     #0F766E;
    --ospos-m-emerald-bg:  #ECFDF5;  --ospos-m-emerald-bd:  #D1FAE5;  --ospos-m-emerald-fg:  #047857;
    --ospos-m-amber-bg:    #FFFBEB;  --ospos-m-amber-bd:    #FEF3C7;  --ospos-m-amber-fg:    #B45309;
    --ospos-m-orange-bg:   #FFF7ED;  --ospos-m-orange-bd:   #FFEDD5;  --ospos-m-orange-fg:   #C2410C;
    --ospos-m-rose-bg:     #FFF1F2;  --ospos-m-rose-bd:     #FFE4E6;  --ospos-m-rose-fg:     #BE123C;
    --ospos-m-cyan-bg:     #ECFEFF;  --ospos-m-cyan-bd:     #CFFAFE;  --ospos-m-cyan-fg:     #0E7490;
    --ospos-m-slate-bg:    #F1F5F9;  --ospos-m-slate-bd:    #E2E8F0;  --ospos-m-slate-fg:    #475569;

    /* Radios — flat: solo 0 / 2 / 4. Prohibido > 4 */
    --ospos-radius-sm:     2px;
    --ospos-radius:        4px;

    /* Tipografía */
    --ospos-font-body:     'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    --ospos-font-title:    'Poppins', var(--ospos-font-body);
    --ospos-fs-xs:         12px;
    --ospos-fs-sm:         13px;
    --ospos-fs-md:         14px;
    --ospos-fs-lg:         16px;
    --ospos-fs-xl:         20px;
    --ospos-fs-2xl:        24px;
    --ospos-fs-display:    32px;
}

/* ============================================================
   Patrón 2026 (slate/brand, réplica de mockup) — DESIGN_GUIDE §4
   Aprobado 2026-11-19: los mockups (receivings, home, clientes)
   definen el lenguaje de TODO el rediseño nuevo. Los tokens de
   arriba quedan intactos para las pantallas ya aprobadas.
   Usar SOLO tokens nuevos en CSS nuevo; no hay litos fuera
   de este bloque (el audit verifica esto).
   ============================================================ */

/* --- Inter auto-alojada (fuente oficial del patrón) ----------- */
/* Inter v20 variable: un archivo cubre 400-700. */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url('../fonts/inter-var-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url('../fonts/inter-var-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
    /* Escala slate (equivalente Tailwind) */
    --ospos-slate-50:       #F8FAFC;
    --ospos-slate-100:      #F1F5F9;
    --ospos-slate-200:      #E2E8F0;
    --ospos-slate-300:      #CBD5E1;
    --ospos-slate-400:      #94A3B8;
    --ospos-slate-500:      #64748B;
    --ospos-slate-600:      #475569;
    --ospos-slate-700:      #334155;
    --ospos-slate-800:      #1E293B;
    --ospos-slate-900:      #0F172A;

    /* Marca (equivalente Tailwind blue-600) */
    --ospos-brand:          #2563EB;
    --ospos-brand-hover:    #1D4ED8;
    --ospos-brand-active:   #1E40AF;
    --ospos-brand-bg:       #EFF6FF;
    --ospos-brand-bg-2:     #DBEAFE;

    /* Estado */
    --ospos-emerald:        #059669;
    --ospos-emerald-hover:  #047857;
    --ospos-emerald-bg:     #ECFDF5;
    --ospos-emerald-border: #A7F3D0;
    --ospos-emerald-fg:     #065F46;

    --ospos-rose:           #E11D48;
    --ospos-rose-hover:     #BE123C;
    --ospos-rose-bg:        #FFF1F2;
    --ospos-rose-border:    #FECDD3;
    --ospos-rose-fg:        #9F1239;

    --ospos-amber:          #D97706;

    /* Radios — escala oficial del patrón */
    --ospos-r-sm:           8px;
    --ospos-r-control:      12px;
    --ospos-r-card:         16px;
    --ospos-r-pill:         9999px;

    /* Sombras suaves — ÚNICAS permitidas (audit) */
    --ospos-shadow-sm:      0 1px 2px 0 rgba(15, 23, 42, .06);
    --ospos-shadow-card:    0 1px 3px 0 rgba(15, 23, 42, .08);

    /* Anillo de foco (inputs, botones) */
    --ospos-focus-ring:     0 0 0 3px rgba(37, 99, 235, .35);

    /* Tipografía oficial del patrón: Inter */
    --ospos-font-ui:        'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}