/* ============================================================
       DARK MODE VARIABLES
       ============================================================ */
    [data-theme="dark"] {
        --dm-bg:          #0f172a;
        --dm-surface:     #1e293b;
        --dm-surface-2:   #273449;
        --dm-elevated:    #334155;
        --dm-border:      #334155;
        --dm-border-2:    #475569;
        --dm-text:        #f1f5f9;
        --dm-text-2:      #cbd5e1;
        --dm-muted:       #94a3b8;
        --dm-dim:         #94a3b8;

        /* Override variabel dari layout app.blade.php */
        --body-bg:    var(--dm-bg);
        --text-main:  var(--dm-text);
        --glass-border: 1px solid rgba(255, 255, 255, 0.06);

        /* CoreUI built-in (kalau dipake) */
        --cui-body-bg:    var(--dm-bg);
        --cui-body-color: var(--dm-text);
        --cui-border-color: var(--dm-border);

        /* Bootstrap 5 vars (untuk komponen yang baca via var) */
        --bs-body-bg:    var(--dm-bg);
        --bs-body-color: var(--dm-text);
        --bs-border-color: var(--dm-border);
        --bs-secondary-color: var(--dm-muted);
        --bs-tertiary-bg: var(--dm-surface-2);

        color-scheme: dark;
    }

    /* ============================================================
       BODY & SCROLLBAR
       ============================================================ */
    [data-theme="dark"] body {
        background-color: var(--dm-bg) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] ::-webkit-scrollbar-thumb {
        background: var(--dm-elevated) !important;
    }
    [data-theme="dark"] ::-webkit-scrollbar-track {
        background: var(--dm-bg);
    }

    /* ============================================================
       LINK & TEXT UTILITIES
       ============================================================ */
    [data-theme="dark"] a:not(.btn):not(.nav-link):not(.dropdown-item):not(.flyout-item):not(.list-group-item) {
        color: #fbbf24;
    }
    [data-theme="dark"] a:not(.btn):not(.nav-link):not(.dropdown-item):not(.flyout-item):not(.list-group-item):hover {
        color: #fcd34d;
    }
    [data-theme="dark"] .text-dark,
    [data-theme="dark"] .text-black,
    [data-theme="dark"] .text-body,
    [data-theme="dark"] .text-body-emphasis {
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .text-secondary {
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .text-muted,
    [data-theme="dark"] small.text-muted {
        color: var(--dm-muted) !important;
    }

    /* Header navigation in app */
    [data-theme="dark"] .header .text-dark,
    [data-theme="dark"] .header-toggler .text-dark,
    [data-theme="dark"] .header-nav .nav-link.text-dark {
        color: var(--dm-text) !important;
    }

    /* ============================================================
       BACKGROUND UTILITIES
       ============================================================ */
    [data-theme="dark"] .bg-white,
    [data-theme="dark"] .bg-body,
    [data-theme="dark"] .bg-body-tertiary {
        background-color: var(--dm-surface) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .bg-light {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text) !important;
    }

    /* Subtle bg-*-bg-opacity (Bootstrap 5.3 utility) — keep tint, dim base */
    [data-theme="dark"] .bg-primary.bg-opacity-10 { background-color: rgba(245, 158, 11, 0.15) !important; }
    [data-theme="dark"] .bg-warning.bg-opacity-10 { background-color: rgba(251, 191, 36, 0.15) !important; }
    [data-theme="dark"] .bg-danger.bg-opacity-10  { background-color: rgba(239, 68, 68, 0.18) !important; }
    [data-theme="dark"] .bg-success.bg-opacity-10 { background-color: rgba(34, 197, 94, 0.18) !important; }
    [data-theme="dark"] .bg-info.bg-opacity-10    { background-color: rgba(56, 189, 248, 0.18) !important; }

    /* Borders */
    [data-theme="dark"] .border,
    [data-theme="dark"] .border-top,
    [data-theme="dark"] .border-bottom,
    [data-theme="dark"] .border-start,
    [data-theme="dark"] .border-end,
    [data-theme="dark"] .border-light {
        border-color: var(--dm-border) !important;
    }

    /* ============================================================
       HEADER (sticky top bar)
       ============================================================ */
    [data-theme="dark"] .header {
        background: rgba(15, 23, 42, 0.85) !important;
        border-bottom: 1px solid var(--dm-border) !important;
    }

    /* ============================================================
       CARDS & WIDGETS
       ============================================================ */
    [data-theme="dark"] .card,
    [data-theme="dark"] .stat-card,
    [data-theme="dark"] .dashboard-widget,
    [data-theme="dark"] .sv-card,
    [data-theme="dark"] .login-card {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4) !important;
    }
    [data-theme="dark"] .card-header,
    [data-theme="dark"] .widget-header,
    [data-theme="dark"] .sv-card-header {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .card-body,
    [data-theme="dark"] .widget-body {
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .card-footer {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .card:hover {
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5) !important;
    }

    /* ============================================================
       TABLES
       ============================================================ */
    [data-theme="dark"] .table,
    [data-theme="dark"] table.dataTable,
    [data-theme="dark"] .table-modern {
        --bs-table-bg: transparent;
        --bs-table-color: var(--dm-text);
        --bs-table-striped-bg: var(--dm-surface-2);
        --bs-table-striped-color: var(--dm-text);
        --bs-table-hover-bg: var(--dm-elevated);
        --bs-table-hover-color: var(--dm-text);
        --bs-table-border-color: var(--dm-border);
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .table > :not(caption) > * > *,
    [data-theme="dark"] table.dataTable > tbody > tr > td,
    [data-theme="dark"] table.dataTable > tbody > tr > th {
        background-color: transparent !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .table thead th,
    [data-theme="dark"] table.dataTable thead th,
    [data-theme="dark"] .table-modern thead th {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text-2) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .table-modern tbody td {
        color: var(--dm-text) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) > * {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .table-hover > tbody > tr:hover > * {
        background-color: var(--dm-elevated) !important;
        color: var(--dm-text) !important;
    }

    /* DataTables wrapper */
    [data-theme="dark"] .dataTables_wrapper,
    [data-theme="dark"] .dataTables_wrapper .dataTables_length,
    [data-theme="dark"] .dataTables_wrapper .dataTables_filter,
    [data-theme="dark"] .dataTables_wrapper .dataTables_info,
    [data-theme="dark"] .dataTables_wrapper .dataTables_processing,
    [data-theme="dark"] .dataTables_wrapper .dataTables_paginate {
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .dataTables_wrapper .dataTables_filter input,
    [data-theme="dark"] .dataTables_wrapper .dataTables_length select {
        background-color: var(--dm-elevated) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border-2) !important;
    }
    [data-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button {
        color: var(--dm-text-2) !important;
        background: transparent !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.current,
    [data-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
        color: #0f172a !important;
        background: #fbbf24 !important;
        border-color: #fbbf24 !important;
    }

    /* ============================================================
       FORMS
       ============================================================ */
    [data-theme="dark"] .form-control,
    [data-theme="dark"] .form-select,
    [data-theme="dark"] textarea.form-control,
    [data-theme="dark"] input.form-control {
        background-color: var(--dm-elevated) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border-2) !important;
    }
    [data-theme="dark"] .form-control::placeholder,
    [data-theme="dark"] .form-select::placeholder,
    [data-theme="dark"] textarea::placeholder,
    [data-theme="dark"] input::placeholder {
        color: var(--dm-muted) !important;
        opacity: 1;
    }
    [data-theme="dark"] .form-control:focus,
    [data-theme="dark"] .form-select:focus {
        background-color: var(--dm-elevated) !important;
        color: var(--dm-text) !important;
        border-color: var(--primary, #f59e0b) !important;
        box-shadow: 0 0 0 0.2rem rgba(245, 158, 11, 0.20) !important;
    }
    [data-theme="dark"] .form-control:disabled,
    [data-theme="dark"] .form-control[readonly] {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-muted) !important;
    }
    [data-theme="dark"] .form-label {
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .form-text {
        color: var(--dm-muted) !important;
    }
    [data-theme="dark"] .input-group-text {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border-2) !important;
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .input-group-text.bg-light {
        background-color: var(--dm-surface-2) !important;
    }
    [data-theme="dark"] .form-check-input {
        background-color: var(--dm-elevated);
        border-color: var(--dm-border-2);
    }
    [data-theme="dark"] .form-check-input:checked {
        background-color: var(--primary, #f59e0b);
        border-color: var(--primary, #f59e0b);
    }
    [data-theme="dark"] .form-check-label {
        color: var(--dm-text-2);
    }
    /* Make calendar/clock picker icons readable */
    [data-theme="dark"] input[type="date"]::-webkit-calendar-picker-indicator,
    [data-theme="dark"] input[type="time"]::-webkit-calendar-picker-indicator,
    [data-theme="dark"] input[type="datetime-local"]::-webkit-calendar-picker-indicator,
    [data-theme="dark"] input[type="month"]::-webkit-calendar-picker-indicator {
        filter: invert(0.85);
        cursor: pointer;
    }

    /* Select2 (kalau dipakai di beberapa modul) */
    [data-theme="dark"] .select2-container--default .select2-selection--single,
    [data-theme="dark"] .select2-container--default .select2-selection--multiple {
        background-color: var(--dm-elevated) !important;
        border-color: var(--dm-border-2) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .select2-container--default .select2-selection__rendered,
    [data-theme="dark"] .select2-container--default .select2-selection__placeholder {
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .select2-dropdown {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border-2) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .select2-results__option {
        color: var(--dm-text);
    }
    [data-theme="dark"] .select2-results__option--highlighted {
        background-color: var(--primary, #f59e0b) !important;
        color: #0f172a !important;
    }
    [data-theme="dark"] .select2-search__field {
        background-color: var(--dm-elevated) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border-2) !important;
    }

    /* vue-select */
    [data-theme="dark"] .v-select .vs__dropdown-toggle {
        background-color: var(--dm-elevated) !important;
        border-color: var(--dm-border-2) !important;
    }
    [data-theme="dark"] .v-select .vs__selected,
    [data-theme="dark"] .v-select .vs__search,
    [data-theme="dark"] .v-select .vs__open-indicator {
        color: var(--dm-text) !important;
        fill: var(--dm-text) !important;
    }
    [data-theme="dark"] .v-select .vs__dropdown-menu {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border-2) !important;
    }
    [data-theme="dark"] .v-select .vs__dropdown-option--highlight {
        background-color: var(--primary, #f59e0b) !important;
        color: #0f172a !important;
    }

    /* ============================================================
       BUTTONS
       ============================================================ */
    [data-theme="dark"] .btn-light {
        background-color: var(--dm-elevated) !important;
        border-color: var(--dm-border-2) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .btn-light:hover {
        background-color: var(--dm-border-2) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .btn-outline-secondary {
        color: var(--dm-text-2) !important;
        border-color: var(--dm-border-2) !important;
    }
    [data-theme="dark"] .btn-outline-secondary:hover {
        background-color: var(--dm-elevated) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .btn-secondary {
        background-color: var(--dm-elevated) !important;
        border-color: var(--dm-border-2) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .btn-close {
        filter: invert(1) grayscale(100%) brightness(200%);
    }

    /* Badge bg-light text-dark — tetap readable */
    [data-theme="dark"] .badge.bg-light {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .badge.bg-light.text-dark {
        color: var(--dm-text) !important;
    }

    /* ============================================================
       MODALS / DROPDOWNS / OFFCANVAS / TOAST / POPOVER / TOOLTIP
       ============================================================ */
    /* Modal ikut tema ambient (2026-08-23): latar modal memakai
       --amb-base bila tenant mengaktifkan Gradasi Latar. Header modal
       diatur gradient ambient oleh layouts/includes/ambient.blade.php
       (selector .modal-content .modal-header lebih spesifik). */
    [data-theme="dark"] .modal-content {
        background-color: var(--amb-base, var(--dm-surface)) !important;
        color: var(--dm-text) !important;
        border: 1px solid var(--dm-border) !important;
    }
    [data-theme="dark"] .modal-header,
    [data-theme="dark"] .modal-footer {
        background-color: var(--amb-base, var(--dm-surface-2)) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .modal-title {
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .modal-backdrop.show {
        opacity: 0.7;
    }
    [data-theme="dark"] #modal-hapus .modal-body {
        background-color: var(--dm-surface) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] #modal-hapus h4 {
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] #modal-hapus .btn-light {
        background-color: var(--dm-elevated) !important;
        color: var(--dm-text) !important;
    }

    [data-theme="dark"] .dropdown-menu {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
        box-shadow: 0 8px 30px rgba(0, 0, 0, 0.5) !important;
    }
    [data-theme="dark"] .dropdown-item {
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .dropdown-item:hover,
    [data-theme="dark"] .dropdown-item:focus {
        background-color: var(--dm-elevated) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .dropdown-item.active,
    [data-theme="dark"] .dropdown-item:active {
        background-color: var(--primary, #f59e0b) !important;
        color: #0f172a !important;
    }
    [data-theme="dark"] .dropdown-divider {
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .dropdown-header {
        color: var(--dm-muted) !important;
    }
    /* Notification dropdown bg-light items */
    [data-theme="dark"] .dropdown-menu .list-group-item.bg-light {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text) !important;
    }

    [data-theme="dark"] .offcanvas {
        background-color: var(--dm-surface) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .toast {
        background-color: var(--dm-surface) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .toast-header {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .tooltip-inner {
        background-color: var(--dm-elevated) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .popover {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .popover-header {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .popover-body {
        color: var(--dm-text-2) !important;
    }

    /* ============================================================
       LIST GROUPS / ACCORDION / NAV / BREADCRUMB / PAGINATION
       ============================================================ */
    [data-theme="dark"] .list-group-item {
        background-color: var(--dm-surface) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .list-group-item-action:hover,
    [data-theme="dark"] .list-group-item-action:focus {
        background-color: var(--dm-elevated) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .list-group-item.active {
        background-color: var(--primary, #f59e0b) !important;
        color: #0f172a !important;
        border-color: var(--primary, #f59e0b) !important;
    }
    [data-theme="dark"] .list-group-item.bg-light {
        background-color: var(--dm-surface-2) !important;
    }

    [data-theme="dark"] .accordion {
        --bs-accordion-bg: var(--dm-surface);
        --bs-accordion-color: var(--dm-text);
        --bs-accordion-border-color: var(--dm-border);
        --bs-accordion-active-bg: var(--dm-surface-2);
        --bs-accordion-active-color: var(--dm-text);
        --bs-accordion-btn-color: var(--dm-text);
        --bs-accordion-btn-bg: var(--dm-surface);
    }
    [data-theme="dark"] .accordion-button {
        background-color: var(--dm-surface) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .accordion-button:not(.collapsed) {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .accordion-item {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .accordion-button::after {
        filter: invert(0.85);
    }

    [data-theme="dark"] .nav-tabs {
        border-bottom-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .nav-tabs .nav-link {
        color: var(--dm-text-2) !important;
        background: transparent !important;
        border-color: transparent !important;
    }
    [data-theme="dark"] .nav-tabs .nav-link:hover {
        border-color: var(--dm-border) var(--dm-border) transparent !important;
        background-color: var(--dm-surface) !important;
    }
    [data-theme="dark"] .nav-tabs .nav-link.active {
        background-color: var(--dm-surface) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border) var(--dm-border) var(--dm-surface) !important;
    }
    [data-theme="dark"] .nav-pills .nav-link {
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .nav-pills .nav-link:hover {
        background-color: var(--dm-surface) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .nav-pills .nav-link.active {
        background-color: var(--primary, #f59e0b) !important;
        color: #0f172a !important;
    }

    [data-theme="dark"] .breadcrumb {
        background-color: transparent !important;
    }
    [data-theme="dark"] .breadcrumb-item,
    [data-theme="dark"] .breadcrumb-item a {
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .breadcrumb-item.active {
        color: var(--dm-muted) !important;
    }
    [data-theme="dark"] .breadcrumb-item + .breadcrumb-item::before {
        color: var(--dm-muted) !important;
    }

    [data-theme="dark"] .page-link {
        background-color: var(--dm-surface) !important;
        color: var(--dm-text-2) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .page-link:hover {
        background-color: var(--dm-elevated) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .page-item.active .page-link {
        background-color: var(--primary, #f59e0b) !important;
        border-color: var(--primary, #f59e0b) !important;
        color: #0f172a !important;
    }
    [data-theme="dark"] .page-item.disabled .page-link {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-muted) !important;
        border-color: var(--dm-border) !important;
    }

    /* ============================================================
       ALERTS — pertahankan tint warna, tapi pakai BG gelap
       ============================================================ */
    [data-theme="dark"] .alert {
        border-color: transparent !important;
    }
    [data-theme="dark"] .alert-primary,
    [data-theme="dark"] .alert-warning {
        background-color: rgba(245, 158, 11, 0.15) !important;
        color: #fcd34d !important;
        border-color: rgba(245, 158, 11, 0.30) !important;
    }
    [data-theme="dark"] .alert-success {
        background-color: rgba(34, 197, 94, 0.15) !important;
        color: #86efac !important;
        border-color: rgba(34, 197, 94, 0.30) !important;
    }
    [data-theme="dark"] .alert-danger {
        background-color: rgba(239, 68, 68, 0.15) !important;
        color: #fca5a5 !important;
        border-color: rgba(239, 68, 68, 0.30) !important;
    }
    [data-theme="dark"] .alert-info {
        background-color: rgba(56, 189, 248, 0.15) !important;
        color: #7dd3fc !important;
        border-color: rgba(56, 189, 248, 0.30) !important;
    }
    [data-theme="dark"] .alert-secondary,
    [data-theme="dark"] .alert-light {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text-2) !important;
        border-color: var(--dm-border-2) !important;
    }
    /* Code chip di dalam alert (mis. rumus harga) → kontras lembut */
    [data-theme="dark"] .alert code {
        background-color: rgba(148, 163, 184, 0.18) !important;
        color: #fcd34d !important;
    }

    /* ============================================================
       PRELOADER (app layout) — gelap saat dark mode
       ============================================================ */
    [data-theme="dark"] #preloader {
        background: var(--dm-bg) !important;
    }
    [data-theme="dark"] #preloader .loading-bar-container {
        background: var(--dm-elevated);
    }
    [data-theme="dark"] #preloader .loader-text {
        color: var(--dm-muted);
    }

    /* ============================================================
       SIDEBAR FLYOUT (popup hover)
       ============================================================ */
    [data-theme="dark"] .sidebar-flyout {
        background: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        box-shadow: 0 8px 30px rgba(0,0,0,0.6), 0 2px 8px rgba(0,0,0,0.4) !important;
    }
    [data-theme="dark"] .sidebar-flyout .flyout-header {
        color: var(--dm-muted) !important;
        border-bottom-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .sidebar-flyout .flyout-item {
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .sidebar-flyout .flyout-item:hover {
        background: var(--dm-elevated) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .sidebar-flyout.sidebar-tooltip {
        color: var(--dm-text) !important;
    }

    /* ============================================================
       SIDEBAR NAV (utama / inline di navigation.blade.php)
       --------------------------------------------------
       Default light: text hitam (#1a1a1a) di bg sidebar gelap → invisible.
       Hover: bg #f3f4f6 putih + text hitam → flash silau.
       Override semua agar konsisten dengan dark surface.
       ============================================================ */
    [data-theme="dark"] .sidebar-nav .nav-link,
    [data-theme="dark"] .sidebar-nav .nav-group-toggle,
    [data-theme="dark"] .sidebar-nav .nav-title {
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .sidebar-nav .nav-icon {
        color: var(--dm-muted) !important;
    }
    /* Hover row — gelap subtle, bukan putih */
    [data-theme="dark"] .sidebar-nav .nav-link:hover,
    [data-theme="dark"] .sidebar-nav .nav-group-toggle:hover {
        background-color: rgba(245, 158, 11, 0.08) !important;
        color: var(--dm-text) !important;
        box-shadow: none !important;
        transform: none !important;
    }
    [data-theme="dark"] .sidebar-nav .nav-link:hover .nav-icon,
    [data-theme="dark"] .sidebar-nav .nav-group-toggle:hover .nav-icon {
        color: var(--primary, #f59e0b) !important;
    }
    /* Active state — pertahankan accent emas, text hitam (kontras tinggi di emas).
       Hilangkan glow box-shadow yang kelihatan silau di bg gelap. */
    [data-theme="dark"] .sidebar-nav .nav-link.active {
        background: var(--primary, #f59e0b) !important;
        color: #0f172a !important;
        box-shadow: 0 2px 6px rgba(0,0,0,0.35) !important;
        transform: none !important;
    }
    [data-theme="dark"] .sidebar-nav .nav-link.active:hover {
        background: var(--primary, #f59e0b) !important;
        color: #0f172a !important;
        box-shadow: 0 2px 6px rgba(0,0,0,0.35) !important;
        transform: none !important;
    }
    [data-theme="dark"] .sidebar-nav .nav-link.active .nav-icon {
        color: #0f172a !important;
    }
    /* Arrow chevron group toggle — di-light-kan supaya kelihatan */
    [data-theme="dark"] .sidebar-nav .nav-group-toggle::after {
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23cbd5e1'%3E%3Cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E") !important;
        opacity: 0.85 !important;
    }
    /* Bullet untuk submenu */
    [data-theme="dark"] .sidebar-nav .nav-icon-bullet {
        background-color: var(--dm-muted) !important;
    }
    [data-theme="dark"] .sidebar-nav .nav-link.active .nav-icon-bullet {
        background-color: #0f172a !important;
    }
    /* Sub-group container background di sidebar */
    [data-theme="dark"] .sidebar-nav .nav-group.show > .nav-group-items,
    [data-theme="dark"] .sidebar-nav .nav-group-items {
        background-color: rgba(0,0,0,0.20) !important;
    }

    /* ============================================================
       SIDEBAR ROOT BACKGROUND — paksa gradient gelap.
         Inline gradient di app.blade.php pakai @{{ $uiSidebarBg }} dari DB tenant.
       Kalau tenant set warna terang, dark mode jadi kontras silau.
       Override sini supaya konsisten dengan tema dark, tanpa edit DB.
       ============================================================ */
    [data-theme="dark"] .sidebar,
    [data-theme="dark"] .sidebar.sidebar-dark,
    [data-theme="dark"] .sidebar.sidebar-fixed,
    [data-theme="dark"] .sidebar.sidebar-narrow-unfoldable,
    [data-theme="dark"] .sidebar.sidebar-narrow-unfoldable:hover,
    [data-theme="dark"] aside.sidebar,
    [data-theme="dark"] #sidebar {
        --cui-sidebar-bg: #0f172a !important;
        --cui-sidebar-color: var(--dm-text-2) !important;
        background: #0f172a !important;
        background-color: #0f172a !important;
        background-image: none !important;
        border-right: 1px solid rgba(255,255,255,0.04) !important;
        box-shadow: 4px 0 24px rgba(0,0,0,0.55) !important;
    }
    /* Pastikan area di dalam sidebar (selain brand emas) tidak punya bg sendiri */
    [data-theme="dark"] .sidebar > *:not(.sidebar-brand-gold):not(.sidebar-brand) {
        background-color: transparent !important;
    }
    [data-theme="dark"] .sidebar .sidebar-nav,
    [data-theme="dark"] .sidebar [data-simplebar],
    [data-theme="dark"] .sidebar .simplebar-content,
    [data-theme="dark"] .sidebar .simplebar-mask,
    [data-theme="dark"] .sidebar .simplebar-content-wrapper {
        background: transparent !important;
        background-color: transparent !important;
    }
    /* Pastikan area subtitle / nav-title text terbaca */
    [data-theme="dark"] .sidebar .nav-title {
        color: var(--dm-muted) !important;
        letter-spacing: 0.06em;
    }
    /* Sidebar header (brand) tetap emas — tapi border bawah selaras dark */
    [data-theme="dark"] .sidebar-brand-gold {
        border-bottom-color: rgba(0,0,0,0.4) !important;
    }
    /* Header utama (top bar) ikut dark biar konsisten saat sidebar sudah dark */
    [data-theme="dark"] .header,
    [data-theme="dark"] .header.header-sticky {
        background-color: var(--dm-surface) !important;
        border-bottom-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .header .header-nav .nav-link,
    [data-theme="dark"] .header .header-toggler {
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .header .header-toggler:hover {
        color: var(--primary, #f59e0b) !important;
    }
    /* Breadcrumb di header */
    [data-theme="dark"] .header .breadcrumb,
    [data-theme="dark"] .header .breadcrumb-item,
    [data-theme="dark"] .header .breadcrumb-item a {
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .header .breadcrumb-item.active {
        color: var(--dm-text) !important;
    }
    /* Footer-glass di bottom sidebar (yang dibikin di app.blade.php) */
    [data-theme="dark"] .sidebar .footer-glass,
    [data-theme="dark"] .sidebar .sidebar-footer {
        background: rgba(255,255,255,0.04) !important;
        border-top-color: var(--dm-border) !important;
        color: var(--dm-text-2) !important;
    }

    /* ============================================================
       DASHBOARD WIDGETS — Jadwal Sholat (.pw-*), Cuaca, Stat-card
       ============================================================ */
    [data-theme="dark"] .pw-card {
        background: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        box-shadow: 0 4px 6px -1px rgba(0,0,0,0.4) !important;
    }
    [data-theme="dark"] .pw-card-header {
        border-bottom-color: var(--dm-border) !important;
    }
    /* Title teks dalam header pw-card pakai .text-dark inline → covered, plus eksplisit */
    [data-theme="dark"] .pw-card-header .fw-bold,
    [data-theme="dark"] .pw-card-header .text-dark {
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .pw-hijri {
        color: var(--dm-muted) !important;
    }
    /* Next-prayer card pakai gradient hijau gelap, sudah bagus → biarkan */
    /* Time-grid item: bg light → ganti elevated */
    [data-theme="dark"] .pw-time-item {
        background: var(--dm-surface-2) !important;
        border-color: transparent !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .pw-time-item:hover {
        background: var(--dm-elevated) !important;
    }
    [data-theme="dark"] .pw-time-item.pw-active {
        background: linear-gradient(135deg, rgba(16,185,129,0.20), rgba(16,185,129,0.10)) !important;
        border-color: rgba(16,185,129,0.45) !important;
    }
    [data-theme="dark"] .pw-time-label { color: var(--dm-muted) !important; }
    [data-theme="dark"] .pw-time-value { color: var(--dm-text) !important; }
    /* Weather */
    [data-theme="dark"] .pw-weather-temp { color: var(--dm-text) !important; }
    [data-theme="dark"] .pw-weather-condition { color: var(--dm-text-2) !important; }
    [data-theme="dark"] .pw-weather-details {
        border-top-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .pw-weather-detail { color: var(--dm-text-2) !important; }
    [data-theme="dark"] .pw-weather-detail span { color: var(--dm-text) !important; }
    /* Tone-down weather icon backgrounds (pastel jadi terlalu pucat di dark) */
    [data-theme="dark"] .pw-weather-icon {
        background: var(--dm-surface-2) !important;
        color: #60a5fa !important; /* blue-400 */
    }
    [data-theme="dark"] .pw-weather-icon.pw-sunny {
        background: rgba(245,158,11,0.18) !important;
        color: #fbbf24 !important;
    }
    [data-theme="dark"] .pw-weather-icon.pw-rainy {
        background: rgba(59,130,246,0.18) !important;
        color: #60a5fa !important;
    }
    [data-theme="dark"] .pw-weather-icon.pw-cloudy {
        background: var(--dm-elevated) !important;
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .pw-weather-icon.pw-storm {
        background: rgba(124,58,237,0.18) !important;
        color: #a78bfa !important;
    }
    /* === KARTU GABUNGAN Sholat|Cuaca|Perlu Tindakan (Opsi B, 2026-09-06) === */
    [data-theme="dark"] .merged-widget {
        background: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        box-shadow: 0 4px 6px -1px rgba(0,0,0,0.4) !important;
    }
    [data-theme="dark"] .merged-widget>section+section { border-left-color: var(--dm-border) !important; }
    @media(max-width:1200px){[data-theme="dark"] .merged-widget>.mw-tindakan{border-top-color:var(--dm-border) !important}}
    @media(max-width:760px){[data-theme="dark"] .merged-widget>.mw-cuaca{border-top-color:var(--dm-border) !important}}
    [data-theme="dark"] .mw-ov { color: var(--dm-muted) !important; }
    [data-theme="dark"] .mw-next-name,
    [data-theme="dark"] .mw-next-time { color: var(--dm-text) !important; }
    [data-theme="dark"] .mw-next-time { color: #34d399 !important; }
    [data-theme="dark"] .mw-next-sub,
    [data-theme="dark"] .mw-hijri { color: var(--dm-muted) !important; }
    [data-theme="dark"] .mw-temp { color: var(--dm-text) !important; }
    [data-theme="dark"] .mw-cond,
    [data-theme="dark"] .mw-update { color: var(--dm-muted) !important; }
    [data-theme="dark"] .mw-cu-sub { color: var(--dm-muted) !important; }
    [data-theme="dark"] .mw-cu-sub b { color: var(--dm-text) !important; }


    /* Dashboard "Order Baru" .btn-dark biar tetap kontras (tetap gelap = sama dengan bg → kasih border) */
    [data-theme="dark"] .btn-dark {
        background-color: var(--dm-elevated) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border-2) !important;
    }
    [data-theme="dark"] .btn-dark:hover {
        background-color: var(--dm-border-2) !important;
    }
    /* Filter tahun pill berlatar bg-white */
    [data-theme="dark"] .rounded-pill.bg-white {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
    }

    /* Table modern (dashboard) — hover row was #fcfcfc (silau) */
    [data-theme="dark"] .table-modern tbody tr:hover td {
        background-color: var(--dm-elevated) !important;
    }
    [data-theme="dark"] .table-modern thead th {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text-2) !important;
        border-bottom-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .table-modern tbody td {
        border-bottom-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    /* Custom scrollbar di table-responsive */
    [data-theme="dark"] .table-responsive::-webkit-scrollbar-thumb {
        background: var(--dm-border-2) !important;
    }
    [data-theme="dark"] .table-responsive::-webkit-scrollbar-track {
        background: var(--dm-surface) !important;
    }

    /* ============================================================
       CATCH-ALL MODULE PATTERNS
       --------------------------------------------------
       Banyak modul punya scoped <style> dengan hardcoded warna
       (background:#fff; color:#1f2937; border:#e5e7eb;) pada
       class dengan prefix module-spesifik. Override semua dengan
       :where() supaya specificity-nya rendah dan gampang di-override.
       ============================================================ */

    /* ---- CARDS / WRAPPERS ---- */
    [data-theme="dark"] :where(
        .fl-card, .fl-card-header, .fl-content, .fl-form-body,
        .ord-card, .order-card, .order-card-header, .ord-card-header,
        .ku-card, .ku-card-header, .ku-content,
        .pk-card, .pk-card-header,
        .pm-card, .pm-card-header,
        .ak-card, .ak-card-header, .akun-card, .akundet-card,
        .mb-card, .mb-card-header, .mem-card, .mbr-card,
        .sdm-card, .sdm-card-header,
        .cu-card, .cu-card-header,
        .ht-card, .ht-card-header, .hut-card,
        .lp-card, .lap-card, .laporan-card, .laporan-section,
        .ms-card, .mp-card, .sk-card, .scrap-card, .sc-card,
        .ai-card, .ai-card-header,
        .stf-card, .stf-card-header,
        .summary-card, .stat-box, .info-card, .dashboard-card,
        .filter-bar, .toolbar
    ) {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }

    /* ---- HEADERS DENGAN BG PUTIH KHUSUS (umumnya gradient atau accent) ---- */
    [data-theme="dark"] :where(
        .fl-card-header, .ord-card-header, .order-card-header,
        .ku-card-header, .pk-card-header, .pm-card-header,
        .ak-card-header, .mb-card-header, .sdm-card-header,
        .cu-card-header, .ht-card-header, .ai-card-header
    ) {
        border-bottom-color: var(--dm-border) !important;
    }

    /* ---- FILTER BAR / TAB BAR ---- */
    [data-theme="dark"] :where(
        .fl-filter-bar, .ord-filter-bar, .ku-filter-bar,
        .pk-filter-bar, .pm-filter-bar, .ak-filter-bar,
        .mb-filter-bar, .sdm-filter-bar, .cu-filter-bar,
        .ht-filter-bar, .lp-filter-bar, .ms-filter-bar,
        .filter-section, .toolbar-section
    ) {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text-2) !important;
    }

    /* ---- TABS (link inactive grey, active accent) ---- */
    [data-theme="dark"] :where(
        .fl-tabs, .ord-tabs, .ku-tabs, .pk-tabs, .pm-tabs,
        .ak-tabs, .mb-tabs, .sdm-tabs, .cu-tabs
    ) {
        background-color: var(--dm-surface) !important;
        border-bottom-color: var(--dm-border) !important;
    }
    [data-theme="dark"] :where(
        .fl-tab-link, .ord-tab-link, .ku-tab-link,
        .pk-tab-link, .pm-tab-link, .ak-tab-link,
        .mb-tab-link, .sdm-tab-link, .cu-tab-link
    ) {
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] :where(
        .fl-tab-link.active, .ord-tab-link.active, .ku-tab-link.active,
        .pk-tab-link.active, .pm-tab-link.active, .ak-tab-link.active,
        .mb-tab-link.active, .sdm-tab-link.active, .cu-tab-link.active
    ) {
        color: var(--primary, #f59e0b) !important;
        border-bottom-color: var(--primary, #f59e0b) !important;
    }

    /* ---- TABLES ---- */
    [data-theme="dark"] :where(
        .fl-table, .fl-detail-table, .fl-pay-table,
        .ord-table, .order-table, .ku-table,
        .pk-table, .pm-table, .ak-table, .mb-table,
        .sdm-table, .cu-table, .ht-table, .lp-table, .lap-table,
        .ms-table, .ai-table, .data-table
    ),
    [data-theme="dark"] :where(
        .fl-table, .fl-detail-table, .fl-pay-table,
        .ord-table, .order-table, .ku-table,
        .pk-table, .pm-table, .ak-table, .mb-table,
        .sdm-table, .cu-table, .ht-table, .lp-table, .lap-table,
        .ms-table, .ai-table, .data-table
    ) tbody td,
    [data-theme="dark"] :where(
        .fl-table, .fl-detail-table, .fl-pay-table,
        .ord-table, .order-table, .ku-table,
        .pk-table, .pm-table, .ak-table, .mb-table,
        .sdm-table, .cu-table, .ht-table, .lp-table, .lap-table,
        .ms-table, .ai-table, .data-table
    ) thead th {
        background-color: transparent !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] :where(
        .fl-table, .ord-table, .order-table, .ku-table,
        .pk-table, .pm-table, .ak-table, .mb-table,
        .sdm-table, .cu-table, .ht-table, .lp-table, .lap-table,
        .ms-table, .ai-table, .data-table
    ) thead th {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] :where(
        .fl-table, .ord-table, .order-table, .ku-table,
        .pk-table, .pm-table, .ak-table, .mb-table,
        .sdm-table, .cu-table, .ht-table, .lp-table, .lap-table,
        .ms-table, .ai-table, .data-table
    ) tbody tr:hover td {
        background-color: var(--dm-elevated) !important;
    }

    /* ---- FORM CONTROLS scoped ---- */
    [data-theme="dark"] :where(
        .fl-form-control, .fl-form-input, .fl-form-select, .fl-form-textarea,
        .ord-form-control, .ord-form-input, .ord-form-select,
        .ku-form-control, .pk-form-control, .pm-form-control,
        .ak-form-control, .mb-form-control, .sdm-form-control,
        .cu-form-control, .ht-form-control, .lp-form-control,
        .ms-form-control
    ) {
        background-color: var(--dm-elevated) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border-2) !important;
    }
    [data-theme="dark"] :where(
        .fl-form-control, .fl-form-input, .fl-form-select, .fl-form-textarea,
        .ord-form-control, .ku-form-control, .pk-form-control,
        .pm-form-control, .ak-form-control, .mb-form-control,
        .sdm-form-control, .cu-form-control, .ht-form-control
    )::placeholder { color: var(--dm-muted) !important; }

    /* ---- LABEL / SECTION TITLES ---- */
    [data-theme="dark"] :where(
        .fl-form-label, .fl-section-title, .fl-section, .fl-stat-label, .fl-stat-value,
        .ord-form-label, .ord-section-title,
        .ku-form-label, .ku-section-title,
        .pk-form-label, .pm-form-label,
        .ak-form-label, .mb-form-label,
        .sdm-form-label, .cu-form-label, .ht-form-label,
        .lp-form-label, .ms-form-label,
        .form-section-title, .section-title
    ) {
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] :where(
        .fl-stat-value, .ord-stat-value, .ku-stat-value,
        .ak-stat-value, .mb-stat-value, .sdm-stat-value,
        .cu-stat-value, .ht-stat-value, .lp-stat-value
    ) {
        color: var(--dm-text) !important;
    }

    /* ---- BTN SECONDARY (back/cancel/outline) ---- */
    [data-theme="dark"] :where(
        .fl-btn-back, .fl-btn-cancel, .fl-btn-outline,
        .ord-btn-back, .ord-btn-cancel,
        .ku-btn-back, .ku-btn-cancel,
        .pk-btn-back, .pk-btn-cancel,
        .pm-btn-back, .pm-btn-cancel,
        .ak-btn-back, .ak-btn-cancel,
        .mb-btn-back, .mb-btn-cancel,
        .sdm-btn-back, .sdm-btn-cancel,
        .cu-btn-back, .cu-btn-cancel,
        .ht-btn-back, .ht-btn-cancel,
        .lp-btn-back, .lp-btn-cancel,
        .ms-btn-back, .ms-btn-cancel,
        .btn-secondary-soft, .btn-outline-soft
    ) {
        background-color: var(--dm-elevated) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border-2) !important;
    }
    [data-theme="dark"] :where(
        .fl-btn-back:hover, .fl-btn-cancel:hover, .fl-btn-outline:hover,
        .ord-btn-back:hover, .ord-btn-cancel:hover,
        .ku-btn-back:hover, .ku-btn-cancel:hover,
        .pk-btn-back:hover, .pk-btn-cancel:hover,
        .pm-btn-back:hover, .pm-btn-cancel:hover,
        .ak-btn-back:hover, .ak-btn-cancel:hover,
        .mb-btn-back:hover, .mb-btn-cancel:hover,
        .sdm-btn-back:hover, .sdm-btn-cancel:hover,
        .cu-btn-back:hover, .cu-btn-cancel:hover,
        .ht-btn-back:hover, .ht-btn-cancel:hover,
        .lp-btn-back:hover, .lp-btn-cancel:hover,
        .ms-btn-back:hover, .ms-btn-cancel:hover
    ) {
        background-color: var(--dm-border-2) !important;
    }

    /* ---- STAT BOX ---- */
    [data-theme="dark"] :where(
        .fl-stat, .ord-stat, .ku-stat, .pk-stat, .pm-stat,
        .ak-stat, .mb-stat, .sdm-stat, .cu-stat, .ht-stat,
        .lp-stat, .ms-stat
    ) {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }

    /* ---- DIVIDERS ---- */
    [data-theme="dark"] :where(
        .fl-divider, .ord-divider, .ku-divider,
        .pk-divider, .pm-divider, .ak-divider, .mb-divider,
        .sdm-divider, .cu-divider, .ht-divider, .lp-divider, .ms-divider
    ) {
        border-color: var(--dm-border) !important;
        background: var(--dm-border) !important;
    }

    /* ---- EMPTY STATE / MUTED TEXT ---- */
    [data-theme="dark"] :where(
        .fl-empty, .ord-empty, .ku-empty, .pk-empty, .pm-empty,
        .ak-empty, .mb-empty, .sdm-empty, .cu-empty, .ht-empty,
        .lp-empty, .ms-empty,
        .empty-state, .no-data
    ) {
        color: var(--dm-muted) !important;
    }

    /* ---- BADGES PALETTE TINTED ---- */
    [data-theme="dark"] :where(
        .fl-badge-green, .ord-badge-green, .ku-badge-green,
        .ak-badge-green, .mb-badge-green, .sdm-badge-green,
        .cu-badge-green, .ht-badge-green, .lp-badge-green
    ) { background: rgba(34,197,94,0.18) !important; color: #4ade80 !important; }
    [data-theme="dark"] :where(
        .fl-badge-red, .ord-badge-red, .ku-badge-red,
        .ak-badge-red, .mb-badge-red, .sdm-badge-red,
        .cu-badge-red, .ht-badge-red, .lp-badge-red
    ) { background: rgba(239,68,68,0.18) !important; color: #f87171 !important; }
    [data-theme="dark"] :where(
        .fl-badge-blue, .ord-badge-blue, .ku-badge-blue,
        .ak-badge-blue, .mb-badge-blue, .sdm-badge-blue,
        .cu-badge-blue, .ht-badge-blue, .lp-badge-blue
    ) { background: rgba(59,130,246,0.18) !important; color: #60a5fa !important; }
    [data-theme="dark"] :where(
        .fl-badge-amber, .ord-badge-amber, .ku-badge-amber,
        .ak-badge-amber, .mb-badge-amber, .sdm-badge-amber,
        .cu-badge-amber, .ht-badge-amber, .lp-badge-amber
    ) { background: rgba(245,158,11,0.18) !important; color: #fbbf24 !important; }
    [data-theme="dark"] :where(
        .fl-badge-purple, .ord-badge-purple, .ku-badge-purple,
        .ak-badge-purple, .mb-badge-purple, .sdm-badge-purple,
        .cu-badge-purple, .ht-badge-purple, .lp-badge-purple
    ) { background: rgba(124,58,237,0.18) !important; color: #c4b5fd !important; }
    [data-theme="dark"] :where(
        .fl-status-option, .ord-status-option, .ku-status-option,
        .ak-status-option, .mb-status-option, .sdm-status-option,
        .cu-status-option, .ht-status-option
    ) {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] :where(
        .fl-status-option:hover, .ord-status-option:hover,
        .ku-status-option:hover, .ak-status-option:hover,
        .mb-status-option:hover, .sdm-status-option:hover,
        .cu-status-option:hover, .ht-status-option:hover
    ) {
        background-color: var(--dm-elevated) !important;
        border-color: var(--primary, #f59e0b) !important;
    }
    [data-theme="dark"] :where(
        .fl-status-desc, .ord-status-desc, .ku-status-desc,
        .ak-status-desc, .mb-status-desc, .sdm-status-desc,
        .cu-status-desc, .ht-status-desc
    ) { color: var(--dm-muted) !important; }

    /* ---- AGGRESSIVE INLINE STYLE BACKGROUND OVERRIDES (perluasan) ---- */
    [data-theme="dark"] [style*="background: #fff"]:not(.btn-glow):not(.sidebar-brand-gold):not(.logo-glass-frame):not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background:#fff"]:not(.btn-glow):not(.sidebar-brand-gold):not(.logo-glass-frame):not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background-color: #fff"]:not(.btn-glow):not(.sidebar-brand-gold):not(.logo-glass-frame):not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background-color:#fff"]:not(.btn-glow):not(.sidebar-brand-gold):not(.logo-glass-frame):not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background: #ffffff"]:not(.btn-glow):not(.sidebar-brand-gold):not(.logo-glass-frame):not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background:#ffffff"]:not(.btn-glow):not(.sidebar-brand-gold):not(.logo-glass-frame):not(.invoice-print):not(.print-area) {
        background-color: var(--dm-surface) !important;
        color: var(--dm-text) !important;
    }

    /* ---- BORDER COLOR OVERRIDES untuk border-color light hardcode ---- */
    [data-theme="dark"] [style*="border: 1px solid #e5e7eb"],
    [data-theme="dark"] [style*="border:1px solid #e5e7eb"],
    [data-theme="dark"] [style*="border-color: #e5e7eb"],
    [data-theme="dark"] [style*="border-color:#e5e7eb"],
    [data-theme="dark"] [style*="border: 1px solid #e2e8f0"],
    [data-theme="dark"] [style*="border:1px solid #e2e8f0"],
    [data-theme="dark"] [style*="border-color: #e2e8f0"],
    [data-theme="dark"] [style*="border-color:#e2e8f0"],
    [data-theme="dark"] [style*="border: 1px solid #d1d5db"],
    [data-theme="dark"] [style*="border:1px solid #d1d5db"],
    [data-theme="dark"] [style*="border-color: #d1d5db"],
    [data-theme="dark"] [style*="border-color:#d1d5db"] {
        border-color: var(--dm-border) !important;
    }

    /* ---- TEXT COLOR HARDCODE GREY-700/900 EXTRA ---- */
    [data-theme="dark"] [style*="color: #111827"],
    [data-theme="dark"] [style*="color:#111827"],
    [data-theme="dark"] [style*="color: #6b7280"],
    [data-theme="dark"] [style*="color:#6b7280"] {
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] [style*="color: #9ca3af"],
    [data-theme="dark"] [style*="color:#9ca3af"],
    [data-theme="dark"] [style*="color: #475569"],
    [data-theme="dark"] [style*="color:#475569"],
    [data-theme="dark"] [style*="color: #64748b"],
    [data-theme="dark"] [style*="color:#64748b"] {
        color: var(--dm-muted) !important;
    }

    /* ============================================================
       UNIVERSAL FALLBACK
       Setiap class yang berakhiran -card / -table / -form-control
       dan masih kelihatan terang (karena scoped CSS hardcode bg).
       Kita pakai attribute selector — tetap aman karena specificity rendah,
       dan punya `!important` untuk paksa override scoped class.
       ============================================================ */
    [data-theme="dark"] [class$="-card"]:not(.stat-card):not(.dashboard-widget):not(.pw-card),
    [data-theme="dark"] [class*=" -card "],
    [data-theme="dark"] [class$="-card-header"],
    [data-theme="dark"] [class$="-card-body"],
    [data-theme="dark"] [class$="-content"][class^=""] {
        background-color: var(--dm-surface) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] [class$="-form-control"],
    [data-theme="dark"] [class$="-form-input"],
    [data-theme="dark"] [class$="-form-select"],
    [data-theme="dark"] [class$="-form-textarea"] {
        background-color: var(--dm-elevated) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border-2) !important;
    }
    [data-theme="dark"] [class$="-empty"],
    [data-theme="dark"] [class$="-muted"] {
        color: var(--dm-muted) !important;
    }

    /* ============================================================
       UNIVERSAL TABLE HOVER OVERRIDE
       --------------------------------------------------
       Banyak modul punya scoped:
         .xxx-table tbody tr:hover { background:#f8fafc; }   (silau putih)
         .xxx-table tbody tr:hover td { background:#fffbeb; } (silau krem)
       Override semua jadi dm-elevated subtle dark.
       ============================================================ */
    [data-theme="dark"] table tbody tr:hover,
    [data-theme="dark"] table tbody tr:hover > *,
    [data-theme="dark"] table tbody tr:hover td,
    [data-theme="dark"] table tbody tr:hover th,
    [data-theme="dark"] .table tbody tr:hover,
    [data-theme="dark"] .table tbody tr:hover > *,
    [data-theme="dark"] .table-hover tbody tr:hover,
    [data-theme="dark"] .table-hover tbody tr:hover > *,
    [data-theme="dark"] .ledger-table tbody tr:hover,
    [data-theme="dark"] .ledger-table tbody tr:hover td,
    [data-theme="dark"] .table-modern tbody tr:hover,
    [data-theme="dark"] .table-modern tbody tr:hover td,
    [data-theme="dark"] .table-custom tr:hover,
    [data-theme="dark"] .table-custom tr:hover td,
    [data-theme="dark"] .custom-table tr:hover,
    [data-theme="dark"] .custom-table tr:hover td,
    [data-theme="dark"] .tbl tbody tr:hover,
    [data-theme="dark"] .tbl tbody tr:hover td,
    [data-theme="dark"] .tbl-ranking tbody tr:hover,
    [data-theme="dark"] .tbl-ranking tbody tr:hover td,
    [data-theme="dark"] .pg-table tbody tr:hover,
    [data-theme="dark"] .pg-table tbody tr:hover td,
    [data-theme="dark"] .sdm-table tr:hover,
    [data-theme="dark"] .sdm-table tr:hover td,
    [data-theme="dark"] .slip-table tbody tr:hover,
    [data-theme="dark"] .slip-table tbody tr:hover td,
    [data-theme="dark"] .fl-table tbody tr:hover,
    [data-theme="dark"] .fl-table tbody tr:hover td {
        background-color: var(--dm-elevated) !important;
        color: var(--dm-text) !important;
    }

    /* Override .table-modern stripe & border pakai surface-2 */
    [data-theme="dark"] table thead th,
    [data-theme="dark"] .table thead th,
    [data-theme="dark"] .ledger-table thead th,
    [data-theme="dark"] .table-modern thead th,
    [data-theme="dark"] .tbl thead th,
    [data-theme="dark"] .custom-table thead th,
    [data-theme="dark"] .fl-table thead th,
    [data-theme="dark"] .sdm-table th,
    [data-theme="dark"] .slip-table th,
    [data-theme="dark"] .pg-table thead th {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text-2) !important;
        border-bottom-color: var(--dm-border) !important;
    }
    [data-theme="dark"] table tbody td,
    [data-theme="dark"] .table tbody td,
    [data-theme="dark"] .ledger-table tbody td,
    [data-theme="dark"] .table-modern tbody td,
    [data-theme="dark"] .tbl tbody td {
        border-bottom-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }

    /* ============================================================
       INLINE-STYLE COLOR ATTRIBUTE OVERRIDES — perluasan
       Pattern hex yang sering muncul:
         #f8fafc, #f8f9fa, #f8f9fc, #f1f5f9, #e2e8f0, #f3f4f6,
         #fffbeb, #fff9db, #fefce8, #fff7ed, #fdf6e3, #f0f9ff,
         #e0f2fe, #fef3c7, #d1fae5, #fee2e2, #ddd6fe, #fce7f3,
         #fdfdfd, #fcfcfc, #f0f4f8
       ============================================================ */
    [data-theme="dark"] [style*="background: #f8fafc"]:not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background:#f8fafc"]:not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background-color: #f8fafc"]:not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background-color:#f8fafc"]:not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background: #f8f9fa"]:not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background:#f8f9fa"]:not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background-color: #f8f9fa"]:not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background-color:#f8f9fa"]:not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background: #f8f9fc"]:not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background:#f8f9fc"]:not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background-color: #f8f9fc"]:not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background-color:#f8f9fc"]:not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background: #f1f5f9"]:not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background:#f1f5f9"]:not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background-color: #f1f5f9"]:not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background-color:#f1f5f9"]:not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background: #f3f4f6"]:not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background:#f3f4f6"]:not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background-color: #f3f4f6"]:not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background-color:#f3f4f6"]:not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background: #fdfdfd"]:not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background:#fdfdfd"]:not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background: #fcfcfc"]:not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background:#fcfcfc"]:not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background: #f0f4f8"]:not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background:#f0f4f8"]:not(.invoice-print):not(.print-area) {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text) !important;
    }
    /* Krem/amber soft (highlight row) → dm-elevated dengan accent kecil */
    [data-theme="dark"] [style*="background: #fffbeb"],
    [data-theme="dark"] [style*="background:#fffbeb"],
    [data-theme="dark"] [style*="background-color: #fffbeb"],
    [data-theme="dark"] [style*="background-color:#fffbeb"],
    [data-theme="dark"] [style*="background: #fff9db"],
    [data-theme="dark"] [style*="background:#fff9db"],
    [data-theme="dark"] [style*="background: #fefce8"],
    [data-theme="dark"] [style*="background:#fefce8"],
    [data-theme="dark"] [style*="background: #fff7ed"],
    [data-theme="dark"] [style*="background:#fff7ed"],
    [data-theme="dark"] [style*="background: #fef3c7"],
    [data-theme="dark"] [style*="background:#fef3c7"] {
        background-color: rgba(245, 158, 11, 0.12) !important;
        color: var(--dm-text) !important;
    }
    /* Soft pastel info/success/danger → tinted setiap warna */
    [data-theme="dark"] [style*="background: #e0f2fe"],
    [data-theme="dark"] [style*="background:#e0f2fe"],
    [data-theme="dark"] [style*="background: #f0f9ff"],
    [data-theme="dark"] [style*="background:#f0f9ff"],
    [data-theme="dark"] [style*="background: #dbeafe"],
    [data-theme="dark"] [style*="background:#dbeafe"],
    [data-theme="dark"] [style*="background: #eff6ff"],
    [data-theme="dark"] [style*="background:#eff6ff"] {
        background-color: rgba(59, 130, 246, 0.15) !important;
        color: #93c5fd !important;
    }
    [data-theme="dark"] [style*="background: #d1fae5"],
    [data-theme="dark"] [style*="background:#d1fae5"] {
        background-color: rgba(34, 197, 94, 0.15) !important;
        color: #86efac !important;
    }
    [data-theme="dark"] [style*="background: #fee2e2"],
    [data-theme="dark"] [style*="background:#fee2e2"] {
        background-color: rgba(239, 68, 68, 0.15) !important;
        color: #fca5a5 !important;
    }
    [data-theme="dark"] [style*="background: #ddd6fe"],
    [data-theme="dark"] [style*="background:#ddd6fe"],
    [data-theme="dark"] [style*="background: #ede9fe"],
    [data-theme="dark"] [style*="background:#ede9fe"],
    [data-theme="dark"] [style*="background: #f3e8ff"],
    [data-theme="dark"] [style*="background:#f3e8ff"] {
        background-color: rgba(124, 58, 237, 0.15) !important;
        color: #c4b5fd !important;
    }

    /* Variant-less .btn fallback (custom buttons without -primary/-warning/etc.) */
    [data-theme="dark"] #reviewSubmitBtn,
    [data-theme="dark"] #reviewRejectBtn {
        background: var(--dm-surface-2) !important;
        color: var(--dm-text) !important;
        border: 1px solid var(--dm-border) !important;
    }
    [data-theme="dark"] #reviewSubmitBtn:hover,
    [data-theme="dark"] #reviewRejectBtn:hover {
        background: var(--dm-elevated) !important;
        color: #fbbf24 !important;
        border-color: #fbbf24 !important;
    }

    /* ============================================================
       SCOPED MODULE TABLE BACKGROUND HARDCODES
       Beberapa modul punya .xxx-table thead th dengan background
       bukan via inline style melainkan class CSS. Tidak bisa
       di-override via inline-style attribute selector.
       Tambah kelas-spesifik di bawah:
       ============================================================ */
    [data-theme="dark"] .ledger-table .badge-date {
        background: rgba(59,130,246,0.18) !important;
        color: #93c5fd !important;
    }
    [data-theme="dark"] .ledger-table .text-dark,
    [data-theme="dark"] .ledger-table tbody td .fw-bold,
    [data-theme="dark"] .ledger-table tbody td .fw-semibold {
        color: var(--dm-text) !important;
    }
    /* small kode/tag chip pakai bg-light */
    [data-theme="dark"] .ledger-table small.bg-light,
    [data-theme="dark"] .ledger-table .bg-light,
    [data-theme="dark"] .small.bg-light,
    [data-theme="dark"] small.bg-light {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text-2) !important;
        border-color: var(--dm-border) !important;
    }

    /* Stat-card di bukubesar (warna: blue/green/red/dark) — sudah ada catch-all
       tapi text-primary/-success/-danger hardcode harus di-light-kan */
    [data-theme="dark"] .stat-card .text-primary,
    [data-theme="dark"] .stat-card .text-success,
    [data-theme="dark"] .stat-card .text-danger,
    [data-theme="dark"] .stat-card .text-warning,
    [data-theme="dark"] .stat-card .text-info {
        filter: brightness(1.4) saturate(0.9);
    }
    [data-theme="dark"] .stat-card.dark { background: var(--dm-surface) !important; }

    /* ============================================================
       FOOTER GLASS
       ============================================================ */
    [data-theme="dark"] .footer-glass {
        background: rgba(15, 23, 42, 0.85) !important;
        border-top-color: var(--dm-border) !important;
        color: var(--dm-text-2) !important;
    }

    /* ============================================================
       INLINE-STYLE OVERRIDES (banyak view pakai style="background:#fff")
       Pakai attribute selector — !important biar menang dari inline style.
       ============================================================ */
    [data-theme="dark"] [style*="background: #fff"]:not(.sidebar-brand-gold):not(.btn-glow):not(.logo-glass-frame):not(.brand-text),
    [data-theme="dark"] [style*="background:#fff"]:not(.sidebar-brand-gold):not(.btn-glow):not(.logo-glass-frame):not(.brand-text),
    [data-theme="dark"] [style*="background-color: #fff"]:not(.sidebar-brand-gold),
    [data-theme="dark"] [style*="background-color:#fff"]:not(.sidebar-brand-gold),
    [data-theme="dark"] [style*="background: white"]:not(.sidebar-brand-gold),
    [data-theme="dark"] [style*="background:white"]:not(.sidebar-brand-gold),
    [data-theme="dark"] [style*="background-color: white"]:not(.sidebar-brand-gold),
    [data-theme="dark"] [style*="background-color:white"]:not(.sidebar-brand-gold) {
        background-color: var(--dm-surface) !important;
        color: var(--dm-text) !important;
    }

    /* ============================================================
       DARK MODE TOGGLE BUTTON
       ============================================================ */
    .dark-toggle {
        width: 40px; height: 40px;
        display: inline-flex; align-items: center; justify-content: center;
        border-radius: 50%;
        background: transparent;
        border: 1px solid transparent;
        color: #475569;
        cursor: pointer;
        transition: all 0.25s ease;
        font-size: 1.25rem;
    }
    .dark-toggle:hover {
        background: rgba(245, 158, 11, 0.10);
        color: var(--primary, #f59e0b);
    }
    [data-theme="dark"] .dark-toggle {
        color: #fbbf24;
    }
    [data-theme="dark"] .dark-toggle:hover {
        background: rgba(251, 191, 36, 0.15);
    }
    /* Show correct icon by theme */
    .dark-toggle .icon-sun  { display: none; }
    .dark-toggle .icon-moon { display: inline-block; }
    [data-theme="dark"] .dark-toggle .icon-sun  { display: inline-block; }
    [data-theme="dark"] .dark-toggle .icon-moon { display: none; }

    /* ============================================================
       MISC: code, hr, blockquote, kbd
       ============================================================ */
    [data-theme="dark"] code,
    [data-theme="dark"] kbd,
    [data-theme="dark"] pre,
    [data-theme="dark"] samp {
        background-color: var(--dm-surface-2) !important;
        color: #fbbf24 !important;
    }
    [data-theme="dark"] hr {
        border-color: var(--dm-border) !important;
        opacity: 0.5;
    }
    [data-theme="dark"] blockquote {
        color: var(--dm-text-2);
        border-left-color: var(--dm-border-2);
    }

    /* ============================================================
       INVOICE / PRINT — selalu light mode (jangan diubah)
       ============================================================ */
    @media print {
        [data-theme="dark"] body,
        [data-theme="dark"] .card,
        [data-theme="dark"] .modal-content {
            background: #fff !important;
            color: #000 !important;
        }
    }
    [data-theme="dark"] .invoice-print,
    [data-theme="dark"] .print-area {
        background: #fff !important;
        color: #000 !important;
    }

    /* ============================================================
       INLINE STYLE OVERRIDES — TEXT COLOR
       Banyak view pakai style="color: #1f2937" / "color: #252f40" yang
       jadi tidak terbaca di bg gelap. Ganti ke text terang otomatis.
       ============================================================ */
    [data-theme="dark"] [style*="color: #1f2937"],
    [data-theme="dark"] [style*="color:#1f2937"],
    [data-theme="dark"] [style*="color: #252f40"],
    [data-theme="dark"] [style*="color:#252f40"],
    [data-theme="dark"] [style*="color: #1e293b"],
    [data-theme="dark"] [style*="color:#1e293b"],
    [data-theme="dark"] [style*="color: #1a1a1a"],
    [data-theme="dark"] [style*="color:#1a1a1a"],
    [data-theme="dark"] [style*="color: #000"]:not([style*="color: #0001"]):not([style*="color: #0002"]):not([style*="color: #00015"]),
    [data-theme="dark"] [style*="color:#000"]:not([style*="color:#0001"]):not([style*="color:#0002"]):not([style*="color:#00015"]),
    [data-theme="dark"] [style*="color: black"],
    [data-theme="dark"] [style*="color:black"] {
        color: var(--dm-text) !important;
    }
    /* Slate-700 / Gray-700 hardcoded → secondary text */
    [data-theme="dark"] [style*="color: #334155"],
    [data-theme="dark"] [style*="color:#334155"],
    [data-theme="dark"] [style*="color: #374151"],
    [data-theme="dark"] [style*="color:#374151"] {
        color: var(--dm-text-2) !important;
    }
    /* Hardcoded background-color light tones (slate-50, gray-100, gray-50) */
    [data-theme="dark"] [style*="background: #f8fafc"]:not(.btn-glow):not(.sidebar-brand-gold),
    [data-theme="dark"] [style*="background:#f8fafc"]:not(.btn-glow):not(.sidebar-brand-gold),
    [data-theme="dark"] [style*="background-color: #f8fafc"]:not(.btn-glow):not(.sidebar-brand-gold),
    [data-theme="dark"] [style*="background-color:#f8fafc"]:not(.btn-glow):not(.sidebar-brand-gold),
    [data-theme="dark"] [style*="background: #f9fafb"]:not(.btn-glow):not(.sidebar-brand-gold),
    [data-theme="dark"] [style*="background:#f9fafb"]:not(.btn-glow):not(.sidebar-brand-gold),
    [data-theme="dark"] [style*="background: #f1f5f9"]:not(.btn-glow):not(.sidebar-brand-gold),
    [data-theme="dark"] [style*="background:#f1f5f9"]:not(.btn-glow):not(.sidebar-brand-gold),
    [data-theme="dark"] [style*="background: #f5f5f5"]:not(.btn-glow):not(.sidebar-brand-gold),
    [data-theme="dark"] [style*="background:#f5f5f5"]:not(.btn-glow):not(.sidebar-brand-gold) {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text) !important;
    }

    /* ============================================================
       SCOPED MODULE PATTERNS (dipakai konsisten di banyak view)
       Naming convention: .sv-* (subdivisi), .rg-* (riwayat-gaji),
       .menu-* (roles), .stat-card, .perm-check, .dashboard-widget.
       ============================================================ */
    /* SUBDIVISI */
    [data-theme="dark"] .sv-card,
    [data-theme="dark"] .sv-card-header,
    [data-theme="dark"] .sv-form-input {
        background-color: var(--dm-surface) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .sv-form-input { background-color: var(--dm-elevated) !important; }
    [data-theme="dark"] .sv-form-input::placeholder { color: var(--dm-muted) !important; }
    [data-theme="dark"] .sv-table tbody tr:hover { background: var(--dm-elevated) !important; }
    [data-theme="dark"] .sv-check-group {
        background: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .sv-check-group:hover {
        background: var(--dm-elevated) !important;
        border-color: var(--primary, #f59e0b) !important;
    }
    [data-theme="dark"] .sv-check-group.checked {
        background: rgba(245, 158, 11, 0.15) !important;
        border-color: var(--primary, #f59e0b) !important;
    }
    [data-theme="dark"] .sv-btn-back,
    [data-theme="dark"] .sv-btn-cancel {
        background: var(--dm-elevated) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .sv-btn-back:hover,
    [data-theme="dark"] .sv-btn-cancel:hover {
        background: var(--dm-border-2) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .sv-btn-edit {
        background: rgba(245, 158, 11, 0.15) !important;
        color: #fbbf24 !important;
        border-color: rgba(245, 158, 11, 0.30) !important;
    }

    /* ROLES (create, edit, show, index) */
    [data-theme="dark"] .menu-group,
    [data-theme="dark"] .menu-group-header {
        background: var(--dm-surface) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .menu-group.has-checked .menu-group-header {
        background: rgba(245, 158, 11, 0.15) !important;
    }
    [data-theme="dark"] .perm-check {
        background: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .perm-check:hover {
        background: var(--dm-elevated) !important;
        border-color: var(--primary, #f59e0b) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .perm-check input:checked + label,
    [data-theme="dark"] .perm-check.checked {
        background: rgba(245, 158, 11, 0.18) !important;
        color: var(--dm-text) !important;
    }
    /* Teks nama submenu & judul grup agar terbaca di dark mode */
    [data-theme="dark"] .submenu-name,
    [data-theme="dark"] .menu-group-title,
    [data-theme="dark"] .submenu-row {
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .submenu-row {
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .perm-check span,
    [data-theme="dark"] .perm-check label {
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .menu-select-all span {
        color: var(--dm-text-2) !important;
    }
    /* Input "Nama Role" + label */
    [data-theme="dark"] .role-form input[type="text"],
    [data-theme="dark"] #permissionGroups + * input[type="text"],
    [data-theme="dark"] form input[name="name"] {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .btn-back {
        background-color: var(--dm-elevated) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .btn-back:hover {
        background-color: var(--dm-border-2) !important;
        color: var(--dm-text) !important;
    }

    /* RIWAYAT GAJI / DASHBOARD WIDGETS */
    [data-theme="dark"] .rg-card,
    [data-theme="dark"] .rg-table,
    [data-theme="dark"] .rg-table thead {
        background: var(--dm-surface) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .rg-table tbody tr:hover { background: var(--dm-elevated) !important; }

    /* DASHBOARD STAT-CARD accent line tetap pakai accent color asli (sudah konsisten) */
    [data-theme="dark"] .stat-icon-wrapper {
        /* Soften color tints di icon wrapper pada bg gelap */
        filter: brightness(1.1);
    }

    /* ============================================================
       LOGIN GLASS PANEL — pertahankan tema gelap eksisting
       Default sudah dark (gold gradient bg). Pastikan tidak diubah.
       ============================================================ */
    [data-theme="dark"] .glass-panel {
        background: rgba(15, 23, 42, 0.45) !important;
        border-color: rgba(245, 158, 11, 0.18) !important;
    }
    /* Saat user pilih light mode, login tetap kelihatan keren */
    [data-theme="light"] .glass-panel {
        background: rgba(255, 255, 255, 0.08);
    }

    /* ============================================================
       AI FLOATING CHAT WIDGET
       ============================================================ */
    [data-theme="dark"] .ai-mini-chat {
        background: var(--dm-surface) !important;
        box-shadow: 0 20px 60px rgba(0,0,0,0.6) !important;
    }
    [data-theme="dark"] .ai-mini-body {
        background: var(--dm-bg) !important;
    }
    [data-theme="dark"] .ai-mini-footer {
        background: var(--dm-surface) !important;
        border-top-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .ai-mini-msg.assistant .mini-bubble {
        background: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .ai-mini-msg.assistant .mini-bubble strong {
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .ai-mini-msg.user .mini-avatar {
        background: var(--dm-elevated) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .ai-mini-input {
        background: var(--dm-elevated) !important;
        border-color: var(--dm-border-2) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .ai-mini-input::placeholder { color: var(--dm-muted) !important; }
    [data-theme="dark"] .ai-mini-input:focus {
        border-color: var(--primary, #f59e0b) !important;
    }
    [data-theme="dark"] .ai-mini-welcome { color: var(--dm-muted) !important; }
    [data-theme="dark"] .ai-mini-welcome > div.fw-bold { color: var(--dm-text) !important; }
    [data-theme="dark"] .ai-mini-typing span { background: var(--dm-border-2) !important; }

    /* Header dropdown bell items dengan bg-light di-merge ke surface */
    [data-theme="dark"] .header-nav .dropdown-menu .list-group-item.bg-light {
        background-color: var(--dm-surface-2) !important;
    }

    /* ============================================================
       PRODUK KATEGORI UTAMA (.ku-*) — module-spesifik
       Halaman: /admin/produk-kategori-utama
       Banyak hardcode hex amber/krem (#fffbeb, #fef3c7, dst.) yang
       di dark mode jadi silau. Override semua ke surface gelap
       atau accent tinted.
       ============================================================ */
    /* Card & header */
    [data-theme="dark"] .ku-card,
    [data-theme="dark"] .ku-card-header,
    [data-theme="dark"] .ku-mobile-card {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .ku-card-header {
        border-bottom-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .ku-mobile-card:hover {
        background-color: var(--dm-surface-2) !important;
        border-color: rgba(245, 158, 11, 0.45) !important;
    }

    /* Title/sub-title */
    [data-theme="dark"] .ku-header-title h5,
    [data-theme="dark"] .ku-mobile h6,
    [data-theme="dark"] .ku-card .ku-mobile h6 {
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .ku-header-title p {
        color: var(--dm-muted) !important;
    }

    /* Search input */
    [data-theme="dark"] .ku-search input {
        background-color: var(--dm-elevated) !important;
        border-color: var(--dm-border-2) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .ku-search input::placeholder {
        color: var(--dm-muted) !important;
    }
    [data-theme="dark"] .ku-search input:focus {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--primary, #f59e0b) !important;
        box-shadow: 0 0 0 3px rgba(251, 191, 36, 0.20) !important;
    }
    [data-theme="dark"] .ku-search svg {
        color: var(--dm-muted) !important;
    }

    /* Table */
    [data-theme="dark"] .ku-table thead th {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text-2) !important;
        border-bottom-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .ku-table tbody tr {
        border-bottom-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .ku-table tbody td {
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .ku-table tbody tr:hover,
    [data-theme="dark"] .ku-table tbody tr:hover td {
        background-color: var(--dm-elevated) !important;
    }

    /* Name link (gold accent — ganti dari amber-700 ke amber-400) */
    [data-theme="dark"] .ku-name-link {
        color: #fbbf24 !important;
    }
    [data-theme="dark"] .ku-name-link:hover {
        color: #fcd34d !important;
    }

    /* Buttons edit / delete */
    [data-theme="dark"] .ku-btn-edit,
    [data-theme="dark"] a.ku-btn-edit,
    [data-theme="dark"] button.ku-btn-edit {
        background-color: rgba(245, 158, 11, 0.15) !important;
        color: #fbbf24 !important;
        border-color: rgba(245, 158, 11, 0.35) !important;
    }
    [data-theme="dark"] .ku-btn-edit:hover,
    [data-theme="dark"] a.ku-btn-edit:hover,
    [data-theme="dark"] button.ku-btn-edit:hover {
        background-color: rgba(245, 158, 11, 0.30) !important;
        color: #fcd34d !important;
        border-color: rgba(245, 158, 11, 0.55) !important;
    }
    [data-theme="dark"] .ku-btn-delete,
    [data-theme="dark"] a.ku-btn-delete,
    [data-theme="dark"] button.ku-btn-delete {
        background-color: rgba(239, 68, 68, 0.15) !important;
        color: #fca5a5 !important;
        border-color: rgba(239, 68, 68, 0.35) !important;
    }
    [data-theme="dark"] .ku-btn-delete:hover,
    [data-theme="dark"] a.ku-btn-delete:hover,
    [data-theme="dark"] button.ku-btn-delete:hover {
        background-color: rgba(239, 68, 68, 0.30) !important;
        color: #fecaca !important;
        border-color: rgba(239, 68, 68, 0.55) !important;
    }

    /* Tombol Tambah / Submit (gold gradient) — paksa text gelap supaya tidak gold-on-gold.
       .ku-btn-add adalah <a> sehingga ter-override rule global
       [data-theme="dark"] a:not(...) yang memaksa color jadi gold. */
    [data-theme="dark"] .ku-btn-add,
    [data-theme="dark"] a.ku-btn-add,
    [data-theme="dark"] .ku-btn-submit,
    [data-theme="dark"] button.ku-btn-submit {
        background: linear-gradient(135deg, #fbbf24, #f59e0b) !important;
        color: #1f2937 !important;
        border-color: transparent !important;
    }
    [data-theme="dark"] .ku-btn-add:hover,
    [data-theme="dark"] a.ku-btn-add:hover,
    [data-theme="dark"] .ku-btn-submit:hover,
    [data-theme="dark"] button.ku-btn-submit:hover {
        background: linear-gradient(135deg, #f59e0b, #d97706) !important;
        color: #111827 !important;
        box-shadow: 0 4px 12px rgba(245, 158, 11, 0.45) !important;
    }

    /* Tombol Back / Cancel (netral) */
    [data-theme="dark"] .ku-btn-back,
    [data-theme="dark"] a.ku-btn-back,
    [data-theme="dark"] .ku-btn-cancel,
    [data-theme="dark"] a.ku-btn-cancel {
        background-color: var(--dm-elevated) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border-2) !important;
    }
    [data-theme="dark"] .ku-btn-back:hover,
    [data-theme="dark"] a.ku-btn-back:hover,
    [data-theme="dark"] .ku-btn-cancel:hover,
    [data-theme="dark"] a.ku-btn-cancel:hover {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text) !important;
        border-color: var(--primary, #f59e0b) !important;
    }

    /* Form (create/edit) */
    [data-theme="dark"] .ku-form-body { color: var(--dm-text) !important; }
    [data-theme="dark"] .ku-form-label { color: var(--dm-text-2) !important; }
    [data-theme="dark"] .ku-form-label span { color: #fca5a5 !important; }
    [data-theme="dark"] .ku-form-input {
        background-color: var(--dm-elevated) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border-2) !important;
    }
    [data-theme="dark"] .ku-form-input::placeholder { color: var(--dm-muted) !important; }
    [data-theme="dark"] .ku-form-input:focus {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--primary, #f59e0b) !important;
        box-shadow: 0 0 0 3px rgba(251, 191, 36, 0.20) !important;
    }

    /* Section title divider */
    [data-theme="dark"] .ku-section-title { color: var(--dm-muted) !important; }
    [data-theme="dark"] .ku-section-line { background: var(--dm-border) !important; }

    /* Switch group toggles (jual/beli/stok/produksi pickers) */
    [data-theme="dark"] .ku-switch-group {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .ku-switch-group:hover {
        background-color: var(--dm-elevated) !important;
        border-color: rgba(245, 158, 11, 0.45) !important;
    }
    [data-theme="dark"] .ku-switch-group.active {
        background-color: rgba(245, 158, 11, 0.12) !important;
        border-color: rgba(245, 158, 11, 0.55) !important;
    }
    [data-theme="dark"] .ku-switch-icon {
        background-color: var(--dm-elevated) !important;
        color: var(--dm-muted) !important;
    }
    [data-theme="dark"] .ku-switch-group.active .ku-switch-icon {
        background-color: rgba(245, 158, 11, 0.25) !important;
        color: #fcd34d !important;
    }
    [data-theme="dark"] .ku-switch-label { color: var(--dm-text) !important; }
    [data-theme="dark"] .ku-switch-desc { color: var(--dm-muted) !important; }
    [data-theme="dark"] .ku-switch-toggle .form-check-input {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border-2) !important;
    }
    [data-theme="dark"] .ku-switch-toggle .form-check-input:checked {
        background-color: #f59e0b !important;
        border-color: #f59e0b !important;
    }

    /* Edit page small badge */
    [data-theme="dark"] .ku-edit-badge {
        background-color: rgba(245, 158, 11, 0.15) !important;
        border-color: rgba(245, 158, 11, 0.40) !important;
        color: #fcd34d !important;
    }

    /* Badges (jual/beli/stok/produksi) — pastel pastel jadi tinted */
    [data-theme="dark"] .ku-badge-jual {
        background-color: rgba(59, 130, 246, 0.20) !important;
        color: #93c5fd !important;
    }
    [data-theme="dark"] .ku-badge-beli {
        background-color: rgba(34, 197, 94, 0.20) !important;
        color: #86efac !important;
    }
    [data-theme="dark"] .ku-badge-stok {
        background-color: rgba(245, 158, 11, 0.20) !important;
        color: #fcd34d !important;
    }
    [data-theme="dark"] .ku-badge-produksi {
        background-color: rgba(124, 58, 237, 0.22) !important;
        color: #c4b5fd !important;
    }

    /* Counter chip — biarkan gold tapi softer */
    [data-theme="dark"] .ku-counter {
        background: rgba(245, 158, 11, 0.85) !important;
        color: #1f2937 !important;
    }

    /* Empty state */
    [data-theme="dark"] .ku-empty {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .ku-empty-icon {
        background-color: rgba(245, 158, 11, 0.18) !important;
    }
    [data-theme="dark"] .ku-empty-icon svg {
        stroke: #fbbf24 !important;
    }
    [data-theme="dark"] .ku-empty h6 {
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .ku-empty p {
        color: var(--dm-muted) !important;
    }

    /* Pagination */
    [data-theme="dark"] .ku-pagination {
        background-color: var(--dm-surface) !important;
        border-top-color: var(--dm-border) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .ku-pagination .page-link {
        background-color: transparent !important;
        color: var(--dm-text) !important;
        border-color: transparent !important;
    }
    [data-theme="dark"] .ku-pagination .page-link:hover {
        background-color: var(--dm-elevated) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .ku-pagination .page-item.active .page-link {
        background: linear-gradient(135deg, rgba(251, 191, 36, 0.85), rgba(245, 158, 11, 0.85)) !important;
        color: #1f2937 !important;
    }
    [data-theme="dark"] .ku-pagination .page-item.disabled .page-link {
        color: var(--dm-muted) !important;
    }

    /* Empty hint text inline (style="color:#d1d5db;") di list badge tipe */
    [data-theme="dark"] .ku-mobile-card [style*="color:#d1d5db"],
    [data-theme="dark"] .ku-mobile-card [style*="color: #d1d5db"] {
        color: var(--dm-muted) !important;
    }
    /* Border separator antar mobile card sections */
    [data-theme="dark"] .ku-mobile-card [style*="border-top: 1px solid #f3f4f6"],
    [data-theme="dark"] .ku-mobile-card [style*="border-top:1px solid #f3f4f6"] {
        border-top-color: var(--dm-border) !important;
    }

    /* Inline-style "background: #fafafa" (ku-table thead th lewat hex utility) */
    [data-theme="dark"] [style*="background: #fafafa"]:not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background:#fafafa"]:not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background-color: #fafafa"]:not(.invoice-print):not(.print-area),
    [data-theme="dark"] [style*="background-color:#fafafa"]:not(.invoice-print):not(.print-area) {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text) !important;
    }

    /* ============================================================
       PRODUK KATEGORI (.pk-*) — module-spesifik
       Halaman: /admin/produk-kategori
       Hardcode: bg #fff, hover #fffbeb, badge utama #fef3c7,
       breadcrumb a #b45309, link #b45309, thead #fafafa.
       ============================================================ */
    /* Card */
    [data-theme="dark"] .pk-card,
    [data-theme="dark"] .pk-card-header {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .pk-card-header {
        border-bottom-color: var(--dm-border) !important;
    }

    /* Title & breadcrumb */
    [data-theme="dark"] .pk-header-title h5 {
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .pk-header-title p,
    [data-theme="dark"] .pk-breadcrumb {
        color: var(--dm-muted) !important;
    }
    [data-theme="dark"] .pk-breadcrumb a {
        color: #fbbf24 !important;
    }
    [data-theme="dark"] .pk-breadcrumb a:hover {
        color: #fcd34d !important;
    }
    [data-theme="dark"] .pk-breadcrumb svg {
        color: var(--dm-muted) !important;
    }
    /* Inline color #111827 untuk nama kategori utama dalam breadcrumb */
    [data-theme="dark"] .pk-breadcrumb [style*="color:#111827"],
    [data-theme="dark"] .pk-breadcrumb [style*="color: #111827"],
    [data-theme="dark"] .pk-card [style*="color:#111827"],
    [data-theme="dark"] .pk-card [style*="color: #111827"] {
        color: var(--dm-text) !important;
    }

    /* Counter chip */
    [data-theme="dark"] .pk-counter {
        background: rgba(245, 158, 11, 0.85) !important;
        color: #1f2937 !important;
    }

    /* Table */
    [data-theme="dark"] .pk-table thead th {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text-2) !important;
        border-bottom-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .pk-table tbody tr {
        border-bottom-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .pk-table tbody td {
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .pk-table tbody tr:hover,
    [data-theme="dark"] .pk-table tbody tr:hover td {
        background-color: var(--dm-elevated) !important;
    }

    /* Name link & arrow */
    [data-theme="dark"] .pk-name-link {
        color: #fbbf24 !important;
    }
    [data-theme="dark"] .pk-name-link:hover {
        color: #fcd34d !important;
    }

    /* Badge utama (kategori utama label) */
    [data-theme="dark"] .pk-badge-utama {
        background-color: rgba(245, 158, 11, 0.20) !important;
        color: #fcd34d !important;
    }

    /* Buttons */
    [data-theme="dark"] .pk-btn-edit {
        background-color: rgba(245, 158, 11, 0.15) !important;
        color: #fbbf24 !important;
        border-color: rgba(245, 158, 11, 0.35) !important;
    }
    [data-theme="dark"] .pk-btn-edit:hover {
        background-color: rgba(245, 158, 11, 0.30) !important;
        color: #fcd34d !important;
        border-color: rgba(245, 158, 11, 0.55) !important;
    }
    [data-theme="dark"] .pk-btn-delete {
        background-color: rgba(239, 68, 68, 0.15) !important;
        color: #fca5a5 !important;
        border-color: rgba(239, 68, 68, 0.35) !important;
    }
    [data-theme="dark"] .pk-btn-delete:hover {
        background-color: rgba(239, 68, 68, 0.30) !important;
        color: #fecaca !important;
        border-color: rgba(239, 68, 68, 0.55) !important;
    }

    /* Empty state */
    [data-theme="dark"] .pk-empty {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .pk-empty-icon {
        background-color: rgba(245, 158, 11, 0.18) !important;
    }
    [data-theme="dark"] .pk-empty-icon svg {
        stroke: #fbbf24 !important;
    }
    [data-theme="dark"] .pk-empty h6 {
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .pk-empty p {
        color: var(--dm-muted) !important;
    }

    /* Inline grey color hardcodes pada table cells (#9ca3af untuk No, #d1d5db utk arrow muted) */
    [data-theme="dark"] .pk-table [style*="color:#9ca3af"],
    [data-theme="dark"] .pk-table [style*="color: #9ca3af"],
    [data-theme="dark"] .pk-card [style*="color:#9ca3af"],
    [data-theme="dark"] .pk-card [style*="color: #9ca3af"] {
        color: var(--dm-muted) !important;
    }

    /* ============================================================
       UNIVERSAL MODULE FALLBACK — semua scoped pattern hover #fffbeb
       Banyak modul (.pk-*, .pm-*, .ak-*, .mb-*, .sdm-*) punya
       background hover krem identik. Sweep universal supaya
       setiap kelas yang berakhiran -table tbody tr:hover dapat dark.
       ============================================================ */
    [data-theme="dark"] [class$="-table"] tbody tr:hover,
    [data-theme="dark"] [class$="-table"] tbody tr:hover > *,
    [data-theme="dark"] [class$="-table"] tbody tr:hover td,
    [data-theme="dark"] [class$="-table"] tbody tr:hover th {
        background-color: var(--dm-elevated) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] [class$="-table"] thead th {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text-2) !important;
        border-bottom-color: var(--dm-border) !important;
    }
    [data-theme="dark"] [class$="-table"] tbody tr {
        border-bottom-color: var(--dm-border) !important;
    }
    [data-theme="dark"] [class$="-table"] tbody td {
        color: var(--dm-text) !important;
        border-bottom-color: var(--dm-border) !important;
    }
    /* Universal module empty state */
    [data-theme="dark"] [class$="-empty"] {
        color: var(--dm-muted) !important;
    }
    [data-theme="dark"] [class$="-empty-icon"] {
        background-color: rgba(245, 158, 11, 0.18) !important;
    }
    [data-theme="dark"] [class$="-empty-icon"] svg {
        stroke: #fbbf24 !important;
    }
    /* Universal module name-link / breadcrumb-link → gold */
    [data-theme="dark"] [class$="-name-link"],
    [data-theme="dark"] [class$="-breadcrumb"] a {
        color: #fbbf24 !important;
    }
    [data-theme="dark"] [class$="-name-link"]:hover,
    [data-theme="dark"] [class$="-breadcrumb"] a:hover {
        color: #fcd34d !important;
    }
    /* Universal module counter chip */
    [data-theme="dark"] [class$="-counter"] {
        background: rgba(245, 158, 11, 0.85) !important;
        color: #1f2937 !important;
    }
    /* Universal module btn-edit / btn-delete (krem amber + soft red) */
    [data-theme="dark"] [class$="-btn-edit"] {
        background-color: rgba(245, 158, 11, 0.15) !important;
        color: #fbbf24 !important;
        border-color: rgba(245, 158, 11, 0.35) !important;
    }
    [data-theme="dark"] [class$="-btn-edit"]:hover {
        background-color: rgba(245, 158, 11, 0.30) !important;
        color: #fcd34d !important;
        border-color: rgba(245, 158, 11, 0.55) !important;
    }
    [data-theme="dark"] [class$="-btn-delete"] {
        background-color: rgba(239, 68, 68, 0.15) !important;
        color: #fca5a5 !important;
        border-color: rgba(239, 68, 68, 0.35) !important;
    }
    [data-theme="dark"] [class$="-btn-delete"]:hover {
        background-color: rgba(239, 68, 68, 0.30) !important;
        color: #fecaca !important;
        border-color: rgba(239, 68, 68, 0.55) !important;
    }
    /* Universal module badge-utama / badge-tag */
    [data-theme="dark"] [class$="-badge-utama"] {
        background-color: rgba(245, 158, 11, 0.20) !important;
        color: #fcd34d !important;
    }

    /* ============================================================
       UNIVERSAL AMBER/RED PATTERN SWEEP
       ------------------------------------------------------------
       Banyak modul punya scoped class dengan warna identik:
         - Amber soft: #fffbeb, #fef3c7, #fffef5, #fefce8 (krem highlight)
         - Red soft: #fef2f2 (alert/danger)
         - Border amber: #fde68a / Red: #fecaca
       Override semua via class-name pattern supaya tiap modul ke-cover
       sekaligus. Pakai `[class*="..."]` (contains) bukan `$=`
       supaya match meski ada multiple class.
       ============================================================ */

    /* AMBER WRAP — badge highlight, edit-badge, parent-badge, harga-prefix, dll */
    [data-theme="dark"] [class*="-edit-badge"],
    [data-theme="dark"] [class*="-parent-badge"],
    [data-theme="dark"] [class*="-quota-warn"],
    [data-theme="dark"] [class*="-lama-kerja"],
    [data-theme="dark"] [class*="-harga-prefix"],
    [data-theme="dark"] [class*="-img-current"],
    [data-theme="dark"] [class*="-badge-amber"],
    [data-theme="dark"] [class*="-badge-stok"],
    [data-theme="dark"] [class*="-badge-ops"],
    [data-theme="dark"] [class*="-badge-freelance"],
    [data-theme="dark"] [class*="-badge-warning"],
    [data-theme="dark"] [class*="-tab-count"] {
        background-color: rgba(245, 158, 11, 0.18) !important;
        border-color: rgba(245, 158, 11, 0.35) !important;
        color: #fcd34d !important;
    }

    /* RED/DANGER WRAP — badge-danger, btn-restore, alert-block, quota-full */
    [data-theme="dark"] [class*="-badge-danger"],
    [data-theme="dark"] [class*="-badge-red"],
    [data-theme="dark"] [class*="-badge-inactive"],
    [data-theme="dark"] [class*="-quota-full"],
    [data-theme="dark"] [class*="-alert-block"],
    [data-theme="dark"] [class*="-btn-restore"] {
        background-color: rgba(239, 68, 68, 0.15) !important;
        border-color: rgba(239, 68, 68, 0.35) !important;
        color: #fca5a5 !important;
    }
    [data-theme="dark"] [class*="-btn-ignore"]:hover {
        background-color: rgba(239, 68, 68, 0.20) !important;
        border-color: rgba(239, 68, 68, 0.45) !important;
        color: #fca5a5 !important;
    }

    /* ACTIVE / CHECKED states amber tinted */
    [data-theme="dark"] [class*="-tab-link"].active,
    [data-theme="dark"] [class*="-tab"].active,
    [data-theme="dark"] [class*="-switch-group"].active,
    [data-theme="dark"] [class*="-check-group"].checked,
    [data-theme="dark"] [class*="-status-option"].active {
        background-color: rgba(245, 158, 11, 0.15) !important;
        border-color: rgba(245, 158, 11, 0.55) !important;
        color: #fbbf24 !important;
    }
    /* status-option danger variant */
    [data-theme="dark"] [class*="-status-option"].active-red,
    [data-theme="dark"] [class*="-status-option"].active-danger {
        background-color: rgba(239, 68, 68, 0.15) !important;
        border-color: rgba(239, 68, 68, 0.55) !important;
        color: #fca5a5 !important;
    }
    /* switch-icon active accent (small) */
    [data-theme="dark"] [class*="-switch-group"].active [class*="-switch-icon"] {
        background-color: rgba(245, 158, 11, 0.25) !important;
        color: #fbbf24 !important;
    }

    /* ============================================================
       ROLES MODULE (.menu-*, .submenu-*, .perm-*, .menu-select-all)
       Hardcode #fffbeb / #fefce8 / #fffef5 / #fef3c7
       ============================================================ */
    [data-theme="dark"] .menu-group.has-checked .menu-group-header {
        background-color: rgba(245, 158, 11, 0.15) !important;
        border-color: rgba(245, 158, 11, 0.35) !important;
    }
    [data-theme="dark"] .submenu-row:hover {
        background-color: var(--dm-elevated) !important;
    }
    [data-theme="dark"] .perm-check:hover {
        background-color: rgba(245, 158, 11, 0.10) !important;
        border-color: rgba(245, 158, 11, 0.45) !important;
    }
    [data-theme="dark"] .menu-select-all:hover {
        background-color: rgba(245, 158, 11, 0.18) !important;
        color: #fbbf24 !important;
    }
    /* Roles permission-count chip */
    [data-theme="dark"] .menu-group .perm-count,
    [data-theme="dark"] .menu-group [class*="badge-count"] {
        background-color: rgba(245, 158, 11, 0.18) !important;
        color: #fbbf24 !important;
    }

    /* ============================================================
       SDM CUTI (.sdm-quota-*, .sdm-alert-block)
       ============================================================ */
    [data-theme="dark"] .sdm-quota-warn {
        background-color: rgba(245, 158, 11, 0.10) !important;
        border-color: rgba(245, 158, 11, 0.35) !important;
    }
    [data-theme="dark"] .sdm-quota-full,
    [data-theme="dark"] .sdm-alert-block {
        background-color: rgba(239, 68, 68, 0.10) !important;
        border-color: rgba(239, 68, 68, 0.35) !important;
        color: var(--dm-text) !important;
    }

    /* ============================================================
       LEMBURS SLIP (.slip-info)
       ============================================================ */
    [data-theme="dark"] .slip-info {
        background-color: rgba(245, 158, 11, 0.08) !important;
        border-bottom-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }

    /* ============================================================
       AI ASSISTANT ACTIVE STATE
       ============================================================ */
    [data-theme="dark"] .ai-assistant-active,
    [data-theme="dark"] .ai-input-wrap.active {
        background-color: rgba(245, 158, 11, 0.10) !important;
        border-color: rgba(245, 158, 11, 0.45) !important;
    }

    /* ============================================================
       PROFILE WRAP — inline style amber
       Sudah di-cover oleh universal `[style*="background: #fffbeb"]`
       tapi pastikan inline dengan multiple style (background+border)
       juga ke-handle.
       ============================================================ */
    [data-theme="dark"] [style*="#fffbeb"][style*="#fde68a"],
    [data-theme="dark"] [style*="#fef3c7"][style*="#fde68a"] {
        background-color: rgba(245, 158, 11, 0.12) !important;
        border-color: rgba(245, 158, 11, 0.35) !important;
        color: var(--dm-text) !important;
    }

    /* ============================================================
       AMBER TEXT HARDCODE (#92400e, #b45309, #d97706, #78350f, #854d0e)
       Banyak label "Tipe Stok"/"Kategori Utama" dst pakai amber-700/800
       yang gelap di dark — naikkan jadi amber-300/400.
       ============================================================ */
    [data-theme="dark"] [class*="-badge"][class*="amber"],
    [data-theme="dark"] [class*="-badge"][class*="stok"],
    [data-theme="dark"] [class*="-badge"][class*="utama"],
    [data-theme="dark"] [class*="-badge"][class*="freelance"],
    [data-theme="dark"] [class*="-edit-badge"],
    [data-theme="dark"] [class*="-parent-badge"] {
        color: #fcd34d !important;
    }

    /* Inline color amber-800/700/900 hardcode */
    [data-theme="dark"] [style*="color: #92400e"],
    [data-theme="dark"] [style*="color:#92400e"],
    [data-theme="dark"] [style*="color: #b45309"],
    [data-theme="dark"] [style*="color:#b45309"],
    [data-theme="dark"] [style*="color: #78350f"],
    [data-theme="dark"] [style*="color:#78350f"],
    [data-theme="dark"] [style*="color: #854d0e"],
    [data-theme="dark"] [style*="color:#854d0e"] {
        color: #fcd34d !important;
    }
    /* Inline color red-700/800 hardcode (button label) */
    [data-theme="dark"] [style*="color: #b91c1c"],
    [data-theme="dark"] [style*="color:#b91c1c"],
    [data-theme="dark"] [style*="color: #991b1b"],
    [data-theme="dark"] [style*="color:#991b1b"],
    [data-theme="dark"] [style*="color: #dc2626"],
    [data-theme="dark"] [style*="color:#dc2626"] {
        color: #fca5a5 !important;
    }
    /* Inline color amber-600 hardcode (active accent) */
    [data-theme="dark"] [style*="color: #d97706"],
    [data-theme="dark"] [style*="color:#d97706"] {
        color: #fbbf24 !important;
    }

    /* ============================================================
       INLINE-STYLE FFFEF5 (super soft cream — perm-check hover)
       ============================================================ */
    [data-theme="dark"] [style*="background: #fffef5"],
    [data-theme="dark"] [style*="background:#fffef5"],
    [data-theme="dark"] [style*="background-color: #fffef5"],
    [data-theme="dark"] [style*="background-color:#fffef5"] {
        background-color: rgba(245, 158, 11, 0.10) !important;
    }

    /* ============================================================
       ANALISA STOK MODULE & GENERIC CUSTOM CONTAINERS
       Halaman /admin/analisa/stok pakai class:
         .custom-card, .filter-box, .mobile-card, .m-header, .m-row,
         .m-label, .m-val, .badge-soft-success/.danger/.info/.warning,
         <thead class="bg-light">, table-danger row state.
       ============================================================ */
    [data-theme="dark"] .custom-card,
    [data-theme="dark"] .filter-box,
    [data-theme="dark"] .mobile-card,
    [data-theme="dark"] .info-card,
    [data-theme="dark"] .data-card,
    [data-theme="dark"] .panel-card,
    [data-theme="dark"] .summary-card {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4) !important;
    }
    /* Mobile card divider & label */
    [data-theme="dark"] .m-header,
    [data-theme="dark"] .m-row {
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .m-label { color: var(--dm-muted) !important; }
    [data-theme="dark"] .m-val   { color: var(--dm-text) !important; }

    /* Bootstrap utility: bg-light (table head, panels, dividers) */
    [data-theme="dark"] .bg-light,
    [data-theme="dark"] thead.bg-light,
    [data-theme="dark"] tr.bg-light,
    [data-theme="dark"] .table-light,
    [data-theme="dark"] .table > :not(caption) > * > .table-light {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text) !important;
        --bs-table-bg: var(--dm-surface-2) !important;
        --bs-table-color: var(--dm-text) !important;
    }
    [data-theme="dark"] .bg-white {
        background-color: var(--dm-surface) !important;
        color: var(--dm-text) !important;
    }

    /* Bootstrap row state utilities — pastel pucat → tinted dark */
    [data-theme="dark"] .table-danger,
    [data-theme="dark"] .table > :not(caption) > * > .table-danger,
    [data-theme="dark"] tr.table-danger > * {
        background-color: rgba(239, 68, 68, 0.18) !important;
        --bs-table-bg: rgba(239, 68, 68, 0.18) !important;
        --bs-table-color: var(--dm-text) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .table-warning,
    [data-theme="dark"] .table > :not(caption) > * > .table-warning,
    [data-theme="dark"] tr.table-warning > * {
        background-color: rgba(245, 158, 11, 0.18) !important;
        --bs-table-bg: rgba(245, 158, 11, 0.18) !important;
        --bs-table-color: var(--dm-text) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .table-success,
    [data-theme="dark"] .table > :not(caption) > * > .table-success,
    [data-theme="dark"] tr.table-success > * {
        background-color: rgba(34, 197, 94, 0.18) !important;
        --bs-table-bg: rgba(34, 197, 94, 0.18) !important;
        --bs-table-color: var(--dm-text) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .table-info,
    [data-theme="dark"] .table > :not(caption) > * > .table-info,
    [data-theme="dark"] tr.table-info > * {
        background-color: rgba(59, 130, 246, 0.18) !important;
        --bs-table-bg: rgba(59, 130, 246, 0.18) !important;
        --bs-table-color: var(--dm-text) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .table-secondary,
    [data-theme="dark"] .table > :not(caption) > * > .table-secondary,
    [data-theme="dark"] tr.table-secondary > * {
        background-color: var(--dm-surface-2) !important;
        --bs-table-bg: var(--dm-surface-2) !important;
        --bs-table-color: var(--dm-text) !important;
        color: var(--dm-text) !important;
    }

    /* Bootstrap soft badges (pastel) — tinted dark */
    [data-theme="dark"] .badge-soft-success {
        background-color: rgba(34, 197, 94, 0.20) !important;
        color: #86efac !important;
    }
    [data-theme="dark"] .badge-soft-danger {
        background-color: rgba(239, 68, 68, 0.20) !important;
        color: #fca5a5 !important;
    }
    [data-theme="dark"] .badge-soft-info {
        background-color: rgba(59, 130, 246, 0.20) !important;
        color: #93c5fd !important;
    }
    [data-theme="dark"] .badge-soft-warning {
        background-color: rgba(245, 158, 11, 0.20) !important;
        color: #fcd34d !important;
    }
    [data-theme="dark"] .badge-soft-primary {
        background-color: rgba(245, 158, 11, 0.20) !important;
        color: #fcd34d !important;
    }
    [data-theme="dark"] .badge-soft-secondary {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .badge-soft-dark {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text) !important;
    }

    /* Generic alert utility on dark — pastel pucat → tinted */
    [data-theme="dark"] .alert-success {
        background-color: rgba(34, 197, 94, 0.15) !important;
        border-color: rgba(34, 197, 94, 0.35) !important;
        color: #86efac !important;
    }
    [data-theme="dark"] .alert-danger {
        background-color: rgba(239, 68, 68, 0.15) !important;
        border-color: rgba(239, 68, 68, 0.35) !important;
        color: #fca5a5 !important;
    }
    [data-theme="dark"] .alert-warning {
        background-color: rgba(245, 158, 11, 0.15) !important;
        border-color: rgba(245, 158, 11, 0.35) !important;
        color: #fcd34d !important;
    }
    [data-theme="dark"] .alert-info {
        background-color: rgba(59, 130, 246, 0.15) !important;
        border-color: rgba(59, 130, 246, 0.35) !important;
        color: #93c5fd !important;
    }
    [data-theme="dark"] .alert-primary {
        background-color: rgba(245, 158, 11, 0.15) !important;
        border-color: rgba(245, 158, 11, 0.35) !important;
        color: #fcd34d !important;
    }
    [data-theme="dark"] .alert-secondary {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }

    /* Inline-style bg-white di mobile-card (analisa stok) */
    [data-theme="dark"] [style*="background: white"]:not(.invoice-print):not(.print-area):not(.btn-glow):not(.sidebar-brand-gold):not(.logo-glass-frame),
    [data-theme="dark"] [style*="background:white"]:not(.invoice-print):not(.print-area):not(.btn-glow):not(.sidebar-brand-gold):not(.logo-glass-frame) {
        background-color: var(--dm-surface) !important;
        color: var(--dm-text) !important;
    }

    /* Stat-card dengan inline border-left-color (analisa/stok) — preserve accent, fix bg */
    [data-theme="dark"] .stat-card[style*="border-left-color"] {
        background-color: var(--dm-surface) !important;
        color: var(--dm-text) !important;
    }
    /* btn-primary-custom (yellow + black text) — boost contrast on dark */
    [data-theme="dark"] .btn-primary-custom {
        background-color: #f59e0b !important;
        color: #0f172a !important;
    }
    [data-theme="dark"] .btn-primary-custom:hover {
        background-color: #fbbf24 !important;
        color: #0f172a !important;
    }

    /* Form-control / form-select custom variants */
    [data-theme="dark"] .form-control-custom,
    [data-theme="dark"] .form-select-custom {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border-2) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .form-control-custom:focus,
    [data-theme="dark"] .form-select-custom:focus {
        background-color: var(--dm-surface-2) !important;
        border-color: #f59e0b !important;
        color: var(--dm-text) !important;
        box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.25) !important;
    }
    [data-theme="dark"] .form-control-custom::placeholder {
        color: var(--dm-muted) !important;
    }

    /* ============================================================
       SOFTEN HOVER (anti-silau)
       --------------------------------------------------
       --dm-elevated (#334155) terlalu terang waktu cursor
       lewat. Pakai --dm-surface-2 (#273449) jauh lebih halus,
       cuma sedikit lebih terang dari surface (#1e293b).
       Override semua jalur hover yang sebelumnya pakai elevated.
       ============================================================ */
    [data-theme="dark"] {
        --dm-elevated: #273449; /* turunkan terang dari #334155 */
    }

    /* Bootstrap 5 table hover variable */
    [data-theme="dark"] .table,
    [data-theme="dark"] table.dataTable,
    [data-theme="dark"] .table-modern {
        --bs-table-hover-bg: #273449 !important;
        --bs-table-hover-color: var(--dm-text) !important;
    }
    /* Force override final hover pada semua table */
    [data-theme="dark"] .table-hover > tbody > tr:hover > *,
    [data-theme="dark"] table tbody tr:hover,
    [data-theme="dark"] table tbody tr:hover > *,
    [data-theme="dark"] table tbody tr:hover td,
    [data-theme="dark"] table tbody tr:hover th {
        background-color: #273449 !important;
        color: var(--dm-text) !important;
    }
    /* Untuk row state (table-danger/warning/success/info) saat hover —
       jaga tinted-nya tapi sedikit lebih gelap supaya gak silau */
    [data-theme="dark"] .table-hover > tbody > tr.table-danger:hover > *,
    [data-theme="dark"] tr.table-danger:hover > * {
        background-color: rgba(239, 68, 68, 0.25) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .table-hover > tbody > tr.table-warning:hover > *,
    [data-theme="dark"] tr.table-warning:hover > * {
        background-color: rgba(245, 158, 11, 0.25) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .table-hover > tbody > tr.table-success:hover > *,
    [data-theme="dark"] tr.table-success:hover > * {
        background-color: rgba(34, 197, 94, 0.25) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .table-hover > tbody > tr.table-info:hover > *,
    [data-theme="dark"] tr.table-info:hover > * {
        background-color: rgba(59, 130, 246, 0.25) !important;
        color: var(--dm-text) !important;
    }

    /* Card hover — hilangkan shadow terang, pakai amber subtle ring */
    [data-theme="dark"] .card:hover,
    [data-theme="dark"] .custom-card:hover,
    [data-theme="dark"] .stat-card:hover,
    [data-theme="dark"] .filter-box:hover {
        box-shadow: 0 6px 20px rgba(0, 0, 0, 0.45),
                    0 0 0 1px rgba(245, 158, 11, 0.15) !important;
    }

    /* List-group hover */
    [data-theme="dark"] .list-group-item:hover,
    [data-theme="dark"] .list-group-item-action:hover {
        background-color: #273449 !important;
        color: var(--dm-text) !important;
    }

    /* Dropdown item hover */
    [data-theme="dark"] .dropdown-item:hover,
    [data-theme="dark"] .dropdown-item:focus {
        background-color: #273449 !important;
        color: var(--dm-text) !important;
    }

    /* Nav-link hover */
    [data-theme="dark"] .nav-link:hover,
    [data-theme="dark"] .nav-tabs .nav-link:hover {
        background-color: rgba(245, 158, 11, 0.08) !important;
        color: #fbbf24 !important;
    }

    /* Btn-outline-dark hover (Pengaturan Stok button) */
    [data-theme="dark"] .btn-outline-dark {
        color: var(--dm-text) !important;
        border-color: var(--dm-border-2) !important;
        background-color: transparent !important;
    }
    [data-theme="dark"] .btn-outline-dark:hover,
    [data-theme="dark"] .btn-outline-dark:focus {
        color: #0f172a !important;
        background-color: #fbbf24 !important;
        border-color: #fbbf24 !important;
    }
    [data-theme="dark"] .btn-outline-secondary {
        color: var(--dm-text) !important;
        border-color: var(--dm-border-2) !important;
        background-color: transparent !important;
    }
    [data-theme="dark"] .btn-outline-secondary:hover {
        color: var(--dm-text) !important;
        background-color: #273449 !important;
        border-color: var(--dm-border-2) !important;
    }

    /* ============================================================
       WHATTODO MODULE (.wt-*)
       Hardcode: #fff bg, #111827/#1f2937 text gelap → tidak terbaca di dark.
       ============================================================ */
    [data-theme="dark"] .wt-card,
    [data-theme="dark"] .wt-card-header {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .wt-header-title h5 { color: var(--dm-text) !important; }
    [data-theme="dark"] .wt-header-title p  { color: var(--dm-muted) !important; }
    [data-theme="dark"] .wt-item-text { color: var(--dm-text) !important; }
    [data-theme="dark"] .wt-item-text.completed { color: var(--dm-muted) !important; }
    [data-theme="dark"] .wt-item-meta { color: var(--dm-muted) !important; }
    [data-theme="dark"] .wt-item:hover {
        background-color: #273449 !important;
    }
    [data-theme="dark"] .wt-item + .wt-item,
    [data-theme="dark"] .wt-item {
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .wt-item-num {
        background-color: rgba(245, 158, 11, 0.20) !important;
        color: #fbbf24 !important;
    }
    [data-theme="dark"] .wt-btn-edit {
        background-color: rgba(245, 158, 11, 0.15) !important;
        border-color: rgba(245, 158, 11, 0.35) !important;
        color: #fbbf24 !important;
    }
    [data-theme="dark"] .wt-btn-edit:hover {
        background-color: #fbbf24 !important;
        color: #0f172a !important;
    }
    [data-theme="dark"] .wt-btn-delete {
        background-color: rgba(239, 68, 68, 0.15) !important;
        border-color: rgba(239, 68, 68, 0.35) !important;
        color: #fca5a5 !important;
    }
    [data-theme="dark"] .wt-btn-delete:hover {
        background-color: #ef4444 !important;
        color: #fff !important;
    }
    [data-theme="dark"] .wt-badge-member {
        background-color: rgba(59, 130, 246, 0.20) !important;
        border-color: rgba(59, 130, 246, 0.40) !important;
        color: #93c5fd !important;
    }
    [data-theme="dark"] .wt-section-divider {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .wt-section-label { color: var(--dm-muted) !important; }
    [data-theme="dark"] .wt-empty-state,
    [data-theme="dark"] .wt-empty-state h6,
    [data-theme="dark"] .wt-empty-state p {
        color: var(--dm-muted) !important;
    }
    [data-theme="dark"] .wt-counter {
        background-color: #fbbf24 !important;
        color: #0f172a !important;
    }
    /* Tambah Tugas button — global a:not(...) override paksa amber, balikin ke text gelap */
    [data-theme="dark"] a.wt-btn-add,
    [data-theme="dark"] .wt-btn-add,
    [data-theme="dark"] .wt-btn-add:hover,
    [data-theme="dark"] .wt-btn-add:focus,
    [data-theme="dark"] .wt-btn-add:visited {
        color: #0f172a !important;
        background: linear-gradient(135deg, #fbbf24, #f59e0b) !important;
        border-color: transparent !important;
    }
    [data-theme="dark"] .wt-btn-add:hover {
        background: linear-gradient(135deg, #f59e0b, #d97706) !important;
        box-shadow: 0 4px 12px rgba(245, 158, 11, 0.35) !important;
    }

    /* ============================================================
       PROJECT MARKETPLACE DASHBOARD (admin/projectMp/dashboard)
       Hardcode: card-order #fff, bg-relax #f1f5f9, bulk-toolbar #f8fafc,
       nav-pills #fff, modal-body-iframe #f8fafc, deadline-strip.bg-relax,
       text-nominal-black #1e293b. Semua silau di dark.
       ============================================================ */
    [data-theme="dark"] .card-order {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    /* Penanda TELAT: pertahankan border MERAH di dark mode (aturan .card-order di
       atas ber-!important dgn spesifisitas lebih tinggi akan menimpanya bila tak
       di-override khusus). Kartu instant tetap merah juga. */
    [data-theme="dark"] .card-order.status-late {
        border-color: var(--c-red, #ef4444) !important;
    }
    [data-theme="dark"] .card-order.card-instant {
        border-color: #ec4899 !important;
    }
    [data-theme="dark"] .card-order:hover {
        box-shadow: 0 10px 20px rgba(0, 0, 0, 0.45) !important;
    }
    [data-theme="dark"] .card-order .text-muted,
    [data-theme="dark"] .card-order small {
        color: var(--dm-muted) !important;
    }
    [data-theme="dark"] .bg-relax {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text-2) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .deadline-strip.bg-relax {
        background-color: var(--dm-border-2) !important;
    }
    [data-theme="dark"] .bulk-toolbar {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .bulk-toolbar .form-check-label,
    [data-theme="dark"] .bulk-toolbar label {
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .modal-body-iframe {
        background-color: var(--dm-bg) !important;
    }
    [data-theme="dark"] .text-nominal-black {
        color: var(--dm-text) !important;
    }
    /* nav-pills putih default → surface-2 */
    [data-theme="dark"] .nav-pills .nav-link {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text-2) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .nav-pills .nav-link:hover {
        background-color: #273449 !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .nav-pills .nav-link.active {
        color: #fff !important;
    }
    /* Badge pill di tab count: bg-light text-dark — over Bootstrap utility */
    [data-theme="dark"] .nav-pills .nav-link .badge.bg-light.text-dark,
    [data-theme="dark"] .nav-pills .nav-link .badge.bg-light {
        background-color: rgba(148, 163, 184, 0.20) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .nav-pills .nav-link.active .badge.bg-light.text-dark,
    [data-theme="dark"] .nav-pills .nav-link.active .badge.bg-light {
        background-color: rgba(255, 255, 255, 0.25) !important;
        color: #fff !important;
    }
    /* Header h4 .text-dark — Bootstrap utility text-dark = #212529 → fix */
    [data-theme="dark"] h1.text-dark,
    [data-theme="dark"] h2.text-dark,
    [data-theme="dark"] h3.text-dark,
    [data-theme="dark"] h4.text-dark,
    [data-theme="dark"] h5.text-dark,
    [data-theme="dark"] h6.text-dark,
    [data-theme="dark"] .text-dark {
        color: var(--dm-text) !important;
    }
    /* Generic toolbar suffix coverage */
    [data-theme="dark"] [class$="-toolbar"]:not(.btn-toolbar) {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }

    /* Bootstrap vertical rule separator (.vr) — silau di dark */
    [data-theme="dark"] .vr {
        background-color: var(--dm-border-2) !important;
        opacity: 0.4 !important;
    }

    /* ============================================================
       USERS / PERMISSIONS / GENERIC ADMIN INDEX MODULES
       Pola: .table-container white, .btn-add amber dengan text amber
       (kena global a:not() rule), .avatar-initial cream, .badge-role
       biru pucat, .guard-badge abu pucat, .perm-badge text gelap.
       ============================================================ */
    [data-theme="dark"] .table-container {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .table-container thead th {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border) !important;
    }
    /* Kartu form & header generik (Setup Packing dll) — tanpa ini latarnya
       tetap #fff hardcode → menyilaukan di mode gelap. */
    [data-theme="dark"] .form-card,
    [data-theme="dark"] .header-card {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .form-card .form-control,
    [data-theme="dark"] .form-card .form-select {
        background-color: var(--dm-elevated) !important;
        border-color: var(--dm-border-2) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .form-card .form-control::placeholder {
        color: var(--dm-dim) !important;
    }
    [data-theme="dark"] .form-card .form-text,
    [data-theme="dark"] .header-card .text-muted {
        color: var(--dm-muted) !important;
    }
    [data-theme="dark"] .form-card .form-label,
    [data-theme="dark"] .form-card .form-label-custom {
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .badge-grup {
        background-color: rgba(56, 189, 248, 0.18) !important;
        color: #7dd3fc !important;
    }
    [data-theme="dark"] .form-card .alert-info {
        background-color: rgba(56, 189, 248, 0.10) !important;
        border-color: rgba(56, 189, 248, 0.30) !important;
        color: #bae6fd !important;
    }
    /* Generic .btn-add — sama kasus wt-btn-add, override balikin text gelap kontras di amber */
    [data-theme="dark"] a.btn-add,
    [data-theme="dark"] .btn-add,
    [data-theme="dark"] .btn-add:hover,
    [data-theme="dark"] .btn-add:focus,
    [data-theme="dark"] .btn-add:visited {
        color: #0f172a !important;
        background-color: #fbbf24 !important;
        border-color: transparent !important;
    }
    [data-theme="dark"] .btn-add:hover {
        background-color: #f59e0b !important;
    }
    [data-theme="dark"] .avatar-initial {
        background-color: rgba(245, 158, 11, 0.20) !important;
        color: #fbbf24 !important;
    }
    [data-theme="dark"] .badge-role {
        background-color: rgba(99, 102, 241, 0.20) !important;
        color: #a5b4fc !important;
        border-color: rgba(99, 102, 241, 0.40) !important;
    }
    [data-theme="dark"] .guard-badge {
        background-color: rgba(148, 163, 184, 0.20) !important;
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .perm-badge {
        background-color: rgba(245, 158, 11, 0.18) !important;
        color: #fcd34d !important;
    }
    [data-theme="dark"] .perm-badge.perm-name {
        color: var(--dm-text) !important;
    }

    /* ============================================================
       BOOTSTRAP BUTTONS — text contrast in dark
       Solid-color buttons (btn-danger/primary/success/warning/info)
       MUST keep white text. Some inherit from generic dark text rules.
       ============================================================ */
    [data-theme="dark"] .btn-danger,
    [data-theme="dark"] .btn-danger:hover,
    [data-theme="dark"] .btn-danger:focus,
    [data-theme="dark"] .btn-danger:active,
    [data-theme="dark"] button.btn-danger,
    [data-theme="dark"] a.btn-danger {
        color: #fff !important;
    }
    [data-theme="dark"] .btn-primary,
    [data-theme="dark"] .btn-primary:hover,
    [data-theme="dark"] .btn-primary:focus,
    [data-theme="dark"] .btn-primary:active,
    [data-theme="dark"] button.btn-primary,
    [data-theme="dark"] a.btn-primary {
        color: #0f172a !important;
    }
    [data-theme="dark"] .btn-success,
    [data-theme="dark"] .btn-success:hover,
    [data-theme="dark"] .btn-success:focus,
    [data-theme="dark"] .btn-success:active {
        color: #fff !important;
    }
    [data-theme="dark"] .btn-warning,
    [data-theme="dark"] .btn-warning:hover,
    [data-theme="dark"] .btn-warning:focus,
    [data-theme="dark"] .btn-warning:active {
        color: #0f172a !important;
    }
    [data-theme="dark"] .btn-info,
    [data-theme="dark"] .btn-info:hover {
        color: #0f172a !important;
    }
    [data-theme="dark"] .btn-secondary,
    [data-theme="dark"] .btn-secondary:hover {
        color: #fff !important;
    }
    [data-theme="dark"] .btn-dark,
    [data-theme="dark"] .btn-dark:hover {
        color: #fff !important;
        background-color: #475569 !important;
        border-color: #475569 !important;
    }
    [data-theme="dark"] .btn-light {
        color: var(--dm-text) !important;
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
    }

    /* ============================================================
       BOOTSTRAP PAGINATION (.page-link / .page-item)
       Default: bg white, text primary blue. Silau + text invisible.
       ============================================================ */
    [data-theme="dark"] .page-link {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .page-link:hover {
        background-color: var(--dm-surface-2) !important;
        color: #fbbf24 !important;
    }
    [data-theme="dark"] .page-item.active .page-link {
        background-color: #fbbf24 !important;
        border-color: #fbbf24 !important;
        color: #0f172a !important;
    }
    [data-theme="dark"] .page-item.disabled .page-link {
        background-color: var(--dm-surface) !important;
        color: var(--dm-muted) !important;
    }

    /* ============================================================
       BOOTSTRAP TEXT UTILITIES — soften over-saturated colors
       Default Bootstrap text-primary uses pure indigo (#321fdb / equivalent).
       Tone down for dark contrast.
       ============================================================ */
    [data-theme="dark"] .text-primary {
        color: #818cf8 !important;
    }
    [data-theme="dark"] .text-secondary {
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .text-muted,
    [data-theme="dark"] .text-body-secondary {
        color: var(--dm-muted) !important;
    }
    [data-theme="dark"] .text-info {
        color: #67e8f9 !important;
    }
    [data-theme="dark"] .text-success {
        color: #6ee7b7 !important;
    }
    [data-theme="dark"] .text-warning {
        color: #fbbf24 !important;
    }
    [data-theme="dark"] .text-danger {
        color: #fca5a5 !important;
    }
    [data-theme="dark"] .text-body {
        color: var(--dm-text) !important;
    }

    /* ============================================================
       UNIVERSAL "-container" SUFFIX SWEEP
       Many modules name their wrapper with "-container" suffix and
       leave it white. Anything that's a containing surface should
       use the dark surface var.
       ============================================================ */
    [data-theme="dark"] [class$="-container"]:not(.production-tabs-container):not(.dropdown-menu) {
        background-color: var(--dm-surface) !important;
        color: var(--dm-text) !important;
    }

    /* ============================================================
       UNIVERSAL BADGE COLOR PALETTE
       Pola di semua module: .{prefix}-badge-{color} dengan bg pastel
       (#dbeafe, #dcfce7, #fef3c7, dll) dan text gelap. Banyak text
       jadi tetap gelap di dark mode → silau + tidak terbaca.
       Tone-down ke alpha + light text.
       ============================================================ */
    [data-theme="dark"] [class*="-badge-green"],
    [data-theme="dark"] [class*="-badge-success"],
    [data-theme="dark"] [class*="-badge-aktif"] {
        background-color: rgba(34, 197, 94, 0.18) !important;
        color: #6ee7b7 !important;
        border-color: rgba(34, 197, 94, 0.35) !important;
    }
    [data-theme="dark"] [class*="-badge-blue"],
    [data-theme="dark"] [class*="-badge-info"],
    [data-theme="dark"] [class*="-badge-karyawan"] {
        background-color: rgba(59, 130, 246, 0.18) !important;
        color: #93c5fd !important;
        border-color: rgba(59, 130, 246, 0.35) !important;
    }
    [data-theme="dark"] [class*="-badge-yellow"],
    [data-theme="dark"] [class*="-badge-amber"],
    [data-theme="dark"] [class*="-badge-warning"],
    [data-theme="dark"] [class*="-badge-freelance"],
    [data-theme="dark"] [class*="-badge-stok"],
    [data-theme="dark"] [class*="-badge-utama"] {
        background-color: rgba(245, 158, 11, 0.18) !important;
        color: #fcd34d !important;
        border-color: rgba(245, 158, 11, 0.35) !important;
    }
    [data-theme="dark"] [class*="-badge-red"],
    [data-theme="dark"] [class*="-badge-danger"] {
        background-color: rgba(239, 68, 68, 0.18) !important;
        color: #fca5a5 !important;
        border-color: rgba(239, 68, 68, 0.35) !important;
    }
    [data-theme="dark"] [class*="-badge-purple"],
    [data-theme="dark"] [class*="-badge-violet"],
    [data-theme="dark"] [class*="-badge-produksi"],
    [data-theme="dark"] [class*="-badge-sub"] {
        background-color: rgba(139, 92, 246, 0.18) !important;
        color: #c4b5fd !important;
        border-color: rgba(139, 92, 246, 0.35) !important;
    }
    [data-theme="dark"] [class*="-badge-gray"],
    [data-theme="dark"] [class*="-badge-count"],
    [data-theme="dark"] [class*="-badge-jual"],
    [data-theme="dark"] [class*="-badge-beli"],
    [data-theme="dark"] [class*="-badge-ops"] {
        background-color: rgba(148, 163, 184, 0.18) !important;
        color: var(--dm-text-2) !important;
        border-color: rgba(148, 163, 184, 0.35) !important;
    }
    /* preserve specific overrides for jual/beli (jual=blue, beli=green) */
    [data-theme="dark"] [class*="-badge-jual"] {
        background-color: rgba(59, 130, 246, 0.18) !important;
        color: #93c5fd !important;
    }
    [data-theme="dark"] [class*="-badge-beli"] {
        background-color: rgba(34, 197, 94, 0.18) !important;
        color: #6ee7b7 !important;
    }
    /* "edit-badge" / "parent-badge" — yellow-ish edit indicator */
    [data-theme="dark"] [class*="-edit-badge"],
    [data-theme="dark"] [class*="-parent-badge"],
    [data-theme="dark"] [class*="-price-badge"] {
        background: rgba(245, 158, 11, 0.18) !important;
        background-image: none !important;
        color: #fcd34d !important;
        border-color: rgba(245, 158, 11, 0.40) !important;
    }

    /* ============================================================
       UNIVERSAL COUNTER (-counter suffix)
       Pola: .{prefix}-counter dengan bg yellow/amber + text dark.
       Tetap pakai amber bg, tapi text-nya kontras (dark slate).
       ============================================================ */
    [data-theme="dark"] [class$="-counter"] {
        background-color: #fbbf24 !important;
        color: #0f172a !important;
    }

    /* ============================================================
       UNIVERSAL ACTION BUTTONS (-btn-action / -btn-edit / -btn-delete)
       Default: white bg, colored text.
       ============================================================ */
    /* btn-edit / btn-view / btn-detail / btn-action → gold tinted (konsisten brand) */
    [data-theme="dark"] [class$="-btn-action"],
    [data-theme="dark"] [class*="-btn-edit"],
    [data-theme="dark"] [class*="-btn-view"],
    [data-theme="dark"] [class*="-btn-detail"] {
        background-color: rgba(245, 158, 11, 0.15) !important;
        background-image: none !important;
        color: #fbbf24 !important;
        border-color: rgba(245, 158, 11, 0.35) !important;
    }
    [data-theme="dark"] [class$="-btn-action"]:hover,
    [data-theme="dark"] [class*="-btn-edit"]:hover,
    [data-theme="dark"] [class*="-btn-view"]:hover,
    [data-theme="dark"] [class*="-btn-detail"]:hover {
        background-color: rgba(245, 158, 11, 0.30) !important;
        background-image: none !important;
        color: #fcd34d !important;
        border-color: rgba(245, 158, 11, 0.55) !important;
    }
    /* btn-delete → red tinted */
    [data-theme="dark"] [class*="-btn-delete"] {
        background-color: rgba(239, 68, 68, 0.15) !important;
        background-image: none !important;
        color: #fca5a5 !important;
        border-color: rgba(239, 68, 68, 0.35) !important;
    }
    [data-theme="dark"] [class*="-btn-delete"]:hover {
        background-color: rgba(239, 68, 68, 0.30) !important;
        background-image: none !important;
        color: #fecaca !important;
        border-color: rgba(239, 68, 68, 0.55) !important;
    }

    /* ============================================================
       UNIVERSAL PRIMARY BUTTONS (-btn-add / -btn-submit / -btn-save /
       -btn-create / -btn-confirm / -btn-publish / -btn-export)
       Pattern: gold/amber gradient di light mode → text-nya harus
       dipaksa dark agar tidak gold-on-gold (rule global a:not(...)
       memaksa <a> jadi gold).
       ============================================================ */
    [data-theme="dark"] [class*="-btn-add"],
    [data-theme="dark"] a[class*="-btn-add"],
    [data-theme="dark"] button[class*="-btn-add"],
    [data-theme="dark"] [class*="-btn-submit"],
    [data-theme="dark"] a[class*="-btn-submit"],
    [data-theme="dark"] button[class*="-btn-submit"],
    [data-theme="dark"] [class*="-btn-save"],
    [data-theme="dark"] a[class*="-btn-save"],
    [data-theme="dark"] button[class*="-btn-save"],
    [data-theme="dark"] [class*="-btn-create"],
    [data-theme="dark"] a[class*="-btn-create"],
    [data-theme="dark"] button[class*="-btn-create"],
    [data-theme="dark"] [class*="-btn-confirm"],
    [data-theme="dark"] a[class*="-btn-confirm"],
    [data-theme="dark"] button[class*="-btn-confirm"],
    [data-theme="dark"] [class*="-btn-publish"],
    [data-theme="dark"] a[class*="-btn-publish"],
    [data-theme="dark"] button[class*="-btn-publish"],
    [data-theme="dark"] [class*="-btn-export"],
    [data-theme="dark"] a[class*="-btn-export"],
    [data-theme="dark"] button[class*="-btn-export"] {
        background: linear-gradient(135deg, #fbbf24, #f59e0b) !important;
        color: #1f2937 !important;
        border-color: transparent !important;
    }
    [data-theme="dark"] [class*="-btn-add"]:hover,
    [data-theme="dark"] a[class*="-btn-add"]:hover,
    [data-theme="dark"] button[class*="-btn-add"]:hover,
    [data-theme="dark"] [class*="-btn-submit"]:hover,
    [data-theme="dark"] a[class*="-btn-submit"]:hover,
    [data-theme="dark"] button[class*="-btn-submit"]:hover,
    [data-theme="dark"] [class*="-btn-save"]:hover,
    [data-theme="dark"] a[class*="-btn-save"]:hover,
    [data-theme="dark"] button[class*="-btn-save"]:hover,
    [data-theme="dark"] [class*="-btn-create"]:hover,
    [data-theme="dark"] a[class*="-btn-create"]:hover,
    [data-theme="dark"] button[class*="-btn-create"]:hover,
    [data-theme="dark"] [class*="-btn-confirm"]:hover,
    [data-theme="dark"] a[class*="-btn-confirm"]:hover,
    [data-theme="dark"] button[class*="-btn-confirm"]:hover,
    [data-theme="dark"] [class*="-btn-publish"]:hover,
    [data-theme="dark"] a[class*="-btn-publish"]:hover,
    [data-theme="dark"] button[class*="-btn-publish"]:hover,
    [data-theme="dark"] [class*="-btn-export"]:hover,
    [data-theme="dark"] a[class*="-btn-export"]:hover,
    [data-theme="dark"] button[class*="-btn-export"]:hover {
        background: linear-gradient(135deg, #f59e0b, #d97706) !important;
        color: #111827 !important;
        box-shadow: 0 4px 12px rgba(245, 158, 11, 0.45) !important;
    }

    /* ============================================================
       UNIVERSAL NEUTRAL BUTTONS (-btn-back / -btn-cancel / -btn-close)
       ============================================================ */
    [data-theme="dark"] [class*="-btn-back"],
    [data-theme="dark"] a[class*="-btn-back"],
    [data-theme="dark"] button[class*="-btn-back"],
    [data-theme="dark"] [class*="-btn-cancel"],
    [data-theme="dark"] a[class*="-btn-cancel"],
    [data-theme="dark"] button[class*="-btn-cancel"],
    [data-theme="dark"] [class*="-btn-close"]:not(.btn-close),
    [data-theme="dark"] a[class*="-btn-close"]:not(.btn-close),
    [data-theme="dark"] button[class*="-btn-close"]:not(.btn-close) {
        background-color: var(--dm-elevated) !important;
        background-image: none !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border-2) !important;
    }
    [data-theme="dark"] [class*="-btn-back"]:hover,
    [data-theme="dark"] a[class*="-btn-back"]:hover,
    [data-theme="dark"] button[class*="-btn-back"]:hover,
    [data-theme="dark"] [class*="-btn-cancel"]:hover,
    [data-theme="dark"] a[class*="-btn-cancel"]:hover,
    [data-theme="dark"] button[class*="-btn-cancel"]:hover,
    [data-theme="dark"] [class*="-btn-close"]:not(.btn-close):hover,
    [data-theme="dark"] a[class*="-btn-close"]:not(.btn-close):hover,
    [data-theme="dark"] button[class*="-btn-close"]:not(.btn-close):hover {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text) !important;
        border-color: rgba(245, 158, 11, 0.55) !important;
    }

    /* ============================================================
       UNIVERSAL INPUT/SELECT/FILTER/SEARCH (white bg by default)
       Pola di banyak module: .{prefix}-select, .{prefix}-filter,
       .{prefix}-search, .{prefix}-form-input, .{prefix}-form-select.
       ============================================================ */
    [data-theme="dark"] [class$="-select"]:not(.form-select):not(.tom-select),
    [data-theme="dark"] [class$="-filter"]:not(.role-filter),
    [data-theme="dark"] [class$="-search"],
    [data-theme="dark"] [class*="-form-input"],
    [data-theme="dark"] [class*="-form-select"],
    [data-theme="dark"] [class*="-form-textarea"] {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] [class$="-select"]:not(.form-select):not(.tom-select):focus,
    [data-theme="dark"] [class$="-search"]:focus,
    [data-theme="dark"] [class*="-form-input"]:focus,
    [data-theme="dark"] [class*="-form-select"]:focus,
    [data-theme="dark"] [class*="-form-textarea"]:focus {
        background-color: var(--dm-elevated) !important;
        border-color: #fbbf24 !important;
        color: var(--dm-text) !important;
    }

    /* ============================================================
       DATATABLES PAGINATION (.paginate_button / .dataTables_paginate)
       Default: a tag with light bg + dark text.
       ============================================================ */
    [data-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button {
        background: var(--dm-surface) !important;
        background-image: none !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.current,
    [data-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
        background: #fbbf24 !important;
        background-image: none !important;
        color: #0f172a !important;
        border-color: #fbbf24 !important;
    }
    [data-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
        background: var(--dm-surface-2) !important;
        background-image: none !important;
        color: #fbbf24 !important;
        border-color: var(--dm-border-2) !important;
    }
    [data-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
    [data-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover {
        background: var(--dm-surface) !important;
        color: var(--dm-muted) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .dataTables_wrapper .dataTables_length,
    [data-theme="dark"] .dataTables_wrapper .dataTables_filter,
    [data-theme="dark"] .dataTables_wrapper .dataTables_info,
    [data-theme="dark"] .dataTables_wrapper .dataTables_processing,
    [data-theme="dark"] .dataTables_wrapper .dataTables_paginate {
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .dataTables_wrapper .dataTables_length select,
    [data-theme="dark"] .dataTables_wrapper .dataTables_filter input {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }

    /* ============================================================
       PEGAWAI MODULE — extra: H4 nominal text fallback to dark
       (in pegawai card kpi, h4 has no class, gets default dark)
       ============================================================ */
    [data-theme="dark"] .pg-card h4,
    [data-theme="dark"] .pg-kpi h4,
    [data-theme="dark"] [class*="pg-"] h4 {
        color: var(--dm-text) !important;
    }

    /* ============================================================
       SEARCH-PILL / CARD-MODERN / CARD-ICON (cross-module patterns)
       ============================================================ */
    [data-theme="dark"] .search-pill {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .search-pill:focus,
    [data-theme="dark"] .search-pill input:focus {
        border-color: #fbbf24 !important;
        background-color: var(--dm-elevated) !important;
    }
    [data-theme="dark"] .search-pill input,
    [data-theme="dark"] .search-pill select,
    [data-theme="dark"] .search-pill .form-control,
    [data-theme="dark"] .search-pill .form-select {
        background-color: transparent !important;
        color: var(--dm-text) !important;
        border-color: transparent !important;
    }
    [data-theme="dark"] .search-pill input::placeholder {
        color: var(--dm-muted) !important;
    }
    [data-theme="dark"] .card-modern {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    /* card-icon background tones — soften to alpha so emoji/icon text remains readable */
    [data-theme="dark"] .card-icon {
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .card-icon.icon-kas,
    [data-theme="dark"] .icon-kas {
        background-color: rgba(34, 197, 94, 0.18) !important;
        color: #6ee7b7 !important;
    }
    [data-theme="dark"] .card-icon.icon-default,
    [data-theme="dark"] .icon-default {
        background-color: rgba(245, 158, 11, 0.18) !important;
        color: #fcd34d !important;
    }
    [data-theme="dark"] .card-icon.icon-bank,
    [data-theme="dark"] .icon-bank {
        background-color: rgba(59, 130, 246, 0.18) !important;
        color: #93c5fd !important;
    }
    [data-theme="dark"] .card-icon.icon-piutang,
    [data-theme="dark"] .icon-piutang {
        background-color: rgba(239, 68, 68, 0.18) !important;
        color: #fca5a5 !important;
    }

    /* ============================================================
       PEGAWAI TABS (.pg-tabs / .pg-subtab) — extra coverage
       ============================================================ */
    [data-theme="dark"] .pg-tabs {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .pg-tab {
        color: var(--dm-text-2) !important;
        background-color: transparent !important;
    }
    [data-theme="dark"] .pg-tab:hover {
        color: #fbbf24 !important;
    }
    [data-theme="dark"] .pg-tab.active {
        color: #fbbf24 !important;
        border-bottom-color: #fbbf24 !important;
    }
    [data-theme="dark"] .pg-subtab {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .pg-subtab:hover {
        border-color: #fbbf24 !important;
        color: #fbbf24 !important;
    }
    [data-theme="dark"] .pg-subtab.active {
        background-color: #fbbf24 !important;
        border-color: #fbbf24 !important;
        color: #0f172a !important;
    }

    /* ============================================================
       BOOTSTRAP BG UTILITIES WITH bg-opacity-10
       Pola: .bg-purple .bg-opacity-10 .text-purple → bg pucat ungu.
       Tambah override agar tone-down di dark mode.
       ============================================================ */
    [data-theme="dark"] .bg-purple.bg-opacity-10,
    [data-theme="dark"] .bg-purple.bg-opacity-25 {
        background-color: rgba(139, 92, 246, 0.18) !important;
        color: #c4b5fd !important;
    }
    [data-theme="dark"] .text-purple {
        color: #c4b5fd !important;
    }
    [data-theme="dark"] .border-purple {
        border-color: rgba(139, 92, 246, 0.40) !important;
    }

    /* ============================================================
       AUTOCOMPLETE-RESULTS (cross-module dropdown)
       Pola: position:absolute; background:#fff dropdown.
       ============================================================ */
    [data-theme="dark"] .autocomplete-results {
        background-color: var(--dm-elevated) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
        box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.4) !important;
    }
    [data-theme="dark"] .autocomplete-results > * {
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .autocomplete-results [class*="item"]:hover,
    [data-theme="dark"] .autocomplete-results > div:hover,
    [data-theme="dark"] .autocomplete-results > li:hover,
    [data-theme="dark"] .autocomplete-results > a:hover {
        background-color: var(--dm-surface-2) !important;
        color: #fbbf24 !important;
    }

    /* ============================================================
       ROLES MODULE — .role-badge.role-name & .role-badge variants
       (yellow/cream bg in light, name text dark)
       ============================================================ */
    [data-theme="dark"] .role-badge,
    [data-theme="dark"] .role-badge.role-name {
        background-color: rgba(245, 158, 11, 0.18) !important;
        color: #fcd34d !important;
        border-color: rgba(245, 158, 11, 0.40) !important;
    }
    [data-theme="dark"] .role-badge-lg {
        background-color: rgba(245, 158, 11, 0.18) !important;
        color: #fcd34d !important;
    }
    [data-theme="dark"] .menu-group-badge {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border) !important;
    }

    /* ============================================================
       PO MODULE (admin/po/index.blade.php)
       ============================================================ */
    [data-theme="dark"] .filter-widget {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .filter-widget label {
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .filter-chip {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .filter-chip:hover {
        background-color: var(--dm-elevated) !important;
        color: #fbbf24 !important;
        border-color: var(--dm-border-2) !important;
    }
    [data-theme="dark"] .filter-chip.active {
        background-color: #fbbf24 !important;
        border-color: #fbbf24 !important;
        color: #0f172a !important;
    }
    [data-theme="dark"] .form-control-date {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .form-control-date:focus {
        background-color: var(--dm-elevated) !important;
        border-color: #fbbf24 !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .btn-reset-po {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .btn-reset-po:hover {
        background-color: var(--dm-elevated) !important;
        color: #fbbf24 !important;
        border-color: var(--dm-border-2) !important;
    }
    /* PO status badge variants */
    [data-theme="dark"] .status-badge.status-process {
        background-color: rgba(245, 158, 11, 0.18) !important;
        color: #fcd34d !important;
        border-color: rgba(245, 158, 11, 0.35) !important;
    }
    [data-theme="dark"] .status-badge.status-finish {
        background-color: rgba(34, 197, 94, 0.18) !important;
        color: #6ee7b7 !important;
        border-color: rgba(34, 197, 94, 0.35) !important;
    }
    [data-theme="dark"] .status-badge.status-pending {
        background-color: rgba(148, 163, 184, 0.18) !important;
        color: var(--dm-text-2) !important;
        border-color: rgba(148, 163, 184, 0.35) !important;
    }
    /* PO supplier icon (light blue circle) */
    [data-theme="dark"] .supplier-icon {
        background-color: rgba(59, 130, 246, 0.18) !important;
        color: #93c5fd !important;
    }
    [data-theme="dark"] .est-badge {
        background-color: rgba(239, 68, 68, 0.15) !important;
        color: #fca5a5 !important;
        border-color: rgba(239, 68, 68, 0.30) !important;
    }
    [data-theme="dark"] .btn-terima {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .btn-terima:hover {
        background-color: rgba(34, 197, 94, 0.20) !important;
        color: #6ee7b7 !important;
        border-color: rgba(34, 197, 94, 0.40) !important;
    }
    [data-theme="dark"] .btn-terima:disabled,
    [data-theme="dark"] .btn-terima.disabled,
    [data-theme="dark"] .btn-terima:disabled:hover,
    [data-theme="dark"] .btn-terima.disabled:hover {
        background-color: var(--dm-surface) !important;
        color: var(--dm-muted) !important;
        border-color: var(--dm-border) !important;
    }

    /* ============================================================
       PO MODULE — extras (data-widget, po-tab-btn, tab-count)
       ============================================================ */
    [data-theme="dark"] .data-widget {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .po-tab-btn {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .po-tab-btn:hover {
        background-color: var(--dm-elevated) !important;
        color: #fbbf24 !important;
    }
    [data-theme="dark"] .po-tab-btn.active {
        background-color: #fbbf24 !important;
        border-color: #fbbf24 !important;
        color: #0f172a !important;
    }
    [data-theme="dark"] .po-tab-btn .tab-count,
    [data-theme="dark"] .tab-count {
        background-color: var(--dm-elevated) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .po-tab-btn:not(.active) .tab-count {
        background-color: var(--dm-elevated) !important;
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .po-tab-btn.active .tab-count {
        background-color: rgba(15, 23, 42, 0.25) !important;
        color: #0f172a !important;
    }

    /* ============================================================
       LEVELS / BAGIAN / GENERIC TABLE MODULES
       (.data-row, .col-nama, .card-header-custom, .search-input)
       ============================================================ */
    [data-theme="dark"] .data-row,
    [data-theme="dark"] tr.data-row {
        background-color: var(--dm-surface) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .data-row:hover,
    [data-theme="dark"] tr.data-row:hover {
        background-color: var(--dm-elevated) !important;
    }
    [data-theme="dark"] .data-row td {
        background-color: transparent !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .col-nama,
    [data-theme="dark"] td.col-nama {
        background-color: rgba(245, 158, 11, 0.10) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .card-header-custom {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .card-header-custom h1,
    [data-theme="dark"] .card-header-custom h2,
    [data-theme="dark"] .card-header-custom h3,
    [data-theme="dark"] .card-header-custom h4,
    [data-theme="dark"] .card-header-custom h5,
    [data-theme="dark"] .card-header-custom h6 {
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .search-input {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .search-input::placeholder {
        color: var(--dm-muted) !important;
    }
    [data-theme="dark"] .search-input:focus {
        background-color: var(--dm-elevated) !important;
        border-color: #fbbf24 !important;
        color: var(--dm-text) !important;
    }

    /* ============================================================
       SUBDIVISI — sv-name, sv-counter (hardcoded #111827 in light)
       ============================================================ */
    [data-theme="dark"] .sv-name {
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .sv-counter {
        background-color: rgba(245, 158, 11, 0.20) !important;
        color: #fcd34d !important;
    }
    [data-theme="dark"] .sv-table,
    [data-theme="dark"] .sv-table thead th {
        background-color: var(--dm-surface) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .sv-table tbody td {
        background-color: var(--dm-surface) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border) !important;
    }

    /* ============================================================
       BARE STRONG / B inside cards (default to inherit, not black)
       ============================================================ */
    [data-theme="dark"] .card strong,
    [data-theme="dark"] .card b,
    [data-theme="dark"] .table strong,
    [data-theme="dark"] .table b,
    [data-theme="dark"] .data-row strong,
    [data-theme="dark"] .data-row b,
    [data-theme="dark"] [class$="-card"] strong,
    [data-theme="dark"] [class$="-card"] b {
        color: inherit !important;
    }

    /* ============================================================
       NATIVE INPUT date/text fallback (white in some browsers)
       Only apply to inputs not already styled by other rules.
       ============================================================ */
    [data-theme="dark"] input[type="date"],
    [data-theme="dark"] input[type="datetime-local"],
    [data-theme="dark"] input[type="time"],
    [data-theme="dark"] input[type="month"],
    [data-theme="dark"] input[type="week"] {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
        color-scheme: dark;
    }
    [data-theme="dark"] input[type="date"]::-webkit-calendar-picker-indicator,
    [data-theme="dark"] input[type="datetime-local"]::-webkit-calendar-picker-indicator,
    [data-theme="dark"] input[type="time"]::-webkit-calendar-picker-indicator {
        filter: invert(0.85);
        cursor: pointer;
    }

    /* ============================================================
       BOOTSTRAP BUTTON .d-md-inline label fallback
       Sometimes a span.d-md-inline inside btn-warning gets default
       dark text. The button itself is amber, so keep dark text.
       Already handled by .btn-warning rule above — no-op safeguard.
       ============================================================ */

    /* ============================================================
       UNIVERSAL DARK-TEXT FALLBACK
       Banyak modul punya scoped CSS pakai gray-900 / gray-800
       tanpa override dark mode. Force semua text gelap jadi terang.
       ============================================================ */
    [data-theme="dark"] [class*="-header"] h1,
    [data-theme="dark"] [class*="-header"] h2,
    [data-theme="dark"] [class*="-header"] h3,
    [data-theme="dark"] [class*="-header"] h4,
    [data-theme="dark"] [class*="-header"] h5,
    [data-theme="dark"] [class*="-header"] h6,
    [data-theme="dark"] [class*="-title"] h1,
    [data-theme="dark"] [class*="-title"] h2,
    [data-theme="dark"] [class*="-title"] h3,
    [data-theme="dark"] [class*="-title"] h4,
    [data-theme="dark"] [class*="-title"] h5,
    [data-theme="dark"] [class*="-title"] h6 {
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] [class*="-text"]:not(.text-warning):not(.text-success):not(.text-danger):not(.text-info):not(.text-primary) {
        /* leave Bootstrap text-* utilities alone, fix only generic *-text scoped classes */
    }

    /* ============================================================
       ROUND 6 — Sweep findings (sewas, ecommerce/products, aset,
       marketplace-returns, pricing, produksi-produk)
       ============================================================ */

    /* Bootstrap progress bar (sewas, dashboards) */
    [data-theme="dark"] .progress {
        background-color: var(--dm-surface-2) !important;
    }
    [data-theme="dark"] .progress-bar {
        color: #0f172a !important;
    }

    /* btn-outline-primary purple → soft blue */
    [data-theme="dark"] .btn-outline-primary {
        color: #93c5fd !important;
        border-color: rgba(147, 197, 253, 0.45) !important;
        background-color: transparent !important;
    }
    [data-theme="dark"] .btn-outline-primary:hover,
    [data-theme="dark"] .btn-outline-primary:focus,
    [data-theme="dark"] .btn-outline-primary.active,
    [data-theme="dark"] .btn-outline-primary:active {
        background-color: rgba(147, 197, 253, 0.18) !important;
        color: #fbbf24 !important;
        border-color: rgba(147, 197, 253, 0.6) !important;
    }
    [data-theme="dark"] .btn-outline-primary:disabled,
    [data-theme="dark"] .btn-outline-primary.disabled {
        color: var(--dm-muted) !important;
        border-color: var(--dm-border) !important;
        background-color: transparent !important;
    }

    /* btn-reset / .btn-reset light gray utility (produksi-produk filter) */
    [data-theme="dark"] .btn-reset {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .btn-reset:hover {
        background-color: var(--dm-elevated) !important;
        color: #fbbf24 !important;
        border-color: var(--dm-border-2) !important;
    }

    /* Ecommerce — product image placeholders */
    [data-theme="dark"] .product-img,
    [data-theme="dark"] .product-img-placeholder {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-muted) !important;
    }

    /* Ecommerce — stock badges */
    [data-theme="dark"] .stock-badge.stock-zero {
        background-color: rgba(239, 68, 68, 0.18) !important;
        color: #fca5a5 !important;
        border-color: rgba(239, 68, 68, 0.30) !important;
    }
    [data-theme="dark"] .stock-badge.stock-inf {
        background-color: rgba(139, 92, 246, 0.18) !important;
        color: #c4b5fd !important;
        border-color: rgba(139, 92, 246, 0.30) !important;
    }
    [data-theme="dark"] .stock-badge.stock-low {
        background-color: rgba(251, 191, 36, 0.18) !important;
        color: #fcd34d !important;
        border-color: rgba(251, 191, 36, 0.30) !important;
    }
    [data-theme="dark"] .stock-badge.stock-ok {
        background-color: rgba(34, 197, 94, 0.18) !important;
        color: #86efac !important;
        border-color: rgba(34, 197, 94, 0.30) !important;
    }

    /* Aset — group header light yellow */
    [data-theme="dark"] .group-header {
        background-color: var(--dm-surface-2) !important;
        color: #fbbf24 !important;
        border-color: var(--dm-border) !important;
    }

    /* Marketplace Returns — badge-status family */
    [data-theme="dark"] .badge-status {
        border: 1px solid transparent !important;
    }
    [data-theme="dark"] .badge-status.badge-cancelled {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text-2) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .badge-status.badge-cancellation {
        background-color: rgba(236, 72, 153, 0.18) !important;
        color: #f9a8d4 !important;
        border-color: rgba(236, 72, 153, 0.30) !important;
    }
    [data-theme="dark"] .badge-status.badge-jurnal-yes {
        background-color: rgba(34, 197, 94, 0.18) !important;
        color: #86efac !important;
        border-color: rgba(34, 197, 94, 0.30) !important;
    }
    [data-theme="dark"] .badge-status.badge-jurnal-no {
        background-color: rgba(239, 68, 68, 0.18) !important;
        color: #fca5a5 !important;
        border-color: rgba(239, 68, 68, 0.30) !important;
    }
    [data-theme="dark"] .badge-status.badge-return {
        background-color: rgba(59, 130, 246, 0.18) !important;
        color: #93c5fd !important;
        border-color: rgba(59, 130, 246, 0.30) !important;
    }
    [data-theme="dark"] .badge-status.badge-processing {
        background-color: rgba(59, 130, 246, 0.18) !important;
        color: #93c5fd !important;
        border-color: rgba(59, 130, 246, 0.30) !important;
    }
    [data-theme="dark"] .badge-status.badge-accepted {
        background-color: rgba(99, 102, 241, 0.18) !important;
        color: #a5b4fc !important;
        border-color: rgba(99, 102, 241, 0.30) !important;
    }

    /* Marketplace Returns — stat-value dark text */
    [data-theme="dark"] .stat-value {
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .stat-label {
        color: var(--dm-muted) !important;
    }

    /* Generic anchor with text-decoration-none in dark grids → soft blue */
    [data-theme="dark"] a.text-decoration-none {
        color: #93c5fd !important;
    }
    [data-theme="dark"] a.text-decoration-none:hover {
        color: #fbbf24 !important;
    }

    /* Pricing module — pc-sku / pc-margin / pc-filters / pc-filter-input */
    [data-theme="dark"] .pc-sku {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text-2) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .pc-margin {
        border: 1px solid transparent !important;
    }
    [data-theme="dark"] .pc-margin.margin-sehat {
        background-color: rgba(34, 197, 94, 0.18) !important;
        color: #86efac !important;
        border-color: rgba(34, 197, 94, 0.30) !important;
    }
    [data-theme="dark"] .pc-margin.margin-bahaya {
        background-color: rgba(239, 68, 68, 0.18) !important;
        color: #fca5a5 !important;
        border-color: rgba(239, 68, 68, 0.30) !important;
    }
    [data-theme="dark"] .pc-margin.margin-warning,
    [data-theme="dark"] .pc-margin.margin-low {
        background-color: rgba(251, 191, 36, 0.18) !important;
        color: #fcd34d !important;
        border-color: rgba(251, 191, 36, 0.30) !important;
    }
    [data-theme="dark"] .pc-filters {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .pc-filter-input {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .pc-filter-input::placeholder {
        color: var(--dm-muted) !important;
    }
    [data-theme="dark"] .pc-filter-input:focus {
        background-color: var(--dm-elevated) !important;
        border-color: #fbbf24 !important;
        box-shadow: 0 0 0 0.2rem rgba(251, 191, 36, 0.20) !important;
    }

    /* Tables — THEAD direct inline white bg fallback */
    [data-theme="dark"] thead,
    [data-theme="dark"] thead tr,
    [data-theme="dark"] thead th {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border) !important;
    }

    /* ============================================================
       NOTIFICATIONS PAGE — beat inline styles
       (notif icon circle + badge use inline style="background:#fef3c7"
        etc; external !important wins over inline no-!important)
       ============================================================ */
    [data-theme="dark"] .notification-item .rounded-circle {
        background-color: var(--dm-surface-2) !important;
    }
    [data-theme="dark"] .notification-item .rounded-circle i {
        /* keep accent color from inline; just ensure visible */
        filter: brightness(1.15) saturate(1.1);
    }
    [data-theme="dark"] .notification-item .badge.rounded-pill {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text) !important;
        border: 1px solid var(--dm-border) !important;
    }
    [data-theme="dark"] .notification-item.notif-unread {
        background: linear-gradient(135deg, rgba(251,191,36,0.10) 0%, rgba(251,191,36,0.06) 100%) !important;
        border-left-color: #fbbf24 !important;
    }
    [data-theme="dark"] .notification-item .text-dark {
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .notification-item .text-muted {
        color: var(--dm-muted) !important;
    }
    [data-theme="dark"] .notification-item .badge.bg-light.text-dark {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text-2) !important;
        border-color: var(--dm-border) !important;
    }

    /* ============================================================
       ROUND 7 — More sweep findings
       (kalkulator, ai assistant, opnames, produksis, labarugi, neraca)
       ============================================================ */

    /* Marketing Kalkulator (kc-* prefix) */
    [data-theme="dark"] .kc-card,
    [data-theme="dark"] .kc-step,
    [data-theme="dark"] .kc-result,
    [data-theme="dark"] .kc-summary {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .kc-input,
    [data-theme="dark"] .kc-select,
    [data-theme="dark"] .kc-textarea {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .kc-input::placeholder,
    [data-theme="dark"] .kc-textarea::placeholder {
        color: var(--dm-muted) !important;
    }
    [data-theme="dark"] .kc-input:focus,
    [data-theme="dark"] .kc-select:focus,
    [data-theme="dark"] .kc-textarea:focus {
        background-color: var(--dm-elevated) !important;
        border-color: #fbbf24 !important;
        box-shadow: 0 0 0 0.2rem rgba(251, 191, 36, 0.20) !important;
    }
    [data-theme="dark"] .kc-step-num {
        background-color: var(--dm-surface-2) !important;
        color: #fbbf24 !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .kc-step-text {
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .kc-hpp-divider {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .kc-toggle-wrap {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .kc-card label,
    [data-theme="dark"] .kc-card .form-label {
        color: var(--dm-text-2) !important;
        background-color: transparent !important;
    }
    [data-theme="dark"] .kc-card label[style*="background"] {
        background-color: var(--dm-surface-2) !important;
    }
    [data-theme="dark"] .kc-laminasi-cost {
        color: #fcd34d !important;
    }
    [data-theme="dark"] .kc-result-icon.blue {
        background-color: rgba(59, 130, 246, 0.18) !important;
        color: #93c5fd !important;
    }
    [data-theme="dark"] .kc-result-icon.green {
        background-color: rgba(34, 197, 94, 0.18) !important;
        color: #86efac !important;
    }
    [data-theme="dark"] .kc-result-icon.amber {
        background-color: rgba(251, 191, 36, 0.18) !important;
        color: #fcd34d !important;
    }
    [data-theme="dark"] .kc-result-icon.red {
        background-color: rgba(239, 68, 68, 0.18) !important;
        color: #fca5a5 !important;
    }
    [data-theme="dark"] .kc-result-icon.purple {
        background-color: rgba(168, 85, 247, 0.18) !important;
        color: #d8b4fe !important;
    }
    [data-theme="dark"] .kc-result-value {
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .kc-steps-card,
    [data-theme="dark"] .kc-viz,
    [data-theme="dark"] .kc-viz-card {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .kc-viz-legend-dot {
        background-color: var(--dm-border-2) !important;
    }
    [data-theme="dark"] .kc-modal,
    [data-theme="dark"] .kc-modal-content,
    [data-theme="dark"] .kc-modal-body,
    [data-theme="dark"] .kc-modal-header,
    [data-theme="dark"] .kc-modal-footer {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .kc-modal-close {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .kc-modal-close:hover {
        background-color: var(--dm-elevated) !important;
        color: #fbbf24 !important;
    }
    [data-theme="dark"] .kc-btn-cancel {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .kc-btn-cancel:hover {
        background-color: var(--dm-elevated) !important;
        color: #fbbf24 !important;
    }

    /* AI Assistant module */
    [data-theme="dark"] .ai-sidebar,
    [data-theme="dark"] .ai-chat,
    [data-theme="dark"] .ai-chat-header,
    [data-theme="dark"] .ai-chat-footer {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .ai-chat-body {
        background-color: var(--dm-bg) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .ai-quick-btn {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .ai-quick-btn:hover {
        background-color: var(--dm-elevated) !important;
        color: #fbbf24 !important;
        border-color: var(--dm-border-2) !important;
    }
    [data-theme="dark"] .ai-quick-btn small,
    [data-theme="dark"] .ai-sidebar small {
        color: var(--dm-muted) !important;
    }
    [data-theme="dark"] .ai-message-user {
        background-color: rgba(251, 191, 36, 0.15) !important;
        color: var(--dm-text) !important;
        border-color: rgba(251, 191, 36, 0.30) !important;
    }
    [data-theme="dark"] .ai-message-bot {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border) !important;
    }

    /* Opnames — autocomplete + modern form */
    [data-theme="dark"] .form-control-modern {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .form-control-modern::placeholder {
        color: var(--dm-muted) !important;
    }
    [data-theme="dark"] .form-control-modern:focus {
        background-color: var(--dm-elevated) !important;
        border-color: #fbbf24 !important;
        box-shadow: 0 0 0 0.2rem rgba(251, 191, 36, 0.20) !important;
    }
    [data-theme="dark"] .ac-results {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
        box-shadow: 0 6px 16px rgba(0,0,0,0.45) !important;
    }
    [data-theme="dark"] .ac-results > *,
    [data-theme="dark"] .ac-results .ac-item,
    [data-theme="dark"] .ac-results li,
    [data-theme="dark"] .ac-results a {
        background-color: transparent !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .ac-results > *:hover,
    [data-theme="dark"] .ac-results .ac-item:hover,
    [data-theme="dark"] .ac-results li:hover,
    [data-theme="dark"] .ac-results a:hover {
        background-color: var(--dm-elevated) !important;
        color: #fbbf24 !important;
    }

    /* Setup Produksi — data-badge */
    [data-theme="dark"] .data-badge {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text-2) !important;
        border-color: var(--dm-border) !important;
    }

    /* Laporan keuangan — row-header / row-subtotal */
    [data-theme="dark"] .row-header,
    [data-theme="dark"] tr.row-header,
    [data-theme="dark"] tr.row-header td {
        background-color: rgba(251, 191, 36, 0.12) !important;
        color: #fcd34d !important;
        border-color: rgba(251, 191, 36, 0.25) !important;
    }
    [data-theme="dark"] .row-subtotal,
    [data-theme="dark"] tr.row-subtotal,
    [data-theme="dark"] tr.row-subtotal td {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border) !important;
        font-weight: 600;
    }

    /* Omzet pages — omz-* family + chart wrappers */
    [data-theme="dark"] .omz-header,
    [data-theme="dark"] .omz-card,
    [data-theme="dark"] .omz-stat,
    [data-theme="dark"] .omz-chart,
    [data-theme="dark"] .omz-table,
    [data-theme="dark"] .omz-summary,
    [data-theme="dark"] .omz-filter {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .omz-stat.stat-total,
    [data-theme="dark"] .omz-stat.stat-offline,
    [data-theme="dark"] .omz-stat.stat-mp,
    [data-theme="dark"] .omz-stat.stat-best {
        background-color: var(--dm-surface) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .omz-stat-icon {
        background-color: var(--dm-surface-2) !important;
        color: #fbbf24 !important;
    }
    [data-theme="dark"] .omz-stat-value {
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .omz-stat-label {
        color: var(--dm-muted) !important;
    }
    [data-theme="dark"] .omz-btn {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .omz-btn:hover {
        background-color: var(--dm-elevated) !important;
        color: #fbbf24 !important;
    }

    /* Generic stat-icon (light blue/violet tint) + chart wrapper */
    [data-theme="dark"] .stat-icon {
        background-color: var(--dm-surface-2) !important;
        color: #93c5fd !important;
    }
    [data-theme="dark"] .chart-wrapper,
    [data-theme="dark"] .chart-card,
    [data-theme="dark"] .chart-container {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }

    /* Loading overlay — keep semi-translucent dark instead of white */
    [data-theme="dark"] .loading-overlay {
        background-color: rgba(15, 23, 42, 0.85) !important;
        color: var(--dm-text) !important;
    }

    /* Filter divider on laporan pages */
    [data-theme="dark"] .filter-divider {
        background-color: var(--dm-border) !important;
        border-color: var(--dm-border) !important;
    }

    /* ============================================================
       ROUND 7c — ApexCharts dark theme + status-bahaya, text-loss/profit
       ============================================================ */

    /* ApexCharts tooltips */
    [data-theme="dark"] .apexcharts-tooltip,
    [data-theme="dark"] .apexcharts-tooltip.apexcharts-theme-light,
    [data-theme="dark"] .apexcharts-tooltip.apexcharts-theme-dark,
    [data-theme="dark"] .apexcharts-yaxistooltip,
    [data-theme="dark"] .apexcharts-xaxistooltip {
        background-color: var(--dm-elevated) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
        box-shadow: 0 4px 12px rgba(0,0,0,0.5) !important;
    }
    [data-theme="dark"] .apexcharts-tooltip-title,
    [data-theme="dark"] .apexcharts-tooltip.apexcharts-theme-light .apexcharts-tooltip-title {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .apexcharts-tooltip-arrow,
    [data-theme="dark"] .apexcharts-tooltip-arrow:before,
    [data-theme="dark"] .apexcharts-tooltip-arrow:after {
        background-color: var(--dm-elevated) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .apexcharts-tooltip-text,
    [data-theme="dark"] .apexcharts-tooltip-text-y-label,
    [data-theme="dark"] .apexcharts-tooltip-text-y-value,
    [data-theme="dark"] .apexcharts-tooltip-text-z-label,
    [data-theme="dark"] .apexcharts-tooltip-text-z-value,
    [data-theme="dark"] .apexcharts-tooltip-text-goals-label,
    [data-theme="dark"] .apexcharts-tooltip-text-goals-value {
        color: var(--dm-text) !important;
    }
    /* ApexCharts axis labels */
    [data-theme="dark"] .apexcharts-xaxis text,
    [data-theme="dark"] .apexcharts-yaxis text,
    [data-theme="dark"] .apexcharts-text {
        fill: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .apexcharts-legend-text {
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .apexcharts-yaxistooltip-text,
    [data-theme="dark"] .apexcharts-xaxistooltip-text {
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .apexcharts-datalabel,
    [data-theme="dark"] .apexcharts-data-labels text {
        fill: var(--dm-text) !important;
    }
    [data-theme="dark"] .apexcharts-gridline,
    [data-theme="dark"] .apexcharts-grid line {
        stroke: var(--dm-border) !important;
    }

    /* Status badges — bahaya / aman / aktif */
    [data-theme="dark"] .status-badge.status-bahaya,
    [data-theme="dark"] .badge.status-bahaya {
        background-color: rgba(239, 68, 68, 0.18) !important;
        color: #fca5a5 !important;
        border-color: rgba(239, 68, 68, 0.35) !important;
    }
    [data-theme="dark"] .status-badge.status-aman,
    [data-theme="dark"] .badge.status-aman {
        background-color: rgba(34, 197, 94, 0.18) !important;
        color: #86efac !important;
        border-color: rgba(34, 197, 94, 0.35) !important;
    }
    [data-theme="dark"] .status-badge.status-warning,
    [data-theme="dark"] .badge.status-warning {
        background-color: rgba(251, 191, 36, 0.18) !important;
        color: #fcd34d !important;
        border-color: rgba(251, 191, 36, 0.35) !important;
    }

    /* Brighten profit/loss text on dark */
    [data-theme="dark"] .text-loss {
        color: #fca5a5 !important;
    }
    [data-theme="dark"] .text-profit {
        color: #86efac !important;
    }

    /* Override hardcoded <font color> tags on stok page */
    [data-theme="dark"] font[color="red"],
    [data-theme="dark"] font[color="#FF0000"],
    [data-theme="dark"] font[color="#ff0000"] {
        color: #fca5a5 !important;
    }
    [data-theme="dark"] font[color="blue"],
    [data-theme="dark"] font[color="#0000FF"],
    [data-theme="dark"] font[color="#0000ff"] {
        color: #93c5fd !important;
    }
    [data-theme="dark"] font[color="green"],
    [data-theme="dark"] font[color="#008000"] {
        color: #86efac !important;
    }

    /* ============================================================
       ROUND 7f — Struktur Organisasi (.so-* family)
       ============================================================ */
    [data-theme="dark"] .so-custom-card,
    [data-theme="dark"] .so-node,
    [data-theme="dark"] .so-fullscreen-header,
    [data-theme="dark"] .so-pos,
    [data-theme="dark"] .so-pos-card,
    [data-theme="dark"] .so-tree,
    [data-theme="dark"] .so-chart,
    [data-theme="dark"] .so-canvas,
    [data-theme="dark"] .so-panel,
    [data-theme="dark"] .so-form-card {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .so-pos-jabatan {
        background-color: rgba(251, 191, 36, 0.15) !important;
        color: #fcd34d !important;
        border-color: rgba(251, 191, 36, 0.30) !important;
    }
    [data-theme="dark"] .so-pos-name,
    [data-theme="dark"] .so-node-name,
    [data-theme="dark"] .so-node-avatar,
    [data-theme="dark"] .so-pos-count {
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .so-node-avatar {
        background-color: var(--dm-surface-2) !important;
    }
    [data-theme="dark"] .so-node-badge.so-badge-member {
        background-color: rgba(59, 130, 246, 0.18) !important;
        color: #93c5fd !important;
        border-color: rgba(59, 130, 246, 0.30) !important;
    }
    [data-theme="dark"] .so-node-badge.so-badge-root {
        background-color: rgba(251, 191, 36, 0.18) !important;
        color: #fcd34d !important;
        border-color: rgba(251, 191, 36, 0.35) !important;
    }
    [data-theme="dark"] .so-node-badge.so-badge-leader,
    [data-theme="dark"] .so-node-badge.so-badge-supervisor {
        background-color: rgba(124, 58, 237, 0.18) !important;
        color: #c4b5fd !important;
        border-color: rgba(124, 58, 237, 0.30) !important;
    }
    [data-theme="dark"] .so-form-label,
    [data-theme="dark"] .so-form-label.required,
    [data-theme="dark"] .so-label,
    [data-theme="dark"] .so-text {
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .so-chart-btn,
    [data-theme="dark"] .so-chart-btn.so-fullscreen-btn,
    [data-theme="dark"] .so-btn-close-fs {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .so-chart-btn:hover,
    [data-theme="dark"] .so-btn-close-fs:hover {
        background-color: var(--dm-elevated) !important;
        color: #fbbf24 !important;
        border-color: #fbbf24 !important;
    }
    [data-theme="dark"] .so-form-input,
    [data-theme="dark"] .so-form-select,
    [data-theme="dark"] .so-form-textarea {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .so-form-input::placeholder,
    [data-theme="dark"] .so-form-textarea::placeholder {
        color: var(--dm-muted) !important;
    }
    [data-theme="dark"] .so-form-input:focus,
    [data-theme="dark"] .so-form-select:focus,
    [data-theme="dark"] .so-form-textarea:focus {
        background-color: var(--dm-elevated) !important;
        border-color: #fbbf24 !important;
        box-shadow: 0 0 0 0.2rem rgba(251, 191, 36, 0.20) !important;
    }
    /* ============================================================
       ROUND 7h — Order Arsip (.nota-badge, .status-pill, filter inputs)
       ============================================================ */
    [data-theme="dark"] .nota-badge {
        background-color: rgba(59, 130, 246, 0.18) !important;
        color: #93c5fd !important;
        border-color: rgba(59, 130, 246, 0.30) !important;
    }
    [data-theme="dark"] .status-pill.lunas {
        background-color: rgba(34, 197, 94, 0.18) !important;
        color: #86efac !important;
        border-color: rgba(34, 197, 94, 0.30) !important;
    }
    [data-theme="dark"] .status-pill.belum-lunas {
        background-color: rgba(251, 191, 36, 0.18) !important;
        color: #fcd34d !important;
        border-color: rgba(251, 191, 36, 0.30) !important;
    }
    [data-theme="dark"] .status-pill.belum-bayar {
        background-color: rgba(239, 68, 68, 0.18) !important;
        color: #fca5a5 !important;
        border-color: rgba(239, 68, 68, 0.30) !important;
    }
    [data-theme="dark"] .status-pill.batal {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text-2) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .filter-input-group,
    [data-theme="dark"] .autocomplete-input {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .filter-input-group .input-icon,
    [data-theme="dark"] .filter-input-group i {
        color: var(--dm-muted) !important;
    }
    [data-theme="dark"] .autocomplete-input::placeholder {
        color: var(--dm-muted) !important;
    }
    [data-theme="dark"] .autocomplete-input:focus,
    [data-theme="dark"] .filter-input-group:focus-within {
        background-color: var(--dm-elevated) !important;
        border-color: #fbbf24 !important;
        box-shadow: 0 0 0 0.2rem rgba(251, 191, 36, 0.20) !important;
    }
    /* Dropdown hasil autocomplete (Konsumen / Produk / Cari) — cegah silau di dark mode */
    [data-theme="dark"] .autocomplete-result-list {
        background-color: var(--dm-surface-2) !important;
        border: 1px solid var(--dm-border) !important;
        color: var(--dm-text) !important;
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45) !important;
    }
    [data-theme="dark"] .autocomplete-result-list li {
        background-color: transparent !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .autocomplete-result-list li:hover,
    [data-theme="dark"] .autocomplete-result-list li.selected,
    [data-theme="dark"] .autocomplete-result-list li[aria-selected="true"] {
        background-color: var(--dm-elevated) !important;
        color: #fbbf24 !important;
    }
    [data-theme="dark"] .autocomplete-result-list li small,
    [data-theme="dark"] .autocomplete-result-list li .text-muted {
        color: var(--dm-muted) !important;
    }
    /* ============================================================
       Komponen "modern" (card-modern / form-control-modern / summary
       / btn-cancel) dipakai di Bayar Order, Belanja, dll — cegah silau
       ============================================================ */
    [data-theme="dark"] .card-modern {
        background-color: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35) !important;
    }
    [data-theme="dark"] .summary-section {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .summary-section .bg-white,
    [data-theme="dark"] .summary-section .border {
        background-color: var(--dm-elevated) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .summary-label {
        color: var(--dm-muted) !important;
    }
    [data-theme="dark"] .summary-value {
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .form-control-modern,
    [data-theme="dark"] .form-select-modern {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .form-control-modern::placeholder {
        color: var(--dm-muted) !important;
    }
    [data-theme="dark"] .form-control-modern:focus,
    [data-theme="dark"] .form-select-modern:focus {
        background-color: var(--dm-elevated) !important;
        border-color: #3b82f6 !important;
        box-shadow: 0 0 0 0.2rem rgba(59, 130, 246, 0.20) !important;
    }
    [data-theme="dark"] .form-select-modern option {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .form-label {
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .btn-cancel {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text-2) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .btn-cancel:hover {
        background-color: var(--dm-elevated) !important;
        color: var(--dm-text) !important;
    }
    /* Flash message (.alert-modern) — cegah silau putih di dark mode */
    [data-theme="dark"] .alert-modern {
        background: var(--dm-surface) !important;
        color: var(--dm-text) !important;
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.35) !important;
    }
    [data-theme="dark"] .alert-modern .btn-close-custom {
        color: var(--dm-muted) !important;
    }
    [data-theme="dark"] .alert-modern .btn-close-custom:hover {
        color: var(--dm-text) !important;
    }
    /* ============================================================
       Edit/Create Varian Produk (.pv-*) — cegah silau di dark mode
       ============================================================ */
    [data-theme="dark"] .pv-card {
        background: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35) !important;
    }
    [data-theme="dark"] .pv-card-header {
        background: var(--dm-surface) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .pv-header-title h5 {
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .pv-header-title p,
    [data-theme="dark"] .pv-section-title,
    [data-theme="dark"] .pv-status-desc {
        color: var(--dm-muted) !important;
    }
    [data-theme="dark"] .pv-form-label {
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .pv-form-input,
    [data-theme="dark"] .pv-form-select {
        background: var(--dm-surface-2) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .pv-form-input::placeholder {
        color: var(--dm-muted) !important;
    }
    [data-theme="dark"] .pv-form-input:focus,
    [data-theme="dark"] .pv-form-select:focus {
        background: var(--dm-elevated) !important;
        border-color: #fbbf24 !important;
        box-shadow: 0 0 0 3px rgba(251, 191, 36, 0.20) !important;
    }
    [data-theme="dark"] .pv-section-line {
        background: var(--dm-border) !important;
    }
    /* Prefix "Rp" pada input harga */
    [data-theme="dark"] .pv-hpp-prefix {
        background: var(--dm-elevated) !important;
        color: #fbbf24 !important;
        border-color: var(--dm-border) !important;
    }
    /* Status Aktif/Tidak Aktif */
    [data-theme="dark"] .pv-status-option {
        border-color: var(--dm-border) !important;
        background: var(--dm-surface-2) !important;
    }
    [data-theme="dark"] .pv-status-option:hover {
        background: var(--dm-elevated) !important;
    }
    [data-theme="dark"] .pv-status-option.active-green {
        border-color: #16a34a !important;
        background: rgba(34, 197, 94, 0.15) !important;
    }
    [data-theme="dark"] .pv-status-option.active-red {
        border-color: #dc2626 !important;
        background: rgba(239, 68, 68, 0.15) !important;
    }
    [data-theme="dark"] .pv-status-label {
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .pv-edit-badge {
        background: rgba(245, 158, 11, 0.15) !important;
        border-color: rgba(245, 158, 11, 0.35) !important;
        color: #fbbf24 !important;
    }
    /* Tombol */
    [data-theme="dark"] .pv-btn-back,
    [data-theme="dark"] .pv-btn-cancel {
        background: var(--dm-surface-2) !important;
        color: var(--dm-text-2) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .pv-btn-back:hover,
    [data-theme="dark"] .pv-btn-cancel:hover {
        background: var(--dm-elevated) !important;
        color: var(--dm-text) !important;
    }
    /* ============================================================
       ROUND 7i — projectMp dashboard (.persen-badge, .mp-tab, .pembayaran-toggle, .toggle-label)
       ============================================================ */
    [data-theme="dark"] .persen-badge {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text-2) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .persen-badge.zero {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-muted) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .persen-badge.up,
    [data-theme="dark"] .persen-badge.positive {
        background-color: rgba(34, 197, 94, 0.18) !important;
        color: #86efac !important;
        border-color: rgba(34, 197, 94, 0.30) !important;
    }
    [data-theme="dark"] .persen-badge.down,
    [data-theme="dark"] .persen-badge.negative {
        background-color: rgba(239, 68, 68, 0.18) !important;
        color: #fca5a5 !important;
        border-color: rgba(239, 68, 68, 0.30) !important;
    }
    [data-theme="dark"] .mp-tab {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text-2) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .mp-tab:hover {
        background-color: var(--dm-elevated) !important;
        color: #fbbf24 !important;
    }
    [data-theme="dark"] .mp-tab.active {
        background-color: rgba(251, 191, 36, 0.15) !important;
        color: #fcd34d !important;
        border-color: rgba(251, 191, 36, 0.40) !important;
    }
    [data-theme="dark"] .pembayaran-toggle {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .toggle-label {
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .toggle-label.active {
        color: #fcd34d !important;
    }
    /* ============================================================
       ROUND 7j — marketplace-returns (inline dark blue links, info-value)
       ============================================================ */
    [data-theme="dark"] a[style*="color:#1e40af"],
    [data-theme="dark"] a[style*="color: #1e40af"],
    [data-theme="dark"] a[style*="color:#1e3a8a"],
    [data-theme="dark"] a[style*="color: #1e3a8a"],
    [data-theme="dark"] a[style*="color:#1d4ed8"],
    [data-theme="dark"] a[style*="color: #1d4ed8"] {
        color: #93c5fd !important;
    }
    [data-theme="dark"] a[style*="border-bottom"][style*="93c5fd"] {
        border-bottom-color: rgba(147, 197, 253, 0.45) !important;
    }
    [data-theme="dark"] .info-value,
    [data-theme="dark"] .info-label,
    [data-theme="dark"] .info-row {
        color: var(--dm-text) !important;
    }
    /* ============================================================
       ROUND 7k — btn-primary force white text (dark slate leaking)
       ============================================================ */
    [data-theme="dark"] .btn-primary,
    [data-theme="dark"] .btn-primary:hover,
    [data-theme="dark"] .btn-primary:focus,
    [data-theme="dark"] .btn-primary:active,
    [data-theme="dark"] .btn.btn-primary,
    [data-theme="dark"] button.btn-primary,
    [data-theme="dark"] a.btn-primary {
        color: #ffffff !important;
    }
    [data-theme="dark"] .btn-primary i,
    [data-theme="dark"] .btn-primary svg {
        color: #ffffff !important;
    }
    /* ============================================================
       ROUND 7l — .card-input radio-style cards (order/create form)
       Used for: Pengiriman, Pembayaran, Tipe Order pickers
       ============================================================ */
    [data-theme="dark"] .card-input {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .card-input:hover {
        background-color: var(--dm-elevated) !important;
        border-color: #fbbf24 !important;
    }
    [data-theme="dark"] .card-input.active,
    [data-theme="dark"] .card-input.selected,
    [data-theme="dark"] input:checked + .card-input,
    [data-theme="dark"] .card-input[style*="rgba(13, 110, 253"],
    [data-theme="dark"] .card-input[style*="rgba(13,110,253"] {
        background-color: rgba(251, 191, 36, 0.15) !important;
        border-color: #fbbf24 !important;
        color: #fcd34d !important;
    }
    [data-theme="dark"] .card-input span,
    [data-theme="dark"] .card-input small,
    [data-theme="dark"] .card-input label {
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .card-input .text-muted {
        color: var(--dm-muted) !important;
    }
    /* ============================================================
       ROUND 7m — brand-preview-box (logo & background preview on /sistem)
       Logos & dashboard bg images may have transparency, so wrap in
       light-tinted slate frame instead of stark white.
       ============================================================ */
    [data-theme="dark"] .brand-preview-box {
        background-color: var(--dm-elevated) !important;
        border-color: var(--dm-border) !important;
        box-shadow: inset 0 0 0 1px rgba(255,255,255,0.05) !important;
    }
    [data-theme="dark"] .brand-preview-box img {
        background-color: rgba(255, 255, 255, 0.08) !important;
        border-radius: 6px !important;
        padding: 4px !important;
    }
    /* ============================================================
       ROUND 7n — inline color:#059669 (Shopee escrow validated badges)
       Used as small "✓aktl" labels on /admin/analisaHarga, etc.
       Replace dark green with slate-friendly emerald.
       ============================================================ */
    [data-theme="dark"] [style*="color:#059669"],
    [data-theme="dark"] [style*="color: #059669"],
    [data-theme="dark"] [style*="color:#047857"],
    [data-theme="dark"] [style*="color: #047857"],
    [data-theme="dark"] [style*="color:#065f46"],
    [data-theme="dark"] [style*="color: #065f46"] {
        color: #6ee7b7 !important;
    }

    /* ============================================================
       ROUND 8 — produkModel/{index,create,edit,show} (.pm-* + .bm-*)
       Halaman /admin/produkModel?kategori_id=N pakai scoped style
       (background:#fff, color:#1f2937/#374151/#6b7280/#9ca3af, dll)
       yang bikin "ga kebaca" di dark mode. Catch-all .pm-card sudah
       cover container, sini override sisanya: header title, breadcrumb,
       icon header, table cells, hover row, empty state, plus modal
       breakdown harga (.bm-*).
       ============================================================ */

    /* Page header — title hitam (#111827), helper #6b7280 */
    [data-theme="dark"] .pm-card-header {
        background-color: var(--dm-surface) !important;
        border-bottom-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .pm-header-title h5 {
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .pm-header-title p {
        color: var(--dm-text-2) !important;
    }
    /* Breadcrumb produkModel — link emas, current text-2 */
    [data-theme="dark"] .pm-breadcrumb {
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .pm-breadcrumb a {
        color: #fbbf24 !important;
    }
    [data-theme="dark"] .pm-breadcrumb a:hover {
        color: #fcd34d !important;
    }
    [data-theme="dark"] .pm-breadcrumb svg {
        color: var(--dm-muted) !important;
    }
    /* Span "current category" pakai inline color:#111827 */
    [data-theme="dark"] .pm-breadcrumb span[style*="color:#111827"],
    [data-theme="dark"] .pm-breadcrumb span[style*="color: #111827"] {
        color: var(--dm-text) !important;
    }

    /* Table header & cell — #6b7280/#fafafa/#374151 */
    [data-theme="dark"] .pm-table thead th {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text-2) !important;
        border-bottom-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .pm-table tbody td {
        color: var(--dm-text) !important;
        border-bottom: 1px solid var(--dm-border) !important;
    }
    [data-theme="dark"] .pm-table tbody tr {
        border-bottom-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .pm-table tbody tr:hover {
        background-color: var(--dm-elevated) !important;
    }
    [data-theme="dark"] .pm-table tbody tr:hover td {
        background-color: transparent !important;
    }
    /* Inline-styled secondary text di kolom (SKU font monospace, satuan, rata², legacy) */
    [data-theme="dark"] .pm-table tbody td [style*="color:#6b7280"],
    [data-theme="dark"] .pm-table tbody td [style*="color: #6b7280"],
    [data-theme="dark"] .pm-table tbody td [style*="color:#9ca3af"],
    [data-theme="dark"] .pm-table tbody td [style*="color: #9ca3af"],
    [data-theme="dark"] .pm-table tbody td [style*="color:#374151"],
    [data-theme="dark"] .pm-table tbody td [style*="color: #374151"] {
        color: var(--dm-text-2) !important;
    }
    /* Name link & price link — primary brand color */
    [data-theme="dark"] .pm-name-link {
        color: #fbbf24 !important;
    }
    [data-theme="dark"] .pm-name-link:hover {
        color: #fcd34d !important;
    }
    [data-theme="dark"] .pm-price-link {
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .pm-price-link:hover {
        color: #fbbf24 !important;
    }
    /* Image thumb & placeholder */
    [data-theme="dark"] .pm-img-thumb {
        background-color: var(--dm-surface-2) !important;
        border-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .pm-img-placeholder {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-muted) !important;
    }
    /* Empty state */
    [data-theme="dark"] .pm-empty-icon {
        background-color: rgba(245, 158, 11, 0.15) !important;
    }
    [data-theme="dark"] .pm-empty h6 {
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .pm-empty p {
        color: var(--dm-muted) !important;
    }

    /* Btn delete — soft red */
    [data-theme="dark"] .pm-btn-delete {
        background-color: rgba(239, 68, 68, 0.12) !important;
        color: #fca5a5 !important;
        border-color: rgba(239, 68, 68, 0.30) !important;
    }
    [data-theme="dark"] .pm-btn-delete:hover {
        background-color: #ef4444 !important;
        color: #fff !important;
        border-color: #ef4444 !important;
    }

    /* ============================================================
       Edit/Show pages — additional pm-* classes
       ============================================================ */
    [data-theme="dark"] .pm-form-section,
    [data-theme="dark"] .pm-form-row,
    [data-theme="dark"] .pm-form-group {
        background-color: transparent !important;
        border-color: var(--dm-border) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .pm-form-label {
        color: var(--dm-text-2) !important;
    }
    [data-theme="dark"] .pm-form-help,
    [data-theme="dark"] .pm-form-hint {
        color: var(--dm-muted) !important;
    }
    [data-theme="dark"] .pm-btn-edit-sm {
        background-color: var(--dm-elevated) !important;
        color: var(--dm-text-2) !important;
        border-color: var(--dm-border-2) !important;
    }
    [data-theme="dark"] .pm-btn-edit-sm:hover {
        background-color: #fbbf24 !important;
        color: #0f172a !important;
    }

    /* ============================================================
       Breakdown Modal (.bm-*) di produkModel/index.blade.php
       Trigger via klik harga modal — pakai .modal-content sehingga
       inheritan .modal-content sudah dark, tapi inner cards butuh
       override agar background pastel ga silau.
       ============================================================ */
    [data-theme="dark"] .bm-modal .modal-content {
        background-color: var(--dm-surface) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .bm-body {
        background-color: var(--dm-surface) !important;
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .bm-body::-webkit-scrollbar-thumb {
        background: var(--dm-border-2) !important;
    }
    [data-theme="dark"] .bm-card.primary {
        background-color: rgba(245, 158, 11, 0.15) !important;
        border-color: rgba(245, 158, 11, 0.30) !important;
    }
    [data-theme="dark"] .bm-card.primary .bm-card-label {
        color: #fcd34d !important;
    }
    [data-theme="dark"] .bm-card.primary .bm-card-value {
        color: #fbbf24 !important;
    }
    [data-theme="dark"] .bm-card.secondary {
        background-color: rgba(34, 197, 94, 0.15) !important;
        border-color: rgba(34, 197, 94, 0.30) !important;
    }
    [data-theme="dark"] .bm-card.secondary .bm-card-label {
        color: #86efac !important;
    }
    [data-theme="dark"] .bm-card.secondary .bm-card-value {
        color: #6ee7b7 !important;
    }
    [data-theme="dark"] .bm-table thead th {
        background-color: var(--dm-surface-2) !important;
        color: var(--dm-text-2) !important;
        border-bottom-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .bm-table tbody tr {
        border-bottom-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .bm-table tbody tr:hover {
        background-color: var(--dm-elevated) !important;
    }
    [data-theme="dark"] .bm-table tbody td {
        color: var(--dm-text) !important;
    }
    [data-theme="dark"] .bm-price-badge {
        background: linear-gradient(135deg, rgba(245, 158, 11, 0.20), rgba(251, 191, 36, 0.30)) !important;
        color: #fcd34d !important;
    }
    [data-theme="dark"] .bm-footer-note {
        color: var(--dm-muted) !important;
        border-top-color: var(--dm-border) !important;
    }
    [data-theme="dark"] .bm-row-ignored .bm-price-badge {
        background: var(--dm-surface-2) !important;
        color: var(--dm-muted) !important;
    }
    [data-theme="dark"] .bm-btn-ignore {
        background-color: var(--dm-elevated) !important;
        color: var(--dm-text-2) !important;
        border-color: var(--dm-border-2) !important;
    }
    [data-theme="dark"] .bm-btn-ignore:hover {
        background-color: rgba(239, 68, 68, 0.15) !important;
        color: #fca5a5 !important;
        border-color: rgba(239, 68, 68, 0.30) !important;
    }
    [data-theme="dark"] .bm-btn-restore {
        background-color: rgba(239, 68, 68, 0.15) !important;
        color: #fca5a5 !important;
        border-color: rgba(239, 68, 68, 0.30) !important;
    }
    [data-theme="dark"] .bm-btn-restore:hover {
        background-color: rgba(34, 197, 94, 0.15) !important;
        color: #86efac !important;
        border-color: rgba(34, 197, 94, 0.30) !important;
    }

    /* ============================================================
       Empty-state circle bg pastel (#fef3c7, #fff1f2, etc) — soften
       ============================================================ */
    [data-theme="dark"] [style*="background: #fef3c7"],
    [data-theme="dark"] [style*="background:#fef3c7"],
    [data-theme="dark"] [style*="background: #fff1f2"],
    [data-theme="dark"] [style*="background:#fff1f2"],
    [data-theme="dark"] [style*="background: #fff7ed"],
    [data-theme="dark"] [style*="background:#fff7ed"],
    [data-theme="dark"] [style*="background: #f0fdf4"],
    [data-theme="dark"] [style*="background:#f0fdf4"] {
        background: var(--dm-surface-2) !important;
    }


/* ================================================================
   Modal batch pickup gabungan (Shopee + TikTok), 1 Sep 2026.

   Alasan blok ini ada: diukur lewat CDP, teks di dalam .alert-info
   pada tema gelap cuma berkontras 2.04 (syarat WCAG AA: 4.5).
   Bootstrap memberi .alert-info latar terang dengan teks biru tua —
   di tema gelap latar itu ikut digelapkan, teksnya tidak.
   ================================================================ */
[data-theme="dark"] .batch-info-dropoff {
    background: var(--dm-surface-2) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}

[data-theme="dark"] .batch-info-dropoff strong,
[data-theme="dark"] .batch-info-dropoff i {
    color: var(--dm-text) !important;
}

/* Badge "N order" di kepala kartu: bg-secondary Bootstrap terlalu
   redup di KEDUA tema (terukur 2.49). Dipakai kartu Shopee & TikTok. */
#batchPickupBody .card-header .badge.bg-secondary {
    background-color: #475569 !important;
    color: #ffffff !important;
}

[data-theme="dark"] #batchPickupBody .card-header .badge.bg-secondary {
    background-color: var(--dm-elevated) !important;
    color: var(--dm-text) !important;
}