/* ═══════════════════════════════════════════════════════════════════════════ */
/* Dark Knight Override — transforms legacy light-theme pages to dark        */
/* Add AFTER theme.css/marketing.css to override without modifying HTML      */
/* ═══════════════════════════════════════════════════════════════════════════ */

:root {
  --bg-void: #08080d;
  --bg-surface: #0e0e16;
  --bg-card: #13131d;
  --border-subtle: #1a1a2a;
  --text-primary: #eaeaf2;
  --text-secondary: #8888a0;
  --text-muted: #55556a;
  --amber: #f59e0b;
  --emerald: #10b981;
}

/* ─── Global overrides ───────────────────────────────────────────────── */
body {
  background: var(--bg-void) !important;
  color: var(--text-primary) !important;
  font-family: 'Inter', -apple-system, sans-serif !important;
}

/* ─── Text color overrides ───────────────────────────────────────────── */
.text-gray-900, .text-gray-800, .text-gray-700 { color: var(--text-primary) !important; }
.text-gray-600, .text-gray-500 { color: var(--text-secondary) !important; }
.text-gray-400, .text-gray-300 { color: var(--text-muted) !important; }
h1, h2, h3, h4, h5, h6 { color: var(--text-primary) !important; }
p, li, td, th, label, span { color: var(--text-secondary) !important; }
a { color: var(--amber) !important; }
a:hover { color: #fbbf24 !important; }
strong, b { color: var(--text-primary) !important; }

/* ─── Background overrides ───────────────────────────────────────────── */
[style*="background: #f9fafb"], [style*="background:#f9fafb"],
[style*="background: white"], [style*="background: #fff"],
[style*="background:#fff"], [style*="background: #ffffff"],
.bg-white, .bg-gray-50, .bg-gray-100 {
  background: var(--bg-surface) !important;
}

section { background: var(--bg-void) !important; }
section[style*="background: #f9fafb"] { background: var(--bg-surface) !important; }
section[style*="background: white"] { background: var(--bg-surface) !important; }

/* ─── Card / panel overrides ─────────────────────────────────────────── */
[style*="background: white"][style*="border-radius"],
[style*="background:#ffffff"][style*="border-radius"],
[style*="background: #fff"][style*="border-radius"] {
  background: var(--bg-card) !important;
  border-color: var(--border-subtle) !important;
}

[style*="border: 1px solid #e5e7eb"],
[style*="border: 1px solid #d1d5db"],
[style*="border-bottom: 1px solid #e5e7eb"],
[style*="border-top: 1px solid #e5e7eb"] {
  border-color: var(--border-subtle) !important;
}

/* ─── Hero / header ──────────────────────────────────────────────────── */
.hero {
  background: linear-gradient(135deg, var(--bg-void) 0%, var(--bg-surface) 100%) !important;
}

.nav, .hero .nav {
  background: rgba(8,8,13,0.88) !important;
  backdrop-filter: blur(16px) !important;
}

.nav a { color: var(--text-secondary) !important; }
.nav a:hover { color: var(--amber) !important; }
.nav-cta {
  background: var(--amber) !important;
  color: var(--bg-void) !important;
}

.eyebrow { color: var(--amber) !important; }
.hero-subtitle { color: var(--text-secondary) !important; }

/* ─── Metrics / stats ────────────────────────────────────────────────── */
[style*="background: linear-gradient"][style*="green"],
.bg-green-50, .bg-green-100 {
  background: rgba(16,185,129,0.12) !important;
}
.text-green-600, .text-green-700, .text-green-500 { color: var(--emerald) !important; }
.text-green-800, .text-green-900 { color: var(--emerald) !important; }
.border-green-200, .border-green-300 { border-color: rgba(16,185,129,0.2) !important; }

/* ─── Buttons ────────────────────────────────────────────────────────── */
[style*="background: #059669"], [style*="background:#059669"],
[style*="background: #10b981"], [style*="background:#10b981"],
.bg-green-600, .bg-green-500 {
  background: var(--amber) !important;
  color: var(--bg-void) !important;
}

button, input[type="submit"] {
  background: var(--amber) !important;
  color: var(--bg-void) !important;
  border: none !important;
  border-radius: 6px !important;
}

/* ─── Forms ──────────────────────────────────────────────────────────── */
input, textarea, select {
  background: var(--bg-card) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-subtle) !important;
}
input:focus, textarea:focus, select:focus {
  border-color: var(--amber) !important;
  outline: none !important;
}
::placeholder { color: var(--text-muted) !important; }

/* ─── Footer ─────────────────────────────────────────────────────────── */
footer {
  background: var(--bg-surface) !important;
  border-top: 1px solid var(--border-subtle) !important;
}
footer a { color: var(--amber) !important; }
footer p, footer span, footer div { color: var(--text-muted) !important; }

/* ─── Tables ─────────────────────────────────────────────────────────── */
table { border-color: var(--border-subtle) !important; }
th { background: var(--bg-card) !important; color: var(--text-primary) !important; }
td { border-color: var(--border-subtle) !important; }
tr:hover { background: var(--bg-card) !important; }

/* ─── Code blocks ────────────────────────────────────────────────────── */
code, pre {
  background: var(--bg-card) !important;
  color: var(--emerald) !important;
  border-color: var(--border-subtle) !important;
}

/* ─── Utility overrides ──────────────────────────────────────────────── */
.rounded-lg, .rounded-xl { border-color: var(--border-subtle) !important; }
.shadow-lg, .shadow-md, .shadow { box-shadow: 0 8px 30px rgba(0,0,0,0.4) !important; }
.divide-gray-200 > * + * { border-color: var(--border-subtle) !important; }

/* ─── Scrollbar ──────────────────────────────────────────────────────── */
::-webkit-scrollbar { width: 8px; background: var(--bg-void); }
::-webkit-scrollbar-thumb { background: var(--border-subtle); border-radius: 4px; }