/* ==========================================================
   AIMAXIMUS — TEMA CLARO OPCIONAL (opt-in)
   Se activa SOLO cuando <html data-theme="light">.
   Es ADITIVO: no modifica el tema oscuro por defecto.
   Si se quita data-theme, todo vuelve al diseño original.
   Creado: 2026-06-27
   ========================================================== */

/* 1) Paleta núcleo en claro.
   El resto del sistema (--base-bg, --surface-bg, --text-*, .footer,
   .navbar-blur, secciones con var(--c-bg-1/2)...) referencia estas
   variables, así que se adaptan automáticamente. */
html[data-theme="light"] {
  --c-bg-0: #ffffff;
  --c-bg-1: #f5f8fc;
  --c-bg-2: #eaf1f9;
  --c-bg-3: #e0e9f4;
  --c-bg-4: #d4e0ef;
  --c-bg-5: #c7d6e9;

  --c-txt-1: #101a2b;
  --c-txt-2: #2a3b52;
  --c-txt-3: #56677e;

  /* Azul un poco más oscuro para contraste sobre fondo claro */
  --c-acc-azure: #0a7bb3;
  --c-acc-azure2: #0a7bb3;
  --c-acc-azure3: #0c6f9e;
  --c-acc-glow: rgba(10, 123, 179, 0.14);

  --surface-glass: rgba(255, 255, 255, 0.92);
  --navbar-blur: rgba(255, 255, 255, 0.92);
  --border-glass: rgba(15, 30, 52, 0.12);
  --border-accent: rgba(10, 123, 179, 0.30);

  --shadow-sm: 0 4px 6px -1px rgba(20, 40, 70, 0.10);
  --shadow-md: 0 10px 20px -3px rgba(20, 40, 70, 0.12);
  --shadow-lg: 0 25px 50px -5px rgba(20, 40, 70, 0.18);
  --shadow-glow-azure: 0 0 0 rgba(0, 0, 0, 0);
  --shadow-glow-em: 0 0 0 rgba(0, 0, 0, 0);
  --glow-accent: 0 0 0 rgba(0, 0, 0, 0);

  color-scheme: light;
}

/* 2) Fondo/color base: vence al <style> inline html,body{#060810!important} */
html[data-theme="light"],
html[data-theme="light"] body {
  background-color: var(--c-bg-1) !important;
  color: var(--c-txt-1) !important;
}

/* 3) Texto pensado para fondo oscuro → oscuro en claro */
html[data-theme="light"] .text-white { color: var(--c-txt-1) !important; }
html[data-theme="light"] .text-white-50 { color: var(--c-txt-2) !important; }

/* 4) Tarjetas "glass" oscuras → superficies claras (fondos translúcidos blancos) */
html[data-theme="light"] [style*="rgba(255,255,255,0.02)"],
html[data-theme="light"] [style*="rgba(255, 255, 255, 0.02)"],
html[data-theme="light"] [style*="rgba(255,255,255,0.03)"],
html[data-theme="light"] [style*="rgba(255, 255, 255, 0.03)"],
html[data-theme="light"] [style*="rgba(255,255,255,0.05)"],
html[data-theme="light"] [style*="rgba(255, 255, 255, 0.05)"] {
  background-color: rgba(15, 45, 85, 0.035) !important;
}

/* 5) Bordes blancos translúcidos → bordes oscuros sutiles (visibles en claro) */
html[data-theme="light"] [style*="rgba(255,255,255,0.07)"],
html[data-theme="light"] [style*="rgba(255, 255, 255, 0.07)"],
html[data-theme="light"] [style*="rgba(255,255,255,0.08)"],
html[data-theme="light"] [style*="rgba(255, 255, 255, 0.08)"],
html[data-theme="light"] [style*="rgba(255,255,255,0.1)"],
html[data-theme="light"] [style*="rgba(255, 255, 255, 0.1)"],
html[data-theme="light"] [style*="rgba(255,255,255,0.15)"],
html[data-theme="light"] [style*="rgba(255,255,255,0.16)"],
html[data-theme="light"] [style*="rgba(255,255,255,0.2)"],
html[data-theme="light"] [style*="rgba(255,255,255,0.20)"] {
  border-color: rgba(15, 30, 52, 0.14) !important;
}

/* 6) Texto/acento cian hardcodeado inline → azul oscuro legible en claro */
html[data-theme="light"] [style*="color:#00d9ff"],
html[data-theme="light"] [style*="color: #00d9ff"],
html[data-theme="light"] [style*="color:#00D9FF"],
html[data-theme="light"] [style*="color: #00D9FF"] {
  color: #0a6e9e !important;
}

/* 6b) Títulos con relleno de degradado recortado (2026-leap.css usa un
   degradado BLANCO→gris pensado para fondo oscuro → invisible en claro).
   Lo reemplazamos por un degradado OSCURO legible. */
html[data-theme="light"] .section-title,
html[data-theme="light"] .display-4,
html[data-theme="light"] .display-6,
html[data-theme="light"] h1,
html[data-theme="light"] h2.fw-bold {
  background: linear-gradient(135deg, #0f1b2d 0%, #2a3b52 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

/* 7) Navbar al hacer scroll (estaba hardcodeada oscura) */
html[data-theme="light"] .navbar-blur.scrolled {
  background: rgba(255, 255, 255, 0.96) !important;
  box-shadow: 0 4px 30px rgba(20, 40, 70, 0.12),
    0 1px 0 rgba(10, 123, 179, 0.18) !important;
  border-bottom: 1px solid rgba(10, 123, 179, 0.18) !important;
}

/* 8) Botones de contorno claro (invisibles sobre blanco) → contorno navy */
html[data-theme="light"] .btn-outline-light {
  color: var(--c-txt-1) !important;
  border-color: rgba(15, 30, 52, 0.35) !important;
}
html[data-theme="light"] .btn-outline-light:hover {
  background-color: rgba(15, 30, 52, 0.06) !important;
  color: var(--c-txt-1) !important;
}

/* 9) Menú desplegable de ayuda → superficie clara */
html[data-theme="light"] .dropdown-menu {
  background-color: #ffffff !important;
  border: 1px solid rgba(15, 30, 52, 0.12) !important;
}
html[data-theme="light"] .dropdown-item { color: var(--c-txt-2) !important; }
html[data-theme="light"] .dropdown-item:hover {
  background-color: rgba(10, 123, 179, 0.08) !important;
  color: var(--c-txt-1) !important;
}

/* 10) Toggle flotante claro/oscuro */
.aim-theme-toggle {
  position: fixed;
  bottom: 22px;
  left: 22px;
  z-index: 1080;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  border: 1px solid var(--border-glass);
  background: var(--surface-bg);
  color: var(--text-primary);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.15rem;
  cursor: pointer;
  box-shadow: var(--shadow-md);
  transition: transform 0.2s ease, background 0.3s ease, color 0.3s ease;
}
.aim-theme-toggle:hover { transform: scale(1.08); }
.aim-theme-toggle:focus-visible { outline: 2px solid var(--accent-primary); outline-offset: 2px; }
@media print { .aim-theme-toggle { display: none !important; } }

/* ==========================================================
   11) PÁGINAS INTERNAS — War Room (.wr-*) y Academia (.cap-*)
   Estas páginas tienen estilos propios con colores fijos; aquí
   se ajustan los textos/superficies que no derivan de variables.
   ========================================================== */
/* Tablas del War Room: texto claro fijo → oscuro legible */
html[data-theme="light"] .wr-table td,
html[data-theme="light"] .wr-table th {
  color: var(--c-txt-1) !important;
  border-color: rgba(15, 30, 52, 0.14) !important;
}
/* Acordeón de objeciones */
html[data-theme="light"] .wr-obj .accordion-button { color: var(--c-txt-1) !important; }
html[data-theme="light"] .wr-obj .accordion-body { color: var(--c-txt-2) !important; }
/* Barra superior y footer oscuros (fijos por estilo inline) → claros */
html[data-theme="light"] [style*="rgba(6,8,16"] {
  background: rgba(255, 255, 255, 0.94) !important;
  border-bottom-color: rgba(10, 123, 179, 0.20) !important;
}
html[data-theme="light"] [style*="#04060c"] {
  background: var(--c-bg-2) !important;
  border-top-color: rgba(15, 30, 52, 0.12) !important;
}
