@layer base {
:root {
    --brand-primary: #18304A;
    --brand-secondary: #E07132;
    --brand-dark: #0F2238;
    --brand-darker: #03090F;
    --brand-accent: #5F88B8;

    /* --- MODO OSCURO (Por defecto en :root) --- */
    --chart-text: #e2e8f0;       /* Texto claro y nítido para ejes, leyendas y step size */
    --chart-grid: #1e293b;       /* Líneas de división sutiles en oscuro */
    --chart-dl-bg: #1e293b;      /* Fondo de las etiquetas flotantes */
    --chart-dl-border: #334155;  /* Borde de las etiquetas flotantes */
    --chart-dl-text: #f8fafc;    /* Texto de las etiquetas flotantes */
  }
}

/* --- TEMA OSCURO (Por defecto) --- */
.bg-slate-950 { background-color: var(--brand-darker) !important; }
.bg-slate-900 { background-color: var(--brand-dark) !important; }
.bg-slate-800 { background-color: #162c46 !important; }
.border-slate-800 { border-color: #1e3a5f !important; }
.border-slate-700 { border-color: #274975 !important; }
.text-indigo-400, .text-indigo-500 { color: var(--brand-secondary) !important; }
.bg-indigo-600 { background-color: var(--brand-secondary) !important; }
.hover\:bg-indigo-500:hover { background-color: #f08244 !important; }
.border-indigo-500\/25 { border-color: rgba(224, 113, 50, 0.35) !important; }
.bg-indigo-600\/10 { background-color: rgba(224, 113, 50, 0.12) !important; }

/* --- TEMA CLARO HUESO PROFUNDO / MATTE --- */
.light {
    --chart-text: #1F2429;       /* Texto oscuro y de alto contraste para ejes, leyendas y step size */
    --chart-grid: #C8C1B5;       /* Líneas de división visibles sobre fondo hueso */
    --chart-dl-bg: #E5E0D5;      /* Fondo claro para las etiquetas flotantes */
    --chart-dl-border: #B8B0A2;  /* Borde para las etiquetas flotantes */
    --chart-dl-text: #161A1E;    /* Texto oscuro para las etiquetas flotantes */
}

.light .bg-slate-950 { background-color: #DCD7CD !important; }
.light .bg-slate-900 { background-color: #E5E0D5 !important; }
.light .bg-slate-800 { background-color: #D2CBC0 !important; }

.light .border-slate-800, 
.light .border-slate-700 { 
    border-color: #B8B0A2 !important; 
}

.light .text-slate-100, 
.light .text-slate-200, 
.light .text-white { 
    color: #1F2429 !important; 
}

.light .text-slate-300 { 
    color: #2C3238 !important; 
}

.light .text-slate-400 { 
    color: #4A525B !important; 
}

.light .hover\:bg-slate-800:hover { 
    background-color: #C2BBB0 !important; 
}

/* --- CORRECCIÓN DEFINITIVA DE ENCABEZADOS Y TABLAS EN MODO CLARO --- */
.light h3,
.light h3.text-slate-300,
.light .bg-slate-900 h3 {
    color: #161A1E !important;
}

.light table, 
.light thead, 
.light tbody, 
.light tr {
    background-color: transparent !important;
}

.light thead tr,
.light thead .bg-slate-950\/50 {
    background-color: #C8C1B5 !important;
}

.light thead th {
    color: #161A1E !important;
    font-weight: 700 !important;
}

.light #table-body tr {
    border-bottom-color: #B8B0A2 !important;
}

.light #table-body tr:hover {
    background-color: rgba(200, 193, 181, 0.4) !important;
}

.light #table-body td,
.light #table-body td span,
.light #table-body td div {
    color: #24292E !important;
}