/* ========================================
   LX Base - Variables de Tema
   Soporta tema claro y oscuro
   ======================================== */

/* Tema claro (por defecto) */
:root {
    /* Colores base */
    --bg-primary: #F6F7FB;
    --bg-secondary: #ffffff;
    --bg-tertiary: #f8f9fa;
    --card-bg: #ffffff;
    
    /* Header y sidebar */
    --header-bg: #272d36;
    --sidebar-header-bg: #272d36;
    --sidebar-content-bg: #404E67;
    
    /* Texto */
    --text-primary: #212529;
    --text-secondary: #6c757d;
    --text-muted: #868e96;
    
    /* Bordes y sombras */
    --border: #e9ecef;
    --border-light: #dee2e6;
    --border-table: #dee2e6;
    --shadow: 0 2px 8px rgba(0,0,0,0.04);
    --shadow-hover: 0 4px 16px rgba(0,0,0,0.08);
    --shadow-card: 0 8px 25px rgba(0,0,0,0.15);
    
    /* Acento (verde del tema) */
    --accent: #0cb890;
    --accent-light: #e8f5f3;
    --accent-dark: #0a9a7a;
    
    /* Aliases para theme-modern */
    --theme-green: #0cb890;
    --theme-green-light: #e8f5e8;
    --theme-green-dark: #0a9a7a;
    --theme-secondary: #6c757d;
    --theme-light: #f8f9fa;
    --theme-border: #e9ecef;
    --theme-shadow: 0 2px 8px rgba(0,0,0,0.04);
    --theme-shadow-hover: 0 4px 16px rgba(0,0,0,0.08);
    --theme-shadow-card: 0 8px 25px rgba(0,0,0,0.15);

    /* Semantica de color (Bootstrap-friendly) */
    --color-primary: #0d6efd;
    --color-primary-contrast: #ffffff;
    --color-success: #198754;
    --color-success-contrast: #ffffff;
    --color-danger: #dc3545;
    --color-danger-contrast: #ffffff;
    --color-warning: #f59f00;
    --color-warning-contrast: #1f2328;
    --color-info: #0dcaf0;
    --color-info-contrast: #062631;

    /* Neutrales para botones "claros" en dark/light */
    --color-neutral-surface: #f8f9fa;
    --color-neutral-border: #dee2e6;
    --color-neutral-text: #212529;

    /* Escala de spacing 4/8 */
    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 20px;
    --space-6: 24px;
    --space-8: 32px;
    --space-10: 40px;

    /* Tipografia base */
    --font-size-xs: 0.75rem;
    --font-size-sm: 0.875rem;
    --font-size-md: 1rem;
    --font-size-lg: 1.125rem;
    --font-size-xl: 1.25rem;
}

/* Tema oscuro */
[data-theme="dark"] {
    --bg-primary: #191919;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #272727;
    --card-bg: #2d2d2d;
    
    /* Header y sidebar cohesionados con la paleta oscura */
    --header-bg: #1a1a1a;
    --sidebar-header-bg: #141414;
    --sidebar-content-bg: #1e1e1e;
    
    --text-primary: #ffffff;
    --text-secondary: #b0b0b0;
    --text-muted: #8a8a8a;
    
    --border: #404040;
    --border-light: #4a4a4a;
    --border-table: #353535;
    --shadow: 0 2px 8px rgba(0,0,0,0.3);
    --shadow-hover: 0 4px 16px rgba(0,0,0,0.4);
    --shadow-card: 0 8px 25px rgba(0,0,0,0.5);
    
    --accent: #0cb890;
    --accent-light: rgba(12, 184, 144, 0.2);
    --accent-dark: #0aa078;
    
    --theme-green: #0cb890;
    --theme-green-light: rgba(12, 184, 144, 0.2);
    --theme-green-dark: #0aa078;
    --theme-secondary: #b0b0b0;
    --theme-light: #272727;
    --theme-border: #404040;
    --theme-shadow: 0 2px 8px rgba(0,0,0,0.3);
    --theme-shadow-hover: 0 4px 16px rgba(0,0,0,0.4);
    --theme-shadow-card: 0 8px 25px rgba(0,0,0,0.5);

    /* Semantica de color dark (mejor contraste) */
    --color-primary: #3b82f6;
    --color-primary-contrast: #f7fbff;
    --color-success: #10b981;
    --color-success-contrast: #f0fdf8;
    --color-danger: #ef4444;
    --color-danger-contrast: #fff5f5;
    --color-warning: #f59e0b;
    --color-warning-contrast: #1f1300;
    --color-info: #38bdf8;
    --color-info-contrast: #041a2a;

    --color-neutral-surface: #272727;
    --color-neutral-border: #4a4a4a;
    --color-neutral-text: #f3f4f6;
}

/* ========================================
   Tipografía global - Override de Nunito Sans
   Inter se carga desde Google Fonts en _Layout
   ======================================== */
body,
.jq-toast-single,
.jq-toast-single h2,
.tooltip {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
}

/* Selector de tema en header */
.theme-toggle {
    background: transparent;
    border: none;
    color: #fff;
    cursor: pointer;
    padding: 6px 10px;
    border-radius: 6px;
    transition: opacity 0.2s ease;
}
.theme-toggle:hover {
    opacity: 0.85;
}
.theme-toggle i {
    font-size: 1.1rem;
}