/* ================================================================
   GetJIL.com Light Theme Overrides
   ----------------------------------------------------------------
   The getjil Next.js pages use Tailwind CSS with hardcoded colors.
   This file overrides those classes when sovereign-light is active.
   Injected server-side by serveGetjil() in index.ts.
   ================================================================ */

/* -- Page background & base text --------------------------------- */
[data-theme="sovereign-light"] body {
  background-color: #F8F8F6 !important;
  color: #1A1A2E !important;
}

/* -- Tailwind text-white overrides ------------------------------- */
[data-theme="sovereign-light"] .text-white {
  color: #1A1A2E !important;
}
[data-theme="sovereign-light"] .text-white\/40,
[data-theme="sovereign-light"] [class*="text-white/4"] {
  color: rgba(26, 26, 46, 0.45) !important;
}
[data-theme="sovereign-light"] .text-white\/45 {
  color: rgba(26, 26, 46, 0.5) !important;
}
[data-theme="sovereign-light"] .text-white\/50,
[data-theme="sovereign-light"] [class*="text-white/5"] {
  color: rgba(26, 26, 46, 0.55) !important;
}
[data-theme="sovereign-light"] .text-white\/58 {
  color: rgba(26, 26, 46, 0.6) !important;
}
[data-theme="sovereign-light"] .text-white\/60,
[data-theme="sovereign-light"] [class*="text-white/6"] {
  color: rgba(26, 26, 46, 0.65) !important;
}
[data-theme="sovereign-light"] .text-white\/66 {
  color: rgba(26, 26, 46, 0.7) !important;
}
[data-theme="sovereign-light"] .text-white\/70,
[data-theme="sovereign-light"] [class*="text-white/7"] {
  color: rgba(26, 26, 46, 0.75) !important;
}
[data-theme="sovereign-light"] .text-white\/72 {
  color: rgba(26, 26, 46, 0.76) !important;
}
[data-theme="sovereign-light"] .text-white\/76 {
  color: rgba(26, 26, 46, 0.8) !important;
}
[data-theme="sovereign-light"] .text-white\/80 {
  color: rgba(26, 26, 46, 0.85) !important;
}

/* -- Dark text classes (already dark, keep for white bg buttons) -- */
[data-theme="sovereign-light"] .text-\[\#121417\],
[data-theme="sovereign-light"] .text-\[\#0D1B2A\] {
  color: #121417 !important;
}

/* -- Tailwind bg overrides for dark backgrounds ------------------ */
[data-theme="sovereign-light"] .bg-\[\#0E1012\],
[data-theme="sovereign-light"] .bg-\[\#121417\],
[data-theme="sovereign-light"] .bg-\[\#0D1B2A\] {
  background-color: #F8F8F6 !important;
}

/* -- Semi-transparent white bg -> semi-transparent dark ---------- */
[data-theme="sovereign-light"] .bg-white\/\[0\.02\] {
  background-color: rgba(0, 0, 0, 0.02) !important;
}
[data-theme="sovereign-light"] .bg-white\/\[0\.04\] {
  background-color: rgba(0, 0, 0, 0.03) !important;
}
[data-theme="sovereign-light"] .bg-white\/\[0\.05\] {
  background-color: rgba(0, 0, 0, 0.04) !important;
}
[data-theme="sovereign-light"] .bg-white\/\[0\.06\] {
  background-color: rgba(0, 0, 0, 0.05) !important;
}
[data-theme="sovereign-light"] .bg-white\/10 {
  background-color: rgba(0, 0, 0, 0.06) !important;
}
[data-theme="sovereign-light"] .bg-black\/20 {
  background-color: rgba(0, 0, 0, 0.06) !important;
}

/* Solid white bg stays white (buttons, etc.) */
[data-theme="sovereign-light"] .bg-white {
  background-color: #FFFFFF !important;
}

/* -- Border overrides -------------------------------------------- */
[data-theme="sovereign-light"] .border-white\/10,
[data-theme="sovereign-light"] .border-white\/\[0\.12\],
[data-theme="sovereign-light"] .border-white\/8 {
  border-color: rgba(0, 0, 0, 0.1) !important;
}

/* -- Gradient overrides ------------------------------------------ */
[data-theme="sovereign-light"] .from-\[\#0E1012\],
[data-theme="sovereign-light"] .from-\[\#121417\] {
  --tw-gradient-from: #F8F8F6 !important;
}
[data-theme="sovereign-light"] .to-\[\#0E1012\],
[data-theme="sovereign-light"] .to-\[\#121417\] {
  --tw-gradient-to: #F0F0EC !important;
}
[data-theme="sovereign-light"] .to-white\/\[0\.03\] {
  --tw-gradient-to: rgba(0, 0, 0, 0.03) !important;
}

/* -- Hover states ------------------------------------------------ */
[data-theme="sovereign-light"] .hover\:bg-white\/\[0\.06\]:hover {
  background-color: rgba(0, 0, 0, 0.06) !important;
}
[data-theme="sovereign-light"] .hover\:border-\[\#D4AF37\]\/30:hover {
  border-color: rgba(180, 140, 20, 0.4) !important;
}

/* -- Focus states ------------------------------------------------ */
[data-theme="sovereign-light"] .focus\:border-\[\#D4AF37\]\/40:focus {
  border-color: rgba(180, 140, 20, 0.5) !important;
}

/* -- Gold accent colors stay gold -------------------------------- */
[data-theme="sovereign-light"] .text-\[\#D4AF37\] {
  color: #B8960C !important;
}
[data-theme="sovereign-light"] .text-\[\#F2D47A\] {
  color: #B8960C !important;
}
[data-theme="sovereign-light"] .bg-\[\#D4AF37\] {
  background-color: #B8960C !important;
}
[data-theme="sovereign-light"] .bg-\[\#D4AF37\]\/10 {
  background-color: rgba(184, 150, 12, 0.1) !important;
}
[data-theme="sovereign-light"] .border-\[\#D4AF37\] {
  border-color: #B8960C !important;
}
[data-theme="sovereign-light"] .border-\[\#D4AF37\]\/20,
[data-theme="sovereign-light"] .border-\[\#D4AF37\]\/25 {
  border-color: rgba(184, 150, 12, 0.25) !important;
}

/* -- Status badges (keep colored) -------------------------------- */
[data-theme="sovereign-light"] .bg-emerald-500\/10 {
  background-color: rgba(16, 185, 129, 0.12) !important;
}
[data-theme="sovereign-light"] .bg-amber-500\/10 {
  background-color: rgba(245, 158, 11, 0.12) !important;
}
[data-theme="sovereign-light"] .bg-red-500\/10 {
  background-color: rgba(239, 68, 68, 0.12) !important;
}

/* -- Placeholder text -------------------------------------------- */
[data-theme="sovereign-light"] .placeholder-white\/30::placeholder {
  color: rgba(26, 26, 46, 0.35) !important;
}

/* -- Scrollbar --------------------------------------------------- */
[data-theme="sovereign-light"] ::-webkit-scrollbar-track {
  background: #F0F0EC;
}
[data-theme="sovereign-light"] ::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.15);
}

/* -- Inline style overrides (background-color on sections) ------- */
[data-theme="sovereign-light"] [style*="background"][style*="#0E1012"],
[data-theme="sovereign-light"] [style*="background"][style*="#121417"],
[data-theme="sovereign-light"] [style*="background"][style*="#0D1B2A"] {
  background-color: #F8F8F6 !important;
}

/* -- Shadow adjustments ------------------------------------------ */
[data-theme="sovereign-light"] .shadow-soft {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
}

/* -- Floating theme toggle button (outside React root) ----------- */
#jil-float-toggle {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 9999;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 1px solid var(--border-subtle, rgba(255,255,255,0.1));
  background: var(--bg-elevated, rgba(26,29,33,0.95));
  color: var(--text-secondary, rgba(255,255,255,0.76));
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 16px rgba(0,0,0,0.3);
  transition: all 0.2s;
  padding: 0;
}
#jil-float-toggle:hover {
  border-color: var(--gold, #D4AF37);
  box-shadow: 0 4px 20px rgba(212,175,55,0.2);
}
[data-theme="sovereign-light"] #jil-float-toggle {
  background: #FFFFFF;
  border-color: rgba(0,0,0,0.12);
  color: #1A1A2E;
  box-shadow: 0 4px 16px rgba(0,0,0,0.1);
}
[data-theme="sovereign-light"] #jil-float-toggle:hover {
  border-color: #B8960C;
  box-shadow: 0 4px 20px rgba(184,150,12,0.15);
}
