/* IVPOOLS Text Visibility Fix — FINAL (v4)
   Comprehensive fix for ALL pages, ALL themes.
   Works with Tailwind v4 compiled CSS.
   */

/* === HEADER NAV TEXT === */
/* When NOT scrolled (homepage hero) — text-white class is present */
header nav a.text-white,
header nav button.text-white,
header > div > div > nav button.text-white,
header > div > div > nav a.text-white {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* Hover — keep white */
header nav a.text-white:hover,
header nav button.text-white:hover,
header > div > div > nav button.text-white:hover,
header > div > div > nav a.text-white:hover {
  color: #ffffff !important;
  background-color: rgba(255, 255, 255, 0.15) !important;
}

/* When scrolled — text-foreground class is present */
/* On aurora-platinum, --foreground is light (oklch 0.97) so text is visible */
/* But we force it to be visible on ALL themes */
header nav a.text-foreground,
header nav button.text-foreground,
header > div > div > nav button.text-foreground,
header > div > div > nav a.text-foreground {
  color: var(--foreground, #e2e8f0) !important;
  -webkit-text-fill-color: var(--foreground, #e2e8f0) !important;
}

header nav a.text-foreground:hover,
header nav button.text-foreground:hover {
  color: var(--primary, #38bdf8) !important;
}

/* Contact link */
header nav a[href="/contact"],
header > div > div > nav a[href="/contact"] {
  color: rgba(255, 255, 255, 0.8) !important;
}
header nav a[href="/contact"]:hover {
  color: #ffffff !important;
}

/* Shop button (gold accent) */
header nav a[class*="bg-accent"] {
  color: #ffffff !important;
  background-color: rgba(251, 191, 36, 0.20) !important;
}

/* === ALL INPUTS — dark background + white text === */
input,
textarea,
select {
  background-color: rgba(15, 23, 42, 0.6) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  caret-color: #ffffff !important;
}

input::placeholder,
textarea::placeholder {
  color: rgba(255, 255, 255, 0.5) !important;
  -webkit-text-fill-color: rgba(255, 255, 255, 0.5) !important;
  opacity: 1 !important;
}

input:focus,
input:focus-visible,
textarea:focus,
textarea:focus-visible,
select:focus,
select:focus-visible {
  background-color: rgba(15, 23, 42, 0.8) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border-color: #38bdf8 !important;
  box-shadow: 0 0 0 2px rgba(56, 189, 248, 0.2) !important;
  outline: none !important;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active,
textarea:-webkit-autofill {
  -webkit-text-fill-color: #ffffff !important;
  -webkit-box-shadow: 0 0 0 1000px rgba(15, 23, 42, 0.6) inset !important;
  caret-color: #ffffff !important;
  transition: background-color 9999s ease-out 0s !important;
}

option {
  background-color: #0f172a !important;
  color: #ffffff !important;
}

/* === TEXT VISIBILITY (kept from original) === */
.bg-white { color: #1f2937 !important; }
.bg-white p, .bg-white span, .bg-white div, .bg-white label,
.bg-white h1, .bg-white h2, .bg-white h3, .bg-white h4,
.bg-white td, .bg-white th, .bg-white li, .bg-white button, .bg-white a {
  color: #1f2937 !important;
}

.bg-slate-50, .bg-sky-50, .bg-amber-50, .bg-emerald-50,
.bg-purple-50, .bg-rose-50, .bg-orange-50 { color: #1f2937 !important; }

.bg-slate-800, .bg-slate-900 { color: #f1f5f9 !important; }
.bg-slate-800 *, .bg-slate-900 * { color: #f1f5f9 !important; }

label { color: #374151 !important; }

/* Override for ALL dark themes (liquid-glass is default, plus all vacation themes) */
[data-theme="aurora-platinum"] label,
[data-theme="liquid-glass"] label,
[data-theme="aqua-luxury"] label,
[data-theme="santorini"] label,
[data-theme="maldives"] label,
[data-theme="monaco"] label,
[data-theme="amalfi"] label,
[data-theme="bali"] label,
[data-theme="tulum"] label,
[data-theme="mykonos"] label,
[data-theme="seychelles"] label,
[data-theme="capri"] label,
[data-theme="phuket"] label,
.dark label,
.bg-card label {
  color: #e2e8f0 !important;
}

/* Override for configurator pages with explicit dark backgrounds (#0D1B2A, #0a1428, etc.) */
.bg-\[\#0D1B2A\] label,
.bg-\[\#0a1428\] label,
.bg-slate-950 label,
.bg-slate-900 label,
.bg-\[\#1E3A5F\] label,
.bg-\[\#0F1B2D\] label,
[class*="bg-\[\#0D1B2A"] label,
[class*="bg-\[\#0a1428"] label,
[class*="bg-slate-950"] label,
[class*="bg-slate-900"] label {
  color: #e2e8f0 !important;
}

/* Light text for labels with text-slate-300/400/500 utilities (configurator labels) */
label.text-slate-300, label.text-slate-400, label.text-slate-500,
label.text-\[\#94A3B8\], label.text-\[\#A78BFA\], label.text-\[\#60A5FA\],
label.text-sky-300, label.text-sky-400, label.text-cyan-300, label.text-cyan-400,
label.text-slate-200, label.text-slate-100, label.text-white,
label.text-\[\#CBD5E1\], label.text-\[\#E2E8F0\] {
  color: #e2e8f0 !important;
}

option { color: #1f2937 !important; background: #fff !important; }

.prose { color: #e9f0f5 !important; }
.prose p, .prose li, .prose ul, .prose ol { color: #e9f0f5 !important; }

[class*="text-white/70"], [class*="text-white/60"],
[class*="text-white/80"], [class*="text-white/50"] {
  color: #f1f5f9 !important;
  opacity: 1 !important;
}