/* ═══════════════════════════════════════════════════════════════
   WritexNova — Glass Fix v1.0
   Fixes light/dark mode hero styling
═══════════════════════════════════════════════════════════════ */

/* ── Light Mode Hero — Use light gradient background ─────────── */
[data-theme="light"] .lp-hero,
:root:not([data-theme="dark"]) .lp-hero {
  background: var(--grad-hero) !important;
}

/* ── Light Mode Glass Card Text Visibility ───────────────────── */
[data-theme="light"] .lp-glass-card,
:root:not([data-theme="dark"]) .lp-glass-card {
  background: rgba(28, 25, 23, 0.85) !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
}

[data-theme="light"] .lp-glass-toolbar,
:root:not([data-theme="dark"]) .lp-glass-toolbar {
  background: rgba(41, 37, 36, 0.9) !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
}

[data-theme="light"] .lp-glass-label,
:root:not([data-theme="dark"]) .lp-glass-label {
  color: rgba(255, 255, 255, 0.6) !important;
}

[data-theme="light"] .lp-glass-input,
:root:not([data-theme="dark"]) .lp-glass-input {
  background: rgba(28, 25, 23, 0.7) !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
  color: rgba(255, 255, 255, 0.8) !important;
}

[data-theme="light"] .lp-glass-chip,
:root:not([data-theme="dark"]) .lp-glass-chip {
  background: rgba(255, 255, 255, 0.1) !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
  color: rgba(255, 255, 255, 0.9) !important;
}

[data-theme="light"] .lp-glass-output,
:root:not([data-theme="dark"]) .lp-glass-output {
  background: rgba(5, 46, 22, 0.8) !important;
  border-color: rgba(34, 197, 94, 0.4) !important;
}

[data-theme="light"] .lp-glass-output-text,
:root:not([data-theme="dark"]) .lp-glass-output-text {
  color: rgba(255, 255, 255, 0.9) !important;
}

[data-theme="light"] .lp-glass-action-btn,
:root:not([data-theme="dark"]) .lp-glass-action-btn {
  background: rgba(255, 255, 255, 0.1) !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
  color: rgba(255, 255, 255, 0.9) !important;
}

[data-theme="light"] .lp-glass-wordcount,
:root:not([data-theme="dark"]) .lp-glass-wordcount {
  color: rgba(255, 255, 255, 0.6) !important;
}

[data-theme="light"] .lp-gtab,
:root:not([data-theme="dark"]) .lp-gtab {
  color: rgba(255, 255, 255, 0.6) !important;
}

[data-theme="light"] .lp-gtab-active,
:root:not([data-theme="dark"]) .lp-gtab-active {
  color: #fff !important;
}

/* ── Light Mode Floating Badges in Hero ────────────────────────── */
[data-theme="light"] .lp-float-glass,
:root:not([data-theme="dark"]) .lp-float-glass {
  background: rgba(28, 25, 23, 0.9) !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
}

[data-theme="light"] .lp-float-title,
:root:not([data-theme="dark"]) .lp-float-title {
  color: rgba(255, 255, 255, 0.6) !important;
}

[data-theme="light"] .lp-float-val,
:root:not([data-theme="dark"]) .lp-float-val {
  color: #fff !important;
}

/* ── Dark Mode Hero — Ensure correct styling ───────────────────── */
[data-theme="dark"] .lp-hero {
  background: var(--grad-hero) !important;
}

[data-theme="dark"] .lp-glass-card {
  background: rgba(28, 25, 23, 0.85) !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
}

[data-theme="dark"] .lp-glass-toolbar {
  background: rgba(41, 37, 36, 0.9) !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .lp-glass-label {
  color: rgba(255, 255, 255, 0.5) !important;
}

[data-theme="dark"] .lp-glass-input {
  background: rgba(28, 25, 23, 0.7) !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
  color: rgba(255, 255, 255, 0.7) !important;
}

[data-theme="dark"] .lp-glass-chip {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
  color: rgba(255, 255, 255, 0.85) !important;
}

[data-theme="dark"] .lp-glass-output {
  background: rgba(5, 46, 22, 0.7) !important;
  border-color: rgba(34, 197, 94, 0.3) !important;
}

[data-theme="dark"] .lp-glass-output-text {
  color: rgba(255, 255, 255, 0.85) !important;
}

[data-theme="dark"] .lp-glass-action-btn {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
  color: rgba(255, 255, 255, 0.85) !important;
}

[data-theme="dark"] .lp-glass-wordcount {
  color: rgba(255, 255, 255, 0.5) !important;
}

[data-theme="dark"] .lp-gtab {
  color: rgba(255, 255, 255, 0.5) !important;
}

[data-theme="dark"] .lp-gtab-active {
  color: #fff !important;
}

[data-theme="dark"] .lp-float-glass {
  background: rgba(28, 25, 23, 0.85) !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
}

[data-theme="dark"] .lp-float-title {
  color: rgba(255, 255, 255, 0.5) !important;
}

[data-theme="dark"] .lp-float-val {
  color: #fafaf9 !important;
}
[data-theme="dark"] .lp-hero-badge,
[data-theme="dark"] .lp-hero-badge * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

[data-theme="dark"] .lp-model-chip,
[data-theme="dark"] .lp-model-chip * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

[data-theme="dark"] .lp-hero-badge,
[data-theme="dark"] .lp-model-chip {
  background: rgba(255, 255, 255, 0.12) !important;
  border-color: rgba(255, 255, 255, 0.22) !important;
}

/* TOP TEXT (GPT-4o...) */
.lp-hero-badge {
  color: #000 !important;
}

/* BOTTOM TEXT (model chips) */
.lp-model-chip {
  color: #000 !important;
}


/* FINAL FIX - Watch How It Works */

.lp-hero .lp-btn-secondary,
.lp-hero .lp-btn-secondary *,
.lp-hero .lp-btn-secondary svg,
.lp-hero .lp-btn-secondary path {
  color: #ffffff !important;
  fill: #ffffff !important;
  stroke: #ffffff !important;
  opacity: 1 !important;
  filter: none !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* premium glass look */
.lp-hero .lp-btn-secondary {
  background: none !important;
  border: 1px solid rgba(255,255,255,0.28) !important;
}

/* DARK MODE — Blends with hero background */
[data-theme="dark"] .lp-glass-card {
  background: rgba(15,12,35,0.92) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

[data-theme="dark"] .lp-glass-toolbar {
  background: rgba(255,255,255,0.04) !important;
  border-color: rgba(255,255,255,0.08) !important;
}

[data-theme="dark"] .lp-glass-body {
  background: transparent !important;
}

[data-theme="dark"] .lp-glass-input {
  background: rgba(255,255,255,0.05) !important;
  border-color: rgba(255,255,255,0.10) !important;
  color: rgba(255,255,255,0.75) !important;
  -webkit-text-fill-color: rgba(255,255,255,0.75) !important;
}

[data-theme="dark"] .lp-glass-chip {
  background: rgba(255,255,255,0.08) !important;
  border-color: rgba(255,255,255,0.14) !important;
  color: rgba(255,255,255,0.85) !important;
  -webkit-text-fill-color: rgba(255,255,255,0.85) !important;
}

[data-theme="dark"] .lp-glass-label {
  color: rgba(255,255,255,0.45) !important;
  -webkit-text-fill-color: rgba(255,255,255,0.45) !important;
}

[data-theme="dark"] .lp-gtab {
  color: rgba(255,255,255,0.6) !important;
  -webkit-text-fill-color: rgba(255,255,255,0.6) !important;
}

[data-theme="dark"] .lp-glass-output-text {
  color: rgba(255,255,255,0.88) !important;
  -webkit-text-fill-color: rgba(255,255,255,0.88) !important;
}

[data-theme="dark"] .lp-glass-wordcount {
  color: rgba(255,255,255,0.45) !important;
  -webkit-text-fill-color: rgba(255,255,255,0.45) !important;
}

[data-theme="dark"] .lp-float-glass {
  background: #0d0d10 !important;
  border-color: rgba(255,255,255,0.12) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

[data-theme="dark"] .lp-glass-card:hover {
  background: rgba(15,12,35,0.92) !important;
  border-color: rgba(255,255,255,0.12) !important;
  box-shadow: none !important;
}

[data-theme="dark"] .lp-float-glass:hover {
  background: #0d0d10 !important;
  border-color: rgba(255,255,255,0.18) !important;
}

/* Exception: watch play icon stays black */
.lp-hero .lp-btn-secondary .watch-play-icon circle {
  fill: #000000 !important;
  stroke: none !important;
}
.lp-hero .lp-btn-secondary .watch-play-icon path {
  fill: #ffffff !important;
  stroke: none !important;
}