/* ==========================================================================
   Sage Theme Variables (Light & Dark Mode)
   --------------------------------------------------------------------------
   Central CSS file for custom branding, color tokens, and vendor overrides.
   
   Color Palette Reference (Dark Mode):
   - `#122822`: Deepest background (Page body & outer canvas)
   - `#16322b`: Intermediate dark surface (Card headers, dropdown popups, search dialogs)
   - `#1B3C34`: Primary card & container surface
   - `#244e44`: Border & divider lines
   - `#316558`: Input field / button borders
   - `#4ade80`: Primary emerald accent (Focus rings, links, active states)
   - `#6ee7b7`: Soft emerald text accent
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. ROOT BRAND TOKENS (LIGHT MODE DEFAULT)
   -------------------------------------------------------------------------- */
:root {
    /* Brand Colors & Surfaces */
    --sage-brand-green: #1d3932;
    --sage-brand-green-hover: #152924;
    --sage-brand-green-subtle: rgba(29, 57, 50, 0.08);
    --sage-body-bg: #f3f3f9;
    --sage-card-bg: #ffffff;
    --sage-card-header-bg: #f8fafc;
    --sage-border-color: #e3e8ee;
    --sage-text-heading: #1e293b;
    --sage-text-body: #475569;
    --sage-text-muted: #64748b;

    /* Sidebar Variables (Light Mode) */
    --sage-sidebar-bg: #111827;
    --sage-sidebar-text: #9ca3af;
    --sage-sidebar-text-active: #ffffff;
    --sage-sidebar-item-active-bg: rgba(255, 255, 255, 0.12);
}

/* --------------------------------------------------------------------------
   2. DARK MODE BRAND TOKENS & BOOTSTRAP OVERRIDES
   Activated when [data-bs-theme="dark"] attribute is set on HTML element.
   -------------------------------------------------------------------------- */
[data-bs-theme="dark"] {
    /* Brand Colors & Surfaces */
    --sage-brand-green: #1B3C34;
    --sage-brand-green-hover: #244e44;
    --sage-brand-green-subtle: rgba(74, 222, 128, 0.15);

    /* Dark Theme Surface Hierarchy */
    --sage-body-bg: #122822;
    /* Darkest background for main page body */
    --sage-card-bg: #1B3C34;
    /* Card surface color */
    --sage-card-header-bg: #16322b;
    /* Card header & dropdown list background */
    --sage-border-color: #244e44;
    /* Component border lines */
    --sage-text-heading: #f8fafc;
    /* Primary white headings */
    --sage-text-body: #cbd5e1;
    /* General body text */
    --sage-text-muted: #94a3b8;
    /* Muted / secondary text */

    /* Sidebar Variables (Dark Mode) */
    --sage-sidebar-bg: #16322b;
    --sage-sidebar-border: #244e44;
    --sage-sidebar-text: #94a3b8;
    --sage-sidebar-text-active: #ffffff;
    --sage-sidebar-item-active-bg: #244e44;

    /* Bootstrap Framework Theme Variable Mapping */
    --vz-body-bg: var(--sage-body-bg);
    --vz-body-color: var(--sage-text-body);
    --vz-card-bg: var(--sage-card-bg);
    --vz-card-cap-bg: var(--sage-card-header-bg);
    --vz-border-color: var(--sage-border-color);
    --vz-header-bg: var(--sage-card-bg);
    --vz-footer-bg: var(--sage-body-bg);
    --vz-primary: var(--sage-brand-green);
    --vz-link-color: #4ade80;
    --vz-header-bg: var(--sage-card-bg);
    --vz-header-item-bg: var(--sage-brand-green-hover);
    --vz-header-item-color: #f8fafc;
    --vz-header-item-sub-color: #94a3b8;
    --vz-secondary-bg-subtle: rgba(255, 255, 255, 0.08);
    --vz-light: rgba(255, 255, 255, 0.06);
    --vz-light-bg-subtle: rgba(255, 255, 255, 0.06);
    --vz-tertiary-bg: var(--sage-card-header-bg);
    --vz-dropdown-bg: var(--sage-card-header-bg);
    --vz-dropdown-color: var(--sage-text-body);
    --vz-dropdown-link-color: var(--sage-text-body);
    --vz-dropdown-link-hover-color: var(--sage-text-heading);
    --vz-dropdown-link-hover-bg: var(--sage-card-bg);
    --vz-dropdown-link-active-color: #ffffff;
    --vz-dropdown-link-active-bg: var(--sage-brand-green-hover);
    --vz-dropdown-border-color: var(--sage-border-color);
    --vz-accordion-bg: transparent;
    --vz-accordion-color: var(--sage-text-body);
    --vz-accordion-border-color: var(--sage-border-color);
    --vz-accordion-btn-color: var(--sage-text-heading);
    --vz-accordion-btn-bg: var(--sage-card-header-bg);
    --vz-accordion-active-color: #ffffff;
    --vz-accordion-active-bg: var(--sage-brand-green-hover);
    --vz-accordion-btn-focus-border-color: #4ade80;
    --vz-accordion-btn-focus-box-shadow: 0 0 0 0.25rem rgba(74, 222, 128, 0.15);

    /* Color scheme hint for browser native controls (pickers, scrollbars) */
    color-scheme: dark !important;
}

/* --------------------------------------------------------------------------
   3. GLOBAL PAGE LAYOUT & TOPBAR STYLES
   -------------------------------------------------------------------------- */
[data-bs-theme="dark"] body {
    background-color: var(--sage-body-bg) !important;
    color: var(--sage-text-body) !important;
}

[data-bs-theme="dark"] #page-topbar {
    background-color: var(--sage-card-bg) !important;
    border-bottom: 1px solid var(--sage-border-color) !important;
}

[data-bs-theme="dark"] #page-topbar .btn-light,
[data-bs-theme="dark"] #dashboardDateBar .btn-light {
    background-color: rgba(255, 255, 255, 0.06) !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    color: var(--sage-text-heading) !important;
}

[data-bs-theme="dark"] .topbar-user,
[data-bs-theme="dark"] #page-header-user-dropdown {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

[data-bs-theme="dark"] #page-topbar .btn-light:hover,
[data-bs-theme="dark"] #dashboardDateBar .btn-light:hover {
    background-color: rgba(255, 255, 255, 0.12) !important;
    color: #ffffff !important;
}

[data-bs-theme="dark"] #page-header-user-dropdown:hover {
    background-color: rgba(255, 255, 255, 0.06) !important;
    border-radius: 8px;
}

[data-bs-theme="dark"] .user-name-text {
    color: #f8fafc !important;
}

[data-bs-theme="dark"] .user-name-sub-text {
    color: #94a3b8 !important;
}

/* Topbar icon buttons (Theme toggle, Fullscreen, Notifications, Search, Hamburger) */
[data-bs-theme="dark"] .navbar-header .btn-topbar,
[data-bs-theme="dark"] .btn-topbar,
[data-bs-theme="dark"] #topnav-hamburger-icon {
    color: var(--sage-text-muted) !important;
}

[data-bs-theme="dark"] .navbar-header .btn-topbar:hover,
[data-bs-theme="dark"] .navbar-header .btn-topbar:focus,
[data-bs-theme="dark"] .navbar-header .btn-topbar:active,
[data-bs-theme="dark"] .navbar-header .btn-topbar.active,
[data-bs-theme="dark"] .navbar-header .btn-topbar.show,
[data-bs-theme="dark"] .btn-topbar:hover,
[data-bs-theme="dark"] .btn-topbar:focus,
[data-bs-theme="dark"] .btn-topbar:active,
[data-bs-theme="dark"] .btn-topbar.active,
[data-bs-theme="dark"] .btn-topbar.show,
[data-bs-theme="dark"] #topnav-hamburger-icon:hover,
[data-bs-theme="dark"] #topnav-hamburger-icon:focus,
[data-bs-theme="dark"] #topnav-hamburger-icon:active {
    background-color: var(--sage-brand-green-hover) !important;
    color: #ffffff !important;
}

/* Global Text Highlight / Selection */
[data-bs-theme="dark"] ::selection {
    background-color: #244e44 !important;
    color: #ffffff !important;
}

[data-bs-theme="dark"] ::-moz-selection {
    background-color: #244e44 !important;
    color: #ffffff !important;
}

/* --------------------------------------------------------------------------
   4. SIDEBAR NAVIGATION STYLES
   -------------------------------------------------------------------------- */
[data-bs-theme="dark"] .app-menu.navbar-menu {
    background-color: var(--sage-sidebar-bg) !important;
    border-right: 1px solid var(--sage-sidebar-border) !important;
}

[data-bs-theme="dark"] .app-menu .navbar-brand-box {
    background-color: var(--sage-sidebar-bg) !important;
    border-bottom-color: var(--sage-sidebar-border) !important;
}

[data-bs-theme="dark"] .navbar-menu .navbar-nav .nav-link {
    color: var(--sage-sidebar-text) !important;
}

[data-bs-theme="dark"] .navbar-menu .navbar-nav .nav-link:hover,
[data-bs-theme="dark"] .navbar-menu .navbar-nav .nav-link.active {
    color: var(--sage-sidebar-text-active) !important;
}

[data-bs-theme="dark"] .navbar-menu .navbar-nav .nav-item .collapse .nav-link.active {
    background-color: var(--sage-sidebar-item-active-bg) !important;
    color: var(--sage-sidebar-text-active) !important;
    border-radius: 6px;
}

/* --------------------------------------------------------------------------
   5. CARDS & GENERAL CONTAINER SURFACES
   -------------------------------------------------------------------------- */
[data-bs-theme="dark"] .card {
    background-color: var(--sage-card-bg) !important;
    border-color: var(--sage-border-color) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
}

[data-bs-theme="dark"] .card-header {
    background-color: var(--sage-card-header-bg) !important;
    border-bottom-color: var(--sage-border-color) !important;
}

/* Headings & Title Elements Across All Pages */
[data-bs-theme="dark"] .card-title,
[data-bs-theme="dark"] .page-title,
[data-bs-theme="dark"] .page-title-box,
[data-bs-theme="dark"] .h1,
[data-bs-theme="dark"] .h2,
[data-bs-theme="dark"] .h3,
[data-bs-theme="dark"] .h4,
[data-bs-theme="dark"] .h5,
[data-bs-theme="dark"] .h6,
[data-bs-theme="dark"] h1,
[data-bs-theme="dark"] h2,
[data-bs-theme="dark"] h3,
[data-bs-theme="dark"] h4,
[data-bs-theme="dark"] h5,
[data-bs-theme="dark"] h6 {
    color: var(--sage-text-heading) !important;
}

[data-bs-theme="dark"] .page-title-box {
    background-color: transparent !important;
}

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

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

[data-bs-theme="dark"] .bg-light {
    background-color: var(--sage-card-header-bg) !important;
}

[data-bs-theme="dark"] .border,
[data-bs-theme="dark"] .border-top,
[data-bs-theme="dark"] .border-bottom,
[data-bs-theme="dark"] .border-start,
[data-bs-theme="dark"] .border-end {
    border-color: var(--sage-border-color) !important;
}

/* --------------------------------------------------------------------------
   6. BUTTONS & ACTIONS
   -------------------------------------------------------------------------- */
[data-bs-theme="dark"] .btn-primary {
    background-color: var(--sage-brand-green-hover) !important;
    border-color: #316558 !important;
    color: #ffffff !important;
}

[data-bs-theme="dark"] .btn-primary:hover {
    background-color: #2b5c50 !important;
    border-color: #3b7b6c !important;
}

[data-bs-theme="dark"] .btn-light {
    background-color: var(--sage-card-header-bg, #16322b) !important;
    border-color: var(--sage-border-color, #244e44) !important;
    color: var(--sage-text-heading, #f8fafc) !important;
}

[data-bs-theme="dark"] .btn-light:hover {
    background-color: var(--sage-brand-green-hover, #244e44) !important;
    border-color: #316558 !important;
    color: #ffffff !important;
}

[data-bs-theme="dark"] .btn-soft-primary {
    background-color: var(--sage-brand-green-subtle) !important;
    border-color: rgba(74, 222, 128, 0.25) !important;
    color: #6ee7b7 !important;
}

[data-bs-theme="dark"] .text-primary {
    color: #6ee7b7 !important;
}

/* Soft Action Button Variants */
[data-bs-theme="dark"] .btn-soft-secondary {
    background-color: rgba(245, 158, 11, 0.15) !important;
    border: 1px solid rgba(245, 158, 11, 0.3) !important;
    color: #facc15 !important;
}

[data-bs-theme="dark"] .btn-soft-secondary:hover {
    background-color: rgba(245, 158, 11, 0.28) !important;
    color: #fef08a !important;
}

[data-bs-theme="dark"] .btn-soft-success {
    background-color: rgba(52, 211, 153, 0.15) !important;
    border: 1px solid rgba(52, 211, 153, 0.3) !important;
    color: #34d399 !important;
}

[data-bs-theme="dark"] .btn-soft-success:hover {
    background-color: rgba(52, 211, 153, 0.28) !important;
    color: #a7f3d0 !important;
}

[data-bs-theme="dark"] .btn-soft-info {
    background-color: rgba(56, 189, 248, 0.15) !important;
    border: 1px solid rgba(56, 189, 248, 0.3) !important;
    color: #38bdf8 !important;
}

[data-bs-theme="dark"] .btn-soft-info:hover {
    background-color: rgba(56, 189, 248, 0.28) !important;
    color: #bae6fd !important;
}

/* Button Icon Badges */
[data-bs-theme="dark"] .btn-label .label-icon {
    background-color: rgba(0, 0, 0, 0.25) !important;
}

[data-bs-theme="dark"] .btn-soft-secondary .label-icon {
    background-color: rgba(245, 158, 11, 0.25) !important;
    color: #facc15 !important;
}

[data-bs-theme="dark"] .btn-soft-success .label-icon {
    background-color: rgba(52, 211, 153, 0.25) !important;
    color: #34d399 !important;
}

[data-bs-theme="dark"] .btn-soft-primary .label-icon {
    background-color: rgba(74, 222, 128, 0.25) !important;
    color: #6ee7b7 !important;
}

[data-bs-theme="dark"] .btn:disabled,
[data-bs-theme="dark"] .btn.disabled {
    background-color: rgba(255, 255, 255, 0.05) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    color: #64748b !important;
    opacity: 0.5 !important;
}

/* Ghost Button Variants in Dark Mode */
[data-bs-theme="dark"] .btn-ghost-secondary {
    color: var(--sage-text-muted) !important;
    background-color: transparent !important;
}

[data-bs-theme="dark"] .btn-ghost-secondary:hover,
[data-bs-theme="dark"] .btn-ghost-secondary:focus,
[data-bs-theme="dark"] .btn-ghost-secondary:active,
[data-bs-theme="dark"] .btn-ghost-secondary.active,
[data-bs-theme="dark"] .btn-ghost-secondary.show {
    background-color: var(--sage-brand-green-hover) !important;
    color: #ffffff !important;
}

[data-bs-theme="dark"] .btn-ghost-primary {
    color: #4ade80 !important;
    background-color: transparent !important;
}

[data-bs-theme="dark"] .btn-ghost-primary:hover,
[data-bs-theme="dark"] .btn-ghost-primary:focus,
[data-bs-theme="dark"] .btn-ghost-primary:active,
[data-bs-theme="dark"] .btn-ghost-primary.active,
[data-bs-theme="dark"] .btn-ghost-primary.show {
    background-color: var(--sage-brand-green-hover) !important;
    color: #ffffff !important;
}

[data-bs-theme="dark"] .btn-ghost-light,
[data-bs-theme="dark"] .btn-ghost-dark {
    color: var(--sage-text-body) !important;
    background-color: transparent !important;
}

[data-bs-theme="dark"] .btn-ghost-light:hover,
[data-bs-theme="dark"] .btn-ghost-light:focus,
[data-bs-theme="dark"] .btn-ghost-light:active,
[data-bs-theme="dark"] .btn-ghost-light.active,
[data-bs-theme="dark"] .btn-ghost-light.show,
[data-bs-theme="dark"] .btn-ghost-dark:hover,
[data-bs-theme="dark"] .btn-ghost-dark:focus,
[data-bs-theme="dark"] .btn-ghost-dark:active,
[data-bs-theme="dark"] .btn-ghost-dark.active,
[data-bs-theme="dark"] .btn-ghost-dark.show {
    background-color: var(--sage-brand-green-hover) !important;
    color: #ffffff !important;
}

/* --------------------------------------------------------------------------
   7. FORM CONTROLS, INPUTS & SELECT2 CONTAINERS
   -------------------------------------------------------------------------- */
[data-bs-theme="dark"] .form-control,
[data-bs-theme="dark"] .form-select,
[data-bs-theme="dark"] input[type="text"],
[data-bs-theme="dark"] input[type="date"],
[data-bs-theme="dark"] input[type="search"],
[data-bs-theme="dark"] .select2-container--bootstrap-5 .select2-selection,
[data-bs-theme="dark"] .select2-container--default .select2-selection--single,
[data-bs-theme="dark"] .select2-container--default .select2-selection--multiple,
[data-bs-theme="dark"] .select2-selection {
    background-color: var(--sage-card-header-bg) !important;
    border-color: #2c594e !important;
    color: var(--sage-text-heading) !important;
}

[data-bs-theme="dark"] .select2-container--default .select2-selection--single .select2-selection__rendered,
[data-bs-theme="dark"] .select2-container--bootstrap-5 .select2-selection--single .select2-selection__rendered {
    color: var(--sage-text-heading) !important;
}

/* Disabled Form Controls & Select2 Containers */
[data-bs-theme="dark"] .form-control:disabled,
[data-bs-theme="dark"] .form-select:disabled,
[data-bs-theme="dark"] .select2-container--disabled .select2-selection,
[data-bs-theme="dark"] .select2-container--disabled .select2-selection--single,
[data-bs-theme="dark"] .select2-container--disabled .select2-selection--multiple,
[data-bs-theme="dark"] select:disabled+.select2-container .select2-selection {
    background-color: rgba(22, 50, 43, 0.6) !important;
    border-color: rgba(44, 89, 78, 0.6) !important;
    color: #64748b !important;
    cursor: not-allowed !important;
    opacity: 0.75 !important;
}

[data-bs-theme="dark"] .form-control:focus,
[data-bs-theme="dark"] .form-select:focus,
[data-bs-theme="dark"] .select2-container--open .select2-selection {
    background-color: var(--sage-card-bg) !important;
    border-color: #4ade80 !important;
    color: #ffffff !important;
    box-shadow: 0 0 0 0.25rem rgba(74, 222, 128, 0.2) !important;
}

/* Form Checkboxes & Switches */
[data-bs-theme="dark"] .form-check-input {
    background-color: #16322b !important;
    border-color: #316558 !important;
}

[data-bs-theme="dark"] .form-check-input:checked {
    background-color: #2e7559 !important;
    border-color: #4ade80 !important;
}

[data-bs-theme="dark"] .form-switch .form-check-input {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23cbd5e1'/%3e%3c/svg%3e") !important;
}

[data-bs-theme="dark"] .form-switch .form-check-input:checked {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23ffffff'/%3e%3c/svg%3e") !important;
}

/* --------------------------------------------------------------------------
   8. DROPDOWNS & LIST GROUPS
   -------------------------------------------------------------------------- */
[data-bs-theme="dark"] .dropdown-menu {
    background-color: var(--sage-card-header-bg) !important;
    border-color: var(--sage-border-color) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4) !important;
}

[data-bs-theme="dark"] .dropdown-item {
    color: var(--sage-text-body) !important;
}

[data-bs-theme="dark"] .dropdown-item:hover,
[data-bs-theme="dark"] .dropdown-item:focus {
    background-color: var(--sage-card-bg) !important;
    color: var(--sage-text-heading) !important;
}

[data-bs-theme="dark"] .dropdown-item.active,
[data-bs-theme="dark"] .dropdown-item:active {
    background-color: var(--sage-brand-green-hover) !important;
    color: #ffffff !important;
}

[data-bs-theme="dark"] .dropdown-item.active:hover,
[data-bs-theme="dark"] .dropdown-item.active:focus {
    background-color: var(--sage-brand-green-hover) !important;
    color: #ffffff !important;
}

[data-bs-theme="dark"] .list-group,
[data-bs-theme="dark"] .list-group-flush {
    background-color: transparent !important;
}

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

[data-bs-theme="dark"] .list-group-item:hover {
    background-color: var(--sage-card-header-bg) !important;
    color: var(--sage-text-heading) !important;
}

[data-bs-theme="dark"] .list-group-item.active {
    background-color: var(--sage-brand-green-hover) !important;
    border-color: var(--sage-brand-green-hover) !important;
    color: #ffffff !important;
}

/* Notification Items in Topbar / Modals */
[data-bs-theme="dark"] .notify-item:hover,
[data-bs-theme="dark"] .notify-item:focus,
[data-bs-theme="dark"] .notification-item:hover,
[data-bs-theme="dark"] .notification-item:focus {
    background-color: var(--sage-card-bg) !important;
}

[data-bs-theme="dark"] .notify-item.active,
[data-bs-theme="dark"] .notification-item.active {
    background-color: var(--sage-brand-green-hover) !important;
    color: #ffffff !important;
}

/* Bootstrap Standard Pagination */
[data-bs-theme="dark"] .pagination .page-link {
    background-color: var(--sage-card-header-bg) !important;
    border-color: #316558 !important;
    color: var(--sage-text-body) !important;
}

[data-bs-theme="dark"] .pagination .page-link:hover,
[data-bs-theme="dark"] .pagination .page-link:focus {
    background-color: var(--sage-brand-green-hover) !important;
    border-color: #4ade80 !important;
    color: #ffffff !important;
}

[data-bs-theme="dark"] .pagination .page-item.active .page-link {
    background-color: var(--sage-brand-green-hover) !important;
    border-color: #4ade80 !important;
    color: #ffffff !important;
}

/* --------------------------------------------------------------------------
   9. TABLES & DATATABLES CONTROLS
   -------------------------------------------------------------------------- */
[data-bs-theme="dark"] .table {
    --vz-table-bg: transparent;
    --vz-table-hover-bg: var(--sage-card-header-bg);
    --vz-table-striped-bg: rgba(255, 255, 255, 0.02);
    --vz-table-color: var(--sage-text-body);
    color: var(--sage-text-body) !important;
    border-color: var(--sage-border-color) !important;
}

[data-bs-theme="dark"] .table thead,
[data-bs-theme="dark"] .table thead tr,
[data-bs-theme="dark"] .table thead th,
[data-bs-theme="dark"] .table th,
[data-bs-theme="dark"] .table-light,
[data-bs-theme="dark"] .table-light th,
[data-bs-theme="dark"] table.dataTable thead th,
[data-bs-theme="dark"] table.dataTable thead td,
[data-bs-theme="dark"] .table-striped-columns thead th,
[data-bs-theme="dark"] .table-striped-columns>thead>tr>th,
[data-bs-theme="dark"] .table-striped-columns>thead>tr>th:nth-child(even),
[data-bs-theme="dark"] .table-striped-columns>thead>tr>th:nth-child(odd),
[data-bs-theme="dark"] .table-striped-columns>thead>tr>th:nth-child(2n) {
    background-color: var(--sage-card-header-bg) !important;
    background-image: none !important;
    color: #f8fafc !important;
    border-bottom-color: var(--sage-border-color) !important;
    border-top-color: var(--sage-border-color) !important;
    box-shadow: none !important;
}

[data-bs-theme="dark"] table.dataTable thead .sorting:before,
[data-bs-theme="dark"] table.dataTable thead .sorting:after,
[data-bs-theme="dark"] table.dataTable thead .sorting_asc:before,
[data-bs-theme="dark"] table.dataTable thead .sorting_asc:after,
[data-bs-theme="dark"] table.dataTable thead .sorting_desc:before,
[data-bs-theme="dark"] table.dataTable thead .sorting_desc:after {
    color: #6ee7b7 !important;
    opacity: 0.6;
}

[data-bs-theme="dark"] .table-hover tbody tr:hover {
    background-color: var(--sage-card-header-bg) !important;
    color: var(--sage-text-heading) !important;
}

/* DataTables Filter Input & Page Length Select */
.dataTables_wrapper .dataTables_filter label {
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    margin-bottom: 0 !important;
    font-weight: 500 !important;
}

.dataTables_wrapper .dataTables_filter input {
    min-width: 180px !important;
    height: 38px !important;
    padding: 0.375rem 0.75rem !important;
    border-radius: 6px !important;
    font-size: 0.875rem !important;
    line-height: 1.5 !important;
    box-sizing: border-box !important;
}

.dataTables_wrapper .dataTables_length label {
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.35rem !important;
    margin-bottom: 0 !important;
}

.dataTables_wrapper .dataTables_length select {
    height: 38px !important;
    padding: 0.375rem 1.75rem 0.375rem 0.75rem !important;
    border-radius: 6px !important;
}

[data-bs-theme="dark"] .dataTables_wrapper .dataTables_filter input,
[data-bs-theme="dark"] .dataTables_wrapper .dataTables_length select {
    background-color: #16322b !important;
    border: 1px solid #316558 !important;
    color: #f8fafc !important;
}

[data-bs-theme="dark"] .dataTables_wrapper .dataTables_filter input:focus,
[data-bs-theme="dark"] .dataTables_wrapper .dataTables_length select:focus {
    border-color: #4ade80 !important;
    background-color: #1b3c34 !important;
    outline: none !important;
    box-shadow: 0 0 0 0.2rem rgba(74, 222, 128, 0.15) !important;
}

[data-bs-theme="dark"] .dt-button,
[data-bs-theme="dark"] .buttons-excel,
[data-bs-theme="dark"] .buttons-print {
    background-color: #16322b !important;
    border-color: #316558 !important;
    color: #cbd5e1 !important;
}

[data-bs-theme="dark"] .dt-button:hover {
    background-color: #244e44 !important;
    color: #ffffff !important;
}

/* DataTables Pagination Buttons */
[data-bs-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button {
    background-color: #16322b !important;
    background: #16322b !important;
    border: 1px solid #316558 !important;
    color: #cbd5e1 !important;
    border-radius: 6px !important;
}

[data-bs-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background-color: #244e44 !important;
    background: #244e44 !important;
    border-color: #4ade80 !important;
    color: #ffffff !important;
}

[data-bs-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.current,
[data-bs-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background-color: #244e44 !important;
    background: #244e44 !important;
    border-color: #4ade80 !important;
    color: #ffffff !important;
}

[data-bs-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
[data-bs-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover,
[data-bs-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {
    background-color: rgba(255, 255, 255, 0.05) !important;
    background: rgba(255, 255, 255, 0.05) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    color: #64748b !important;
    opacity: 0.5 !important;
}

/* --------------------------------------------------------------------------
   10. SEARCH MODAL DIALOG
   -------------------------------------------------------------------------- */
#moduleSearchModal .modal-content,
[data-bs-theme="dark"] #moduleSearchModal .modal-content {
    background-color: var(--sage-card-bg) !important;
    border: 1px solid var(--sage-border-color) !important;
    color: var(--sage-text-heading) !important;
}

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

#moduleSearchModal .modal-body,
[data-bs-theme="dark"] #moduleSearchModal .modal-body {
    background-color: var(--sage-card-bg) !important;
    color: var(--sage-text-heading) !important;
}

[data-bs-theme="dark"] .modal-module-group-title {
    color: #6ee7b7 !important;
    border-bottom: 1px solid var(--sage-border-color) !important;
}

[data-bs-theme="dark"] .modal-module-item-link {
    background-color: var(--sage-card-header-bg) !important;
    border: 1px solid #2c594e !important;
    color: var(--sage-text-heading) !important;
}

[data-bs-theme="dark"] .modal-module-item-link:hover {
    background-color: var(--sage-brand-green-hover) !important;
    border-color: #4ade80 !important;
    color: #ffffff !important;
}

[data-bs-theme="dark"] .modal-module-item-link i {
    color: var(--sage-text-muted) !important;
}

[data-bs-theme="dark"] .modal-module-item-link:hover i {
    color: #6ee7b7 !important;
}

[data-bs-theme="dark"] .modal-module-item-link.is-active-page {
    background-color: var(--sage-brand-green-hover) !important;
    border-color: #4ade80 !important;
    color: #ffffff !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4) !important;
}

/* Modal Search Pill - Base & Light Mode */
.modal-search-pill-container {
    background-color: #f1f5f9 !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    padding: 6px 14px !important;
    transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.modal-search-pill-container:focus-within {
    border-color: #10b981 !important;
    background-color: #ffffff !important;
    box-shadow: 0 0 0 0.2rem rgba(16, 185, 129, 0.18) !important;
}

.modal-search-pill-icon {
    color: #64748b;
    transition: color 0.15s ease;
}

.modal-search-pill-container:focus-within .modal-search-pill-icon {
    color: #059669;
}

#modal-module-search-input,
.modal-search-pill-input {
    background: transparent !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    color: #1e293b !important;
}

#modal-module-search-input:focus,
.modal-search-pill-input:focus {
    background: transparent !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    color: #1e293b !important;
}

#modal-module-search-input::placeholder,
.modal-search-pill-input::placeholder {
    color: #94a3b8 !important;
    font-weight: 400;
}

.modal-search-pill-close {
    opacity: 0.65;
    font-size: 11px;
    transition: opacity 0.15s ease;
}

.modal-search-pill-close:hover {
    opacity: 1;
}

#modal-module-search-input::-webkit-search-cancel-button,
#modal-module-search-input::-webkit-search-decoration,
.modal-search-pill-input::-webkit-search-cancel-button,
.modal-search-pill-input::-webkit-search-decoration {
    -webkit-appearance: none;
    display: none;
}

/* Modal Search Pill - Dark Mode */
[data-bs-theme="dark"] .modal-search-pill-container {
    background-color: rgba(255, 255, 255, 0.08) !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
}

[data-bs-theme="dark"] .modal-search-pill-container:focus-within {
    border-color: #4ade80 !important;
    background-color: rgba(255, 255, 255, 0.14) !important;
    box-shadow: 0 0 0 0.2rem rgba(74, 222, 128, 0.15) !important;
}

[data-bs-theme="dark"] .modal-search-pill-icon {
    color: rgba(255, 255, 255, 0.55);
}

[data-bs-theme="dark"] .modal-search-pill-container:focus-within .modal-search-pill-icon {
    color: #4ade80;
}

[data-bs-theme="dark"] #modal-module-search-input,
[data-bs-theme="dark"] .modal-search-pill-input {
    color: #ffffff !important;
}

[data-bs-theme="dark"] #modal-module-search-input:focus,
[data-bs-theme="dark"] .modal-search-pill-input:focus {
    color: #ffffff !important;
}

[data-bs-theme="dark"] #modal-module-search-input::placeholder,
[data-bs-theme="dark"] .modal-search-pill-input::placeholder {
    color: rgba(255, 255, 255, 0.55) !important;
}

[data-bs-theme="dark"] .modal-search-pill-close {
    filter: var(--bs-btn-close-white-filter, invert(1) grayscale(100%) brightness(200%));
    opacity: 0.75;
}

/* --------------------------------------------------------------------------
   11. DASHBOARD SCOPE FILTER PANEL
   -------------------------------------------------------------------------- */
[data-bs-theme="dark"] .dashboard-filter-card {
    background: var(--sage-card-bg) !important;
    border-color: var(--sage-border-color) !important;
}

[data-bs-theme="dark"] .dashboard-filter-header {
    background: var(--sage-card-header-bg) !important;
    border-bottom-color: var(--sage-border-color) !important;
}

[data-bs-theme="dark"] .dashboard-filter-title-text {
    color: var(--sage-text-heading) !important;
}

[data-bs-theme="dark"] .scope-column-wrapper {
    border-right-color: var(--sage-border-color) !important;
}

[data-bs-theme="dark"] .scope-check {
    background: var(--sage-card-header-bg) !important;
    border-color: #2c594e !important;
    color: var(--sage-text-body) !important;
}

[data-bs-theme="dark"] .scope-check:hover {
    background: var(--sage-brand-green-hover) !important;
    color: #ffffff !important;
}

[data-bs-theme="dark"] .scope-check:has(input:checked),
[data-bs-theme="dark"] .scope-check.is-checked {
    background: var(--sage-brand-green-subtle) !important;
    border-color: #4ade80 !important;
    color: #6ee7b7 !important;
}

[data-bs-theme="dark"] .scope-badge-pill {
    background: var(--sage-card-header-bg) !important;
    border-color: #2c594e !important;
    color: var(--sage-text-body) !important;
}

[data-bs-theme="dark"] .scope-badge-pill.is-active {
    background: var(--sage-brand-green-hover) !important;
    border-color: #4ade80 !important;
    color: #ffffff !important;
}

[data-bs-theme="dark"] .dashboard-filter-footer {
    background: var(--sage-card-header-bg) !important;
    border-top-color: var(--sage-border-color) !important;
}

[data-bs-theme="dark"] .btn-apply-filters {
    background: var(--sage-brand-green-hover) !important;
    border-color: #316558 !important;
    color: #ffffff !important;
}

[data-bs-theme="dark"] .btn-apply-filters:hover {
    background: #2b5c50 !important;
    border-color: #3b7b6c !important;
    color: #ffffff !important;
}

[data-bs-theme="dark"] .btn-reset-filters:hover {
    background: var(--sage-brand-green-hover) !important;
    color: #ffffff !important;
}

/* --------------------------------------------------------------------------
   12. FLATPICKR DATE & TIME PICKER POPUPS
   -------------------------------------------------------------------------- */
.flatpickr-months {
    background-color: var(--vz-primary, #1b3c34) !important;
}

.flatpickr-months .flatpickr-month,
.flatpickr-current-month,
.flatpickr-current-month span.cur-month,
.flatpickr-current-month .flatpickr-monthDropdown-months,
.flatpickr-current-month input.cur-year {
    color: #ffffff !important;
    fill: #ffffff !important;
    font-weight: 600 !important;
}

.flatpickr-current-month .flatpickr-monthDropdown-months option {
    background-color: #ffffff !important;
    color: #333333 !important;
}

[data-bs-theme="dark"] .flatpickr-current-month .flatpickr-monthDropdown-months option {
    background-color: #16322b !important;
    color: #f8fafc !important;
}

.flatpickr-months .flatpickr-prev-month,
.flatpickr-months .flatpickr-next-month {
    color: #ffffff !important;
    fill: #ffffff !important;
}

.flatpickr-months .flatpickr-prev-month svg,
.flatpickr-months .flatpickr-next-month svg {
    fill: #ffffff !important;
}

.flatpickr-months .flatpickr-prev-month:hover svg,
.flatpickr-months .flatpickr-next-month:hover svg {
    fill: #e2e8f0 !important;
}

.flatpickr-current-month .numInputWrapper span.arrowUp:after {
    border-bottom-color: #ffffff !important;
}

.flatpickr-current-month .numInputWrapper span.arrowDown:after {
    border-top-color: #ffffff !important;
}

[data-bs-theme="dark"] .flatpickr-calendar,
.flatpickr-calendar.darkMode {
    background: #16322b !important;
    border: 1px solid #244e44 !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5) !important;
    color: #f8fafc !important;
}

[data-bs-theme="dark"] .flatpickr-time,
.flatpickr-calendar.darkMode .flatpickr-time {
    border-top: 1px solid #244e44 !important;
    background: #16322b !important;
}

[data-bs-theme="dark"] .flatpickr-time input,
.flatpickr-calendar.darkMode .flatpickr-time input {
    color: #f8fafc !important;
}

[data-bs-theme="dark"] .flatpickr-time input:hover,
[data-bs-theme="dark"] .flatpickr-time input:focus,
.flatpickr-calendar.darkMode .flatpickr-time input:hover,
.flatpickr-calendar.darkMode .flatpickr-time input:focus {
    background: #244e44 !important;
    color: #ffffff !important;
}

[data-bs-theme="dark"] .flatpickr-time .flatpickr-time-separator,
[data-bs-theme="dark"] .flatpickr-time .flatpickr-am-pm,
.flatpickr-calendar.darkMode .flatpickr-time .flatpickr-time-separator,
.flatpickr-calendar.darkMode .flatpickr-time .flatpickr-am-pm {
    color: #6ee7b7 !important;
}

[data-bs-theme="dark"] .flatpickr-time .flatpickr-am-pm:hover,
[data-bs-theme="dark"] .flatpickr-time .flatpickr-am-pm:focus,
.flatpickr-calendar.darkMode .flatpickr-time .flatpickr-am-pm:hover,
.flatpickr-calendar.darkMode .flatpickr-time .flatpickr-am-pm:focus {
    background: #244e44 !important;
    color: #ffffff !important;
}

[data-bs-theme="dark"] .flatpickr-calendar .flatpickr-innerContainer {
    background: #16322b !important;
}

[data-bs-theme="dark"] .flatpickr-day {
    color: #cbd5e1 !important;
}

[data-bs-theme="dark"] .flatpickr-day:hover,
[data-bs-theme="dark"] .flatpickr-day:focus {
    background: #244e44 !important;
    color: #ffffff !important;
}

[data-bs-theme="dark"] .flatpickr-day.selected,
[data-bs-theme="dark"] .flatpickr-day.startRange,
[data-bs-theme="dark"] .flatpickr-day.endRange {
    background: #2b5c50 !important;
    border-color: #4ade80 !important;
    color: #ffffff !important;
}

/* Native HTML5 Input Time/Date Picker Controls & Chromium Popups */
[data-bs-theme="dark"] input[type="time"]::-webkit-calendar-picker-indicator,
[data-bs-theme="dark"] input[type="date"]::-webkit-calendar-picker-indicator,
[data-bs-theme="dark"] input[type="datetime-local"]::-webkit-calendar-picker-indicator {
    filter: invert(0.8) sepia(0.2) saturate(2) hue-rotate(100deg) !important;
    cursor: pointer !important;
}

/* --------------------------------------------------------------------------
   13. APEXCHARTS DASHBOARD WIDGETS
   -------------------------------------------------------------------------- */
[data-bs-theme="dark"] .apexcharts-canvas .apexcharts-tooltip,
[data-bs-theme="dark"] .apexcharts-tooltip.apexcharts-theme-light,
[data-bs-theme="dark"] .apexcharts-tooltip.apexcharts-theme-dark {
    background-color: #16322b !important;
    border: 1px solid #244e44 !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4) !important;
    color: #f8fafc !important;
}

[data-bs-theme="dark"] .apexcharts-tooltip-title {
    background-color: #122822 !important;
    border-bottom: 1px solid #244e44 !important;
    color: #f8fafc !important;
    font-weight: 600 !important;
}

[data-bs-theme="dark"] .apexcharts-tooltip-text,
[data-bs-theme="dark"] .apexcharts-tooltip-text-y-value,
[data-bs-theme="dark"] .apexcharts-tooltip-text-y-label {
    color: #cbd5e1 !important;
}

[data-bs-theme="dark"] .apexcharts-text,
[data-bs-theme="dark"] .apexcharts-text tspan,
[data-bs-theme="dark"] .apexcharts-legend-text,
[data-bs-theme="dark"] .apexcharts-xaxis-label,
[data-bs-theme="dark"] .apexcharts-yaxis-label {
    fill: #cbd5e1 !important;
    color: #cbd5e1 !important;
}

[data-bs-theme="dark"] .apexcharts-gridline,
[data-bs-theme="dark"] .apexcharts-xaxis-tick,
[data-bs-theme="dark"] .apexcharts-ycrosshairs,
[data-bs-theme="dark"] .apexcharts-xcrosshairs {
    stroke: rgba(255, 255, 255, 0.08) !important;
}

[data-bs-theme="dark"] .apexcharts-menu {
    background-color: #16322b !important;
    border-color: #244e44 !important;
    color: #f8fafc !important;
}

[data-bs-theme="dark"] .apexcharts-menu-item:hover {
    background-color: #244e44 !important;
}

/* --------------------------------------------------------------------------
   14. FOOTER BOTTOM BAR & BACK-TO-TOP BUTTON
   -------------------------------------------------------------------------- */
[data-bs-theme="dark"] .footer,
[data-bs-theme="dark"] footer.footer,
[data-bs-theme="dark"] .main-content .footer,
[data-bs-theme="dark"] body .footer {
    background-color: var(--sage-body-bg, #122822) !important;
    border-top: 1px solid #244e44 !important;
    color: #94a3b8 !important;
}

[data-bs-theme="dark"] .footer .text-muted {
    color: #94a3b8 !important;
}

[data-bs-theme="dark"] .footer a.text-primary,
[data-bs-theme="dark"] .footer a {
    color: #4ade80 !important;
}

[data-bs-theme="dark"] #back-to-top,
[data-bs-theme="dark"] .back-to-top,
[data-bs-theme="dark"] button#back-to-top {
    background-color: #16322b !important;
    border: 1px solid #316558 !important;
    color: #4ade80 !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4) !important;
}

[data-bs-theme="dark"] #back-to-top:hover,
[data-bs-theme="dark"] .back-to-top:hover {
    background-color: #244e44 !important;
    color: #ffffff !important;
}

/* --------------------------------------------------------------------------
   15. GLOBAL BOOTSTRAP MODAL & SELECT2 DARK MODE THEME RULES
   -------------------------------------------------------------------------- */
[data-bs-theme="dark"] .modal-content {
    background-color: var(--sage-card-bg, #1B3C34) !important;
    color: var(--sage-text-body, #cbd5e1) !important;
    border-color: var(--sage-border-color, #244e44) !important;
}

[data-bs-theme="dark"] .modal-header {
    background-color: var(--sage-card-header-bg, #16322b) !important;
    border-bottom-color: var(--sage-border-color, #244e44) !important;
}

[data-bs-theme="dark"] .modal-header .modal-title {
    color: var(--sage-text-heading, #f8fafc) !important;
}

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

[data-bs-theme="dark"] .modal-footer {
    border-top-color: var(--sage-border-color, #244e44) !important;
    background-color: var(--sage-card-bg, #1B3C34) !important;
}

/* --------------------------------------------------------------------------
   16. NAVIGATION TABS, CUSTOM TABS & PILLS (DARK MODE)
   -------------------------------------------------------------------------- */
[data-bs-theme="dark"] .nav-tabs-custom {
    border-bottom-color: var(--sage-border-color, #244e44) !important;
}

[data-bs-theme="dark"] .nav-tabs-custom .nav-item .nav-link,
[data-bs-theme="dark"] .nav-tabs-custom .nav-link {
    color: var(--sage-text-muted, #94a3b8) !important;
    background-color: transparent !important;
}

[data-bs-theme="dark"] .nav-tabs-custom .nav-item .nav-link:hover,
[data-bs-theme="dark"] .nav-tabs-custom .nav-link:hover {
    color: #6ee7b7 !important;
}

[data-bs-theme="dark"] .nav-tabs-custom .nav-item .nav-link.active,
[data-bs-theme="dark"] .nav-tabs-custom .nav-link.active,
[data-bs-theme="dark"] .nav-tabs-custom.nav-success .nav-link.active,
[data-bs-theme="dark"] .nav-tabs-custom.nav-primary .nav-link.active {
    color: #4ade80 !important;
    background-color: transparent !important;
}

[data-bs-theme="dark"] .nav-tabs-custom .nav-item .nav-link:after,
[data-bs-theme="dark"] .nav-tabs-custom .nav-link:after {
    background: #4ade80 !important;
}

[data-bs-theme="dark"] .nav-tabs-custom.card-header-tabs .nav-link.active {
    color: #4ade80 !important;
    background-color: transparent !important;
}

[data-bs-theme="dark"] .nav-tabs {
    border-bottom-color: var(--sage-border-color, #244e44) !important;
}

[data-bs-theme="dark"] .nav-tabs .nav-link {
    color: var(--sage-text-muted, #94a3b8) !important;
}

[data-bs-theme="dark"] .nav-tabs .nav-link:hover {
    color: #6ee7b7 !important;
    border-color: transparent !important;
}

[data-bs-theme="dark"] .nav-tabs .nav-link.active {
    color: #4ade80 !important;
    background-color: var(--sage-card-bg, #1B3C34) !important;
    border-color: var(--sage-border-color, #244e44) var(--sage-border-color, #244e44) var(--sage-card-bg, #1B3C34) !important;
}

[data-bs-theme="dark"] .nav-pills .nav-link {
    color: var(--sage-text-body, #cbd5e1) !important;
}

[data-bs-theme="dark"] .nav-pills .nav-link:hover {
    background-color: var(--sage-brand-green-hover, #244e44) !important;
    color: #ffffff !important;
}

[data-bs-theme="dark"] .nav-pills .nav-link.active {
    background-color: var(--sage-brand-green-hover, #244e44) !important;
    color: #4ade80 !important;
    border: 1px solid #4ade80 !important;
}

[data-bs-theme="dark"] .nav-border-top .nav-link.active {
    border-top-color: #4ade80 !important;
    color: #4ade80 !important;
}

[data-bs-theme="dark"] .nav-tabs-custom .nav-link i,
[data-bs-theme="dark"] .nav-tabs .nav-link i {
    color: inherit !important;
}

/* --------------------------------------------------------------------------
   37. TIMETABLE AUTOMATION & CUSTOMIZER (DARK MODE POLISH)
   -------------------------------------------------------------------------- */
[data-bs-theme="dark"] .tt-custom-table th,
[data-bs-theme="dark"] .tt-custom-table td {
    border-color: var(--sage-border-color, #244e44) !important;
}

[data-bs-theme="dark"] .tt-custom-table thead th,
[data-bs-theme="dark"] .tt-day-col {
    background-color: var(--sage-card-header-bg, #16322b) !important;
    color: var(--sage-text-heading, #f8fafc) !important;
}

[data-bs-theme="dark"] .tt-drop-cell {
    background-color: var(--sage-body-bg, #122822) !important;
    border-color: var(--sage-border-color, #244e44) !important;
}

[data-bs-theme="dark"] .tt-custom-lesson {
    background: var(--sage-card-bg, #1B3C34) !important;
    border: 1px solid var(--sage-border-color, #244e44) !important;
    border-left: 3px solid #4ade80 !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25) !important;
}

[data-bs-theme="dark"] .tt-custom-lesson:hover {
    border-color: #4ade80 !important;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.4) !important;
}

[data-bs-theme="dark"] .tt-custom-lesson strong {
    color: var(--sage-text-heading, #f8fafc) !important;
}

[data-bs-theme="dark"] .tt-custom-lesson span {
    color: var(--sage-text-muted, #94a3b8) !important;
}

[data-bs-theme="dark"] .tt-custom-lesson .badge {
    background-color: rgba(74, 222, 128, 0.15) !important;
    color: #6ee7b7 !important;
    border-color: rgba(74, 222, 128, 0.3) !important;
}

[data-bs-theme="dark"] .tt-drop-cell.tt-break-cell {
    background-color: rgba(245, 158, 11, 0.08) !important;
    border: 1px dashed rgba(245, 158, 11, 0.3) !important;
}

[data-bs-theme="dark"] .tt-custom-break {
    background: rgba(245, 158, 11, 0.15) !important;
    border: 1.5px dashed rgba(245, 158, 11, 0.7) !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2) !important;
}

[data-bs-theme="dark"] .tt-custom-break:hover {
    background: rgba(245, 158, 11, 0.22) !important;
    border-color: #f59e0b !important;
}

[data-bs-theme="dark"] .tt-custom-break strong {
    color: #fef08a !important;
}

[data-bs-theme="dark"] .tt-custom-break span {
    color: #fcd34d !important;
}

[data-bs-theme="dark"] .tt-custom-break i {
    color: #f59e0b !important;
}

[data-bs-theme="dark"] .tt-drop-cell.tt-avail-highlight {
    background-color: rgba(74, 222, 128, 0.08) !important;
    border: 1px dashed #4ade80 !important;
}

[data-bs-theme="dark"] .tt-drop-cell.tt-over {
    background-color: rgba(74, 222, 128, 0.18) !important;
    border: 2px dashed #4ade80 !important;
}

[data-bs-theme="dark"] .tt-drop-cell.tt-busy-slot {
    background-color: rgba(239, 68, 68, 0.1) !important;
    border: 1px dashed rgba(239, 68, 68, 0.4) !important;
}

[data-bs-theme="dark"] .tt-busy-card {
    background: rgba(239, 68, 68, 0.15) !important;
    border: 1px dashed rgba(239, 68, 68, 0.5) !important;
}

[data-bs-theme="dark"] .tt-busy-card .busy-header {
    color: #f87171 !important;
}

[data-bs-theme="dark"] .tt-busy-card .busy-subject {
    color: #fca5a5 !important;
}

[data-bs-theme="dark"] .tt-busy-card .busy-meta {
    color: #cbd5e1 !important;
}

/* --------------------------------------------------------------------------
   GLOBAL MODAL HEADERS (DARK PRIMARY THEME)
   -------------------------------------------------------------------------- */
.modal-header,
.modal-header.bg-primary,
.modal-header.bg-primary-subtle {
    background-color: var(--sage-brand-green, #1d3932) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
}

.modal-header .modal-title,
.modal-header h1,
.modal-header h2,
.modal-header h3,
.modal-header h4,
.modal-header h5,
.modal-header h6,
.modal-header.bg-primary .modal-title,
.modal-header.bg-primary-subtle .modal-title {
    color: #ffffff !important;
}

.modal-header .btn-close,
.modal-header.bg-primary .btn-close,
.modal-header.bg-primary-subtle .btn-close {
    filter: invert(1) grayscale(100%) brightness(200%) !important;
}

[data-bs-theme="dark"] .modal-header,
[data-bs-theme="dark"] .modal-header.bg-primary,
[data-bs-theme="dark"] .modal-header.bg-primary-subtle {
    background-color: var(--sage-card-header-bg, #16322b) !important;
    border-bottom-color: var(--sage-border-color, #244e44) !important;
}

[data-bs-theme="dark"] .modal-header .modal-title,
[data-bs-theme="dark"] .modal-header h1,
[data-bs-theme="dark"] .modal-header h2,
[data-bs-theme="dark"] .modal-header h3,
[data-bs-theme="dark"] .modal-header h4,
[data-bs-theme="dark"] .modal-header h5,
[data-bs-theme="dark"] .modal-header h6,
[data-bs-theme="dark"] .modal-header.bg-primary .modal-title,
[data-bs-theme="dark"] .modal-header.bg-primary-subtle .modal-title {
    color: #f8fafc !important;
}

/* --------------------------------------------------------------------------
   GLOBAL MODERN DROPZONE & FILE UPLOAD UI
   -------------------------------------------------------------------------- */
.dropzone,
.dropzone.dz-clickable,
.homework-dropzone {
    border: 2px dashed #cbd5e1 !important;
    border-radius: 12px !important;
    background: #f8fafc !important;
    transition: all 0.2s ease-in-out !important;
    padding: 24px 16px !important;
    text-align: center !important;
    cursor: pointer !important;
    min-height: 120px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.dropzone:hover,
.dropzone.dz-drag-hover,
.dropzone.dz-clickable:hover {
    border-color: var(--sage-brand-green, #1d3932) !important;
    background: rgba(29, 57, 50, 0.04) !important;
    box-shadow: 0 4px 12px rgba(29, 57, 50, 0.06) !important;
}

/* Hide default textual remove link from Dropzone since custom trash button is used */
.dropzone .dz-remove,
.dz-remove,
a.dz-remove {
    display: none !important;
}

.dropzone .dz-message {
    margin: 0 !important;
}

.dropzone .dz-message .ri-upload-cloud-2-fill,
.dropzone .dz-message .ri-upload-cloud-2-line,
.dropzone .dz-icon-circle {
    color: var(--sage-brand-green, #1d3932) !important;
}

.homework-dropzone .dz-icon-circle,
.dropzone .dz-icon-circle {
    width: 48px;
    height: 48px;
    margin: 0 auto 10px auto;
    border-radius: 50%;
    background-color: rgba(29, 57, 50, 0.08);
    color: var(--sage-brand-green, #1d3932);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    transition: transform 0.2s ease;
}

.dropzone:hover .dz-icon-circle {
    transform: translateY(-2px);
    background-color: rgba(29, 57, 50, 0.14);
}

.homework-dropzone .dz-title,
.dropzone .dz-title {
    font-size: 13.5px;
    font-weight: 600;
    color: #1e293b;
    margin-bottom: 2px;
}

.homework-dropzone .dz-subtitle,
.dropzone .dz-subtitle {
    font-size: 11.5px;
    color: #64748b;
}

.homework-file-preview-card {
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 8px 12px;
    background: #ffffff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
    transition: all 0.2s ease;
}

.homework-file-preview-card:hover {
    border-color: #cbd5e1;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
}

.homework-existing-file-item {
    border-color: #e2e8f0 !important;
    background-color: #ffffff !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
}

/* Dark Mode Overrides for Global Dropzone */
[data-bs-theme="dark"] .dropzone,
[data-bs-theme="dark"] .dropzone.dz-clickable,
[data-bs-theme="dark"] .homework-dropzone {
    border-color: var(--sage-border-color, #244e44) !important;
    background: var(--sage-card-header-bg, #16322b) !important;
}

[data-bs-theme="dark"] .dropzone:hover,
[data-bs-theme="dark"] .dropzone.dz-drag-hover,
[data-bs-theme="dark"] .dropzone.dz-clickable:hover {
    border-color: #4ade80 !important;
    background: rgba(74, 222, 128, 0.06) !important;
}

[data-bs-theme="dark"] .dropzone .dz-icon-circle,
[data-bs-theme="dark"] .homework-dropzone .dz-icon-circle {
    background-color: var(--sage-brand-green-subtle, rgba(74, 222, 128, 0.15)) !important;
    color: #6ee7b7 !important;
}

[data-bs-theme="dark"] .dropzone .dz-title,
[data-bs-theme="dark"] .homework-dropzone .dz-title {
    color: #f8fafc !important;
}

[data-bs-theme="dark"] .dropzone .dz-subtitle,
[data-bs-theme="dark"] .homework-dropzone .dz-subtitle {
    color: #94a3b8 !important;
}

[data-bs-theme="dark"] .homework-file-preview-card,
[data-bs-theme="dark"] .homework-existing-file-item {
    background: var(--sage-card-bg, #1B3C34) !important;
    border-color: var(--sage-border-color, #244e44) !important;
}

/* --------------------------------------------------------------------------
   16. PROFILE & USER PAGES (SAGE THEME OVERRIDES)
   -------------------------------------------------------------------------- */
.profile-wid-bg:not(.profile-setting-img) {
    position: absolute !important;
    left: 0;
    right: 0;
    top: 0;
    overflow: hidden;
    height: 320px !important;
    background-color: #122822 !important;
    z-index: 1;
}

.profile-setting-img {
    position: relative !important;
    height: 260px !important;
    overflow: hidden;
}

.profile-setting-img .overlay-content {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 3;
}

.profile-wid-bg::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(29, 57, 50, 0.6) 0%, rgba(18, 40, 34, 0.9) 100%) !important;
    z-index: 2;
}

[data-bs-theme="dark"] .profile-wid-bg:not(.profile-setting-img) {
    background-color: #0b1c18 !important;
}

[data-bs-theme="dark"] .profile-wid-bg::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(14, 32, 27, 0.5) 0%, rgba(18, 40, 34, 0.92) 100%) !important;
    z-index: 2;
}

.profile-wid-img,
[data-bs-theme="dark"] .profile-wid-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center 30% !important;
    opacity: 0.65 !important;
    filter: brightness(0.95) contrast(1.1) !important;
    position: relative;
    z-index: 1;
}

.profile-wrapper {
    position: relative;
    z-index: 3;
}

.profile-nav.nav-pills .nav-link {
    color: rgba(255, 255, 255, 0.85) !important;
}

.profile-nav.nav-pills .nav-link:hover {
    color: #ffffff !important;
    background-color: rgba(255, 255, 255, 0.15) !important;
}

.profile-nav.nav-pills .nav-link.active {
    background-color: rgba(255, 255, 255, 0.22) !important;
    color: #ffffff !important;
}

[data-bs-theme="dark"] .user-profile-image,
[data-bs-theme="dark"] .avatar-lg .img-thumbnail,
[data-bs-theme="dark"] .avatar-xl .img-thumbnail,
[data-bs-theme="dark"] .avatar-xxl img {
    background-color: var(--sage-card-bg, #1B3C34) !important;
    border-color: #316558 !important;
}

[data-bs-theme="dark"] .bg-light-subtle {
    background-color: var(--sage-card-header-bg, #16322b) !important;
    border-color: var(--sage-border-color, #244e44) !important;
    color: var(--sage-text-heading, #f8fafc) !important;
}

[data-bs-theme="dark"] .border-dashed {
    border-color: var(--sage-border-color, #244e44) !important;
}

/* Generic Dark Mode Accordion */
[data-bs-theme="dark"] .accordion,
[data-bs-theme="dark"] .accordion-item,
[data-bs-theme="dark"] .accordion-flush .accordion-item,
[data-bs-theme="dark"] .accordion-collapse,
[data-bs-theme="dark"] .accordion-body {
    background-color: transparent !important;
    background: transparent !important;
    color: var(--sage-text-body, #cbd5e1) !important;
}

[data-bs-theme="dark"] .accordion-button {
    background-color: var(--sage-card-header-bg, #16322b) !important;
    color: var(--sage-text-heading, #f8fafc) !important;
    border: 1px solid var(--sage-border-color, #244e44) !important;
}

[data-bs-theme="dark"] .accordion-button:not(.collapsed) {
    background-color: var(--sage-brand-green-hover, #244e44) !important;
    color: #ffffff !important;
    box-shadow: none !important;
}

[data-bs-theme="dark"] .accordion-button::after {
    filter: brightness(0) invert(1);
}

/* Profile Timeline & Recent Activity */
[data-bs-theme="dark"] .profile-timeline,
[data-bs-theme="dark"] .profile-timeline .accordion,
[data-bs-theme="dark"] .profile-timeline .accordion-item,
[data-bs-theme="dark"] .profile-timeline .accordion-collapse,
[data-bs-theme="dark"] .profile-timeline .accordion-body {
    background-color: transparent !important;
    background: transparent !important;
}

[data-bs-theme="dark"] .profile-timeline .accordion-item::before {
    border-left-color: var(--sage-border-color, #244e44) !important;
}

[data-bs-theme="dark"] .profile-timeline .accordion-button {
    background-color: var(--sage-card-header-bg, #16322b) !important;
    color: var(--sage-text-heading, #f8fafc) !important;
    border: 1px solid var(--sage-border-color, #244e44) !important;
}

[data-bs-theme="dark"] .profile-timeline .accordion-button:not(.collapsed) {
    background-color: var(--sage-brand-green-hover, #244e44) !important;
    color: #ffffff !important;
    box-shadow: none !important;
}

[data-bs-theme="dark"] .profile-timeline .accordion-button::after {
    filter: brightness(0) invert(1);
}

[data-bs-theme="dark"] .profile-timeline .accordion-body {
    background-color: transparent !important;
    color: var(--sage-text-body, #cbd5e1) !important;
}

[data-bs-theme="dark"] .profile-timeline .accordion-body.border-start,
[data-bs-theme="dark"] .profile-timeline .border-primary-subtle {
    border-left-color: #316558 !important;
}

[data-bs-theme="dark"] .profile-json-block,
[data-bs-theme="dark"] .profile-timeline pre {
    background-color: #0d1e1a !important;
    background: #0d1e1a !important;
    border: 1px solid var(--sage-border-color, #244e44) !important;
    color: #86efac !important;
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3) !important;
}

[data-bs-theme="dark"] .profile-json-block code,
[data-bs-theme="dark"] .profile-timeline pre code {
    color: #86efac !important;
    background: transparent !important;
}

[data-bs-theme="dark"] .profile-nav.nav-pills .nav-link {
    color: rgba(255, 255, 255, 0.75) !important;
}

[data-bs-theme="dark"] .profile-nav.nav-pills .nav-link:hover {
    color: #ffffff !important;
    background-color: rgba(255, 255, 255, 0.08) !important;
}

[data-bs-theme="dark"] .profile-nav.nav-pills .nav-link.active {
    background-color: rgba(255, 255, 255, 0.15) !important;
    color: #ffffff !important;
}

/* Prominent Edit Profile Action Button */
.btn-edit-profile,
[data-bs-theme="dark"] .btn-edit-profile {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%) !important;
    background-color: #10b981 !important;
    border: 1px solid #34d399 !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    letter-spacing: 0.2px;
    box-shadow: 0 4px 14px rgba(16, 185, 129, 0.4) !important;
    transition: all 0.2s ease-in-out !important;
}

.btn-edit-profile:hover,
.btn-edit-profile:focus,
[data-bs-theme="dark"] .btn-edit-profile:hover,
[data-bs-theme="dark"] .btn-edit-profile:focus {
    background: linear-gradient(135deg, #059669 0%, #047857 100%) !important;
    background-color: #059669 !important;
    border-color: #6ee7b7 !important;
    color: #ffffff !important;
    box-shadow: 0 6px 20px rgba(16, 185, 129, 0.55) !important;
    transform: translateY(-1px);
}

/* --------------------------------------------------------------------------
   20. ROLE PERMISSIONS MATRIX MODAL (ADD & EDIT ROLE) - DARK MODE THEME
   -------------------------------------------------------------------------- */
[data-bs-theme="dark"] #addModal .modal-content,
[data-bs-theme="dark"] #editModal .modal-content {
    background-color: var(--sage-card-bg, #1B3C34) !important;
    color: var(--sage-text-body, #cbd5e1) !important;
    border-color: var(--sage-border-color, #244e44) !important;
}

[data-bs-theme="dark"] #addModal .modal-header,
[data-bs-theme="dark"] #editModal .modal-header {
    background-color: var(--sage-card-header-bg, #16322b) !important;
    border-bottom: 1px solid var(--sage-border-color, #244e44) !important;
}

[data-bs-theme="dark"] #addModal .modal-header .modal-title,
[data-bs-theme="dark"] #editModal .modal-header .modal-title {
    color: var(--sage-text-heading, #f8fafc) !important;
}

[data-bs-theme="dark"] #addModal .modal-header .avatar-title,
[data-bs-theme="dark"] #editModal .modal-header .avatar-title {
    background-color: rgba(74, 222, 128, 0.15) !important;
    color: #4ade80 !important;
}

[data-bs-theme="dark"] #addModal .modal-body,
[data-bs-theme="dark"] #editModal .modal-body {
    background-color: var(--sage-body-bg, #122822) !important;
}

/* Modal Footer & Action Buttons - Base (Light Mode) */
#addModal .modal-footer,
#editModal .modal-footer {
    background-color: #ffffff !important;
    border-top: 1px solid #e2e8f0 !important;
    box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.05) !important;
    z-index: 100 !important;
}

#addModal .modal-footer .btn-light,
#editModal .modal-footer .btn-light {
    background-color: #f8fafc !important;
    border: 1px solid #cbd5e1 !important;
    color: #475569 !important;
    font-weight: 500 !important;
    padding: 0.5rem 1.25rem !important;
    border-radius: 6px !important;
    transition: all 0.15s ease-in-out !important;
}

#addModal .modal-footer .btn-light:hover,
#editModal .modal-footer .btn-light:hover {
    background-color: #e2e8f0 !important;
    border-color: #94a3b8 !important;
    color: #0f172a !important;
}

#add-btn,
#edit-btn {
    background-color: #1d3932 !important;
    border-color: #1d3932 !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    padding: 0.5rem 1.5rem !important;
    border-radius: 6px !important;
    box-shadow: 0 2px 6px rgba(29, 57, 50, 0.25) !important;
    transition: all 0.15s ease-in-out !important;
}

#add-btn:hover,
#edit-btn:hover {
    background-color: #152924 !important;
    border-color: #152924 !important;
    color: #ffffff !important;
    box-shadow: 0 4px 10px rgba(29, 57, 50, 0.35) !important;
}

/* Modal Footer & Action Buttons - Dark Mode */
[data-bs-theme="dark"] #addModal .modal-footer,
[data-bs-theme="dark"] #editModal .modal-footer {
    background-color: var(--sage-card-header-bg, #16322b) !important;
    border-top: 1px solid var(--sage-border-color, #244e44) !important;
    box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.35) !important;
}

[data-bs-theme="dark"] #addModal .modal-footer .btn-light,
[data-bs-theme="dark"] #editModal .modal-footer .btn-light {
    background-color: rgba(255, 255, 255, 0.07) !important;
    border-color: var(--sage-border-color, #244e44) !important;
    color: var(--sage-text-heading, #f8fafc) !important;
}

[data-bs-theme="dark"] #addModal .modal-footer .btn-light:hover,
[data-bs-theme="dark"] #editModal .modal-footer .btn-light:hover {
    background-color: rgba(255, 255, 255, 0.14) !important;
    border-color: rgba(255, 255, 255, 0.25) !important;
    color: #ffffff !important;
}

[data-bs-theme="dark"] #add-btn,
[data-bs-theme="dark"] #edit-btn {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%) !important;
    background-color: #10b981 !important;
    border-color: #34d399 !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    box-shadow: 0 3px 10px rgba(16, 185, 129, 0.35) !important;
}

[data-bs-theme="dark"] #add-btn:hover,
[data-bs-theme="dark"] #edit-btn:hover {
    background: linear-gradient(135deg, #059669 0%, #047857 100%) !important;
    background-color: #059669 !important;
    border-color: #6ee7b7 !important;
    color: #ffffff !important;
}

/* Matrix Top Information Bar */
[data-bs-theme="dark"] .matrix-top-bar {
    background-color: var(--sage-card-bg, #1B3C34) !important;
    border: 1px solid var(--sage-border-color, #244e44) !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.25) !important;
}

[data-bs-theme="dark"] .matrix-top-bar .form-label,
[data-bs-theme="dark"] .matrix-top-bar .form-check-label {
    color: var(--sage-text-heading, #f8fafc) !important;
}

[data-bs-theme="dark"] .matrix-top-bar .form-control,
[data-bs-theme="dark"] .matrix-top-bar .form-select,
[data-bs-theme="dark"] .matrix-top-bar .flag-input {
    background-color: var(--sage-card-header-bg, #16322b) !important;
    border: 1px solid var(--sage-border-color, #244e44) !important;
    color: var(--sage-text-heading, #f8fafc) !important;
}

[data-bs-theme="dark"] .matrix-top-bar .form-control:focus,
[data-bs-theme="dark"] .matrix-top-bar .form-select:focus,
[data-bs-theme="dark"] .matrix-top-bar .flag-input:focus {
    border-color: #4ade80 !important;
    box-shadow: 0 0 0 3px rgba(74, 222, 128, 0.15) !important;
}

[data-bs-theme="dark"] .matrix-top-bar .form-control::placeholder {
    color: var(--sage-text-muted, #94a3b8) !important;
}

/* Company Dropdown List inside Modal */
[data-bs-theme="dark"] #addModal .dropdown-menu,
[data-bs-theme="dark"] #editModal .dropdown-menu {
    background-color: var(--sage-card-header-bg, #16322b) !important;
    border: 1px solid var(--sage-border-color, #244e44) !important;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.45) !important;
}

[data-bs-theme="dark"] #addModal .dropdown-menu .company_add,
[data-bs-theme="dark"] #editModal .dropdown-menu .company_add {
    background-color: var(--sage-card-bg, #1B3C34) !important;
    border: 1px solid var(--sage-border-color, #244e44) !important;
    color: var(--sage-text-heading, #f8fafc) !important;
}

[data-bs-theme="dark"] #addModal .dropdown-menu .dropdown-item,
[data-bs-theme="dark"] #editModal .dropdown-menu .dropdown-item {
    color: var(--sage-text-body, #cbd5e1) !important;
}

[data-bs-theme="dark"] #addModal .dropdown-menu .dropdown-item:hover,
[data-bs-theme="dark"] #addModal .dropdown-menu .dropdown-item:focus,
[data-bs-theme="dark"] #editModal .dropdown-menu .dropdown-item:hover,
[data-bs-theme="dark"] #editModal .dropdown-menu .dropdown-item:focus {
    background-color: var(--sage-brand-green-hover, #244e44) !important;
    color: #ffffff !important;
}

/* Navigation Tabs */
[data-bs-theme="dark"] .matrix-nav-pills {
    background-color: var(--sage-card-bg, #1B3C34) !important;
    border: 1px solid var(--sage-border-color, #244e44) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2) !important;
}

[data-bs-theme="dark"] .matrix-nav-pills .nav-link {
    color: var(--sage-text-muted, #94a3b8) !important;
}

[data-bs-theme="dark"] .matrix-nav-pills .nav-link:hover {
    color: var(--sage-text-heading, #f8fafc) !important;
    background-color: rgba(255, 255, 255, 0.06) !important;
}

[data-bs-theme="dark"] .matrix-nav-pills .nav-link.active {
    color: #ffffff !important;
    background-color: #10b981 !important;
    box-shadow: 0 2px 8px rgba(16, 185, 129, 0.35) !important;
}

/* Quick Filter Module Search Box */
[data-bs-theme="dark"] .matrix-search-box .matrix-search-icon {
    color: #4ade80 !important;
    opacity: 0.85 !important;
}

[data-bs-theme="dark"] .matrix-search-input {
    background-color: var(--sage-card-bg, #1B3C34) !important;
    border: 1.5px solid var(--sage-border-color, #244e44) !important;
    color: var(--sage-text-heading, #f8fafc) !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) !important;
}

[data-bs-theme="dark"] .matrix-search-input::placeholder {
    color: var(--sage-text-muted, #94a3b8) !important;
}

[data-bs-theme="dark"] .matrix-search-input:focus {
    background-color: var(--sage-card-bg, #1B3C34) !important;
    border-color: #4ade80 !important;
    box-shadow: 0 0 0 3px rgba(74, 222, 128, 0.18) !important;
}

[data-bs-theme="dark"] .matrix-search-clear {
    color: var(--sage-text-muted, #94a3b8) !important;
}

[data-bs-theme="dark"] .matrix-search-clear:hover {
    color: #ef4444 !important;
}

/* Sticky Column Header */
[data-bs-theme="dark"] .matrix-sticky-header {
    background-color: var(--sage-card-bg, #1B3C34) !important;
    border: 1px solid var(--sage-border-color, #244e44) !important;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.35) !important;
}

[data-bs-theme="dark"] .matrix-header-col-title {
    color: var(--sage-text-muted, #94a3b8) !important;
}

[data-bs-theme="dark"] .matrix-header-col-title.text-primary {
    color: #4ade80 !important;
}

[data-bs-theme="dark"] .btn-matrix-toggle {
    background-color: var(--sage-card-header-bg, #16322b) !important;
    color: var(--sage-text-heading, #f8fafc) !important;
    border: 1px solid var(--sage-border-color, #244e44) !important;
}

[data-bs-theme="dark"] .btn-matrix-toggle:hover {
    background-color: var(--sage-brand-green-hover, #244e44) !important;
    border-color: #4ade80 !important;
    color: #ffffff !important;
}

[data-bs-theme="dark"] .matrix-sticky-header .badge {
    background-color: var(--sage-card-header-bg, #16322b) !important;
    color: var(--sage-text-muted, #94a3b8) !important;
    border: 1px solid var(--sage-border-color, #244e44) !important;
}

/* Module Cards & Headers */
[data-bs-theme="dark"] .matrix-module-card {
    background: var(--sage-card-bg, #1B3C34) !important;
    border: 1.5px solid var(--sage-border-color, #244e44) !important;
    border-left: 3.5px solid #316558 !important;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25) !important;
}

[data-bs-theme="dark"] .matrix-module-card:hover {
    border-color: #316558 !important;
    border-left-color: #4ade80 !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35) !important;
}

[data-bs-theme="dark"] .matrix-module-header {
    background: var(--sage-card-bg, #1B3C34) !important;
    border-bottom: 1px solid var(--sage-border-color, #244e44) !important;
    transition: background-color 0.15s ease-in-out !important;
}

[data-bs-theme="dark"] .matrix-module-header:hover {
    background-color: #21483e !important;
}

/* Ensure accordion button inside module header is completely seamless without any dark boxed outline or fill */
[data-bs-theme="dark"] .matrix-module-header .accordion-button,
[data-bs-theme="dark"] .matrix-module-header .accordion-button:not(.collapsed),
[data-bs-theme="dark"] .matrix-module-header:hover .accordion-button,
[data-bs-theme="dark"] .matrix-module-header .accordion-button:hover,
[data-bs-theme="dark"] .matrix-module-header .accordion-button:focus,
[data-bs-theme="dark"] .matrix-module-header .accordion-button:active {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    color: inherit !important;
    outline: none !important;
}

[data-bs-theme="dark"] .matrix-module-title {
    color: #f8fafc !important;
    font-weight: 600 !important;
    font-size: 0.835rem !important;
    transition: color 0.15s ease-in-out !important;
}

[data-bs-theme="dark"] .matrix-module-header:hover .matrix-module-title {
    color: #4ade80 !important;
}

[data-bs-theme="dark"] .matrix-module-header .ri-folder-3-fill {
    color: #4ade80 !important;
}

[data-bs-theme="dark"] .matrix-chevron {
    color: #94a3b8 !important;
    transition: color 0.15s ease-in-out, transform 0.2s ease-in-out !important;
}

[data-bs-theme="dark"] .matrix-module-header:hover .matrix-chevron {
    color: #4ade80 !important;
}

[data-bs-theme="dark"] .matrix-module-header .badge {
    background-color: rgba(255, 255, 255, 0.08) !important;
    color: #cbd5e1 !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    font-weight: 600;
}

/* Expanded Module Cards & Subpages */
[data-bs-theme="dark"] .matrix-module-card.is-expanded,
[data-bs-theme="dark"] .matrix-module-card:has(.accordion-collapse.show) {
    border-color: #316558 !important;
    border-left: 4px solid #4ade80 !important;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.4) !important;
}

[data-bs-theme="dark"] .matrix-module-card.is-expanded .matrix-module-header,
[data-bs-theme="dark"] .matrix-module-card:has(.accordion-collapse.show) .matrix-module-header,
[data-bs-theme="dark"] .matrix-module-header:has(.accordion-button:not(.collapsed)) {
    background: linear-gradient(90deg, #16322b 0%, #1c3d35 100%) !important;
    border-bottom: 1.5px solid var(--sage-border-color, #244e44) !important;
}

[data-bs-theme="dark"] .matrix-module-card.is-expanded .matrix-module-title,
[data-bs-theme="dark"] .matrix-module-card:has(.accordion-collapse.show) .matrix-module-title {
    color: #4ade80 !important;
}

[data-bs-theme="dark"] .accordion-button:not(.collapsed) .matrix-chevron {
    color: #4ade80 !important;
    transform: rotate(90deg) !important;
}

[data-bs-theme="dark"] .matrix-module-card.is-expanded .matrix-subpage-row,
[data-bs-theme="dark"] .matrix-module-card:has(.accordion-collapse.show) .matrix-subpage-row,
[data-bs-theme="dark"] .matrix-subpage-row {
    background-color: var(--sage-card-bg, #1B3C34) !important;
    border-bottom: 1px solid var(--sage-border-color, #244e44) !important;
}

[data-bs-theme="dark"] .matrix-module-card.is-expanded .matrix-subpage-row:nth-child(even),
[data-bs-theme="dark"] .matrix-module-card:has(.accordion-collapse.show) .matrix-subpage-row:nth-child(even) {
    background-color: #16322b !important;
}

[data-bs-theme="dark"] .matrix-module-card.is-expanded .matrix-subpage-row:hover,
[data-bs-theme="dark"] .matrix-module-card:has(.accordion-collapse.show) .matrix-subpage-row:hover,
[data-bs-theme="dark"] .matrix-subpage-row:hover {
    background-color: var(--sage-brand-green-hover, #244e44) !important;
}

[data-bs-theme="dark"] .matrix-subpage-title {
    color: var(--sage-text-body, #cbd5e1) !important;
}

/* Custom Checkboxes */
[data-bs-theme="dark"] .matrix-checkbox {
    border-color: #4a786d !important;
    background-color: rgba(255, 255, 255, 0.08) !important;
}

[data-bs-theme="dark"] .matrix-checkbox:checked {
    background-color: #10b981 !important;
    border-color: #10b981 !important;
}

[data-bs-theme="dark"] .matrix-checkbox:indeterminate {
    background-color: #16322b !important;
    border-color: #4ade80 !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3crect x='4' y='8.5' width='12' height='3' rx='1.5' fill='%234ade80'/%3e%3c/svg%3e") !important;
}

[data-bs-theme="dark"] .matrix-checkbox:focus,
[data-bs-theme="dark"] .matrix-checkbox:indeterminate:focus {
    border-color: #4ade80 !important;
    box-shadow: 0 0 0 2.5px rgba(74, 222, 128, 0.25) !important;
}

[data-bs-theme="dark"] .matrix-empty-cell {
    color: #316558 !important;
}

/* Extra Permissions Tab (Dark Mode) */
[data-bs-theme="dark"] .extra-category-card {
    background-color: var(--sage-card-bg, #1B3C34) !important;
    border: 1px solid var(--sage-border-color, #244e44) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
}

[data-bs-theme="dark"] .extra-category-header {
    background-color: var(--sage-card-header-bg, #16322b) !important;
    border-bottom: 1px solid var(--sage-border-color, #244e44) !important;
}

[data-bs-theme="dark"] .extra-category-title {
    color: #4ade80 !important;
}

[data-bs-theme="dark"] .extra-category-icon {
    background-color: rgba(74, 222, 128, 0.15) !important;
    color: #4ade80 !important;
}

[data-bs-theme="dark"] .extra-category-badge {
    background-color: var(--sage-card-header-bg, #16322b) !important;
    color: var(--sage-text-muted, #94a3b8) !important;
    border: 1px solid var(--sage-border-color, #244e44) !important;
}

[data-bs-theme="dark"] .extra-perm-item {
    background-color: var(--sage-card-header-bg, #16322b) !important;
    border: 1px solid #2c594e !important;
}

[data-bs-theme="dark"] .extra-perm-item:hover {
    border-color: #4ade80 !important;
    background-color: var(--sage-brand-green-hover, #244e44) !important;
}

[data-bs-theme="dark"] .extra-perm-item.is-checked {
    background-color: rgba(74, 222, 128, 0.14) !important;
    border-color: #4ade80 !important;
    box-shadow: 0 1px 4px rgba(74, 222, 128, 0.25) !important;
}

[data-bs-theme="dark"] .extra-perm-label {
    color: var(--sage-text-body, #cbd5e1) !important;
}

[data-bs-theme="dark"] .extra-perm-item.is-checked .extra-perm-label {
    color: #4ade80 !important;
}

[data-bs-theme="dark"] .extra-toggle-all-btn {
    background-color: var(--sage-card-header-bg, #16322b) !important;
    border: 1px solid var(--sage-border-color, #244e44) !important;
    color: var(--sage-text-body, #cbd5e1) !important;
}

[data-bs-theme="dark"] .extra-toggle-all-btn:hover {
    background-color: var(--sage-brand-green-hover, #244e44) !important;
    border-color: #4ade80 !important;
    color: #ffffff !important;
}