/* =========================================================
   NGajiPlus GLOBAL DARK / LIGHT MODE
   Dipakai oleh seluruh halaman
========================================================= */

html { color-scheme: light; }

body.dark-mode,
body.dark {
  color-scheme: dark;
  background: #111815 !important;
  color: #e8f0eb !important;
}

/* Header / navigation */
body.dark-mode header,
body.dark-mode .header,
body.dark-mode .site-header,
body.dark-mode .topbar,
body.dark-mode nav,
body.dark header,
body.dark .header,
body.dark .site-header,
body.dark .topbar,
body.dark nav {
  background: #17211c !important;
  color: #e8f0eb !important;
  border-color: #2d3932 !important;
}

/* Main surfaces / cards */
body.dark-mode .card,
body.dark-mode .box,
body.dark-mode .container,
body.dark-mode .auth-box,
body.dark-mode .login-card,
body.dark-mode .admin-box,
body.dark-mode .member-box,
body.dark-mode .membership-card,
body.dark-mode .package-card,
body.dark-mode .order-card,
body.dark-mode .profile-header,
body.dark-mode .profile-card,
body.dark-mode .progress-card,
body.dark-mode .history-card,
body.dark-mode .material-card,
body.dark-mode .category-card,
body.dark-mode .player-card,
body.dark-mode .pdf-card,
body.dark-mode .audio-player,
body.dark-mode .info-box,
body.dark-mode .notice,
body.dark-mode .modal-box,
body.dark-mode .modal,
body.dark .card,
body.dark .box,
body.dark .container,
body.dark .auth-box,
body.dark .login-card,
body.dark .admin-box,
body.dark .member-box,
body.dark .membership-card,
body.dark .package-card,
body.dark .order-card,
body.dark .profile-header,
body.dark .profile-card,
body.dark .progress-card,
body.dark .history-card,
body.dark .material-card,
body.dark .category-card,
body.dark .player-card,
body.dark .pdf-card,
body.dark .audio-player,
body.dark .info-box,
body.dark .notice,
body.dark .modal-box,
body.dark .modal {
  background: #1a241f !important;
  color: #e8f0eb !important;
  border-color: #334139 !important;
}

/* Common text */
body.dark-mode h1,
body.dark-mode h2,
body.dark-mode h3,
body.dark-mode h4,
body.dark-mode h5,
body.dark-mode h6,
body.dark-mode p,
body.dark-mode label,
body.dark-mode span,
body.dark-mode .title,
body.dark-mode .subtitle,
body.dark-mode .description,
body.dark-mode .card-title,
body.dark-mode .card-description,
body.dark-mode .material-title,
body.dark-mode .material-description,
body.dark-mode .material-desc,
body.dark-mode .page-title,
body.dark-mode .section-title,
body.dark-mode .footer-text,
body.dark-mode .footer-title,
body.dark-mode .hint,
body.dark-mode .help,
body.dark,
body.dark h1,
body.dark h2,
body.dark h3,
body.dark h4,
body.dark h5,
body.dark h6,
body.dark p,
body.dark label,
body.dark span,
body.dark .title,
body.dark .subtitle,
body.dark .description,
body.dark .card-title,
body.dark .card-description,
body.dark .material-title,
body.dark .material-description,
body.dark .material-desc,
body.dark .page-title,
body.dark .section-title,
body.dark .footer-text,
body.dark .footer-title,
body.dark .hint,
body.dark .help {
  color: inherit;
}

/* Secondary text */
body.dark-mode small,
body.dark-mode .meta,
body.dark-mode .material-meta,
body.dark-mode .category,
body.dark-mode .free-label,
body.dark-mode .membership-text,
body.dark-mode .order-description,
body.dark-mode .photo-info,
body.dark .meta,
body.dark .material-meta,
body.dark .category,
body.dark .free-label,
body.dark .membership-text,
body.dark .order-description,
body.dark .photo-info {
  color: #b7c5bc !important;
}

/* Inputs */
body.dark-mode input,
body.dark-mode select,
body.dark-mode textarea,
body.dark .input,
body.dark input,
body.dark select,
body.dark textarea {
  background: #111915 !important;
  color: #eef5f0 !important;
  border-color: #3a4a40 !important;
}

body.dark-mode input::placeholder,
body.dark input::placeholder {
  color: #8e9d94 !important;
}

/* Tables */
body.dark-mode table,
body.dark-mode th,
body.dark-mode td,
body.dark table,
body.dark th,
body.dark td {
  background: #1a241f !important;
  color: #e8f0eb !important;
  border-color: #334139 !important;
}

/* Links — keep green branding */
body.dark-mode a,
body.dark a {
  color: #73d9a0;
}

body.dark-mode .logo,
body.dark .logo {
  color: #73d9a0 !important;
}

/* Footer */
body.dark-mode footer,
body.dark-mode .footer,
body.dark footer,
body.dark .footer {
  background: #0e1511 !important;
  color: #dce7e0 !important;
  border-color: #29352e !important;
}

/* Common white surfaces that otherwise stay glaringly white */
body.dark-mode .hero-card,
body.dark-mode .hero-screen,
body.dark-mode .featured-video,
body.dark-mode .continue-card,
body.dark-mode .stat-card,
body.dark-mode .feature,
body.dark-mode .search-box,
body.dark-mode .filter-box,
body.dark-mode .lock-card,
body.dark-mode .error-card,
body.dark-mode .empty-material,
body.dark-mode .loading-player,
body.dark-mode .preview-box,
body.dark-mode .open-source,
body.dark-mode .active-card,
body.dark-mode .account-notice-free,
body.dark-mode .account-notice-premium,
body.dark .hero-card,
body.dark .hero-screen,
body.dark .featured-video,
body.dark .continue-card,
body.dark .stat-card,
body.dark .feature,
body.dark .search-box,
body.dark .filter-box,
body.dark .lock-card,
body.dark .error-card,
body.dark .empty-material,
body.dark .loading-player,
body.dark .preview-box,
body.dark .open-source,
body.dark .active-card,
body.dark .account-notice-free,
body.dark .account-notice-premium {
  background: #1a241f !important;
  color: #e8f0eb !important;
  border-color: #334139 !important;
}

/* Universal theme button for pages that do not already have one */
.ngp-theme-floating {
  position: fixed !important;
  right: 16px !important;
  bottom: 16px !important;
  z-index: 99999 !important;
  width: 44px !important;
  height: 44px !important;
  border: 1px solid #cfd8d2 !important;
  border-radius: 50% !important;
  background: #ffffff !important;
  color: #1d2a23 !important;
  box-shadow: 0 4px 16px rgba(0,0,0,.15) !important;
  cursor: pointer !important;
  font-size: 20px !important;
  line-height: 1 !important;
}

body.dark-mode .ngp-theme-floating,
body.dark .ngp-theme-floating {
  background: #1f2b24 !important;
  color: #ffffff !important;
  border-color: #425248 !important;
}


/* =========================================================
   ADMIN MEMBERSHIP - DARK OVERRIDES
========================================================= */
body.dark-mode .dashboard-btn,
body.dark .dashboard-btn {
  background:#20332a !important;
  color:#8de2b1 !important;
  border:1px solid #365143 !important;
}

body.dark-mode .logout-btn,
body.dark .logout-btn {
  background:#26302b !important;
  color:#d7e2dc !important;
  border:1px solid #3b4942 !important;
}

body.dark-mode .refresh-btn,
body.dark .refresh-btn {
  background:#00a85a !important;
  color:#fff !important;
}

body.dark-mode .status-menunggu,
body.dark .status-menunggu {
  background:#4a3b08 !important;
  color:#ffe48a !important;
  border:1px solid #6d5a12 !important;
}

body.dark-mode .status-diproses,
body.dark .status-diproses {
  background:#17344d !important;
  color:#9bd3ff !important;
  border:1px solid #275477 !important;
}

body.dark-mode .status-disetujui,
body.dark .status-disetujui {
  background:#153b29 !important;
  color:#8de2b1 !important;
  border:1px solid #276342 !important;
}

body.dark-mode .status-ditolak,
body.dark .status-ditolak,
body.dark-mode .status-dibatalkan,
body.dark .status-dibatalkan {
  background:#401d1d !important;
  color:#ffaaa6 !important;
  border:1px solid #683131 !important;
}

body.dark-mode .detail-btn,
body.dark .detail-btn {
  background:#20332a !important;
  color:#8de2b1 !important;
  border:1px solid #365143 !important;
}

body.dark-mode .approve-btn,
body.dark .approve-btn {
  background:#00a85a !important;
  color:#fff !important;
}

body.dark-mode .reject-btn,
body.dark .reject-btn {
  background:#401d1d !important;
  color:#ffaaa6 !important;
  border:1px solid #683131 !important;
}

body.dark-mode .close-btn,
body.dark .close-btn {
  background:#26302b !important;
  color:#e8f0eb !important;
  border:1px solid #3b4942 !important;
}

body.dark-mode .date-preview,
body.dark .date-preview {
  background:#153b29 !important;
  color:#8de2b1 !important;
  border-color:#276342 !important;
}

body.dark-mode .order-bottom,
body.dark .order-bottom {
  border-top-color:#334139 !important;
}

body.dark-mode .hero,
body.dark .hero {
  box-shadow:0 8px 25px rgba(0,0,0,.30) !important;
}

body.dark-mode .toolbar,
body.dark .toolbar,
body.dark-mode .empty,
body.dark .empty,
body.dark-mode .stat-card,
body.dark .stat-card,
body.dark-mode .order-card,
body.dark .order-card {
  background:#1a241f !important;
  color:#e8f0eb !important;
  border-color:#334139 !important;
}

body.dark-mode .info-box,
body.dark .info-box {
  background:#111915 !important;
  color:#e8f0eb !important;
  border:1px solid #2d3932 !important;
}

body.dark-mode .member-email,
body.dark .member-email,
body.dark-mode .info-label,
body.dark .info-label,
body.dark-mode .order-id,
body.dark .order-id,
body.dark-mode .section-count,
body.dark .section-count,
body.dark-mode .stat-label,
body.dark .stat-label,
body.dark-mode .loading,
body.dark .loading {
  color:#9eaea4 !important;
}

body.dark-mode .section-title h2,
body.dark .section-title h2,
body.dark-mode .member-name,
body.dark .member-name,
body.dark-mode .info-value,
body.dark .info-value,
body.dark-mode .modal-title,
body.dark .modal-title {
  color:#e8f0eb !important;
}

/* =========================================================
   DARK MODE FINAL - KONTRAS TOTAL ADMIN MEMBERSHIP
   Menimpa style putih bawaan halaman agar tidak ada
   komponen terang yang tersisa saat body.dark-mode aktif.
========================================================= */

body.dark-mode,
body.dark {
  background:#07110d !important;
  color:#e8f5ee !important;
}

body.dark-mode .topbar,
body.dark .topbar,
body.dark-mode header,
body.dark header,
body.dark-mode nav,
body.dark nav {
  background:#0b1812 !important;
  color:#e8f5ee !important;
  border-color:#20382c !important;
}

body.dark-mode .toolbar,
body.dark .toolbar {
  background:#121f19 !important;
  border:1px solid #2c4035 !important;
  box-shadow:none !important;
}

body.dark-mode .search,
body.dark .search,
body.dark-mode .filter,
body.dark .filter {
  background:transparent !important;
}

body.dark-mode .search input,
body.dark .search input,
body.dark-mode .filter select,
body.dark .filter select {
  background:#0a1510 !important;
  color:#e8f5ee !important;
  border:1px solid #355044 !important;
  outline:none !important;
  color-scheme:dark;
}

body.dark-mode .search input::placeholder,
body.dark .search input::placeholder {
  color:#8da198 !important;
  opacity:1 !important;
}

body.dark-mode .filter select option,
body.dark .filter select option {
  background:#0f1c16 !important;
  color:#e8f5ee !important;
}

body.dark-mode .toolbar button,
body.dark .toolbar button {
  border:1px solid #355044 !important;
}

body.dark-mode .refresh-btn,
body.dark .refresh-btn {
  background:#008f50 !important;
  color:#ffffff !important;
  border-color:#00b866 !important;
}

body.dark-mode .dashboard-btn,
body.dark .dashboard-btn,
body.dark-mode .logout-btn,
body.dark .logout-btn {
  background:#16271f !important;
  color:#dff8e9 !important;
  border:1px solid #365244 !important;
}

body.dark-mode .order-card,
body.dark .order-card,
body.dark-mode .stat-card,
body.dark .stat-card,
body.dark-mode .empty,
body.dark .empty,
body.dark-mode .info-box,
body.dark .info-box,
body.dark-mode .detail-item,
body.dark .detail-item,
body.dark-mode .modal-box,
body.dark .modal-box {
  background:#121f19 !important;
  color:#e8f5ee !important;
  border-color:#2c4035 !important;
  box-shadow:0 4px 18px rgba(0,0,0,.18) !important;
}

body.dark-mode .member-name,
body.dark .member-name,
body.dark-mode .info-value,
body.dark .info-value,
body.dark-mode .detail-value,
body.dark .detail-value {
  color:#f1faf5 !important;
}

body.dark-mode .member-email,
body.dark .member-email,
body.dark-mode .info-label,
body.dark .info-label,
body.dark-mode .order-id,
body.dark .order-id,
body.dark-mode .section-count,
body.dark .section-count,
body.dark-mode .stat-label,
body.dark .stat-label,
body.dark-mode .empty,
body.dark .empty,
body.dark-mode .detail-label,
body.dark .detail-label {
  color:#9bb0a5 !important;
}

body.dark-mode .section-title,
body.dark .section-title,
body.dark-mode .section-title h2,
body.dark .section-title h2 {
  color:#eef8f2 !important;
}

body.dark-mode .order-bottom,
body.dark .order-bottom {
  border-top-color:#33483d !important;
}

/* Status harus terbaca jelas */
body.dark-mode .status,
body.dark .status {
  font-weight:800 !important;
  text-shadow:none !important;
}

body.dark-mode .status-menunggu,
body.dark .status-menunggu {
  background:#5a4708 !important;
  color:#ffe58b !important;
  border:1px solid #856b12 !important;
}

body.dark-mode .status-diproses,
body.dark .status-diproses {
  background:#173c58 !important;
  color:#a9dcff !important;
  border:1px solid #2b638c !important;
}

body.dark-mode .status-disetujui,
body.dark .status-disetujui {
  background:#075b36 !important;
  color:#b9f5d3 !important;
  border:1px solid #11945b !important;
}

body.dark-mode .status-ditolak,
body.dark .status-ditolak,
body.dark-mode .status-dibatalkan,
body.dark .status-dibatalkan {
  background:#5a2020 !important;
  color:#ffc1bd !important;
  border:1px solid #873b38 !important;
}

body.dark-mode .detail-btn,
body.dark .detail-btn {
  background:#173326 !important;
  color:#a8edc6 !important;
  border:1px solid #2f6148 !important;
}

body.dark-mode .approve-btn,
body.dark .approve-btn {
  background:#008f50 !important;
  color:#ffffff !important;
  border:1px solid #00bd6a !important;
}

body.dark-mode .reject-btn,
body.dark .reject-btn {
  background:#4a2020 !important;
  color:#ffc1bd !important;
  border:1px solid #7a3737 !important;
}

body.dark-mode .close-btn,
body.dark .close-btn {
  background:#1b2922 !important;
  color:#eaf5ef !important;
  border:1px solid #3a5044 !important;
}

body.dark-mode .modal,
body.dark .modal {
  background:rgba(0,0,0,.78) !important;
}

body.dark-mode .date-preview,
body.dark .date-preview {
  background:#073c25 !important;
  color:#b8f2cf !important;
  border-color:#168253 !important;
}

body.dark-mode .hero,
body.dark .hero {
  color:#ffffff !important;
}

body.dark-mode .hero h1,
body.dark .hero h1,
body.dark-mode .hero p,
body.dark .hero p {
  color:#ffffff !important;
}

/* Semua link dan tombol yang masih mewarisi warna terang */
body.dark-mode a,
body.dark a {
  color:#8ee6b5;
}

body.dark-mode button,
body.dark button {
  color:#e8f5ee;
}

/* cegah browser Android memaksa select/input menjadi terang */
body.dark-mode input,
body.dark-mode select,
body.dark-mode textarea,
body.dark input,
body.dark select,
body.dark textarea {
  color-scheme:dark !important;
}


/* =========================================================
   NAVBAR THEME BUTTON - ADMIN MEMBERSHIP
========================================================= */
.nav-btn.theme-btn{
  min-width:36px;
  width:36px;
  height:32px;
  padding:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  border:1px solid rgba(255,255,255,.18);
}

body.dark-mode .nav-btn.theme-btn,
body.dark .nav-btn.theme-btn{
  background:#10251d !important;
  color:#ffffff !important;
  border-color:#24533e !important;
}

body:not(.dark-mode):not(.dark) .nav-btn.theme-btn{
  background:#ffffff !important;
  color:#123d2b !important;
}