/*
    theme-tokens.css
    Fuente unica de verdad para el rediseno visual del ERP: paleta de color,
    tipografia, radios, sombras y espaciado. Se carga antes que modern-ui.css,
    modern-shell.css, modern-components.css y dashboard-modern.css, que
    mapean sus propias variables (--mu-*, --dm-*) a estos tokens (--t-*) en
    vez de reescribir sus reglas existentes. No define selectores de
    componentes, solo variables.
*/

:root {
    /* ---------- Color ---------- */
    --t-primary: #0B5ED7;
    --t-primary-dark: #094CB0;
    --t-primary-soft: rgba(11, 94, 215, 0.10);
    --t-secondary: #1E293B;

    --t-success: #10B981;
    --t-success-bg: #ECFDF5;
    --t-warning: #F59E0B;
    --t-warning-bg: #FFFBEB;
    --t-danger: #EF4444;
    --t-danger-bg: #FEF2F2;
    --t-info: #06B6D4;
    --t-info-bg: #ECFEFF;

    --t-bg: #F8FAFC;
    --t-card: #FFFFFF;
    --t-text: #1F2937;
    --t-text-muted: #64748B;
    --t-border: #E5E9F1;

    /* ---------- Tipografia ---------- */
    --t-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --t-fs-xs: 11px;
    --t-fs-sm: 12.5px;
    --t-fs-base: 13.5px;
    --t-fs-md: 15px;
    --t-fs-lg: 18px;
    --t-fs-xl: 24px;
    --t-fs-2xl: 32px;

    /* ---------- Radio / sombra / espaciado ---------- */
    --t-radius-sm: 8px;
    --t-radius: 12px;
    --t-radius-lg: 16px;
    --t-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.05);
    --t-shadow: 0 2px 10px rgba(15, 23, 42, 0.07);
    --t-shadow-lg: 0 8px 28px rgba(15, 23, 42, 0.12);
    --t-shadow-hover: 0 10px 24px rgba(15, 23, 42, 0.12);
    --t-space-1: 4px;
    --t-space-2: 8px;
    --t-space-3: 12px;
    --t-space-4: 16px;
    --t-space-5: 24px;
    --t-space-6: 32px;
    --t-transition: 160ms cubic-bezier(.4,0,.2,1);
}

/* ---------- Modo oscuro: mismos nombres de token, valores oscuros ---------- */
html.dark-mode {
    --t-primary: #3B82F6;
    --t-primary-dark: #60A5FA;
    --t-primary-soft: rgba(59, 130, 246, 0.16);
    --t-secondary: #CBD5E1;

    --t-success: #34D399;
    --t-success-bg: rgba(16, 185, 129, 0.12);
    --t-warning: #FBBF24;
    --t-warning-bg: rgba(245, 158, 11, 0.12);
    --t-danger: #F87171;
    --t-danger-bg: rgba(239, 68, 68, 0.12);
    --t-info: #22D3EE;
    --t-info-bg: rgba(6, 182, 212, 0.12);

    --t-bg: #0F172A;
    --t-card: #1E293B;
    --t-text: #F1F5F9;
    --t-text-muted: #94A3B8;
    --t-border: rgba(148, 163, 184, 0.18);

    --t-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.25);
    --t-shadow: 0 2px 10px rgba(0, 0, 0, 0.30);
    --t-shadow-lg: 0 8px 28px rgba(0, 0, 0, 0.40);
    --t-shadow-hover: 0 10px 24px rgba(0, 0, 0, 0.42);
}

body, .smart-form, .modal-content {
    font-family: var(--t-font);
}