/* ==========================================================================
   Glassbook — Mode malam (OPAC)
   Dimuat SETELAH custom-glass.css. Aktif bila <html data-theme="dark">;
   atribut itu dipasang skrip kecil di <head> (pilihan pengguna di localStorage
   "slims-theme", atau mengikuti pengaturan perangkat bila belum memilih).

   --g-accent tetap dipakai sebagai latar tombol (teks putih), sedangkan teks
   beraksen di atas latar gelap memakai --g-accent-text yang lebih terang.

   01. Tokens              05. Kartu, panel, halaman dalam
   02. Dasar               06. Login & area anggota
   03. Tombol & kontrol    07. Widget, navigasi bawah, Bootstrap, Tailwind
   04. Navbar & drawer     08. Plugin (Bebas Pustaka, Pendaftaran Email)
   ========================================================================== */

/* 01. Tokens -------------------------------------------------------------- */
html[data-theme="dark"] { color-scheme: dark; }

html[data-theme="dark"] body.glass-theme {
    --g-bg: #17130F;
    --g-bg-2: #211A15;
    --g-text: #F1E9E1;
    --g-muted: #B9ADA2;
    --g-line: rgba(241, 233, 225, 0.12);

    --g-glass: rgba(38, 31, 26, 0.55);
    --g-glass-thick: rgba(38, 31, 26, 0.74);
    --g-glass-solid: rgba(34, 28, 23, 0.96);
    --g-glass-border: rgba(255, 255, 255, 0.08);
    --g-glass-edge: rgba(255, 255, 255, 0.06);
    --g-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.35);
    --g-shadow-2: 0 2px 6px rgba(0, 0, 0, 0.3), 0 12px 32px rgba(0, 0, 0, 0.4);

    /* permukaan kecil (tombol hantu, isian, baris tabel) */
    --g-surface: rgba(255, 255, 255, 0.06);
    --g-surface-hover: rgba(255, 255, 255, 0.12);
    --g-input: rgba(0, 0, 0, 0.28);

    --g-accent-soft: rgba(232, 102, 79, 0.20);
    --g-accent-ink: #FFB8A8;
    --g-accent-text: #FF9F8A;
    --g-accent-glow: rgba(232, 102, 79, 0.35);
}
html[data-theme="dark"] body.glass-theme[data-accent="orange"] {
    --g-accent-soft: rgba(232, 128, 48, 0.20);
    --g-accent-ink: #FFC99A;
    --g-accent-text: #FFB677;
    --g-accent-glow: rgba(232, 128, 48, 0.35);
}
html[data-theme="dark"] body.glass-theme[data-accent="blue"] {
    --g-accent-soft: rgba(80, 150, 220, 0.22);
    --g-accent-ink: #B9DAFA;
    --g-accent-text: #8EC3F5;
    --g-accent-glow: rgba(80, 150, 220, 0.35);
}

/* 02. Dasar --------------------------------------------------------------- */
html[data-theme="dark"] body.glass-theme {
    background-image:
        radial-gradient(42rem 42rem at 92% 8%, rgba(200, 67, 47, 0.16), transparent 60%),
        radial-gradient(36rem 36rem at 4% 38%, rgba(110, 96, 190, 0.14), transparent 60%),
        radial-gradient(40rem 40rem at 80% 78%, rgba(40, 140, 110, 0.10), transparent 60%),
        linear-gradient(180deg, var(--g-bg) 0%, var(--g-bg-2) 100%);
}
/* :where() menjaga bobot selektor sama dengan ".glass-theme a" di custom-glass.css,
   sehingga tautan yang berwarna teks (navbar, footer, judul berita) tetap menang */
:where(html[data-theme="dark"]) .glass-theme a { color: var(--g-accent-text); }
:where(html[data-theme="dark"]) .glass-theme a:hover { color: var(--g-accent-ink); }
html[data-theme="dark"] .g-news__title a,
html[data-theme="dark"] .g-footer__links a { color: var(--g-text); }

html[data-theme="dark"] .g-link-btn,
html[data-theme="dark"] .g-chip i,
html[data-theme="dark"] .g-news__media,
html[data-theme="dark"] .g-news__title a:hover,
html[data-theme="dark"] .g-news__more,
html[data-theme="dark"] .g-auth__switch a,
html[data-theme="dark"] .glass-theme .btn-outline-primary { color: var(--g-accent-text); }
html[data-theme="dark"] .g-link-btn { color: var(--g-accent-text) !important; }
html[data-theme="dark"] .g-news__more:hover { color: var(--g-accent-ink); }
html[data-theme="dark"] .g-link-btn:hover { color: var(--g-accent-ink) !important; }
html[data-theme="dark"] .glass-theme .text-primary { color: var(--g-accent-text) !important; }
html[data-theme="dark"] .glass-theme .btn-outline-primary:hover { color: #fff; }

html[data-theme="dark"] .g-skip { background: var(--g-accent); }

/* 03. Tombol & kontrol ---------------------------------------------------- */
html[data-theme="dark"] .g-pill--ghost,
html[data-theme="dark"] .g-icon-btn,
html[data-theme="dark"] .g-chip { background: var(--g-surface); }
html[data-theme="dark"] .g-pill--ghost:hover,
html[data-theme="dark"] .g-pill--ghost.active,
html[data-theme="dark"] .g-icon-btn:hover { background: var(--g-surface-hover); }
html[data-theme="dark"] .g-icon-btn:hover { color: var(--g-accent-text) !important; }
html[data-theme="dark"] .g-avatar { border-color: rgba(255, 255, 255, 0.25); }
html[data-theme="dark"] .g-input { background: var(--g-input); color: var(--g-text); }

/* tombol pengalih mode: ikon bulan (terang) / matahari (gelap) */
.g-theme-toggle .g-theme-toggle__sun { display: none; }
html[data-theme="dark"] .g-theme-toggle .g-theme-toggle__sun { display: inline-block; }
html[data-theme="dark"] .g-theme-toggle .g-theme-toggle__moon { display: none; }

/* 04. Navbar & drawer ----------------------------------------------------- */
html[data-theme="dark"] .g-nav__inner.glass { background: rgba(30, 24, 20, 0.72); }
html[data-theme="dark"] .g-nav__link:hover,
html[data-theme="dark"] .g-drawer__link:hover,
html[data-theme="dark"] .g-drawer__langs .dropdown-item:hover { background: var(--g-surface-hover); }
html[data-theme="dark"] .g-drawer.glass { background: rgba(30, 24, 20, 0.9); }
html[data-theme="dark"] .g-drawer__user { background: var(--g-surface); }
html[data-theme="dark"] .g-drawer-backdrop { background: rgba(0, 0, 0, 0.55); }
html[data-theme="dark"] .g-burger__bar { background: var(--g-text); }

/* 05. Pencarian, kartu, panel, halaman dalam ------------------------------ */
html[data-theme="dark"] .g-search__box.glass--thick { background: rgba(30, 24, 20, 0.78); }
html[data-theme="dark"] .glass-theme .search .g-search__input { color: var(--g-text); }
html[data-theme="dark"] .glass-theme .search .g-search__input::placeholder { color: #9C9087; }

html[data-theme="dark"] .g-shelf { background: rgba(255, 255, 255, 0.04); }
html[data-theme="dark"] .g-book__cover,
html[data-theme="dark"] .g-reader__rank { background: #3A3029; }
html[data-theme="dark"] .g-reader:nth-child(1) .g-reader__rank { background: #F2C14E; }
html[data-theme="dark"] .g-reader:nth-child(2) .g-reader__rank { background: #D5D9DE; }
html[data-theme="dark"] .g-reader:nth-child(3) .g-reader__rank { background: #E3A374; }
html[data-theme="dark"] .g-reader__photo { border-color: rgba(255, 255, 255, 0.18); }
html[data-theme="dark"] .g-reader__stats div,
html[data-theme="dark"] .glass-theme .biblioResult .item.card,
html[data-theme="dark"] .glass-theme .g-page .card.item,
html[data-theme="dark"] .glass-theme .availability.card,
html[data-theme="dark"] .glass-theme .grid-item .card,
html[data-theme="dark"] .glass-theme .librarian,
html[data-theme="dark"] .g-detail__actions > a,
html[data-theme="dark"] .g-detail__body table tr,
html[data-theme="dark"] .g-detail__body .flex-col > .w-100.flex-row { background: var(--g-surface); }
html[data-theme="dark"] .glass-theme .biblioPaging .pagingList a,
html[data-theme="dark"] .glass-theme .pagination .page-link {
    background: var(--g-surface);
    border-color: var(--g-line);
    color: var(--g-text);
}
html[data-theme="dark"] .glass-theme .biblioPaging .pagingList b,
html[data-theme="dark"] .glass-theme .pagination .active .page-link { background: var(--g-accent); color: #fff; }
html[data-theme="dark"] .glass-theme .card,
html[data-theme="dark"] .glass-theme .card-body,
html[data-theme="dark"] .glass-theme .card-header,
html[data-theme="dark"] .glass-theme .card-footer { color: var(--g-text); border-color: var(--g-line); }
html[data-theme="dark"] .glass-theme .card { background-color: var(--g-surface); }
html[data-theme="dark"] .glass-theme .card-header,
html[data-theme="dark"] .glass-theme .card-footer { background-color: rgba(255, 255, 255, 0.03); }

/* 06. Login & area anggota ------------------------------------------------ */
html[data-theme="dark"] .glass-theme .g-auth .login_input input,
html[data-theme="dark"] .glass-theme .g-auth #loginForm .login_input input,
html[data-theme="dark"] .glass-theme .g-auth input.form-control { background: var(--g-input); color: var(--g-text); }
html[data-theme="dark"] .glass-theme .g-auth .homeButton,
html[data-theme="dark"] .glass-theme .g-auth #loginForm .homeButton { background: var(--g-surface); color: var(--g-text); }
html[data-theme="dark"] .glass-theme .g-auth .homeButton:hover { background: var(--g-surface-hover); }

html[data-theme="dark"] .g-member__card { background: var(--g-glass-thick); }
html[data-theme="dark"] .glass-theme .g-member #member_sidebar { background: var(--g-surface) !important; }
html[data-theme="dark"] .glass-theme .g-member #member_sidebar img { border-color: rgba(255, 255, 255, 0.18); }
html[data-theme="dark"] .glass-theme .g-member .nav-tabs { background: var(--g-surface); }
html[data-theme="dark"] .glass-theme .g-member .nav-tabs .nav-link { color: var(--g-muted); }
html[data-theme="dark"] .glass-theme .g-member .nav-tabs .nav-link:hover { background: var(--g-surface-hover); color: var(--g-text); }
html[data-theme="dark"] .glass-theme .g-member .nav-tabs .nav-link.active { color: #fff; }
html[data-theme="dark"] .glass-theme .g-member .nav-tabs + div { background: var(--g-surface) !important; }
html[data-theme="dark"] .glass-theme .g-member .table-striped tbody tr:nth-of-type(odd) { background: rgba(255, 255, 255, 0.04); }

/* 07. Widget, navigasi bawah, Bootstrap, Tailwind ------------------------- */
html[data-theme="dark"] .g-help__card.glass--thick { background: rgba(30, 24, 20, 0.92); }
html[data-theme="dark"] .g-help__item { background: var(--g-surface); color: var(--g-text); }
html[data-theme="dark"] .g-help__item:hover { background: var(--g-surface-hover); }
html[data-theme="dark"] .g-help__icon--wa { background: rgba(37, 160, 90, 0.2); color: #7DDBA3; }
html[data-theme="dark"] .g-bottom-nav.glass--thick { background: rgba(30, 24, 20, 0.88); }

/* .input-transparent = kolom cari utama yang menyatu dengan kotak kacanya */
html[data-theme="dark"] .glass-theme .form-control,
html[data-theme="dark"] .glass-theme .custom-select,
html[data-theme="dark"] .glass-theme select,
html[data-theme="dark"] .glass-theme textarea,
html[data-theme="dark"] .glass-theme input:is([type="text"], [type="password"], [type="email"], [type="number"], [type="date"], [type="search"], [type="tel"]):not(.input-transparent) {
    background-color: var(--g-input);
    border-color: var(--g-line);
    color: var(--g-text);
}
html[data-theme="dark"] .glass-theme .form-control::placeholder,
html[data-theme="dark"] .glass-theme input::placeholder,
html[data-theme="dark"] .glass-theme textarea::placeholder { color: #9C9087; }
html[data-theme="dark"] .glass-theme .form-control:disabled,
html[data-theme="dark"] .glass-theme .form-control[readonly] { background-color: rgba(255, 255, 255, 0.04); }
html[data-theme="dark"] .glass-theme .input-group-text { background: var(--g-surface); border-color: var(--g-line); color: var(--g-muted); }

html[data-theme="dark"] .glass-theme .dropdown-menu,
html[data-theme="dark"] .glass-theme .glass-menu { background: rgba(34, 28, 23, 0.96); border-color: var(--g-glass-border); }
html[data-theme="dark"] .glass-theme .dropdown-item:not(:hover):not(:focus),
html[data-theme="dark"] .glass-theme .dropdown-header { color: var(--g-text); }
html[data-theme="dark"] .glass-theme .dropdown-divider { border-color: var(--g-line); }
html[data-theme="dark"] .glass-theme .modal-content { background: rgba(34, 28, 23, 0.97); color: var(--g-text); }
html[data-theme="dark"] .glass-theme .modal-header,
html[data-theme="dark"] .glass-theme .modal-footer { border-color: var(--g-line); }
html[data-theme="dark"] .glass-theme .close { color: var(--g-text); text-shadow: none; }

html[data-theme="dark"] .glass-theme .table { color: var(--g-text); }
html[data-theme="dark"] .glass-theme .table th,
html[data-theme="dark"] .glass-theme .table td,
html[data-theme="dark"] .glass-theme .table thead th { border-color: var(--g-line); }
html[data-theme="dark"] .glass-theme .table-striped tbody tr:nth-of-type(odd) { background-color: rgba(255, 255, 255, 0.04); }
html[data-theme="dark"] .glass-theme .table-hover tbody tr:hover { background-color: var(--g-surface-hover); color: var(--g-text); }
html[data-theme="dark"] .glass-theme .list-group-item { background: var(--g-surface); border-color: var(--g-line); color: var(--g-text); }
html[data-theme="dark"] .glass-theme .nav-tabs { border-color: var(--g-line); }
html[data-theme="dark"] .glass-theme .nav-tabs .nav-link.active { background: var(--g-surface); border-color: var(--g-line); color: var(--g-text); }
html[data-theme="dark"] .glass-theme hr { border-color: var(--g-line); }
html[data-theme="dark"] .glass-theme .btn-light,
html[data-theme="dark"] .glass-theme .btn-outline-secondary { background: var(--g-surface); border-color: var(--g-line); color: var(--g-text); }
html[data-theme="dark"] .glass-theme .btn-light:hover,
html[data-theme="dark"] .glass-theme .btn-outline-secondary:hover { background: var(--g-surface-hover); color: var(--g-text); }
html[data-theme="dark"] .glass-theme .badge-light { background: var(--g-surface-hover); color: var(--g-text); }
html[data-theme="dark"] .glass-theme .alert-info { background: rgba(80, 150, 220, 0.16); border-color: transparent; color: #B9DAFA; }
html[data-theme="dark"] .glass-theme .alert-warning { background: rgba(232, 160, 48, 0.16); border-color: transparent; color: #FFD79A; }
html[data-theme="dark"] .glass-theme .alert-danger { background: rgba(230, 80, 70, 0.16); border-color: transparent; color: #FFB4AB; }
html[data-theme="dark"] .glass-theme .alert-success { background: rgba(37, 160, 90, 0.16); border-color: transparent; color: #A6E9C0; }
html[data-theme="dark"] .glass-theme .text-dark,
html[data-theme="dark"] .glass-theme .text-black { color: var(--g-text) !important; }
html[data-theme="dark"] .glass-theme .text-muted,
html[data-theme="dark"] .glass-theme .text-secondary { color: var(--g-muted) !important; }
html[data-theme="dark"] .glass-theme .bg-white,
html[data-theme="dark"] .glass-theme .bg-light,
html[data-theme="dark"] .glass-theme .bg-grey-light,
html[data-theme="dark"] .glass-theme .bg-grey-lighter { background-color: var(--g-surface) !important; }
html[data-theme="dark"] .glass-theme .text-grey-darkest,
html[data-theme="dark"] .glass-theme .text-grey-darker { color: var(--g-text) !important; }
html[data-theme="dark"] .glass-theme .text-grey-dark,
html[data-theme="dark"] .glass-theme .text-grey-light { color: var(--g-muted) !important; }
html[data-theme="dark"] .glass-theme .border,
html[data-theme="dark"] .glass-theme .border-b,
html[data-theme="dark"] .glass-theme .border-t,
html[data-theme="dark"] .glass-theme .border-grey-light { border-color: var(--g-line) !important; }

/* gambar sampul & logo tidak dibalik warnanya, cukup sedikit diredupkan */
html[data-theme="dark"] .glass-theme img:not(.g-brand__logo):not(.g-footer__logo) { filter: brightness(.92); }

/* 08. Plugin -------------------------------------------------------------- */
html[data-theme="dark"] .skbp-card,
html[data-theme="dark"] .mrm-card { background: var(--g-glass-thick); border-color: var(--g-glass-border); color: var(--g-text); }
html[data-theme="dark"] .skbp-steps li span,
html[data-theme="dark"] .mrm-steps span { background: var(--g-surface-hover); color: var(--g-text); }
html[data-theme="dark"] .skbp-steps li.is-done,
html[data-theme="dark"] .skbp-done,
html[data-theme="dark"] .skbp-note--success { background: rgba(37, 160, 90, 0.16); color: #A6E9C0; }
html[data-theme="dark"] .skbp-steps li.is-revision,
html[data-theme="dark"] .skbp-note--info,
html[data-theme="dark"] .mrm-note--info { background: rgba(80, 150, 220, 0.16); color: #B9DAFA; }
html[data-theme="dark"] .skbp-steps li.is-rejected,
html[data-theme="dark"] .skbp-note--danger { background: rgba(230, 80, 70, 0.16); color: #FFB4AB; }
html[data-theme="dark"] .skbp-note,
html[data-theme="dark"] .mrm-note { background: rgba(232, 160, 48, 0.16); color: #FFD79A; }
html[data-theme="dark"] .skbp-danger,
html[data-theme="dark"] .skbp-req,
html[data-theme="dark"] .mrm-req,
html[data-theme="dark"] .is-invalid .skbp-verify__title { color: #FF8A7E; }
html[data-theme="dark"] .is-valid .skbp-verify__title { color: #7DDBA3; }
html[data-theme="dark"] .skbp-field input:not([type=file]),
html[data-theme="dark"] .skbp-field textarea,
html[data-theme="dark"] .mrm-field input:not([type=radio]):not([type=checkbox]),
html[data-theme="dark"] .mrm-field select,
html[data-theme="dark"] .mrm-field textarea { background: var(--g-input); border-color: var(--g-line); color: var(--g-text); }
html[data-theme="dark"] .skbp-btn--ghost,
html[data-theme="dark"] .mrm-btn--ghost { background: var(--g-surface); color: var(--g-text) !important; }
html[data-theme="dark"] .skbp-btn--ghost:hover,
html[data-theme="dark"] .mrm-btn--ghost:hover { background: var(--g-surface-hover); }

/* cetak selalu terang */
@media print {
    html[data-theme="dark"] { color-scheme: light; }
    html[data-theme="dark"] body.glass-theme { --g-text: #2B2622; --g-muted: #5F564F; background: #fff !important; }
}
