/* ==========================================================================
   THEME CSS: SISTEM INFORMASI PERPUSTAKAAN SMPN 1 KALIBAGOR
   Mendukung Dark Mode (Default) & Light Mode yang Elegan, Modern, dan Halus
   ========================================================================== */

/* TOMBOL TOGGLE TEMA (DI SEBELAH KIRI NAMA ADMIN) */
.btn-theme-toggle {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.15);
    color: #fbbf24; /* Kuning cerah matahari di dark mode */
    font-size: 1.15rem;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    padding: 0;
    line-height: 1;
}

.btn-theme-toggle:hover {
    background: rgba(255, 255, 255, 0.18);
    transform: scale(1.08) rotate(15deg);
    box-shadow: 0 0 15px rgba(251, 191, 36, 0.45);
    color: #f59e0b;
}

.btn-theme-toggle:active {
    transform: scale(0.95);
}

/* ==========================================================================
   ATURAN TEMA TERANG (LIGHT MODE)
   ========================================================================== */
[data-theme="light"] {
    --bg-color: #f8fafc;
    --glass-bg: rgba(255, 255, 255, 0.9);
    --glass-border: rgba(203, 213, 225, 0.8);
    --accent-glow: #2563eb;
    --text-main: #0f172a;
    --text-muted: #64748b;
}

/* Body & Background */
[data-theme="light"] body {
    background-color: #f1f5f9 !important;
    color: #0f172a !important;
    background-image: radial-gradient(circle at 50% 0%, #cbd5e1 0%, transparent 60%) !important;
}

/* Tombol Tema di Mode Terang */
[data-theme="light"] .btn-theme-toggle {
    background: rgba(15, 23, 42, 0.06);
    border: 1px solid rgba(148, 163, 184, 0.4);
    color: #2563eb; /* Biru bulan di mode terang */
}

[data-theme="light"] .btn-theme-toggle:hover {
    background: rgba(15, 23, 42, 0.1);
    transform: scale(1.08) rotate(-15deg);
    box-shadow: 0 0 15px rgba(37, 99, 235, 0.35);
    color: #1d4ed8;
}

/* Navbar */
[data-theme="light"] .navbar-custom {
    background: rgba(255, 255, 255, 0.95) !important;
    border-bottom: 1px solid rgba(226, 232, 240, 1) !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04) !important;
}

[data-theme="light"] .navbar-brand,
[data-theme="light"] .navbar-brand span,
[data-theme="light"] .navbar-brand .text-white,
[data-theme="light"] .btn-menu,
[data-theme="light"] #adminDropdown,
[data-theme="light"] #adminName,
[data-theme="light"] #adminDropdown .text-white {
    color: #0f172a !important;
}

[data-theme="light"] .btn-menu:hover {
    color: #2563eb !important;
    text-shadow: none !important;
}

/* Sidebar */
[data-theme="light"] #sidebar-wrapper {
    background: #ffffff !important;
    border-right: 1px solid #e2e8f0 !important;
    box-shadow: 2px 0 12px rgba(0, 0, 0, 0.02) !important;
}

[data-theme="light"] .sidebar-nav li[style*="color: #94a3b8"],
[data-theme="light"] .sidebar-nav .text-muted,
[data-theme="light"] .sidebar-nav .text-uppercase {
    color: #64748b !important;
}

[data-theme="light"] .sidebar-nav a {
    color: #475569 !important;
}

[data-theme="light"] .sidebar-nav a:hover,
[data-theme="light"] .sidebar-nav a.active {
    color: #1d4ed8 !important;
    background: rgba(37, 99, 235, 0.08) !important;
    box-shadow: inset 4px 0 0 #2563eb !important;
}

/* Cards (Glass Card & Dashboard Card) */
[data-theme="light"] .glass-card,
[data-theme="light"] .card:not(.bg-primary):not(.bg-success):not(.bg-danger):not(.bg-warning):not(.bg-info) {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.05) !important;
    color: #0f172a !important;
}

[data-theme="light"] .card-header,
[data-theme="light"] .card-footer {
    background-color: #f8fafc !important;
    border-color: #e2e8f0 !important;
    color: #0f172a !important;
}

/* Teks dan Judul */
[data-theme="light"] h1,
[data-theme="light"] h2:not(.text-danger):not(.text-primary):not(.text-success):not(.text-warning):not(.text-info),
[data-theme="light"] h3:not(.text-danger):not(.text-primary):not(.text-success):not(.text-warning):not(.text-info),
[data-theme="light"] h4:not(.text-danger):not(.text-primary):not(.text-success):not(.text-warning):not(.text-info),
[data-theme="light"] h5:not(.text-danger):not(.text-primary):not(.text-success):not(.text-warning):not(.text-info),
[data-theme="light"] h6:not(.text-danger):not(.text-primary):not(.text-success):not(.text-warning):not(.text-info) {
    color: #0f172a !important;
}

[data-theme="light"] .text-muted {
    color: #64748b !important;
}

[data-theme="light"] label.form-label,
[data-theme="light"] .modal-title,
[data-theme="light"] .breadcrumb-item.active {
    color: #0f172a !important;
}

[data-theme="light"] .breadcrumb-item a {
    color: #2563eb !important;
}

/* Overriding .text-white secara selektif (kecuali tombol berwarna & badge) */
[data-theme="light"] p.text-white,
[data-theme="light"] span.text-white:not(.badge),
[data-theme="light"] small.text-white,
[data-theme="light"] div.text-white,
[data-theme="light"] h3.text-white,
[data-theme="light"] h4.text-white,
[data-theme="light"] h5.text-white,
[data-theme="light"] td.text-white,
[data-theme="light"] th.text-white {
    color: #0f172a !important;
}

/* Form Inputs, Select, Input Group */
[data-theme="light"] .form-control,
[data-theme="light"] .form-select {
    background-color: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    color: #0f172a !important;
}

[data-theme="light"] .form-control:focus,
[data-theme="light"] .form-select:focus {
    background-color: #ffffff !important;
    border-color: #3b82f6 !important;
    color: #0f172a !important;
    box-shadow: 0 0 0 0.25rem rgba(59, 130, 246, 0.2) !important;
}

[data-theme="light"] .form-control::placeholder {
    color: #94a3b8 !important;
    opacity: 1 !important;
}

[data-theme="light"] .input-group-text {
    background-color: #f1f5f9 !important;
    border: 1px solid #cbd5e1 !important;
    color: #475569 !important;
}

[data-theme="light"] select option {
    background-color: #ffffff !important;
    color: #0f172a !important;
}

/* Dropdown Menu */
[data-theme="light"] .dropdown-menu-custom,
[data-theme="light"] .dropdown-menu {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08) !important;
}

[data-theme="light"] .dropdown-menu-custom .dropdown-item,
[data-theme="light"] .dropdown-menu .dropdown-item:not(.text-danger) {
    color: #334155 !important;
}

[data-theme="light"] .dropdown-menu-custom .dropdown-item:hover,
[data-theme="light"] .dropdown-menu .dropdown-item:hover {
    background-color: rgba(37, 99, 235, 0.08) !important;
    color: #2563eb !important;
}

[data-theme="light"] .dropdown-divider {
    border-top: 1px solid #e2e8f0 !important;
}

/* Tabel */
[data-theme="light"] .table,
[data-theme="light"] .table-custom {
    color: #1e293b !important;
    border-color: #e2e8f0 !important;
}

[data-theme="light"] .table-custom th,
[data-theme="light"] .table th,
[data-theme="light"] thead tr {
    background-color: #f1f5f9 !important;
    color: #334155 !important;
    border-bottom: 2px solid #cbd5e1 !important;
}

[data-theme="light"] .table-custom td,
[data-theme="light"] .table td {
    background-color: #ffffff !important;
    border-bottom: 1px solid #e2e8f0 !important;
    color: #1e293b !important;
}

[data-theme="light"] .table-custom tr:hover td,
[data-theme="light"] .table-hover tbody tr:hover td {
    background-color: #f8fafc !important;
}

[data-theme="light"] .table-dark {
    background-color: #ffffff !important;
    color: #1e293b !important;
    border-color: #e2e8f0 !important;
}

[data-theme="light"] .table-dark th {
    background-color: #f1f5f9 !important;
    color: #1e293b !important;
}

[data-theme="light"] .table-dark td {
    background-color: #ffffff !important;
    color: #1e293b !important;
}

/* Bootstrap 5.3 mewarnai baris belang & hover lewat box-shadow memakai variabel ini.
   Tanpa override, .table-dark tetap memberi lapisan gelap di atas sel putih saat light mode. */
[data-theme="light"] .table-dark,
[data-theme="light"] .table {
    --bs-table-color: #1e293b;
    --bs-table-bg: #ffffff;
    --bs-table-border-color: #e2e8f0;
    --bs-table-striped-bg: #f1f5f9;
    --bs-table-striped-color: #1e293b;
    --bs-table-hover-bg: #e2e8f0;
    --bs-table-hover-color: #0f172a;
    --bs-table-active-bg: #e2e8f0;
    --bs-table-active-color: #0f172a;
}

[data-theme="light"] .table-striped>tbody>tr:nth-of-type(odd)>* {
    background-color: #f1f5f9 !important;
    color: #1e293b !important;
}

/* Modal */
[data-theme="light"] .modal-content,
[data-theme="light"] .modal-content.glass-modal {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    color: #0f172a !important;
    box-shadow: 0 20px 30px rgba(0, 0, 0, 0.12) !important;
}

[data-theme="light"] .modal-header,
[data-theme="light"] .modal-footer {
    border-color: #e2e8f0 !important;
}

[data-theme="light"] .btn-close {
    filter: none !important;
}

/* Pagination */
[data-theme="light"] .page-link.bg-dark {
    background-color: #ffffff !important;
    color: #334155 !important;
    border-color: #cbd5e1 !important;
}

[data-theme="light"] .page-link.bg-dark:hover {
    background-color: #f1f5f9 !important;
    color: #2563eb !important;
}

[data-theme="light"] .page-link.bg-primary {
    background-color: #2563eb !important;
    border-color: #2563eb !important;
    color: #ffffff !important;
}

/* Accordion, Tabs, Nav-pills */
[data-theme="light"] .nav-tabs .nav-link {
    color: #64748b !important;
}

[data-theme="light"] .nav-tabs .nav-link.active {
    color: #2563eb !important;
    background-color: #ffffff !important;
    border-color: #cbd5e1 #cbd5e1 #ffffff !important;
}

/* ====================================================================
   PERBAIKAN LIGHT MODE: Tombol Outline, Modal Info Boxes, Eksemplar
   ==================================================================== */

/* Tombol outline dengan text-white: tampilkan warna sesuai varian */
[data-theme="light"] .btn-outline-success.text-white {
    color: #198754 !important;
    border-color: #198754 !important;
}
[data-theme="light"] .btn-outline-success.text-white:hover,
[data-theme="light"] .btn-outline-success.text-white:active,
[data-theme="light"] .btn-outline-success.text-white:focus,
[data-theme="light"] .btn-outline-success.text-white.show {
    color: #ffffff !important;
    background-color: #198754 !important;
}

[data-theme="light"] .btn-outline-info.text-white {
    color: #0891b2 !important;
    border-color: #0891b2 !important;
}
[data-theme="light"] .btn-outline-info.text-white:hover,
[data-theme="light"] .btn-outline-info.text-white:active,
[data-theme="light"] .btn-outline-info.text-white:focus,
[data-theme="light"] .btn-outline-info.text-white.show {
    color: #ffffff !important;
    background-color: #0891b2 !important;
}

[data-theme="light"] .btn-outline-primary.text-white {
    color: #2563eb !important;
    border-color: #2563eb !important;
}
[data-theme="light"] .btn-outline-primary.text-white:hover,
[data-theme="light"] .btn-outline-primary.text-white:active,
[data-theme="light"] .btn-outline-primary.text-white:focus,
[data-theme="light"] .btn-outline-primary.text-white.show {
    color: #ffffff !important;
    background-color: #2563eb !important;
}

[data-theme="light"] .btn-outline-secondary.text-white {
    color: #64748b !important;
    border-color: #94a3b8 !important;
}

/* Modal custom background (dark -> light) */
[data-theme="light"] .modal-content-custom {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    color: #0f172a !important;
    box-shadow: 0 20px 30px rgba(0, 0, 0, 0.12) !important;
}

[data-theme="light"] .modal-content-custom label,
[data-theme="light"] .modal-content-custom .form-label {
    color: #0f172a !important;
}

[data-theme="light"] .modal-content-custom small,
[data-theme="light"] .modal-content-custom .text-muted {
    color: #64748b !important;
}

/* Info box gelap di dalam modal (inline style override) */
[data-theme="light"] .modal-body [style*="background: rgba(30,41,59"] {
    background: #f1f5f9 !important;
    border-color: #cbd5e1 !important;
}

[data-theme="light"] .modal-body [style*="background: rgba(15, 23, 42"] {
    background: #f1f5f9 !important;
    border-color: #cbd5e1 !important;
}

/* Info rak badge di light mode */
[data-theme="light"] .info-rak-badge {
    background: #f1f5f9 !important;
    border-color: #cbd5e1 !important;
    color: #0f172a !important;
}

/* Eksemplar modal: scroll table */
[data-theme="light"] .eks-scroll {
    border-color: #cbd5e1 !important;
}

[data-theme="light"] .eks-scroll th {
    background-color: #f1f5f9 !important;
    color: #334155 !important;
    border-color: #cbd5e1 !important;
}

[data-theme="light"] .eks-scroll td {
    color: #1e293b !important;
    border-color: #e2e8f0 !important;
}

/* Eksemplar modal: preview box */
[data-theme="light"] .eks-preview {
    background: #f1f5f9 !important;
    border: 1px dashed #94a3b8 !important;
    color: #1e293b !important;
}

/* Eksemplar modal: toggle mode buttons */
[data-theme="light"] .eks-mode .btn {
    color: #475569 !important;
    background: #f8fafc !important;
    border: 1px solid #cbd5e1 !important;
}

[data-theme="light"] .eks-mode .btn:hover {
    color: #2563eb !important;
    background: rgba(37, 99, 235, 0.08) !important;
}

[data-theme="light"] .eks-mode .btn-check:checked+.btn {
    background: #2563eb !important;
    color: #fff !important;
    border-color: #3b82f6 !important;
}

/* Subtitle teks dengan inline !important (override via higher specificity) */
[data-theme="light"] #page-content-wrapper p[style*="color: #ffffff"] {
    color: #475569 !important;
}

/* btn-close-white di light mode */
[data-theme="light"] .btn-close-white {
    filter: none !important;
}

/* btn-secondary text-white pada modal footer */
[data-theme="light"] .modal-footer .btn-secondary.text-white {
    color: #ffffff !important;
}

/* Pastikan tombol dengan background solid tetap punya teks putih */
[data-theme="light"] .btn-primary.text-white,
[data-theme="light"] .btn-success.text-white,
[data-theme="light"] .btn-danger.text-white,
[data-theme="light"] .btn-warning.text-white {
    color: #ffffff !important;
}

/* Fix form-select option dropdown di light mode */
[data-theme="light"] select option {
    background-color: #ffffff !important;
    color: #0f172a !important;
}

/* Smooth Transition saat perpindahan tema */
body,
.navbar-custom,
#sidebar-wrapper,
.glass-card,
.card,
.modal-content,
.form-control,
.form-select,
.btn-theme-toggle {
    transition: background-color 0.25s ease, border-color 0.25s ease, color 0.2s ease, box-shadow 0.25s ease;
}

/* Judul kelompok menu di sidebar (MENU UTAMA, LAPORAN) */
.sidebar-heading {
    color: #cbd5e1 !important;
    letter-spacing: 0.05em;
}

[data-theme="light"] .sidebar-nav .sidebar-heading {
    color: #475569 !important;
}