/* ── CloviScan Dark Mode Overrides ──────────────────────────────── */
/* Theme: DARK  Brand: #F43F5E  BrandLight: #fb7185  BrandDark: #be123c */

/* Force dark theme as default */
html[data-theme="dark"] {
  color-scheme: dark;
}

/* Base dark body */
[data-theme="dark"] body {
  background: #0a0f1e !important;
  color: #f1f5f9 !important;
}

/* ── Background overrides ── */
[data-theme="dark"] .bg-white,
[data-theme="dark"] .bg-slate-50,
[data-theme="dark"] .bg-slate-100 {
  background-color: #1e293b !important;
}

[data-theme="dark"] .bg-gray-50,
[data-theme="dark"] .bg-gray-100 {
  background-color: #1e293b !important;
}

/* ── Text overrides ── */
[data-theme="dark"] .text-gray-600,
[data-theme="dark"] .text-gray-500,
[data-theme="dark"] .text-slate-600,
[data-theme="dark"] .text-slate-500 {
  color: #94a3b8 !important;
}

[data-theme="dark"] .text-gray-900,
[data-theme="dark"] .text-slate-900,
[data-theme="dark"] .text-black {
  color: #f1f5f9 !important;
}

[data-theme="dark"] .text-gray-700,
[data-theme="dark"] .text-slate-700 {
  color: #cbd5e1 !important;
}

[data-theme="dark"] .text-slate-400 {
  color: #94a3b8 !important;
}

/* ── Nav / Header ── */
[data-theme="dark"] header,
[data-theme="dark"] .cs-nav,
[data-theme="dark"] nav {
  background: rgba(10, 15, 30, 0.92) !important;
  border-color: rgba(244, 63, 94, 0.15) !important;
}

/* ── Sections ── */
[data-theme="dark"] section,
[data-theme="dark"] .section {
  background: transparent;
}

[data-theme="dark"] .hero-bg {
  background: radial-gradient(ellipse 80% 60% at 20% 40%, rgba(244,63,94,.15) 0%, transparent 60%),
              radial-gradient(ellipse 60% 50% at 80% 20%, rgba(251,146,60,.08) 0%, transparent 55%),
              #0a0f1e !important;
}

/* Layer/demo sections dark backgrounds */
[data-theme="dark"] .layers-bg,
[data-theme="dark"] .demo-bg {
  background: #0d1225 !important;
}

[data-theme="dark"] .breach-bg,
[data-theme="dark"] .integ-bg {
  background: #0a0f1e !important;
}

/* ── Cards and surfaces ── */
[data-theme="dark"] .card,
[data-theme="dark"] .pricing-card,
[data-theme="dark"] .feature-card,
[data-theme="dark"] .integ-card,
[data-theme="dark"] .breach-card {
  background: #1e293b !important;
  border-color: rgba(244, 63, 94, 0.15) !important;
}

[data-theme="dark"] .mini-mockup {
  background: #1e293b !important;
}

/* ── Pricing cards ── */
[data-theme="dark"] .pricing-card {
  background: #1e293b !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .pricing-card.popular,
[data-theme="dark"] .pricing-card.highlighted {
  background: #1e293b !important;
  border-color: #F43F5E !important;
}

/* ── FAQ ── */
[data-theme="dark"] details,
[data-theme="dark"] .faq-item {
  background: #1e293b !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] details summary {
  color: #f1f5f9 !important;
}

[data-theme="dark"] details[open] {
  background: #1e293b !important;
}

/* ── Forms and inputs ── */
[data-theme="dark"] input,
[data-theme="dark"] textarea,
[data-theme="dark"] select,
[data-theme="dark"] .demo-input,
[data-theme="dark"] .demo-gate-input {
  background: #0a0f1e !important;
  color: #f1f5f9 !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}

[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder {
  color: #64748b !important;
}

/* ── Demo box ── */
[data-theme="dark"] .demo-box {
  background: #1e293b !important;
  border-color: rgba(244, 63, 94, 0.2) !important;
}

/* ── Demo gate ── */
[data-theme="dark"] .demo-gate {
  background: linear-gradient(135deg, rgba(244,63,94,.1), rgba(251,146,60,.06)) !important;
  border-color: rgba(244, 63, 94, 0.25) !important;
}

[data-theme="dark"] .demo-gate-veil {
  background: linear-gradient(180deg, transparent, #1e293b 92%) !important;
}

/* ── Stats bar ── */
[data-theme="dark"] .stats-bar {
  background: rgba(255, 255, 255, 0.04) !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

/* ── Brand badge ── */
[data-theme="dark"] .brand-badge {
  color: #fb7185 !important;
}

/* ── Borders ── */
[data-theme="dark"] .border,
[data-theme="dark"] .border-slate-200,
[data-theme="dark"] .border-gray-200 {
  border-color: rgba(255, 255, 255, 0.08) !important;
}

/* ── Buttons (ensure contrast) ── */
[data-theme="dark"] .btn-primary {
  background: linear-gradient(135deg, #F43F5E, #e11d48) !important;
  color: #fff !important;
}

[data-theme="dark"] .btn-outline {
  color: #f1f5f9 !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
}

[data-theme="dark"] .btn-outline:hover {
  border-color: #F43F5E !important;
  color: #F43F5E !important;
}

/* ── Layer tabs ── */
[data-theme="dark"] .layer-tab {
  color: #94a3b8 !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .layer-tab.active {
  background: #F43F5E !important;
  color: #fff !important;
  border-color: #F43F5E !important;
}

/* ── Scan results ── */
[data-theme="dark"] .scan-result .rtext {
  color: rgba(255, 255, 255, 0.9) !important;
}

/* ── Integration cards ── */
[data-theme="dark"] .integ-card {
  background: rgba(255, 255, 255, 0.04) !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
  color: #f1f5f9 !important;
}

[data-theme="dark"] .integ-card:hover {
  border-color: #F43F5E !important;
}

/* ── Footer ── */
[data-theme="dark"] footer {
  background: #060a15 !important;
  border-top-color: rgba(255, 255, 255, 0.06) !important;
}

[data-theme="dark"] footer a {
  color: #94a3b8 !important;
}

[data-theme="dark"] footer a:hover {
  color: #fb7185 !important;
}

/* ── Score circle / inner ── */
[data-theme="dark"] .score-inner {
  background: #0a0f1e !important;
}

/* ── Mockup bars ── */
[data-theme="dark"] .mm-label {
  color: rgba(255, 255, 255, 0.85) !important;
}

/* ── Layer quote ── */
[data-theme="dark"] .layer-quote {
  background: rgba(255, 255, 255, 0.04) !important;
  color: #f1f5f9 !important;
}

/* ── Cross-product chips ── */
[data-theme="dark"] .xprod-chip {
  background: rgba(255, 255, 255, 0.04) !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
  color: #cbd5e1 !important;
}

/* ── muted text on dark ── */
[data-theme="dark"] .text-muted,
[data-theme="dark"] .muted {
  color: #94a3b8 !important;
}

/* ── Breach CTA box ── */
[data-theme="dark"] .breach-cta-box {
  background: linear-gradient(135deg, rgba(244,63,94,.1), rgba(251,146,60,.07)) !important;
  border-color: rgba(244, 63, 94, 0.25) !important;
}

/* ── Inline links ── */
[data-theme="dark"] a:not(.btn):not(.cs-logo):not(.cs-nav-links a):not(footer a):not(.xprod-chip) {
  color: inherit;
}

/* ── Ensure main content areas dark ── */
[data-theme="dark"] main,
[data-theme="dark"] .main-content {
  background: transparent;
}