/* =========================================================
   DARK MODE — BAGIAN 2 (lanjutan)
   Muat file ini TEPAT SETELAH file dark-mode utama di header.php,
   supaya urutannya tidak masalah (keduanya sama-sama pakai selector
   [data-theme="dark"] biasa, tidak ada konflik spesifisitas).

   Meng-cover komponen yang belum ada versi gelapnya:
   1. journal.css — .filter-section, .search-box (varian list page,
      BUKAN yang di navbar), .sort-dropdown/.sort-menu, .btn-back,
      .journal-item (list view), pagination, .btn-see-all
   2. opinions/admin grid — .filter-bar, .opinion-card, .upload-tabs
   3. my_journals_user.css — kartu "Jurnal Saya", status badge, dst
   4. Riwayat Token — summary banner & history card

   CATATAN: bagian 1 saya susun berdasarkan journal.css versi yang
   sempat dikirim di awal percakapan ini. Kalau class-nya sudah
   berubah sejak itu (mis. pagination_user.js sekarang generate
   markup dengan nama class lain), kirim journal.css /
   pagination_user.js terbaru dan saya sesuaikan lagi.
   ========================================================= */

/* ===== 1. FILTER & SEARCH BAR (journals_user.php / opinions_user.php list) ===== */
[data-theme="dark"] .filter-section {
  background: #1e293b;
  box-shadow: 0 2px 15px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .search-box {
  background: #0f172a;
}

[data-theme="dark"] .search-box input {
  color: #e2e8f0;
}

[data-theme="dark"] .search-box input::placeholder {
  color: #64748b;
}

[data-theme="dark"] .search-box svg,
[data-theme="dark"] .search-box i {
  color: #64748b;
}

[data-theme="dark"] .filter-stats {
  color: #94a3b8;
}

/* ===== Sort dropdown ===== */
[data-theme="dark"] .btn-icon-sort {
  border-color: #475569;
  color: #cbd5e1;
}

[data-theme="dark"] .btn-icon-sort:hover {
  background: #334155;
  color: #f1f5f9;
}

[data-theme="dark"] .sort-menu {
  background: #1e293b;
  border-color: #334155;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35);
}

[data-theme="dark"] .sort-item {
  color: #cbd5e1;
}

[data-theme="dark"] .sort-item:hover {
  background: #334155;
}

/* .sort-item.active sudah background #2c3e50, cukup terang di atas
   dark card jadi tidak perlu diubah */

/* ===== Back button ===== */
[data-theme="dark"] .btn-back {
  border-color: #475569;
  color: #cbd5e1;
}

[data-theme="dark"] .btn-back:hover {
  background: #334155;
  color: #f1f5f9;
}

[data-theme="dark"] .back-section {
  border-top-color: #334155;
}

/* ===== Journal list item (tampilan list horizontal, bukan grid card) ===== */
[data-theme="dark"] .journal-item {
  background-color: #1e293b;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .journal-item:hover {
  box-shadow: 0 3px 15px rgba(0, 0, 0, 0.4);
}

[data-theme="dark"] .journal-meta {
  color: #64748b;
}

[data-theme="dark"] .journal-description {
  color: #94a3b8;
}

/* ===== Pagination ===== */
[data-theme="dark"] .pagination-item,
[data-theme="dark"] .pagination-btn {
  background: #1e293b;
  border-color: #334155;
  color: #94a3b8;
}

[data-theme="dark"] .pagination-item:hover,
[data-theme="dark"] .pagination-btn:hover:not(:disabled) {
  background: #334155;
  border-color: #3b82f6;
  color: #60a5fa;
}

[data-theme="dark"] .pagination-btn:disabled {
  background: #0f172a;
  opacity: 0.4;
}

/* ===== Empty state ===== */
[data-theme="dark"] .empty-state h3 {
  color: #cbd5e1;
}

[data-theme="dark"] .empty-state p {
  color: #64748b;
}

/* =========================================================
   2. OPINIONS / ADMIN GRID (filter-bar, opinion-card, upload-tabs)
   ========================================================= */
[data-theme="dark"] select,
[data-theme="dark"] .sort-select {
  background: #0f172a;
  border-color: #334155;
  color: #e2e8f0;
}

[data-theme="dark"] .section-header h2 {
  color: #f1f5f9;
}

[data-theme="dark"] .section-subtitle {
  color: #94a3b8;
}

[data-theme="dark"] .filter-bar {
  background: #1e293b;
}

[data-theme="dark"] .sort-group label {
  color: #cbd5e1;
}

[data-theme="dark"] .filter-btn {
  background: #0f172a;
  border-color: #334155;
  color: #cbd5e1;
}

[data-theme="dark"] .filter-btn:hover {
  background: #334155;
}

/* .filter-btn.active sudah biru solid, tetap kontras di dark mode */

[data-theme="dark"] .opinion-card {
  background: #1e293b;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .opinion-card:hover {
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);
}

[data-theme="dark"] .opinion-meta {
  color: #94a3b8;
}

[data-theme="dark"] .opinion-author {
  color: #e2e8f0;
}

[data-theme="dark"] .opinion-excerpt {
  color: #94a3b8;
}

[data-theme="dark"] .opinion-footer {
  border-top-color: #334155;
}

[data-theme="dark"] .upload-tabs {
  border-bottom-color: #334155;
}

[data-theme="dark"] .upload-tab {
  color: #94a3b8;
}

[data-theme="dark"] .upload-tab:hover {
  color: #f1f5f9;
  background: #1e293b;
}

[data-theme="dark"] .upload-tab.active {
  color: #f1f5f9;
  border-bottom-color: #60a5fa;
  background: #1e293b;
}

/* Mobile drawer nav (varian journal.css/opinions.css, dipakai di halaman
   selain dashboard) */
[data-theme="dark"] nav {
  background: #111827;
}

[data-theme="dark"] .nav-dropdown .dropdown-menu a {
  border-bottom-color: #334155;
}

/* =========================================================
   3. HALAMAN "JURNAL SAYA" (my_journals_user.php)
   ========================================================= */
[data-theme="dark"] .ksm-page-heading h2 {
  color: #f1f5f9;
}

[data-theme="dark"] .ksm-page-subtitle {
  color: #94a3b8;
}

/* .ksm-btn-solid-dark sudah navy solid #2c3e50, tetap kontras */

[data-theme="dark"] .ksm-filter-tab {
  background: #1e293b;
  border-color: #334155;
  color: #94a3b8;
}

[data-theme="dark"] .ksm-filter-tab:hover {
  border-color: #60a5fa;
  color: #60a5fa;
}

/* .ksm-filter-tab.active sudah navy solid, tetap kontras */

[data-theme="dark"] .ksm-my-journal-card {
  background: #1e293b;
  box-shadow: 0 2px 15px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .ksm-my-journal-card:hover {
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.4);
}

[data-theme="dark"] .ksm-my-journal-title {
  color: #f1f5f9;
}

[data-theme="dark"] .ksm-my-journal-meta {
  color: #64748b;
}

[data-theme="dark"] .ksm-status-pending {
  background: rgba(184, 134, 11, 0.18);
  color: #eab308;
}

[data-theme="dark"] .ksm-status-published {
  background: rgba(30, 158, 90, 0.18);
  color: #34d399;
}

[data-theme="dark"] .ksm-status-rejected {
  background: rgba(231, 76, 60, 0.18);
  color: #f87171;
}

[data-theme="dark"] .ksm-icon-btn {
  background: #0f172a;
  border-color: #334155;
  color: #94a3b8;
}

[data-theme="dark"] .ksm-icon-btn:hover {
  border-color: #60a5fa;
  color: #60a5fa;
}

[data-theme="dark"] .ksm-icon-btn.ksm-icon-btn-danger:hover {
  border-color: #f87171;
  color: #f87171;
}

[data-theme="dark"] .ksm-my-journals-empty {
  background: #1e293b;
  color: #64748b;
  box-shadow: 0 2px 15px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .ksm-my-journals-empty h3 {
  color: #cbd5e1;
}

/* =========================================================
   4. RIWAYAT TOKEN (token_history_user.php)
   ========================================================= */
[data-theme="dark"] .ksm-token-summary-banner {
  background: #1e293b;
  box-shadow: 0 2px 15px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .ksm-token-summary-item {
  border-right-color: #334155;
}

[data-theme="dark"] .ksm-token-summary-item .label {
  color: #64748b;
}

[data-theme="dark"] .ksm-token-summary-item .value {
  color: #f1f5f9;
}

[data-theme="dark"] .ksm-token-history-card {
  background: #1e293b;
  box-shadow: 0 2px 15px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .ksm-token-history-icon {
  background: rgba(59, 130, 246, 0.18);
  color: #60a5fa;
}

[data-theme="dark"] .ksm-token-history-amount {
  color: #f1f5f9;
}

[data-theme="dark"] .ksm-token-history-date {
  color: #64748b;
}

@media (max-width: 640px) {
  [data-theme="dark"] .ksm-token-summary-item {
    border-bottom-color: #334155;
  }
}