/**
 * MThElder — full-site visual themes (landing + all modules)
 * Active: html[data-mthelder-theme="<id>"]  (+ .dark-mode for dark themes)
 */

/* ─── Shared mapping: tokens → suite landing + app shell ─── */
html[data-mthelder-theme] {
  --suite-bg: var(--mt-bg);
  --suite-surface: var(--mt-surface);
  --suite-text: var(--mt-text);
  --suite-muted: var(--mt-text-muted);
  --suite-border: var(--mt-border);
  --suite-accent: var(--mt-accent);
  --suite-accent-soft: var(--mt-accent-soft);
}

html[data-mthelder-theme] body,
html[data-mthelder-theme] #suite-body,
html[data-mthelder-theme] #app-root,
html[data-mthelder-theme] #suite-landing {
  background: var(--mt-bg) !important;
  color: var(--mt-text) !important;
}

html[data-mthelder-theme] #suite-landing .suite-hero {
  background: var(--mt-hero-bg) !important;
}

html[data-mthelder-theme] #suite-landing .suite-card {
  background: var(--mt-surface) !important;
  border-color: var(--mt-border) !important;
  box-shadow: var(--mt-card-shadow) !important;
}

html[data-mthelder-theme] #suite-nav.top-bar,
html[data-mthelder-theme] .top-bar,
html[data-mthelder-theme] .actions-footer {
  background: var(--mt-topbar) !important;
  border-bottom-color: var(--mt-topbar-border) !important;
}

html[data-mthelder-theme] #suite-nav .suite-nav__link.is-active {
  background: var(--mt-nav-active) !important;
  border-color: var(--mt-nav-active-border) !important;
}

html[data-mthelder-theme] #suite-nav .suite-menu-panel {
  background: var(--mt-menu-bg) !important;
  border-color: var(--mt-border) !important;
  box-shadow: var(--mt-menu-shadow) !important;
}

html[data-mthelder-theme] #suite-nav .suite-menu-item {
  color: var(--mt-menu-text) !important;
}

html[data-mthelder-theme] #suite-nav .suite-menu-item:hover,
html[data-mthelder-theme] #suite-nav .suite-menu-item.is-active {
  background: var(--mt-menu-hover) !important;
  color: var(--mt-menu-text) !important;
}

/* ─── Modules: override legacy body.dark-mode (higher specificity) ─── */
html[data-mthelder-theme] body,
html[data-mthelder-theme] body.dark-mode {
  background: var(--mt-bg) !important;
}

html[data-mthelder-theme] body #mainWrap,
html[data-mthelder-theme] body.dark-mode #mainWrap {
  color: var(--mt-text) !important;
}

html[data-mthelder-theme] body h1,
html[data-mthelder-theme] body.dark-mode h1,
html[data-mthelder-theme] #app-root h2,
html[data-mthelder-theme] #app-root h3 {
  color: var(--mt-heading) !important;
}

html[data-mthelder-theme] body .subtitle,
html[data-mthelder-theme] body.dark-mode .subtitle,
html[data-mthelder-theme] body .text-slate-500,
html[data-mthelder-theme] body.dark-mode .text-slate-500,
html[data-mthelder-theme] body .text-slate-600,
html[data-mthelder-theme] body.dark-mode .text-slate-600,
html[data-mthelder-theme] body .text-slate-700,
html[data-mthelder-theme] body.dark-mode .text-slate-700,
html[data-mthelder-theme] body .text-slate-900,
html[data-mthelder-theme] body.dark-mode .text-slate-900 {
  color: var(--mt-text-muted) !important;
}

html[data-mthelder-theme] body .stat-card,
html[data-mthelder-theme] body.dark-mode .stat-card,
html[data-mthelder-theme] #app-root .bg-white,
html[data-mthelder-theme] body.dark-mode #app-root .bg-white {
  background: var(--mt-surface) !important;
  border-color: var(--mt-border) !important;
  color: var(--mt-text) !important;
  box-shadow: var(--mt-card-shadow) !important;
}

html[data-mthelder-theme] body .table-container,
html[data-mthelder-theme] body.dark-mode .table-container {
  background: var(--mt-surface) !important;
  border: 1px solid var(--mt-border) !important;
  box-shadow: var(--mt-table-shadow) !important;
}

html[data-mthelder-theme] body .fixed-table th,
html[data-mthelder-theme] body.dark-mode .fixed-table th {
  background: var(--mt-table-head) !important;
  color: var(--mt-table-head-text) !important;
  border-color: var(--mt-border) !important;
}

html[data-mthelder-theme] body .fixed-table td,
html[data-mthelder-theme] body.dark-mode .fixed-table td {
  background: var(--mt-table-cell) !important;
  color: var(--mt-text) !important;
  border-color: var(--mt-border) !important;
}

html[data-mthelder-theme] body .row-hover:hover,
html[data-mthelder-theme] body.dark-mode .row-hover:hover {
  background-color: var(--mt-table-hover) !important;
}

html[data-mthelder-theme] body .search-field,
html[data-mthelder-theme] body.dark-mode .search-field,
html[data-mthelder-theme] #app-root input,
html[data-mthelder-theme] #app-root select,
html[data-mthelder-theme] #app-root textarea {
  background: var(--mt-input-bg) !important;
  border-color: var(--mt-input-border) !important;
  color: var(--mt-text) !important;
}

html[data-mthelder-theme] body .search-field::placeholder,
html[data-mthelder-theme] #app-root input::placeholder {
  color: var(--mt-text-muted) !important;
  opacity: 0.85;
}

html[data-mthelder-theme] body .search-field:focus,
html[data-mthelder-theme] #app-root input:focus,
html[data-mthelder-theme] #app-root select:focus {
  box-shadow: 0 0 0 2px var(--mt-focus-ring) !important;
  border-color: var(--mt-accent) !important;
}

html[data-mthelder-theme] body .filter-popup,
html[data-mthelder-theme] body.dark-mode .filter-popup,
html[data-mthelder-theme] body .status-popup,
html[data-mthelder-theme] body.dark-mode .status-popup,
html[data-mthelder-theme] body.dark-mode #appAlertBox {
  background: var(--mt-surface) !important;
  border-color: var(--mt-border) !important;
  color: var(--mt-text) !important;
}

html[data-mthelder-theme] body .filter-option:hover,
html[data-mthelder-theme] body.dark-mode .filter-option:hover,
html[data-mthelder-theme] body .status-option:hover,
html[data-mthelder-theme] body.dark-mode .status-option:hover {
  background: var(--mt-table-hover) !important;
}

html[data-mthelder-theme] body .import-report-panel,
html[data-mthelder-theme] body.dark-mode .import-report-panel {
  background: var(--mt-surface) !important;
  border-color: var(--mt-border) !important;
}

html[data-mthelder-theme] body .import-report-header,
html[data-mthelder-theme] body.dark-mode .import-report-header {
  background: var(--mt-table-head) !important;
  border-color: var(--mt-border) !important;
}

html[data-mthelder-theme] body .import-report-body,
html[data-mthelder-theme] body.dark-mode .import-report-body {
  background: var(--mt-bg-elevated) !important;
  color: var(--mt-text-muted) !important;
}

html[data-mthelder-theme] body.dark-mode .actions-footer {
  background: var(--mt-topbar) !important;
  border-color: var(--mt-topbar-border) !important;
}

html[data-mthelder-theme] #suite-landing .suite-card a {
  color: var(--mt-accent);
}

html[data-mthelder-theme] body .bg-indigo-600,
html[data-mthelder-theme] body.dark-mode .bg-indigo-600,
html[data-mthelder-theme] #app-root .bg-indigo-600 {
  background-color: var(--mt-btn-primary) !important;
}

html[data-mthelder-theme] body .bg-indigo-600:hover,
html[data-mthelder-theme] .hover\:bg-indigo-700:hover {
  background-color: var(--mt-btn-primary-hover) !important;
}

html[data-mthelder-theme] body .text-indigo-600,
html[data-mthelder-theme] body.dark-mode .text-indigo-700,
html[data-mthelder-theme] body .text-blue-600 {
  color: var(--mt-accent) !important;
}

html[data-mthelder-theme] body .bg-slate-50,
html[data-mthelder-theme] body.dark-mode .bg-slate-50,
html[data-mthelder-theme] body .bg-slate-100 {
  background: var(--mt-bg-elevated) !important;
}

html[data-mthelder-theme] body .border-slate-200,
html[data-mthelder-theme] body .border-slate-300 {
  border-color: var(--mt-border) !important;
}

/* Smooth theme transition */
html[data-mthelder-theme] body,
html[data-mthelder-theme] #suite-landing,
html[data-mthelder-theme] .table-container,
html[data-mthelder-theme] .stat-card {
  transition: background-color 0.35s ease, color 0.25s ease, border-color 0.25s ease, box-shadow 0.35s ease;
}

/* ═══════════════════════════════════════════════════════════════
   THEME 1 — LIGHT (Daylight · crisp paper & sky)
   ═══════════════════════════════════════════════════════════════ */
html[data-mthelder-theme="light"] {
  color-scheme: light;
  --mt-bg: #e8f4fc;
  --mt-bg-elevated: #f0f9ff;
  --mt-surface: #ffffff;
  --mt-text: #0c4a6e;
  --mt-text-muted: #0369a1;
  --mt-heading: #082f49;
  --mt-border: rgba(14, 116, 144, 0.22);
  --mt-accent: #0284c7;
  --mt-accent-soft: rgba(2, 132, 199, 0.12);
  --mt-topbar: linear-gradient(120deg, #0ea5e9 0%, #2563eb 55%, #4f46e5 100%);
  --mt-topbar-border: rgba(255, 255, 255, 0.2);
  --mt-hero-bg: radial-gradient(ellipse 90% 60% at 50% -15%, rgba(14, 165, 233, 0.35), transparent),
    linear-gradient(180deg, #bae6fd 0%, #e8f4fc 45%, #e8f4fc 100%);
  --mt-card-shadow: 0 16px 40px -12px rgba(2, 132, 199, 0.2);
  --mt-table-shadow: 0 8px 24px rgba(3, 105, 161, 0.1);
  --mt-nav-active: rgba(255, 255, 255, 0.35);
  --mt-nav-active-border: rgba(255, 255, 255, 0.45);
  --mt-menu-bg: #ffffff;
  --mt-menu-text: #0c4a6e;
  --mt-menu-hover: #e0f2fe;
  --mt-menu-shadow: 0 16px 40px rgba(3, 105, 161, 0.18);
  --mt-input-bg: #ffffff;
  --mt-input-border: #7dd3fc;
  --mt-table-head: #bae6fd;
  --mt-table-head-text: #0c4a6e;
  --mt-table-cell: #ffffff;
  --mt-table-hover: #e0f2fe;
  --mt-focus-ring: rgba(14, 165, 233, 0.45);
  --mt-btn-primary: #0284c7;
  --mt-btn-primary-hover: #0369a1;
}

html[data-mthelder-theme="light"] .text-slate-900,
html[data-mthelder-theme="light"] .text-slate-800 {
  color: var(--mt-heading) !important;
}

/* ═══════════════════════════════════════════════════════════════
   THEME 2 — DARK (Graphite · classic warehouse)
   ═══════════════════════════════════════════════════════════════ */
html[data-mthelder-theme="dark"] {
  color-scheme: dark;
  --mt-bg: #0b0f1a;
  --mt-bg-elevated: #111827;
  --mt-surface: #1a2332;
  --mt-text: #e8edf5;
  --mt-text-muted: #94a3b8;
  --mt-heading: #f8fafc;
  --mt-border: #2d3a4f;
  --mt-accent: #818cf8;
  --mt-accent-soft: rgba(129, 140, 248, 0.2);
  --mt-topbar: linear-gradient(135deg, #0f172a 0%, #1e293b 45%, #312e81 100%);
  --mt-topbar-border: rgba(255, 255, 255, 0.08);
  --mt-hero-bg: radial-gradient(ellipse 80% 50% at 50% -20%, rgba(99, 102, 241, 0.2), transparent);
  --mt-card-shadow: 0 16px 48px rgba(0, 0, 0, 0.45);
  --mt-table-shadow: 0 8px 32px rgba(0, 0, 0, 0.35);
  --mt-nav-active: rgba(99, 102, 241, 0.5);
  --mt-nav-active-border: rgba(255, 255, 255, 0.15);
  --mt-menu-bg: #1e293b;
  --mt-menu-text: #e2e8f0;
  --mt-menu-hover: #334155;
  --mt-menu-shadow: 0 16px 48px rgba(0, 0, 0, 0.5);
  --mt-input-bg: #243044;
  --mt-input-border: #3d4f66;
  --mt-table-head: #1e293b;
  --mt-table-head-text: #cbd5e1;
  --mt-table-cell: #1a2332;
  --mt-table-hover: #2d3a4f;
  --mt-focus-ring: rgba(129, 140, 248, 0.45);
  --mt-btn-primary: #4f46e5;
  --mt-btn-primary-hover: #6366f1;
}

/* ═══════════════════════════════════════════════════════════════
   THEME 3 — NORD (Arctic · calm polar night)
   Legacy alias: ocean
   ═══════════════════════════════════════════════════════════════ */
html[data-mthelder-theme="nord"],
html[data-mthelder-theme="ocean"] {
  color-scheme: dark;
  --mt-bg: #2e3440;
  --mt-bg-elevated: #3b4252;
  --mt-surface: #434c5e;
  --mt-text: #eceff4;
  --mt-text-muted: #d8dee9;
  --mt-heading: #e5e9f0;
  --mt-border: #4c566a;
  --mt-accent: #88c0d0;
  --mt-accent-soft: rgba(136, 192, 208, 0.2);
  --mt-topbar: linear-gradient(135deg, #3b4252 0%, #5e81ac 45%, #81a1c1 100%);
  --mt-topbar-border: rgba(136, 192, 208, 0.25);
  --mt-hero-bg: radial-gradient(ellipse 90% 55% at 50% -25%, rgba(94, 129, 172, 0.35), transparent),
    linear-gradient(180deg, #3b4252 0%, #2e3440 55%);
  --mt-card-shadow: 0 16px 44px rgba(0, 0, 0, 0.35);
  --mt-table-shadow: 0 10px 28px rgba(0, 0, 0, 0.28);
  --mt-nav-active: rgba(136, 192, 208, 0.4);
  --mt-nav-active-border: rgba(236, 239, 244, 0.2);
  --mt-menu-bg: #3b4252;
  --mt-menu-text: #eceff4;
  --mt-menu-hover: #4c566a;
  --mt-menu-shadow: 0 18px 44px rgba(0, 0, 0, 0.45);
  --mt-input-bg: #2e3440;
  --mt-input-border: #4c566a;
  --mt-table-head: #434c5e;
  --mt-table-head-text: #eceff4;
  --mt-table-cell: #3b4252;
  --mt-table-hover: #4c566a;
  --mt-focus-ring: rgba(136, 192, 208, 0.45);
  --mt-btn-primary: #5e81ac;
  --mt-btn-primary-hover: #81a1c1;
}

html[data-mthelder-theme="nord"] .stat-card .text-emerald-700,
html[data-mthelder-theme="nord"] .text-emerald-600,
html[data-mthelder-theme="ocean"] .stat-card .text-emerald-700,
html[data-mthelder-theme="ocean"] .text-emerald-600 {
  color: #2dd4bf !important;
}

/* ═══════════════════════════════════════════════════════════════
   THEME 4 — DRACULA (Gothic · violet studio)
   ═══════════════════════════════════════════════════════════════ */
html[data-mthelder-theme="dracula"] {
  color-scheme: dark;
  --mt-bg: #282a36;
  --mt-bg-elevated: #313443;
  --mt-surface: #343746;
  --mt-text: #f8f8f2;
  --mt-text-muted: #bd93f9;
  --mt-heading: #ff79c6;
  --mt-border: #6272a4;
  --mt-accent: #ff79c6;
  --mt-accent-soft: rgba(255, 121, 198, 0.18);
  --mt-topbar: linear-gradient(135deg, #44475a 0%, #6272a4 40%, #bd93f9 100%);
  --mt-topbar-border: rgba(255, 121, 198, 0.25);
  --mt-hero-bg: radial-gradient(ellipse 90% 55% at 50% -25%, rgba(189, 147, 249, 0.3), transparent),
    linear-gradient(180deg, #44475a 0%, #282a36 55%);
  --mt-card-shadow: 0 20px 48px rgba(0, 0, 0, 0.45);
  --mt-table-shadow: 0 12px 32px rgba(0, 0, 0, 0.35);
  --mt-nav-active: rgba(189, 147, 249, 0.45);
  --mt-nav-active-border: rgba(255, 121, 198, 0.35);
  --mt-menu-bg: #343746;
  --mt-menu-text: #f8f8f2;
  --mt-menu-hover: #44475a;
  --mt-menu-shadow: 0 20px 48px rgba(0, 0, 0, 0.5);
  --mt-input-bg: #313443;
  --mt-input-border: #6272a4;
  --mt-table-head: #44475a;
  --mt-table-head-text: #f8f8f2;
  --mt-table-cell: #343746;
  --mt-table-hover: #44475a;
  --mt-focus-ring: rgba(255, 121, 198, 0.45);
  --mt-btn-primary: #bd93f9;
  --mt-btn-primary-hover: #ff79c6;
}

/* ═══════════════════════════════════════════════════════════════
   THEME 5 — SOLARIZED DARK (Classic · warm cyan base)
   ═══════════════════════════════════════════════════════════════ */
html[data-mthelder-theme="solarized-dark"] {
  color-scheme: dark;
  --mt-bg: #002b36;
  --mt-bg-elevated: #073642;
  --mt-surface: #073642;
  --mt-text: #eee8d5;
  --mt-text-muted: #93a1a1;
  --mt-heading: #fdf6e3;
  --mt-border: #586e75;
  --mt-accent: #2aa198;
  --mt-accent-soft: rgba(42, 161, 152, 0.2);
  --mt-topbar: linear-gradient(135deg, #073642 0%, #586e75 45%, #268bd2 100%);
  --mt-topbar-border: rgba(42, 161, 152, 0.3);
  --mt-hero-bg: radial-gradient(ellipse 85% 50% at 50% -20%, rgba(38, 139, 210, 0.25), transparent),
    linear-gradient(180deg, #073642 0%, #002b36 55%);
  --mt-card-shadow: 0 16px 40px rgba(0, 0, 0, 0.4);
  --mt-table-shadow: 0 10px 28px rgba(0, 0, 0, 0.3);
  --mt-nav-active: rgba(42, 161, 152, 0.45);
  --mt-nav-active-border: rgba(253, 246, 227, 0.2);
  --mt-menu-bg: #073642;
  --mt-menu-text: #eee8d5;
  --mt-menu-hover: #586e75;
  --mt-menu-shadow: 0 16px 40px rgba(0, 0, 0, 0.45);
  --mt-input-bg: #002b36;
  --mt-input-border: #586e75;
  --mt-table-head: #586e75;
  --mt-table-head-text: #fdf6e3;
  --mt-table-cell: #073642;
  --mt-table-hover: #586e75;
  --mt-focus-ring: rgba(42, 161, 152, 0.5);
  --mt-btn-primary: #268bd2;
  --mt-btn-primary-hover: #2aa198;
}

/* ═══════════════════════════════════════════════════════════════
   THEME 6 — CYBERPUNK (Neon · yellow on midnight)
   ═══════════════════════════════════════════════════════════════ */
html[data-mthelder-theme="cyberpunk"] {
  color-scheme: dark;
  --mt-bg: #0d0221;
  --mt-bg-elevated: #150734;
  --mt-surface: #1a0a2e;
  --mt-text: #f0e6ff;
  --mt-text-muted: #ffee00;
  --mt-heading: #ffee00;
  --mt-border: #7209b7;
  --mt-accent: #ffee00;
  --mt-accent-soft: rgba(255, 238, 0, 0.15);
  --mt-topbar: linear-gradient(135deg, #3a0ca3 0%, #7209b7 40%, #f72585 75%, #ffee00 100%);
  --mt-topbar-border: rgba(255, 238, 0, 0.35);
  --mt-hero-bg: radial-gradient(ellipse 90% 60% at 20% -20%, rgba(247, 37, 133, 0.35), transparent),
    radial-gradient(ellipse 70% 50% at 100% 0%, rgba(255, 238, 0, 0.2), transparent),
    linear-gradient(180deg, #3a0ca3 0%, #0d0221 55%);
  --mt-card-shadow: 0 0 40px rgba(247, 37, 133, 0.2), 0 20px 50px rgba(0, 0, 0, 0.55);
  --mt-table-shadow: 0 0 24px rgba(255, 238, 0, 0.08);
  --mt-nav-active: rgba(255, 238, 0, 0.35);
  --mt-nav-active-border: rgba(247, 37, 133, 0.5);
  --mt-menu-bg: #1a0a2e;
  --mt-menu-text: #f0e6ff;
  --mt-menu-hover: #7209b7;
  --mt-menu-shadow: 0 20px 50px rgba(0, 0, 0, 0.6), 0 0 30px rgba(247, 37, 133, 0.15);
  --mt-input-bg: #150734;
  --mt-input-border: #7209b7;
  --mt-table-head: #3a0ca3;
  --mt-table-head-text: #ffee00;
  --mt-table-cell: #1a0a2e;
  --mt-table-hover: #7209b7;
  --mt-focus-ring: rgba(255, 238, 0, 0.45);
  --mt-btn-primary: #f72585;
  --mt-btn-primary-hover: #ffee00;
}

/* ═══════════════════════════════════════════════════════════════
   THEME 7 — CUPERTINO (Apple · soft daylight UI)
   ═══════════════════════════════════════════════════════════════ */
html[data-mthelder-theme="cupertino"] {
  color-scheme: light;
  --mt-bg: #f5f5f7;
  --mt-bg-elevated: #ffffff;
  --mt-surface: #ffffff;
  --mt-text: #1d1d1f;
  --mt-text-muted: #6e6e73;
  --mt-heading: #000000;
  --mt-border: rgba(0, 0, 0, 0.12);
  --mt-accent: #0071e3;
  --mt-accent-soft: rgba(0, 113, 227, 0.1);
  --mt-topbar: linear-gradient(180deg, #f5f5f7 0%, #e8e8ed 100%);
  --mt-topbar-border: rgba(0, 0, 0, 0.08);
  --mt-hero-bg: radial-gradient(ellipse 90% 50% at 50% -20%, rgba(0, 113, 227, 0.08), transparent),
    linear-gradient(180deg, #ffffff 0%, #f5f5f7 50%);
  --mt-card-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
  --mt-table-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
  --mt-nav-active: rgba(0, 113, 227, 0.15);
  --mt-nav-active-border: rgba(0, 113, 227, 0.25);
  --mt-menu-bg: #ffffff;
  --mt-menu-text: #1d1d1f;
  --mt-menu-hover: #e8e8ed;
  --mt-menu-shadow: 0 12px 32px rgba(0, 0, 0, 0.12);
  --mt-input-bg: #ffffff;
  --mt-input-border: #d2d2d7;
  --mt-table-head: #e8e8ed;
  --mt-table-head-text: #1d1d1f;
  --mt-table-cell: #ffffff;
  --mt-table-hover: #f5f5f7;
  --mt-focus-ring: rgba(0, 113, 227, 0.35);
  --mt-btn-primary: #0071e3;
  --mt-btn-primary-hover: #0077ed;
}

html[data-mthelder-theme="cupertino"] #suite-nav .suite-nav__brand,
html[data-mthelder-theme="cupertino"] #suite-nav .suite-nav__link,
html[data-mthelder-theme="cupertino"] #suite-nav .suite-menu-btn,
html[data-mthelder-theme="cupertino"] #suite-nav .suite-util-btn,
html[data-mthelder-theme="cupertino"] #suite-nav #liveClock {
  color: #1d1d1f !important;
  border-color: rgba(0, 0, 0, 0.12) !important;
}
html[data-mthelder-theme="cupertino"] #suite-nav .suite-menu-btn,
html[data-mthelder-theme="cupertino"] #suite-nav .suite-util-btn {
  background: rgba(0, 0, 0, 0.05) !important;
}
html[data-mthelder-theme="cupertino"] #suite-nav #liveClock {
  background: rgba(0, 0, 0, 0.04) !important;
}

/* ═══════════════════════════════════════════════════════════════
   THEME 8 — ONE DARK PRO (IDE · balanced graphite)
   Legacy alias: slate
   ═══════════════════════════════════════════════════════════════ */
html[data-mthelder-theme="one-dark-pro"],
html[data-mthelder-theme="slate"] {
  color-scheme: dark;
  --mt-bg: #282c34;
  --mt-bg-elevated: #2c323c;
  --mt-surface: #323842;
  --mt-text: #abb2bf;
  --mt-text-muted: #5c6370;
  --mt-heading: #e5e9f0;
  --mt-border: #3e4451;
  --mt-accent: #61afef;
  --mt-accent-soft: rgba(97, 175, 239, 0.18);
  --mt-topbar: linear-gradient(135deg, #282c34 0%, #3e4451 50%, #528bff 100%);
  --mt-topbar-border: rgba(97, 175, 239, 0.2);
  --mt-hero-bg: radial-gradient(ellipse 85% 55% at 50% -25%, rgba(97, 175, 239, 0.2), transparent),
    linear-gradient(180deg, #323842 0%, #282c34 55%);
  --mt-card-shadow: 0 16px 44px rgba(0, 0, 0, 0.45);
  --mt-table-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
  --mt-nav-active: rgba(97, 175, 239, 0.4);
  --mt-nav-active-border: rgba(255, 255, 255, 0.12);
  --mt-menu-bg: #323842;
  --mt-menu-text: #abb2bf;
  --mt-menu-hover: #3e4451;
  --mt-menu-shadow: 0 18px 48px rgba(0, 0, 0, 0.5);
  --mt-input-bg: #2c323c;
  --mt-input-border: #3e4451;
  --mt-table-head: #3e4451;
  --mt-table-head-text: #e5e9f0;
  --mt-table-cell: #323842;
  --mt-table-hover: #3e4451;
  --mt-focus-ring: rgba(97, 175, 239, 0.45);
  --mt-btn-primary: #528bff;
  --mt-btn-primary-hover: #61afef;
}

/* ═══════════════════════════════════════════════════════════════
   THEME 9 — EMERALD FOREST (Canopy · jungle night)
   Legacy alias: forest
   ═══════════════════════════════════════════════════════════════ */
html[data-mthelder-theme="emerald-forest"],
html[data-mthelder-theme="forest"] {
  color-scheme: dark;
  --mt-bg: #071208;
  --mt-bg-elevated: #0f1f10;
  --mt-surface: #142818;
  --mt-text: #ecfccb;
  --mt-text-muted: #a3e635;
  --mt-heading: #f7fee7;
  --mt-border: #365314;
  --mt-accent: #84cc16;
  --mt-accent-soft: rgba(132, 204, 22, 0.2);
  --mt-topbar: linear-gradient(135deg, #14532d 0%, #166534 35%, #3f6212 70%, #1a2e05 100%);
  --mt-topbar-border: rgba(163, 230, 53, 0.2);
  --mt-hero-bg: radial-gradient(ellipse 90% 55% at 50% -25%, rgba(132, 204, 22, 0.25), transparent),
    radial-gradient(ellipse 60% 40% at 0% 80%, rgba(22, 101, 52, 0.4), transparent),
    linear-gradient(180deg, #14532d 0%, #071208 50%);
  --mt-card-shadow: 0 20px 50px rgba(0, 0, 0, 0.5), 0 0 30px rgba(74, 222, 128, 0.06);
  --mt-table-shadow: 0 12px 32px rgba(0, 0, 0, 0.4);
  --mt-nav-active: rgba(132, 204, 22, 0.4);
  --mt-nav-active-border: rgba(163, 230, 53, 0.35);
  --mt-menu-bg: #142818;
  --mt-menu-text: #d9f99d;
  --mt-menu-hover: #365314;
  --mt-menu-shadow: 0 20px 48px rgba(0, 0, 0, 0.55);
  --mt-input-bg: #0f1f10;
  --mt-input-border: #4d7c0f;
  --mt-table-head: #166534;
  --mt-table-head-text: #d9f99d;
  --mt-table-cell: #142818;
  --mt-table-hover: #365314;
  --mt-focus-ring: rgba(163, 230, 53, 0.45);
  --mt-btn-primary: #65a30d;
  --mt-btn-primary-hover: #84cc16;
}

html[data-mthelder-theme="emerald-forest"] .stat-card .text-amber-700,
html[data-mthelder-theme="emerald-forest"] .text-amber-600,
html[data-mthelder-theme="forest"] .stat-card .text-amber-700,
html[data-mthelder-theme="forest"] .text-amber-600 {
  color: #facc15 !important;
}

/* ═══════════════════════════════════════════════════════════════
   THEME 10 — SYNTHWAVE '84 (Retro · neon sunset)
   ═══════════════════════════════════════════════════════════════ */
html[data-mthelder-theme="synthwave84"] {
  color-scheme: dark;
  --mt-bg: #241734;
  --mt-bg-elevated: #2a1f3d;
  --mt-surface: #34214e;
  --mt-text: #f8f8ff;
  --mt-text-muted: #ff71ce;
  --mt-heading: #fffb96;
  --mt-border: #b967ff;
  --mt-accent: #ff71ce;
  --mt-accent-soft: rgba(255, 113, 206, 0.2);
  --mt-topbar: linear-gradient(135deg, #b967ff 0%, #ff71ce 40%, #fffb96 75%, #05ffa1 100%);
  --mt-topbar-border: rgba(255, 113, 206, 0.35);
  --mt-hero-bg: radial-gradient(ellipse 90% 60% at 20% -20%, rgba(185, 103, 255, 0.4), transparent),
    radial-gradient(ellipse 70% 50% at 100% 0%, rgba(255, 113, 206, 0.3), transparent),
    linear-gradient(180deg, #b967ff 0%, #241734 55%);
  --mt-card-shadow: 0 0 50px rgba(255, 113, 206, 0.15), 0 24px 56px rgba(0, 0, 0, 0.55);
  --mt-table-shadow: 0 0 28px rgba(185, 103, 255, 0.12);
  --mt-nav-active: rgba(255, 113, 206, 0.45);
  --mt-nav-active-border: rgba(255, 251, 150, 0.35);
  --mt-menu-bg: #34214e;
  --mt-menu-text: #f8f8ff;
  --mt-menu-hover: #b967ff;
  --mt-menu-shadow: 0 24px 56px rgba(0, 0, 0, 0.6), 0 0 40px rgba(185, 103, 255, 0.15);
  --mt-input-bg: #2a1f3d;
  --mt-input-border: #b967ff;
  --mt-table-head: #b967ff;
  --mt-table-head-text: #fffb96;
  --mt-table-cell: #34214e;
  --mt-table-hover: #b967ff;
  --mt-focus-ring: rgba(255, 113, 206, 0.45);
  --mt-btn-primary: #ff71ce;
  --mt-btn-primary-hover: #fffb96;
}

html[data-mthelder-theme="synthwave84"] .stat-card .text-purple-700,
html[data-mthelder-theme="synthwave84"] .text-indigo-700 {
  color: #ff71ce !important;
}

/* Tailwind cell tints — harmonize per theme */
html[data-mthelder-theme="nord"] .fixed-table td[class*="bg-emerald"],
html[data-mthelder-theme="nord"] .fixed-table td[class*="bg-green"],
html[data-mthelder-theme="ocean"] .fixed-table td[class*="bg-emerald"],
html[data-mthelder-theme="ocean"] .fixed-table td[class*="bg-green"] {
  background: rgba(46, 52, 64, 0.55) !important;
}

html[data-mthelder-theme="emerald-forest"] .fixed-table td[class*="bg-emerald"],
html[data-mthelder-theme="emerald-forest"] .fixed-table td[class*="bg-green"],
html[data-mthelder-theme="forest"] .fixed-table td[class*="bg-emerald"],
html[data-mthelder-theme="forest"] .fixed-table td[class*="bg-green"] {
  background: rgba(22, 101, 52, 0.5) !important;
}

html[data-mthelder-theme="one-dark-pro"] .fixed-table td[class*="bg-purple"],
html[data-mthelder-theme="one-dark-pro"] .fixed-table td[class*="bg-indigo"],
html[data-mthelder-theme="slate"] .fixed-table td[class*="bg-purple"],
html[data-mthelder-theme="slate"] .fixed-table td[class*="bg-indigo"] {
  background: rgba(62, 68, 81, 0.5) !important;
}

html[data-mthelder-theme="synthwave84"] .fixed-table td[class*="bg-purple"],
html[data-mthelder-theme="synthwave84"] .fixed-table td[class*="bg-indigo"] {
  background: rgba(185, 103, 255, 0.35) !important;
}

html[data-mthelder-theme="light"] .fixed-table td[class*="bg-"] {
  filter: saturate(1.05);
}

/* Scrollbars */
html[data-mthelder-theme] .table-container {
  scrollbar-color: var(--mt-accent) transparent;
}