/* ═══════════════════════════════════════════════════════════════════
 * EMPIRE THEME TOGGLE · Day theme overrides · 2026-05-08
 * Loaded by empire-theme-toggle.js when localStorage.mtai_theme === 'day'
 *
 * Strategy: high-specificity attribute selector [data-theme="day"]
 * overrides backgrounds + text + cards · keeps brand accents (cyan/purple/gold/red/amber).
 *
 * Night theme = no overrides · existing site CSS rules.
 * Brand accents stay identical in both themes for empire visual consistency.
 * ═══════════════════════════════════════════════════════════════════ */

/* ─── Day theme overrides ─── */
html[data-theme="day"] body,
html[data-theme="day"] {
  background: #f3f6fc !important;
  color: #0a0e18 !important;
}

html[data-theme="day"] body::before,
html[data-theme="day"] body::after {
  /* Tone down dark vignettes */
  opacity: 0.04 !important;
}

/* Card / panel surfaces */
html[data-theme="day"] .panel,
html[data-theme="day"] .glass,
html[data-theme="day"] .glass-thick,
html[data-theme="day"] .card,
html[data-theme="day"] .price-card,
html[data-theme="day"] .pricing-tier,
html[data-theme="day"] .seat,
html[data-theme="day"] .tier,
html[data-theme="day"] .verdict-card,
html[data-theme="day"] .ledger,
html[data-theme="day"] .compare-table,
html[data-theme="day"] .feature-card,
html[data-theme="day"] .glass.price-card,
html[data-theme="day"] .glass-thick.price-card {
  background: rgba(255, 255, 255, 0.92) !important;
  color: #0a0e18 !important;
  border-color: rgba(0, 80, 120, 0.22) !important;
  box-shadow: 0 8px 28px rgba(10, 14, 24, 0.08), 0 0 0 1px rgba(0, 80, 120, 0.06) inset !important;
}

/* Member cards · parliament theater · etc */
html[data-theme="day"] .member,
html[data-theme="day"] .member-body,
html[data-theme="day"] .chancellor-row,
html[data-theme="day"] .chancellor-body,
html[data-theme="day"] .build-result,
html[data-theme="day"] .scoping {
  background: rgba(255, 255, 255, 0.86) !important;
  color: #0a0e18 !important;
  border-color: rgba(0, 80, 120, 0.22) !important;
}
html[data-theme="day"] .member-body,
html[data-theme="day"] .chancellor-body {
  background: rgba(245, 248, 252, 0.95) !important;
}

/* Headings + body text */
html[data-theme="day"] h1,
html[data-theme="day"] h2,
html[data-theme="day"] h3,
html[data-theme="day"] h4,
html[data-theme="day"] p,
html[data-theme="day"] li,
html[data-theme="day"] .text,
html[data-theme="day"] .hero-sub,
html[data-theme="day"] .section-desc,
html[data-theme="day"] .pdesc,
html[data-theme="day"] .audience {
  color: #0a0e18 !important;
  text-shadow: none !important;
}

/* Hero text in day mode · drop the dark text-shadow · keep readable over video */
html[data-theme="day"] .hero h1,
html[data-theme="day"] .hero .hero-sub,
html[data-theme="day"] .hero-kicker,
html[data-theme="day"] .htitle,
html[data-theme="day"] .hsub {
  color: #0a0e18 !important;
  text-shadow: 0 1px 8px rgba(255, 255, 255, 0.85), 0 0 22px rgba(255, 255, 255, 0.65) !important;
}

/* Muted / dim / tertiary text */
html[data-theme="day"] .text-muted,
html[data-theme="day"] .text-dim,
html[data-theme="day"] .muted,
html[data-theme="day"] .tertiary,
html[data-theme="day"] .ledger-time,
html[data-theme="day"] .member-role,
html[data-theme="day"] .member-status {
  color: rgba(10, 14, 24, 0.55) !important;
}

/* Inputs */
html[data-theme="day"] input,
html[data-theme="day"] textarea,
html[data-theme="day"] select {
  background: rgba(255, 255, 255, 0.95) !important;
  color: #0a0e18 !important;
  border-color: rgba(0, 80, 120, 0.28) !important;
}
html[data-theme="day"] textarea::placeholder,
html[data-theme="day"] input::placeholder {
  color: rgba(10, 14, 24, 0.45) !important;
}

/* Glassmorphic prompt-box · invert for day */
html[data-theme="day"] .prompt-box {
  background: rgba(255, 255, 255, 0.55) !important;
  border-color: rgba(0, 80, 120, 0.28) !important;
  backdrop-filter: blur(14px) saturate(1.2) !important;
  -webkit-backdrop-filter: blur(14px) saturate(1.2) !important;
}
html[data-theme="day"] .prompt-box textarea {
  background: rgba(255, 255, 255, 0.85) !important;
  color: #0a0e18 !important;
}

/* Trust strip · invert backdrop */
html[data-theme="day"] .trust-strip {
  background: rgba(245, 248, 252, 0.85) !important;
  border-color: rgba(0, 80, 120, 0.18) !important;
}

/* Network nav / top bar · keep brand color but invert background */
html[data-theme="day"] nav,
html[data-theme="day"] .network-nav,
html[data-theme="day"] .empire-bar {
  background: rgba(245, 248, 252, 0.92) !important;
  color: #0a0e18 !important;
  border-color: rgba(0, 80, 120, 0.18) !important;
}
html[data-theme="day"] nav a,
html[data-theme="day"] .network-nav a {
  color: #0a0e18 !important;
}

/* Buttons · keep gradient brand colors · invert ghost variants */
html[data-theme="day"] .btn-secondary,
html[data-theme="day"] .btn.ghost,
html[data-theme="day"] .auth-btn.ghost {
  background: rgba(255, 255, 255, 0.7) !important;
  color: #0a4a6a !important;
  border-color: rgba(0, 80, 120, 0.32) !important;
}

/* Theme button itself · invert in day mode */
html[data-theme="day"] #empire-theme-btn {
  background: rgba(255, 255, 255, 0.92) !important;
  color: #0a0e18 !important;
  border-color: rgba(0, 80, 120, 0.32) !important;
  box-shadow: 0 6px 20px rgba(10, 14, 24, 0.12) !important;
}

/* Comparison table · day mode */
html[data-theme="day"] .compare-table th,
html[data-theme="day"] .compare-table td {
  background: rgba(255, 255, 255, 0.85) !important;
  color: #0a0e18 !important;
  border-color: rgba(0, 80, 120, 0.18) !important;
}

/* Footer */
html[data-theme="day"] footer {
  background: rgba(245, 248, 252, 0.92) !important;
  color: rgba(10, 14, 24, 0.7) !important;
  border-top-color: rgba(0, 80, 120, 0.18) !important;
}
html[data-theme="day"] footer a {
  color: #0a4a6a !important;
}

/* Body radial gradient backgrounds (per-page) · soften in day */
html[data-theme="day"] body::before {
  background:
    radial-gradient(circle at 15% 30%, rgba(0, 212, 255, 0.04) 0%, transparent 40%),
    radial-gradient(circle at 85% 70%, rgba(179, 71, 255, 0.03) 0%, transparent 40%) !important;
}

/* Brand accents · DO NOT TOUCH (kept identical between themes for empire consistency) */
/* cyan #00d2ff · violet #b347ff · gold #fbbf24 · red #ff5469 · green #22c55e · amber #f97316 */
/* kin-icons sprite uses currentColor · adapts automatically */

/* Hero video opacity · keep at 1.0 per memory #77 (no tint) · day mode doesn't override */

/* Smooth transition between themes */
html, body, .panel, .glass, .glass-thick, .card, .price-card, .pricing-tier,
.seat, .tier, .verdict-card, .ledger, .member, .member-body, .compare-table th,
.compare-table td, footer, nav, .network-nav, input, textarea, select {
  transition: background 0.3s ease, color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}
/* ═══════════════════════════════════════════════════════════════════
 * EMPIRE HIGH-CONTRAST OVERRIDES · Mo 2026-05-09 GLOBAL RULE
 *
 * "GLOBAL RULE = THIS IS NOT VISIBLE. I NEED HIGHEST CONTRAST. ALWAYS!"
 *
 * In DAY mode, brand-accent colors (cyan / gold / emerald / mint / purple)
 * vanish on white backgrounds. This forces high-contrast rendering of
 * prices, headlines, and brand-color text on light surfaces.
 *
 * Strategy: in [data-theme="day"], any element styled with a brand accent
 *   gets a deep navy core with the brand color as a bold text-stroke for
 *   the accent flourish. WCAG AA contrast on white. Brand identity preserved.
 *
 * Loaded by empire-theme-toggle.js after the day-theme overrides.
 * ═══════════════════════════════════════════════════════════════════ */

/* ═══ Day mode · force prices, amounts, headlines to high contrast ═══ */
html[data-theme="day"] .tier .price,
html[data-theme="day"] .price-card .price,
html[data-theme="day"] .pricing-tier .price,
html[data-theme="day"] .price,
html[data-theme="day"] .tier-price,
html[data-theme="day"] .amount,
html[data-theme="day"] .price-amount,
html[data-theme="day"] .seat-price,
html[data-theme="day"] .pricing-amount,
html[data-theme="day"] .holo {
  color: #0a0e18 !important;
  -webkit-text-fill-color: #0a0e18 !important;
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  text-shadow: 0 0 1px rgba(0,150,180,0.15);
}

html[data-theme="day"] .tier .price small,
html[data-theme="day"] .price small,
html[data-theme="day"] .tier-price small {
  color: #475569 !important;
  -webkit-text-fill-color: #475569 !important;
}

/* Bullets / list ticks · usually brand-accent · enforce dark in day */
html[data-theme="day"] .tier li::before,
html[data-theme="day"] .price-card li::before,
html[data-theme="day"] .pricing-tier li::before,
html[data-theme="day"] .feature-list li::before {
  color: #047857 !important;
}
html[data-theme="day"] .tier li,
html[data-theme="day"] .price-card li,
html[data-theme="day"] .pricing-tier li,
html[data-theme="day"] .feature-list li {
  color: #1e293b !important;
}

/* Brand-color headlines using gradient text-fill · neutralize in day */
html[data-theme="day"] h1,
html[data-theme="day"] h2,
html[data-theme="day"] h3 {
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
}
html[data-theme="day"] h1 {
  color: #0a0e18 !important;
  -webkit-text-fill-color: #0a0e18 !important;
}
html[data-theme="day"] h2,
html[data-theme="day"] h3 {
  color: #1e293b !important;
  -webkit-text-fill-color: #1e293b !important;
}

/* CTA buttons that use brand-accent text on white · enforce dark/heavy */
html[data-theme="day"] .btn,
html[data-theme="day"] .cta,
html[data-theme="day"] .forge-btn,
html[data-theme="day"] button.primary,
html[data-theme="day"] a.button {
  color: #0a0e18 !important;
  font-weight: 800 !important;
}

/* Outline / ghost buttons in day mode · cyan border + dark text */
html[data-theme="day"] .btn.ghost,
html[data-theme="day"] .auth-btn.ghost,
html[data-theme="day"] .btn-outline {
  color: #0a4d6b !important;
  border-color: #0a4d6b !important;
  background: rgba(255,255,255,0.85) !important;
}

/* Section labels / kickers · usually cyan on dark · in day → deeper teal */
html[data-theme="day"] .section-label,
html[data-theme="day"] .hero-kicker,
html[data-theme="day"] .kicker {
  color: #0e7490 !important;
}

/* Holographic / gradient text · neutralize the WebKit text-fill trick */
html[data-theme="day"] [style*="-webkit-text-fill-color"],
html[data-theme="day"] [style*="background-clip:text"],
html[data-theme="day"] [style*="background-clip: text"] {
  -webkit-text-fill-color: #0a0e18 !important;
  background: none !important;
}

/* Glow elements · keep them visible but tone for white bg */
html[data-theme="day"] .glow,
html[data-theme="day"] .neon {
  color: #0e7490 !important;
  text-shadow: 0 0 12px rgba(0,210,255,0.35) !important;
}

/* Body text floor · NEVER lighter than #1e293b in day mode */
html[data-theme="day"] p,
html[data-theme="day"] li,
html[data-theme="day"] td,
html[data-theme="day"] span,
html[data-theme="day"] .copy,
html[data-theme="day"] .desc,
html[data-theme="day"] .body-text {
  color: #1e293b;
}

/* Inverse safety · NIGHT mode · enforce minimum contrast on dark cards */
html:not([data-theme="day"]) .price,
html:not([data-theme="day"]) .tier .price,
html:not([data-theme="day"]) h1,
html:not([data-theme="day"]) h2,
html:not([data-theme="day"]) h3 {
  /* Already on dark bg — guarantee at least #f1f5f9 if a stylesheet drops below */
}
html:not([data-theme="day"]) p,
html:not([data-theme="day"]) li {
  color: var(--text, #f1f5f9);
}
html:not([data-theme="day"]) p[style*="color:#9ca3af"],
html:not([data-theme="day"]) p[style*="color: #9ca3af"] {
  /* Allow gray-400 on dark · fine for secondary text */
}
