/* Admin Specific Dark Mode Global Overrides */

[data-theme="dark"] {
    color-scheme: dark;
}

[data-theme="dark"] body {
    background-color: var(--background) !important;
    color: var(--text-color) !important;
}

/* Layout Containers */
[data-theme="dark"] .workspace,
[data-theme="dark"] .workspace-center,
[data-theme="dark"] .content,
[data-theme="dark"] .main,
[data-theme="dark"] #tabulasi_konten {
    background-color: var(--background) !important;
}

[data-theme="dark"] .workspace-left,
[data-theme="dark"] .workspace-right {
    background-color: var(--background) !important;
    color: var(--background) !important; /* Hide filler dots */
}

[data-theme="dark"] .icon-count {
    border: 1px solid #404040 !important;
    border-right: 1px solid #00733B !important;
}

/* Navbar & Topbar */
[data-theme="dark"] .navbar {
    background-color: var(--primary-color) !important;
}

[data-theme="dark"] .topbar-content {
    background-color: var(--td-bg) !important;
    color: var(--text-color) !important;
}

/* Icons Scoped to Dark Mode */
[data-theme="dark"] img[src*="menu-bar-black.png"],
[data-theme="dark"] img[src*="arrow-left.png"],
[data-theme="dark"] img[src*="up-arrow.png"],
[data-theme="dark"] img[src*="down-arrow.png"],
[data-theme="dark"] img[src*="up-down.png"],
[data-theme="dark"] img[src*="view-eye.png"],
[data-theme="dark"] img[src*="info-1.png"],
[data-theme="dark"] img[src*="love-dark.png"],
[data-theme="dark"] img[src*="img-pelanggaran-dark.png"],
[data-theme="dark"] img[src*="dark.png"],
[data-theme="dark"] .icon-back img,
[data-theme="dark"] .btn-back img {
    filter: brightness(0) invert(1) !important;
}

[data-theme="dark"] .border-arrow {
    border-color: #fff !important;
}

/* Specific exclusion for view-eye-dark.png to ensure it is NOT turned white */
[data-theme="dark"] img[src*="view-eye-dark.png"] {
    filter: none !important;
}

[data-theme="dark"] .keterangan-item .range-box,
[data-theme="dark"] .keterangan-item .keterangan-text {
    color: #fff !important;
}

[data-theme="dark"] .card-body .view-form .box-form-input {
    background-color: #404040 !important;
    color: var(--text-color) !important;
}

/* Cards & Boxes */
[data-theme="dark"] .card,
[data-theme="dark"] .box-form-input,
[data-theme="dark"] .profil-show .card,
[data-theme="dark"] .gear-show .card,
[data-theme="dark"] .modal-content,
[data-theme="dark"] .card-body {
    background-color: #282828 !important;
    color: var(--text-color) !important;
}

[data-theme="dark"] .card-header,
[data-theme="dark"] .modal-header {
    background-color: #333333 !important;
    border-bottom: 1px solid #444444 !important;
    color: var(--text-color) !important;
}

/* Universal Override for Inline White Backgrounds */
[data-theme="dark"] div[style*="background-color: white"] i,
[data-theme="dark"] div[style*="background-color: #ffffff"] i,
[data-theme="dark"] div[style*="background-color:white"] i,
[data-theme="dark"] div[style*="background-color:#ffffff"] i,
[data-theme="dark"] div[style*="background: white"] i,
[data-theme="dark"] div[style*="background: #ffffff"] i,
[data-theme="dark"] div[style*="background:white"] i,
[data-theme="dark"] div[style*="background:#ffffff"] i {
    background-color: #282828 !important;
    color: var(--text-color) !important;
}

/* Fix for specific inline styles with semicolon or without spaces */
[data-theme="dark"] div[style*="background-color: white"],
[data-theme="dark"] div[style*="background-color:white"],
[data-theme="dark"] div[style*="background: white"],
[data-theme="dark"] div[style*="background:white"],
[data-theme="dark"] div[style*="background-color: #fff"],
[data-theme="dark"] div[style*="background-color:#fff"],
[data-theme="dark"] div[style*="background: #fff"],
[data-theme="dark"] div[style*="background:#fff"],
[data-theme="dark"] div[style*="background-color: #ffffff"],
[data-theme="dark"] div[style*="background-color:#ffffff"],
[data-theme="dark"] div[style*="background: #ffffff"],
[data-theme="dark"] div[style*="background:#ffffff"],
[data-theme="dark"] div[style*="background: #fff !important"] {
    background-color: #282828 !important;
    color: var(--text-color) !important;
}

[data-theme="dark"] select[style*="background-color: white"],
[data-theme="dark"] select[style*="background-color: #ffffff"],
[data-theme="dark"] .card-header[style*="background-color: #ffffff !important"],
[data-theme="dark"] .card-header[style*="background-color:#ffffff !important"],
[data-theme="dark"] .card-header[style*="background-color: white !important"],
[data-theme="dark"] .card-header[style*="background-color:white !important"],
[data-theme="dark"] .card-header[style*="background-color: #ffffff"],
[data-theme="dark"] .card-header[style*="background-color:#ffffff"] {
    background-color: var(--card-header) !important;
    color: var(--text-color) !important;
}

[data-theme="dark"] .list-group-item {
    background-color: #333333 !important;
    color: var(--text-color) !important;
    border-color: var(--border) !important;
}

[data-theme="dark"] .list-group-item.bg-light {
    background-color: #404040 !important;
}

/* Modal Internal Backgrounds */
[data-theme="dark"] .modal-body .bg-light,
[data-theme="dark"] .modal-body .bg-white {
    background-color: #333333 !important;
    color: var(--text-color) !important;
}

[data-theme="dark"] .modal-body input.bg-white {
    background-color: var(--input-bg) !important;
    color: var(--input-text) !important;
}

[data-theme="dark"] .modal-body textarea.bg-white {
    background-color: var(--input-bg) !important;
    color: var(--input-text) !important;
}

/* Tables */
[data-theme="dark"] .table thead th {
    background-color: var(--table-bg) !important;
    color: var(--text-color) !important;
    border-color: var(--table-bottom) !important;
}

[data-theme="dark"] .table td {
    background-color: var(--td-bg) !important;
    color: var(--text-color) !important;
    border: 1px solid var(--border) !important;
}

[data-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) > * {
    background-color: var(--td-bg-odd) !important;
    color: var(--text-color) !important;
}

[data-theme="dark"] .table-striped > tbody > tr:nth-of-type(even) > * {
    background-color: var(--td-bg-even) !important;
    color: var(--text-color) !important;
}

/* Reverse stripes specifically for Punishment Detail */
[data-theme="dark"] #pelanggaran_detail .table-striped > tbody > tr:nth-of-type(odd) > td,
[data-theme="dark"] #pelanggaran_detail .table-striped > tbody > tr:nth-of-type(odd) > th,
[data-theme="dark"] #pelanggaran_detail .table-style tbody tr:nth-of-type(odd) td {
    background-color: #282828 !important;
}

[data-theme="dark"] #pelanggaran_detail .table-striped > tbody > tr:nth-of-type(even) > td,
[data-theme="dark"] #pelanggaran_detail .table-striped > tbody > tr:nth-of-type(even) > th,
[data-theme="dark"] #pelanggaran_detail .table-style tbody tr:nth-of-type(even) td {
    background-color: #404040 !important;
}

/* Forms */
[data-theme="dark"] .form-control,
[data-theme="dark"] .form-select {
    background-color: var(--input-bg) !important;
    color: var(--input-text) !important;
    border: 1px solid var(--border) !important;
}

[data-theme="dark"] .form-select {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e") !important;
}

/* Sidebar Gear / Profile */
[data-theme="dark"] .side-gear a,
[data-theme="dark"] .profile-child p,
[data-theme="dark"] .profile-child span {
    color: var(--text-color) !important;
}

[data-theme="dark"] .side-gear a {
    border-bottom-color: var(--border) !important;
}


[data-theme="dark"] .footer-fixed {
    background-color: var(--footer-color) !important;
    border-top: 1px solid var(--footer-border) !important;
    color: var(--text-color) !important;
}

[data-theme="dark"] .footer-fixed p,
[data-theme="dark"] .footer-fixed a {
    color: var(--text-color) !important;
}

[data-theme="dark"] .footer-import {
    background-color: #404040;
    color: #fff ;
    border-radius: 0;
    justify-content: start;
    padding: 3px 5px;
    font-size: 8.5px;
}

/* Modals */
[data-theme="dark"] .modal-footer {
    background-color: #333333 !important;
    border-top: 1px solid #444444 !important;
}

[data-theme="dark"] .modal-title {
    color: var(--text-color) !important;
}

[data-theme="dark"] .btn-close, [data-theme="dark"] .close-button {
    filter: invert(1) grayscale(100%) brightness(200%) !important;
}

/* CKEditor Dark Mode Support */
[data-theme="dark"] .ck.ck-editor__main>.ck-editor__editable {
    background: var(--input-bg) !important;
    color: var(--input-text) !important;
}

[data-theme="dark"] .ck.ck-toolbar {
    background: var(--topbar-color) !important;
    border: 1px solid var(--border) !important;
}

[data-theme="dark"] .ck.ck-toolbar__items {
    background: var(--topbar-color) !important;
}

[data-theme="dark"] .ck.ck-button {
    color: var(--text-color) !important;
}

[data-theme="dark"] .ck.ck-button:not(.ck-disabled):hover,
[data-theme="dark"] .ck.ck-button.ck-on {
    background: var(--nav-hover) !important;
}

[data-theme="dark"] .ck.ck-list {
    background: var(--card-body) !important;
}
