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

/* Tema claro (por defecto) */
:root {
    /* Colores base */
    --bg-primary: #F8F9FC;
    --bg-secondary: #ffffff;
    --bg-tertiary: #f8f9fa;
    --card-bg: #ffffff;
    
    /* Header y sidebar */
    --header-bg: #0A0A0A;
    --sidebar-header-bg: #0A0A0A;
    --sidebar-content-bg: #111111;

    /* Texto */
    --text-primary: #1A1D23;
    --text-secondary: #64748B;
    --text-muted: #94A3B8;

    /* Bordes y sombras */
    --border: #E2E8F0;
    --border-light: #CBD5E1;
    --border-table: #E2E8F0;
    --shadow-xs: 0 1px 2px rgba(0,0,0,0.05);
    --shadow: 0 1px 3px rgba(0,0,0,0.08), 0 1px 2px rgba(0,0,0,0.04);
    --shadow-hover: 0 4px 6px -1px rgba(0,0,0,0.08), 0 2px 4px -2px rgba(0,0,0,0.04);
    --shadow-card: 0 10px 15px -3px rgba(0,0,0,0.06), 0 4px 6px -4px rgba(0,0,0,0.04);

    /* Acento — negro sobre fondos claros; azul hielo (#f3fafe) como tint */
    --accent: #0A0A0A;
    --accent-light: #f3fafe;
    --accent-dark: #000000;

    /* Aliases para theme-modern */
    --theme-green: #0A0A0A;
    --theme-green-light: #f3fafe;
    --theme-green-dark: #000000;
    --theme-secondary: #64748B;
    --theme-light: #f8f9fa;
    --theme-border: #E2E8F0;
    --theme-shadow-xs: 0 1px 2px rgba(0,0,0,0.05);
    --theme-shadow: 0 1px 3px rgba(0,0,0,0.08), 0 1px 2px rgba(0,0,0,0.04);
    --theme-shadow-hover: 0 4px 6px -1px rgba(0,0,0,0.08), 0 2px 4px -2px rgba(0,0,0,0.04);
    --theme-shadow-card: 0 10px 15px -3px rgba(0,0,0,0.06), 0 4px 6px -4px rgba(0,0,0,0.04);

    /* 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;
    --font-size-2xl: 1.5rem;
    --font-size-3xl: 2rem;
}

/* Tema oscuro */
[data-theme="dark"] {
    --bg-primary: #131316;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #272727;
    --card-bg: #2d2d2d;
    
    /* Header y sidebar */
    --header-bg: #0A0A0A;
    --sidebar-header-bg: #0A0A0A;
    --sidebar-content-bg: #111111;
    
    --text-primary: #E0E0E0;
    --text-secondary: #94A3B8;
    --text-muted: #94A3B8;
    
    --border: #383838;
    --border-light: #4a4a4a;
    --border-table: #3a3a3a;
    --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: #f3fafe;
    --accent-light: rgba(243, 250, 254, 0.12);
    --accent-dark: #c8e3f5;

    --theme-green: #f3fafe;
    --theme-green-light: rgba(243, 250, 254, 0.12);
    --theme-green-dark: #c8e3f5;
    --theme-secondary: #94A3B8;
    --theme-light: #272727;
    --theme-border: #383838;
    --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;
}