/* ── DARK MODE VARIABLES ── */
[data-theme="dark"] {
  --gd: #34D399;
  --gm: #6EE7B7;
  --gn: #10B981;
  --gl: #064E3B;
  --gp: #022c22;
  --cr: #0F1117;
  --wh: #1A1D27;
  --td: #F0F0EE;
  --tm: #D1D5DB;
  --ts: #9CA3AF;
  --br: #2D3040;
}

[data-theme="dark"] body {
  background: var(--cr);
  color: var(--td);
}

/* Nav */
[data-theme="dark"] .nav {
  background: #13151F;
  border-bottom-color: var(--br);
}
[data-theme="dark"] .nav-logo-text { color: #F0F0EE; }
[data-theme="dark"] .nav-back { background: #1A1D27; color: var(--ts); border-color: var(--br); }
[data-theme="dark"] .nav-back:hover { border-color: var(--gn); color: var(--gd); }
[data-theme="dark"] .nav-menu { background: #1A1D27; color: var(--ts); border-color: var(--br); }
[data-theme="dark"] .nav-cta { background: var(--gn); color: #0F1117; }

/* Theme toggle button */
.theme-toggle {
  width: 36px; height: 36px;
  border: 0.5px solid var(--br);
  border-radius: 8px;
  background: var(--cr);
  color: var(--ts);
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.15s;
  flex-shrink: 0;
}
.theme-toggle:hover { border-color: var(--gn); color: var(--gd); }
[data-theme="dark"] .theme-toggle { background: #1A1D27; }

/* Hero */
[data-theme="dark"] .hero { background: var(--cr); }
[data-theme="dark"] .hero h1 { color: #F0F0EE; }
[data-theme="dark"] .hero-tag { background: #022c22; border-color: #064E3B; }
[data-theme="dark"] .btn-p { background: var(--gn); color: #0F1117; }
[data-theme="dark"] .btn-s { background: #1A1D27; border-color: var(--br); color: var(--tm); }

/* Search */
[data-theme="dark"] .search-box { background: #1A1D27; border-color: var(--br); }
[data-theme="dark"] .search-input { color: var(--td); }

/* Cards */
[data-theme="dark"] .topik-card,
[data-theme="dark"] .jalur-card,
[data-theme="dark"] .materi-item,
[data-theme="dark"] .artikel-card,
[data-theme="dark"] .soal-card,
[data-theme="dark"] .form-card,
[data-theme="dark"] .sb-card,
[data-theme="dark"] .card {
  background: #1A1D27;
  border-color: var(--br);
}
[data-theme="dark"] .topik-card:hover,
[data-theme="dark"] .jalur-card:hover,
[data-theme="dark"] .materi-item:hover,
[data-theme="dark"] .artikel-card:hover,
[data-theme="dark"] .soal-card:hover { border-color: var(--gn); }
[data-theme="dark"] .materi-item:hover { background: #022c22; }

/* Dropdown menu */
[data-theme="dark"] .dropdown { background: #13151F; border-bottom-color: var(--br); }
[data-theme="dark"] .dd-item { border-color: var(--br); }
[data-theme="dark"] .dd-item:hover { background: #022c22; border-color: var(--gn); }
[data-theme="dark"] .dd-name { color: var(--td); }

/* Divider */
[data-theme="dark"] .divider { background: var(--br); }

/* Sidebar */
[data-theme="dark"] .sidebar,
[data-theme="dark"] .topik-sidebar,
[data-theme="dark"] .filter-sidebar { border-color: var(--br); }
[data-theme="dark"] .sb-nav-link:hover,
[data-theme="dark"] .topik-link:hover,
[data-theme="dark"] .filter-link:hover,
[data-theme="dark"] .filter-chip:hover { background: #022c22; }
[data-theme="dark"] .sb-nav-link.active,
[data-theme="dark"] .topik-link.active,
[data-theme="dark"] .filter-link.active,
[data-theme="dark"] .filter-chip.active { background: var(--gn); color: #0F1117; }

/* Table */
[data-theme="dark"] .table-wrap,
[data-theme="dark"] .card { background: #1A1D27; }
[data-theme="dark"] .table th { background: #13151F; color: var(--ts); border-color: var(--br); }
[data-theme="dark"] .table td { border-color: var(--br); color: var(--td); }
[data-theme="dark"] .table tr:hover td { background: #13151F; }

/* Form elements */
[data-theme="dark"] .input-full,
[data-theme="dark"] .textarea,
[data-theme="dark"] .konten-area,
[data-theme="dark"] .select,
[data-theme="dark"] .input,
[data-theme="dark"] .sort-select { background: #13151F; border-color: var(--br); color: var(--td); }

/* Buttons */
[data-theme="dark"] .btn-secondary { background: #13151F; border-color: var(--br); color: var(--tm); }
[data-theme="dark"] .btn-secondary:hover { border-color: var(--gn); color: var(--gd); }

/* Hero bank soal (dark header) */
[data-theme="dark"] .hero.hero-dark { background: #064E3B; }

/* Admin sidebar */
[data-theme="dark"] .sidebar.admin-sidebar { background: #064E3B; }

/* Page header */
[data-theme="dark"] .page-header { background: #13151F; border-color: var(--br); }

/* Footer */
[data-theme="dark"] .footer { background: #13151F; border-color: var(--br); }
[data-theme="dark"] .footer-logo-text { color: var(--gd); }
[data-theme="dark"] .footer-links a { color: var(--ts); }
[data-theme="dark"] .footer-links a:hover { color: var(--gd); }

/* Exam & PDF card */
[data-theme="dark"] .exam-card { background: #022c22; border-color: #064E3B; }
[data-theme="dark"] .pdf-card { background: #1a0a0a; border-color: #3d1515; }
[data-theme="dark"] .pdf-btn { background: #C62828; }

/* Konten artikel/materi */
[data-theme="dark"] .konten { color: var(--tm); }
[data-theme="dark"] .konten h2, [data-theme="dark"] .konten h3 { color: var(--td); }
[data-theme="dark"] .konten blockquote { background: #022c22; border-color: var(--gn); color: var(--gd); }
[data-theme="dark"] .formula-block { background: #022c22; }

/* Tags - tetap warna tapi lebih gelap */
[data-theme="dark"] .tag-sma { background: #022c22; color: #6EE7B7; }
[data-theme="dark"] .tag-snbt { background: #2d1f00; color: #FCD34D; }
[data-theme="dark"] .tag-osn { background: #1a0a0a; color: #FCA5A5; }
[data-theme="dark"] .tag-mhs, [data-theme="dark"] .tag-smp { background: #1e1a30; color: #A78BFA; }
[data-theme="dark"] .tag-vid { background: #001a2d; color: #93C5FD; }
[data-theme="dark"] .tag-pdf { background: #1a0a0a; color: #FCA5A5; }
[data-theme="dark"] .tag-pub { background: #022c22; color: #6EE7B7; }
[data-theme="dark"] .tag-draft { background: #1A1D27; color: var(--ts); border-color: var(--br); }

/* Filter chips dark */
[data-theme="dark"] .filter-chip { background: #1A1D27; border-color: var(--br); color: var(--ts); }
[data-theme="dark"] .filter-chip.active { background: var(--gn); border-color: var(--gn); color: #0F1117; }
[data-theme="dark"] .filter-link { color: var(--ts); }
[data-theme="dark"] .filter-link.active { background: #022c22; color: var(--gd); }

/* Topik icon background — override inline */
[data-theme="dark"] .topik-icon { filter: brightness(0.8); }
[data-theme="dark"] .jalur-card .jalur-emoji { filter: none; }

/* Toggle */
[data-theme="dark"] .toggle { background: var(--br); }
[data-theme="dark"] .toggle.on { background: var(--gn); }

/* Notif */
[data-theme="dark"] .notif-success { background: var(--gn); color: #0F1117; }

/* Stat cards admin */
[data-theme="dark"] .stat-card { background: #1A1D27; border-color: var(--br); }
[data-theme="dark"] .action-card { background: #1A1D27; border-color: var(--br); }
[data-theme="dark"] .list-item { border-color: var(--br); }

/* Login card */
[data-theme="dark"] .login-card { background: #1A1D27; border-color: var(--br); }
[data-theme="dark"] .login-wrap { background: #0F1117; }
[data-theme="dark"] .login-btn { background: var(--gn); color: #0F1117; }