/**
 * OVERRIDE CRÍTICO - Cambios de Tema Dinámicos
 * 
 * Este archivo FUERZA que TODOS los elementos respondan al cambio de tema
 * usando las variables CSS definidas en daisyui-colors.css
 * 
 * CARGA: DESPUÉS de Tailwind, ANTES de style.css
 */

/* ========================================================================
   ASEGURAR QUE LAS VARIABLES EXISTEN Y ESTÁN DISPONIBLES
   ======================================================================== */

html {
    --b1: 0 0% 100%;
    --b2: 0 0% 96%;
    --b3: 0 0% 90%;
    --bc: 223 17% 12%;
}

/* ========================================================================
   SELECTORES DE TEMA - Cambiar variables cuando data-theme cambia
   ======================================================================== */

[data-theme="marhoani"] {
    --b1: 0 0% 100% !important;
    --b2: 0 0% 96% !important;
    --b3: 0 0% 90% !important;
    --bc: 223 17% 12% !important;
}

[data-theme="marhoani-dark"] {
    --b1: 223 14% 16% !important;
    --b2: 223 14% 22% !important;
    --b3: 223 14% 28% !important;
    --bc: 0 0% 90% !important;
}

/* ========================================================================
   SOBRESCRIBIR TODOS LOS FONDOS - ¡CRÍTICO!
   Estos cambian la clase compilada por Tailwind de color fijo a variable CSS
   ======================================================================== */

/* HTML y Body */
html, body {
    background-color: hsl(var(--b1)) !important;
    color: hsl(var(--bc)) !important;
}

section, article, main, div {
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* bg-base-100 - Muy específico */
.bg-base-100, [class~="bg-base-100"] {
    background-color: hsl(var(--b1)) !important;
}

/* bg-base-200 - Muy específico */
.bg-base-200, [class~="bg-base-200"] {
    background-color: hsl(var(--b2)) !important;
}

/* bg-base-300 - Muy específico */
.bg-base-300, [class~="bg-base-300"] {
    background-color: hsl(var(--b3)) !important;
}

/* Selectores WILDCARD para capturar variantes */
[class*="bg-base-100"] { background-color: hsl(var(--b1)) !important; }
[class*="bg-base-200"] { background-color: hsl(var(--b2)) !important; }
[class*="bg-base-300"] { background-color: hsl(var(--b3)) !important; }

/* ========================================================================
   SOBRESCRIBIR TODOS LOS TEXTOS - Asegurar que también cambien
   ======================================================================== */

.text-base-content, [class~="text-base-content"] {
    color: hsl(var(--bc)) !important;
}

.text-base-content\/50 { color: hsla(var(--bc), 0.5) !important; }
.text-base-content\/60 { color: hsla(var(--bc), 0.6) !important; }
.text-base-content\/70 { color: hsla(var(--bc), 0.7) !important; }
.text-base-content\/80 { color: hsla(var(--bc), 0.8) !important; }
.text-base-content\/90 { color: hsla(var(--bc), 0.9) !important; }

/* ========================================================================
   SOBRESCRIBIR BORDES
   ======================================================================== */

.border-base-100 { border-color: hsl(var(--b1)) !important; }
.border-base-200 { border-color: hsl(var(--b2)) !important; }
.border-base-300 { border-color: hsl(var(--b3)) !important; }

/* ========================================================================
   COMPONENTES DAISYUI ESPECÍFICOS
   ======================================================================== */

.card {
    background-color: hsl(var(--b1)) !important;
    color: hsl(var(--bc)) !important;
    transition: all 0.3s ease;
}

.navbar {
    background-color: hsl(var(--b1)) !important;
    color: hsl(var(--bc)) !important;
    transition: all 0.3s ease;
}

.footer {
    background-color: hsl(var(--b1)) !important;
    color: hsl(var(--bc)) !important;
}

.btn-ghost {
    color: hsl(var(--bc)) !important;
}

/* ========================================================================
   TRANSICIÓN SUAVE PARA TODOS LOS CAMBIOS
   ======================================================================== */

* {
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}
/**
 * Theme Override - Marhoani
 * Este archivo sobrepone estilos Tailwind/DaisyUI para forzar cambios de tema
 * CARGA DESPUÉS: Tailwind + DaisyUI + daisyui-colors.css + style.css
 */

/* ========================================================================
   TEMA CLARO - MARHOANI
   ======================================================================== */

[data-theme="marhoani"],
[data-theme="marhoani"] * {
    --b1: 0 0% 100% !important;
    --b2: 0 0% 96% !important;
    --b3: 0 0% 90% !important;
    --bc: 223 17% 12% !important;
}

[data-theme="marhoani"] body {
    background-color: #ffffff !important;
    color: #1a1f2e !important;
}

[data-theme="marhoani"] section,
[data-theme="marhoani"] div,
[data-theme="marhoani"] main,
[data-theme="marhoani"] article {
    --b1: 0 0% 100% !important;
    --b2: 0 0% 96% !important;
    --b3: 0 0% 90% !important;
    --bc: 223 17% 12% !important;
}

/* Fondos explícitos tema claro */
[data-theme="marhoani"] .bg-base-100 {
    background-color: #ffffff !important;
}

[data-theme="marhoani"] .bg-base-200 {
    background-color: #f5f5f5 !important;
}

[data-theme="marhoani"] .bg-base-300 {
    background-color: #e6e6e6 !important;
}

/* Textos tema claro */
[data-theme="marhoani"] .text-base-content {
    color: #1a1f2e !important;
}

[data-theme="marhoani"] .text-base-content\/70 {
    color: rgba(26, 31, 46, 0.7) !important;
}

[data-theme="marhoani"] .text-base-content\/60 {
    color: rgba(26, 31, 46, 0.6) !important;
}

/* Bordes tema claro */
[data-theme="marhoani"] .border-base-300 {
    border-color: #e6e6e6 !important;
}

[data-theme="marhoani"] .border-base-200 {
    border-color: #f5f5f5 !important;
}

/* Cards tema claro */
[data-theme="marhoani"] .card {
    background-color: #ffffff !important;
    color: #1a1f2e !important;
    border-color: #e6e6e6 !important;
}

/* ========================================================================
   TEMA OSCURO - MARHOANI-DARK
   ======================================================================== */

[data-theme="marhoani-dark"],
[data-theme="marhoani-dark"] * {
    --b1: 223 14% 16% !important;
    --b2: 223 14% 22% !important;
    --b3: 223 14% 28% !important;
    --bc: 0 0% 90% !important;
}

[data-theme="marhoani-dark"] body {
    background-color: #1a1f2e !important;
    color: #e6e6e6 !important;
}

[data-theme="marhoani-dark"] section,
[data-theme="marhoani-dark"] div,
[data-theme="marhoani-dark"] main,
[data-theme="marhoani-dark"] article {
    --b1: 223 14% 16% !important;
    --b2: 223 14% 22% !important;
    --b3: 223 14% 28% !important;
    --bc: 0 0% 90% !important;
}

/* Fondos explícitos tema oscuro */
[data-theme="marhoani-dark"] .bg-base-100 {
    background-color: #1a1f2e !important;
}

[data-theme="marhoani-dark"] .bg-base-200 {
    background-color: #252d3d !important;
}

[data-theme="marhoani-dark"] .bg-base-300 {
    background-color: #3d4556 !important;
}

/* Textos tema oscuro */
[data-theme="marhoani-dark"] .text-base-content {
    color: #e6e6e6 !important;
}

[data-theme="marhoani-dark"] .text-base-content\/70 {
    color: rgba(230, 230, 230, 0.7) !important;
}

[data-theme="marhoani-dark"] .text-base-content\/60 {
    color: rgba(230, 230, 230, 0.6) !important;
}

/* Bordes tema oscuro */
[data-theme="marhoani-dark"] .border-base-300 {
    border-color: #3d4556 !important;
}

[data-theme="marhoani-dark"] .border-base-200 {
    border-color: #252d3d !important;
}

/* Cards tema oscuro */
[data-theme="marhoani-dark"] .card {
    background-color: #1a1f2e !important;
    color: #e6e6e6 !important;
    border-color: #3d4556 !important;
}

/* ========================================================================
   TRANSICIONES SUAVES
   ======================================================================== */

body,
section,
div,
.bg-base-100,
.bg-base-200,
.bg-base-300,
.text-base-content,
.card {
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease !important;
}
