/*
 * CheckinBook design system — dashboards (hotel and platform admin), on top of the Atlantis template.
 * Identity: lagoon teal + hibiscus accent on cool pearl; Bricolage Grotesque headings, Plus Jakarta Sans text;
 * hotel key-tag motif. Light and dark are both driven by tokens on html[data-theme] (set before paint by
 * partials/cb-theme-head). The old dark.css is no longer loaded.
 */

/* ---------- 1. Tokens ------------------------------------------------------ */
html[data-theme="light"] {
    color-scheme: light;
    --cb-bg: #F2F6F5;
    --cb-surface: #FFFFFF;
    --cb-surface-2: #F6F9F8;
    --cb-surface-3: #E9F0EE;
    --cb-border: #DDE6E4;
    --cb-border-strong: #C5D3D0;
    --cb-divider: #E8EEED;
    --cb-text: #0F2528;
    --cb-text-2: #35494D;
    --cb-muted: #637679;
    --cb-primary: #0E6E6B;
    --cb-primary-hover: #0A5653;
    --cb-primary-soft: rgba(14, 110, 107, .10);
    --cb-primary-soft-2: rgba(14, 110, 107, .18);
    --cb-on-primary: #FFFFFF;
    --cb-accent: #D6336C;
    --cb-accent-soft: rgba(214, 51, 108, .10);
    --cb-accent-text: #B0245A;
    --cb-side-bg: #FFFFFF;
    --cb-side-text: #35494D;
    --cb-side-muted: #7B8D90;
    --cb-side-hover: #EFF5F4;
    --cb-side-active-bg: #0E6E6B;
    --cb-side-active-text: #FFFFFF;
    --cb-success: #1F8A5B; --cb-success-soft: rgba(31, 138, 91, .11);
    --cb-warning: #A86A0C; --cb-warning-soft: rgba(214, 145, 30, .14);
    --cb-danger: #C62F3C;  --cb-danger-soft: rgba(198, 47, 60, .10);
    --cb-info: #2563C9;    --cb-info-soft: rgba(37, 99, 201, .10);
    --cb-shadow-sm: 0 1px 2px rgba(15, 37, 40, .06);
    --cb-shadow: 0 1px 2px rgba(15, 37, 40, .05), 0 6px 20px rgba(15, 37, 40, .06);
    --cb-shadow-lg: 0 18px 50px rgba(15, 37, 40, .16);
    --cb-focus: 0 0 0 3px rgba(14, 110, 107, .28);
}
html[data-theme="dark"] {
    color-scheme: dark;
    --cb-bg: #0A1516;
    --cb-surface: #0F1F21;
    --cb-surface-2: #132628;
    --cb-surface-3: #1A3134;
    --cb-border: #1F373A;
    --cb-border-strong: #2C4A4E;
    --cb-divider: #1A2F32;
    --cb-text: #E4EFEE;
    --cb-text-2: #B7C9C7;
    --cb-muted: #8BA2A0;
    --cb-primary: #38C3B4;
    --cb-primary-hover: #5AD3C6;
    --cb-primary-soft: rgba(56, 195, 180, .13);
    --cb-primary-soft-2: rgba(56, 195, 180, .22);
    --cb-on-primary: #032321;
    --cb-accent: #F06292;
    --cb-accent-soft: rgba(240, 98, 146, .14);
    --cb-accent-text: #F48FB1;
    --cb-side-bg: #0C191A;
    --cb-side-text: #B7C9C7;
    --cb-side-muted: #7E9593;
    --cb-side-hover: #142729;
    --cb-side-active-bg: #38C3B4;
    --cb-side-active-text: #032321;
    --cb-success: #4ACB8C; --cb-success-soft: rgba(74, 203, 140, .14);
    --cb-warning: #F0B34A; --cb-warning-soft: rgba(240, 179, 74, .14);
    --cb-danger: #F2737E;  --cb-danger-soft: rgba(242, 115, 126, .14);
    --cb-info: #7AA7F5;    --cb-info-soft: rgba(122, 167, 245, .14);
    --cb-shadow-sm: 0 1px 2px rgba(0, 0, 0, .4);
    --cb-shadow: 0 1px 2px rgba(0, 0, 0, .35), 0 8px 24px rgba(0, 0, 0, .28);
    --cb-shadow-lg: 0 20px 60px rgba(0, 0, 0, .55);
    --cb-focus: 0 0 0 3px rgba(56, 195, 180, .35);
}
html[data-theme] {
    --cb-font: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
    --cb-font-head: 'Bricolage Grotesque', 'Plus Jakarta Sans', system-ui, sans-serif;
    --cb-r-sm: 8px; --cb-r: 12px; --cb-r-lg: 16px; --cb-r-xl: 22px;
    --cb-speed: .16s;
}

/* ---------- 2. Base -------------------------------------------------------- */
html[data-theme] body,
html[data-theme] .wrapper,
html[data-theme] .main-panel,
html[data-theme] .main-panel > .content { background: var(--cb-bg) !important; color: var(--cb-text); }
html[data-theme] body { font-family: var(--cb-font) !important; font-size: 14.5px; -webkit-font-smoothing: antialiased; }
html[data-theme] body, html[data-theme] p, html[data-theme] td, html[data-theme] li, html[data-theme] label, html[data-theme] span,
html[data-theme] input, html[data-theme] select, html[data-theme] textarea, html[data-theme] button, html[data-theme] .btn { font-family: var(--cb-font) !important; }
html[data-theme] h1, html[data-theme] h2, html[data-theme] h3, html[data-theme] h4, html[data-theme] h5,
html[data-theme] .page-title, html[data-theme] .card-title, html[data-theme] .modal-title {
    font-family: var(--cb-font-head) !important; color: var(--cb-text) !important; letter-spacing: -.01em;
}
html[data-theme] a { color: var(--cb-primary); }
html[data-theme] a:hover { color: var(--cb-primary-hover); }
html[data-theme] .text-muted, html[data-theme] small, html[data-theme] .card-category { color: var(--cb-muted) !important; }
html[data-theme] hr { border-color: var(--cb-divider); }
html[data-theme] ::selection { background: var(--cb-primary-soft-2); }
html[data-theme] :focus-visible { outline: none; box-shadow: var(--cb-focus) !important; }
@media (prefers-reduced-motion: reduce) { html[data-theme] * { transition: none !important; animation-duration: .01ms !important; } }

/* ---------- 3. Top bar ----------------------------------------------------- */
html[data-theme] .main-header,
html[data-theme] .main-header .logo-header,
html[data-theme] .main-header .navbar-header,
html[data-theme] .main-header[data-background-color],
html[data-theme] .logo-header[data-background-color],
html[data-theme] .navbar-header[data-background-color] {
    background: var(--cb-surface) !important; box-shadow: none !important; border-bottom: 1px solid var(--cb-border);
}
html[data-theme] .main-header .logo-header { border-right: 1px solid var(--cb-border); }
html[data-theme] .logo-header .logo img, html[data-theme] .logo-header .navbar-brand { max-height: 34px; }
html[data-theme] .logo-header .navbar-toggler .navbar-toggler-icon,
html[data-theme] .logo-header .more, html[data-theme] .logo-header .btn-toggle,
html[data-theme] .main-header .nav-link, html[data-theme] .main-header .nav-link i { color: var(--cb-text-2) !important; }
html[data-theme] .topbar-nav .profile-pic .avatar-img, html[data-theme] .main-header .avatar-sm img { border: 2px solid var(--cb-surface-3); }

/* theme switch (rendered by cb-theme.js into [data-cb-theme-switch]) */
.cb-theme-switch { display: inline-flex; padding: 3px; gap: 2px; border-radius: 999px; background: var(--cb-surface-3); border: 1px solid var(--cb-border); }
.cb-theme-switch button { width: 32px; height: 30px; border: 0; border-radius: 999px; background: transparent; color: var(--cb-muted); display: grid; place-items: center; cursor: pointer; font-size: 13px; transition: background var(--cb-speed), color var(--cb-speed); }
.cb-theme-switch button:hover { color: var(--cb-text); }
.cb-theme-switch button[aria-pressed="true"] { background: var(--cb-surface); color: var(--cb-primary); box-shadow: var(--cb-shadow-sm); }

/* ---------- 4. Sidebar ----------------------------------------------------- */
html[data-theme] .sidebar,
html[data-theme] .sidebar[data-background-color],
html[data-theme] .sidebar .sidebar-wrapper { background: var(--cb-side-bg) !important; box-shadow: none !important; }
html[data-theme] .sidebar { border-right: 1px solid var(--cb-border) !important; }
html[data-theme] .sidebar .user { border-bottom: 1px solid var(--cb-divider) !important; margin: 0 14px; padding-bottom: 14px; }
html[data-theme] .sidebar .user .info a > span, html[data-theme] .sidebar .user .info a { color: var(--cb-text) !important; font-weight: 700; }
html[data-theme] .sidebar .user .info .user-level { color: var(--cb-muted) !important; font-weight: 500; }
html[data-theme] .sidebar .user .info .caret { border-top-color: var(--cb-muted) !important; }
html[data-theme] .sidebar input.form-control { background: var(--cb-surface-2) !important; border-color: var(--cb-border) !important; border-radius: 10px !important; font-size: 13px; }
html[data-theme] .sidebar .nav > .nav-item > a,
html[data-theme] .sidebar.sidebar-style-2 .nav .nav-item a { border-radius: 10px !important; margin: 1px 10px !important; padding: 9px 12px !important; }
html[data-theme] .sidebar .nav > .nav-item > a p,
html[data-theme] .sidebar .nav > .nav-item > a i,
html[data-theme] .sidebar .nav > .nav-item > a .caret,
html[data-theme] .sidebar .nav .nav-collapse li a .sub-item,
html[data-theme] .sidebar .nav .nav-collapse li a span,
html[data-theme] .sidebar .user .nav li a span { color: var(--cb-side-text) !important; }
html[data-theme] .sidebar .nav > .nav-item > a p { font-weight: 600; font-size: 13.5px; }
html[data-theme] .sidebar .nav > .nav-item > a i { color: var(--cb-side-muted) !important; width: 22px; font-size: 15px !important; }
html[data-theme] .sidebar .nav .nav-item a:hover,
html[data-theme] .sidebar .nav .nav-item a:focus,
html[data-theme] .sidebar .nav .nav-item a[data-toggle=collapse][aria-expanded=true] { background: var(--cb-side-hover) !important; }
html[data-theme] .sidebar .nav .nav-item a:hover p, html[data-theme] .sidebar .nav .nav-item a:hover i,
html[data-theme] .sidebar .nav .nav-item a[aria-expanded=true] p, html[data-theme] .sidebar .nav .nav-item a[aria-expanded=true] i { color: var(--cb-text) !important; }
html[data-theme] .sidebar .nav > .nav-item.active > a,
html[data-theme] .sidebar.sidebar-style-2 .nav .nav-item.active > a,
html[data-theme] .sidebar[data-background-color].sidebar-style-2 .nav .nav-item.active > a {
    background: var(--cb-side-active-bg) !important; box-shadow: 0 6px 16px var(--cb-primary-soft-2) !important;
}
html[data-theme] .sidebar .nav > .nav-item.active > a p,
html[data-theme] .sidebar .nav > .nav-item.active > a i,
html[data-theme] .sidebar .nav > .nav-item.active > a .caret { color: var(--cb-side-active-text) !important; }
html[data-theme] .sidebar .nav .nav-collapse { margin-top: 2px !important; padding-bottom: 6px !important; }
html[data-theme] .sidebar .nav .nav-collapse li a { margin: 0 10px 0 22px !important; padding: 6px 12px !important; border-left: 2px solid var(--cb-divider); border-radius: 0 8px 8px 0 !important; }
html[data-theme] .sidebar .nav .nav-collapse li a .sub-item { font-size: 13px; }
html[data-theme] .sidebar .nav .nav-collapse li a .sub-item:before { display: none !important; }
html[data-theme] .sidebar .nav .nav-collapse li.active > a, html[data-theme] .sidebar .nav .nav-collapse li a:hover { border-left-color: var(--cb-primary); background: var(--cb-primary-soft) !important; }
html[data-theme] .sidebar .nav .nav-collapse li.active > a .sub-item { color: var(--cb-primary) !important; font-weight: 700; }
html[data-theme] .sidebar .nav .nav-section .text-section { color: var(--cb-side-muted) !important; letter-spacing: .08em; }
html[data-theme] .sidebar .scroll-element .scroll-bar { background: var(--cb-border-strong) !important; }

/* ---------- 5. Page header ------------------------------------------------- */
html[data-theme] .page-header { margin-bottom: 18px; }
html[data-theme] .page-header .page-title { font-size: 1.55rem !important; font-weight: 700 !important; }
html[data-theme] .breadcrumbs, html[data-theme] .breadcrumbs li a, html[data-theme] .breadcrumbs .nav-home a,
html[data-theme] .breadcrumbs li { color: var(--cb-muted) !important; }
html[data-theme] .breadcrumbs .separator { color: var(--cb-border-strong) !important; }

/* ---------- 6. Cards ------------------------------------------------------- */
html[data-theme] .card {
    background: var(--cb-surface) !important; border: 1px solid var(--cb-border) !important; border-radius: var(--cb-r-lg) !important;
    box-shadow: var(--cb-shadow-sm) !important; color: var(--cb-text);
}
html[data-theme] .card .card-header { background: transparent !important; border-bottom: 1px solid var(--cb-divider) !important; padding: 16px 20px; }
html[data-theme] .card .card-footer { background: transparent !important; border-top: 1px solid var(--cb-divider) !important; }
html[data-theme] .card .card-title { font-size: 1.05rem !important; font-weight: 700 !important; }
html[data-theme] .card .card-body { color: var(--cb-text-2); }

/* stat tiles: loud colour blocks become calm cards with a coloured key-tag icon */
html[data-theme] .card.card-stats,
html[data-theme] .card.card-stats.card-primary, html[data-theme] .card.card-stats.card-info, html[data-theme] .card.card-stats.card-success,
html[data-theme] .card.card-stats.card-warning, html[data-theme] .card.card-stats.card-danger, html[data-theme] .card.card-stats.card-secondary {
    background: var(--cb-surface) !important; color: var(--cb-text) !important; transition: transform var(--cb-speed), box-shadow var(--cb-speed), border-color var(--cb-speed);
}
html[data-theme] a.card.card-stats:hover { transform: translateY(-2px); box-shadow: var(--cb-shadow) !important; border-color: var(--cb-border-strong) !important; text-decoration: none; }
html[data-theme] .card-stats .card-body { padding: 18px 20px !important; }
html[data-theme] .card-stats .icon-big {
    width: 52px; height: 58px; margin: 0; display: grid; place-items: center; font-size: 22px !important;
    border-radius: 12px 12px 18px 18px; position: relative; background: var(--cb-primary-soft); color: var(--cb-primary) !important;
}
html[data-theme] .card-stats .icon-big::before { content: ""; position: absolute; top: 6px; left: 50%; width: 7px; height: 7px; margin-left: -3.5px; border-radius: 50%; border: 2px solid currentColor; opacity: .45; }
html[data-theme] .card-stats .icon-big i { color: inherit !important; margin-top: 8px; }
html[data-theme] .card-stats.card-info .icon-big { background: var(--cb-info-soft); color: var(--cb-info) !important; }
html[data-theme] .card-stats.card-success .icon-big { background: var(--cb-success-soft); color: var(--cb-success) !important; }
html[data-theme] .card-stats.card-warning .icon-big { background: var(--cb-warning-soft); color: var(--cb-warning) !important; }
html[data-theme] .card-stats.card-danger .icon-big { background: var(--cb-danger-soft); color: var(--cb-danger) !important; }
html[data-theme] .card-stats.card-secondary .icon-big { background: var(--cb-accent-soft); color: var(--cb-accent) !important; }
html[data-theme] .card-stats .numbers .card-category { font-size: 12.5px !important; font-weight: 600; text-transform: none; color: var(--cb-muted) !important; }
html[data-theme] .card-stats .numbers .card-title { font-size: 1.6rem !important; font-weight: 700 !important; color: var(--cb-text) !important; margin-top: 2px; }
html[data-theme] .card-primary .card-header, html[data-theme] .card-info .card-header, html[data-theme] .card-success .card-header { border-color: var(--cb-divider) !important; }

/* ---------- 7. Buttons ----------------------------------------------------- */
html[data-theme] .btn { border-radius: 10px !important; font-weight: 600 !important; box-shadow: none !important; transition: background var(--cb-speed), border-color var(--cb-speed), color var(--cb-speed), transform var(--cb-speed); }
html[data-theme] .btn:active { transform: translateY(1px); }
html[data-theme] .btn-round { border-radius: 999px !important; }
html[data-theme] .btn-primary, html[data-theme] .btn-primary:disabled { background: var(--cb-primary) !important; border-color: var(--cb-primary) !important; color: var(--cb-on-primary) !important; }
html[data-theme] .btn-primary:hover, html[data-theme] .btn-primary:focus { background: var(--cb-primary-hover) !important; border-color: var(--cb-primary-hover) !important; }
html[data-theme] .btn-secondary { background: var(--cb-accent) !important; border-color: var(--cb-accent) !important; color: #fff !important; }
html[data-theme] .btn-success { background: var(--cb-success) !important; border-color: var(--cb-success) !important; color: #fff !important; }
html[data-theme] .btn-info { background: var(--cb-info) !important; border-color: var(--cb-info) !important; color: #fff !important; }
html[data-theme] .btn-warning { background: var(--cb-warning) !important; border-color: var(--cb-warning) !important; color: #fff !important; }
html[data-theme] .btn-danger { background: var(--cb-danger) !important; border-color: var(--cb-danger) !important; color: #fff !important; }
html[data-theme="dark"] .btn-success, html[data-theme="dark"] .btn-info, html[data-theme="dark"] .btn-warning, html[data-theme="dark"] .btn-danger { color: #06181A !important; }
html[data-theme] .btn-light, html[data-theme] .btn-default, html[data-theme] .btn-outline-secondary, html[data-theme] .btn-border {
    background: var(--cb-surface) !important; border: 1px solid var(--cb-border-strong) !important; color: var(--cb-text) !important;
}
html[data-theme] .btn-light:hover, html[data-theme] .btn-default:hover { background: var(--cb-surface-3) !important; }
html[data-theme] .btn-outline-primary { border-color: var(--cb-primary) !important; color: var(--cb-primary) !important; background: transparent !important; }
html[data-theme] .btn-outline-primary:hover { background: var(--cb-primary-soft) !important; }

/* ---------- 8. Forms ------------------------------------------------------- */
html[data-theme] label, html[data-theme] .form-group label, html[data-theme] .form-check label { color: var(--cb-text-2) !important; font-weight: 600 !important; font-size: 13px !important; }
html[data-theme] .form-control, html[data-theme] .custom-select, html[data-theme] .input-group-text,
html[data-theme] .select2-container--default .select2-selection--single, html[data-theme] .select2-container--default .select2-selection--multiple,
html[data-theme] .bootstrap-tagsinput {
    background: var(--cb-surface) !important; color: var(--cb-text) !important; border: 1px solid var(--cb-border-strong) !important; border-radius: 10px !important; box-shadow: none !important;
}
html[data-theme] .form-control { min-height: 40px; padding: 8px 12px !important; font-size: 14px !important; }
html[data-theme] .form-control:focus, html[data-theme] .select2-container--focus .select2-selection { border-color: var(--cb-primary) !important; box-shadow: var(--cb-focus) !important; }
html[data-theme] .form-control::placeholder { color: var(--cb-muted) !important; opacity: .8; }
html[data-theme] .form-control:disabled, html[data-theme] .form-control[readonly] { background: var(--cb-surface-2) !important; }
html[data-theme] .input-group-text { background: var(--cb-surface-2) !important; color: var(--cb-muted) !important; }
html[data-theme] .select2-container--default .select2-selection--single .select2-selection__rendered { color: var(--cb-text) !important; line-height: 38px; }
html[data-theme] .select2-container--default .select2-selection--single { height: 40px !important; }
html[data-theme] .select2-dropdown { background: var(--cb-surface) !important; border-color: var(--cb-border-strong) !important; color: var(--cb-text); border-radius: 10px !important; overflow: hidden; }
html[data-theme] .select2-results__option--highlighted { background: var(--cb-primary) !important; color: var(--cb-on-primary) !important; }
html[data-theme] .select2-search__field { background: var(--cb-surface-2) !important; color: var(--cb-text) !important; border-color: var(--cb-border) !important; }
html[data-theme] .select2-container--default .select2-selection--multiple .select2-selection__choice { background: var(--cb-primary-soft) !important; border-color: transparent !important; color: var(--cb-primary) !important; }
html[data-theme] .text-danger, html[data-theme] .error, html[data-theme] em.text-danger { color: var(--cb-danger) !important; }
html[data-theme] .custom-control-input:checked ~ .custom-control-label::before { background: var(--cb-primary) !important; border-color: var(--cb-primary) !important; }
html[data-theme] .selectgroup-input:checked + .selectgroup-button { background: var(--cb-primary) !important; border-color: var(--cb-primary) !important; color: var(--cb-on-primary) !important; }
html[data-theme] .selectgroup-button { border-color: var(--cb-border-strong) !important; color: var(--cb-text-2) !important; background: var(--cb-surface) !important; }
html[data-theme] .switch .slider { background: var(--cb-border-strong) !important; }
html[data-theme] .switch input:checked + .slider { background: var(--cb-success) !important; }

/* ---------- 9. Tables ------------------------------------------------------ */
html[data-theme] .table { color: var(--cb-text-2) !important; }
html[data-theme] .table thead th, html[data-theme] .table th {
    background: var(--cb-surface-2) !important; color: var(--cb-muted) !important; border-color: var(--cb-divider) !important;
    font-size: 12px !important; font-weight: 700 !important; text-transform: uppercase; letter-spacing: .05em; border-bottom-width: 1px !important;
}
html[data-theme] .table td, html[data-theme] .table th { border-color: var(--cb-divider) !important; padding: 12px 14px !important; vertical-align: middle !important; }
html[data-theme] .table td { font-size: 14px !important; }
html[data-theme] .table-bordered, html[data-theme] .table-bordered td, html[data-theme] .table-bordered th { border-color: var(--cb-divider) !important; }
html[data-theme] .table-striped tbody tr:nth-of-type(odd) { background: var(--cb-surface-2) !important; }
html[data-theme] .table-hover tbody tr:hover, html[data-theme] .table tbody tr:hover { background: var(--cb-primary-soft) !important; }
html[data-theme] .dataTables_wrapper .dataTables_info, html[data-theme] .dataTables_wrapper label { color: var(--cb-muted) !important; }
html[data-theme] .page-link { background: var(--cb-surface) !important; border-color: var(--cb-border) !important; color: var(--cb-text-2) !important; }
html[data-theme] .page-item.active .page-link { background: var(--cb-primary) !important; border-color: var(--cb-primary) !important; color: var(--cb-on-primary) !important; }
html[data-theme] .page-item.disabled .page-link { color: var(--cb-muted) !important; opacity: .6; }

/* ---------- 10. Badges, alerts, lists -------------------------------------- */
html[data-theme] .badge { border-radius: 999px !important; font-weight: 700 !important; padding: .38em .75em !important; font-size: 11.5px !important; border: 0 !important; }
html[data-theme] .badge-primary { background: var(--cb-primary-soft) !important; color: var(--cb-primary) !important; }
html[data-theme] .badge-success { background: var(--cb-success-soft) !important; color: var(--cb-success) !important; }
html[data-theme] .badge-warning { background: var(--cb-warning-soft) !important; color: var(--cb-warning) !important; }
html[data-theme] .badge-danger { background: var(--cb-danger-soft) !important; color: var(--cb-danger) !important; }
html[data-theme] .badge-info { background: var(--cb-info-soft) !important; color: var(--cb-info) !important; }
html[data-theme] .badge-secondary { background: var(--cb-accent-soft) !important; color: var(--cb-accent-text) !important; }
html[data-theme] .badge-dark, html[data-theme] .badge-light { background: var(--cb-surface-3) !important; color: var(--cb-text-2) !important; }
html[data-theme] .alert { border-radius: var(--cb-r) !important; border: 1px solid var(--cb-border) !important; background: var(--cb-surface) !important; color: var(--cb-text-2) !important; box-shadow: none !important; border-left-width: 4px !important; }
html[data-theme] .alert-warning, html[data-theme] .alert.text-warning { border-left-color: var(--cb-warning) !important; background: var(--cb-warning-soft) !important; }
html[data-theme] .alert-danger { border-left-color: var(--cb-danger) !important; background: var(--cb-danger-soft) !important; }
html[data-theme] .alert-success { border-left-color: var(--cb-success) !important; background: var(--cb-success-soft) !important; }
html[data-theme] .alert-info, html[data-theme] .alert-primary { border-left-color: var(--cb-primary) !important; background: var(--cb-primary-soft) !important; }
html[data-theme] .list-group-item { background: var(--cb-surface) !important; border-color: var(--cb-divider) !important; color: var(--cb-text-2) !important; }
html[data-theme] .border { border-color: var(--cb-border) !important; }
html[data-theme] .bg-white, html[data-theme] .bg-light { background: var(--cb-surface) !important; }
html[data-theme] .text-dark, html[data-theme] .text-black { color: var(--cb-text) !important; }
html[data-theme] .text-white { color: #fff; }
html[data-theme] .text-primary { color: var(--cb-primary) !important; }
html[data-theme] .text-success { color: var(--cb-success) !important; }
html[data-theme] .text-warning { color: var(--cb-warning) !important; }

/* ---------- 11. Dropdowns, modals, tabs ------------------------------------ */
html[data-theme] .dropdown-menu { background: var(--cb-surface) !important; border: 1px solid var(--cb-border) !important; border-radius: var(--cb-r) !important; box-shadow: var(--cb-shadow-lg) !important; padding: 6px !important; }
html[data-theme] .dropdown-item { color: var(--cb-text-2) !important; border-radius: 8px; padding: 8px 12px !important; }
html[data-theme] .dropdown-item:hover, html[data-theme] .dropdown-item:focus { background: var(--cb-surface-3) !important; color: var(--cb-text) !important; }
html[data-theme] .dropdown-divider { border-color: var(--cb-divider) !important; }
html[data-theme] .dropdown-user .u-text h4, html[data-theme] .dropdown-user .u-text p { color: var(--cb-text) !important; }
html[data-theme] .modal-content { background: var(--cb-surface) !important; border: 1px solid var(--cb-border) !important; border-radius: var(--cb-r-xl) !important; box-shadow: var(--cb-shadow-lg) !important; color: var(--cb-text); }
html[data-theme] .modal-header, html[data-theme] .modal-footer { border-color: var(--cb-divider) !important; }
html[data-theme] .modal-backdrop.show { opacity: .55; background: #041012; }
html[data-theme] .close { color: var(--cb-text) !important; text-shadow: none !important; opacity: .6; }
html[data-theme] .nav-tabs, html[data-theme] .nav-pills { border-color: var(--cb-divider) !important; }
html[data-theme] .nav-tabs .nav-link, html[data-theme] .nav-pills .nav-link { color: var(--cb-text-2) !important; border-radius: 10px 10px 0 0; }
html[data-theme] .nav-pills .nav-link { border-radius: 10px !important; }
html[data-theme] .nav-tabs .nav-link.active { background: var(--cb-surface) !important; color: var(--cb-primary) !important; border-color: var(--cb-divider) var(--cb-divider) var(--cb-surface) !important; }
html[data-theme] .nav-pills .nav-link.active, html[data-theme] .nav-pills.nav-secondary .nav-link.active { background: var(--cb-primary) !important; color: var(--cb-on-primary) !important; }

/* ---------- 12. Plugins ---------------------------------------------------- */
html[data-theme] .daterangepicker, html[data-theme] .flatpickr-calendar, html[data-theme] .ui-datepicker {
    background: var(--cb-surface) !important; border: 1px solid var(--cb-border) !important; color: var(--cb-text) !important; box-shadow: var(--cb-shadow-lg) !important; border-radius: var(--cb-r) !important;
}
html[data-theme] .daterangepicker .calendar-table { background: var(--cb-surface) !important; border-color: transparent !important; }
html[data-theme] .daterangepicker td.available:hover, html[data-theme] .daterangepicker th.available:hover { background: var(--cb-surface-3) !important; }
html[data-theme] .daterangepicker td.active, html[data-theme] .flatpickr-day.selected { background: var(--cb-primary) !important; border-color: var(--cb-primary) !important; color: var(--cb-on-primary) !important; }
html[data-theme] .daterangepicker td.off { background: transparent !important; color: var(--cb-muted) !important; }
html[data-theme] .flatpickr-day, html[data-theme] .flatpickr-month, html[data-theme] .flatpickr-weekday, html[data-theme] span.flatpickr-weekday { color: var(--cb-text) !important; }
html[data-theme] .tox-tinymce { border-color: var(--cb-border-strong) !important; border-radius: var(--cb-r) !important; }
html[data-theme] .dropzone { background: var(--cb-surface-2) !important; border: 2px dashed var(--cb-border-strong) !important; border-radius: var(--cb-r) !important; color: var(--cb-muted); }
html[data-theme] .swal-modal, html[data-theme] .swal2-popup { background: var(--cb-surface) !important; border-radius: var(--cb-r-xl) !important; }
html[data-theme] .swal-title, html[data-theme] .swal-text, html[data-theme] .swal2-title, html[data-theme] .swal2-html-container { color: var(--cb-text) !important; }
html[data-theme] .request-loader { background: rgba(4, 16, 18, .45) !important; }
html[data-theme] .chart-container canvas { max-width: 100%; }

/* ---------- 13. Footer ----------------------------------------------------- */
html[data-theme] .footer { background: var(--cb-surface) !important; border-top: 1px solid var(--cb-border) !important; color: var(--cb-muted) !important; }
html[data-theme] .footer .copyright, html[data-theme] .footer a { color: var(--cb-muted) !important; }

/* ---------- 14. Dark-mode leftovers from the template ---------------------- */
html[data-theme="dark"] .bg-white, html[data-theme="dark"] .bg-light { color: var(--cb-text) !important; }
html[data-theme="dark"] .text-dark, html[data-theme="dark"] .text-black-50 { color: var(--cb-text-2) !important; }
html[data-theme="dark"] img.avatar-img { background: var(--cb-surface-3); }
html[data-theme="dark"] .card[style*="background: #fff"], html[data-theme="dark"] [style*="background-color: #fff"], html[data-theme="dark"] [style*="background: white"] { background: var(--cb-surface) !important; }
html[data-theme="dark"] [style*="color: #000"], html[data-theme="dark"] [style*="color:#000"] { color: var(--cb-text) !important; }

/* ---------- 15. Wordmark --------------------------------------------------- */
.cb-logo { display: inline-flex; align-items: center; gap: 9px; text-decoration: none !important; line-height: 1; }
.cb-logo img { width: 34px; height: 34px; flex: 0 0 auto; }
.cb-logo__name { font-family: 'Bricolage Grotesque', 'Plus Jakarta Sans', system-ui, sans-serif; font-weight: 700; font-size: 21px; letter-spacing: -.02em; color: var(--cb-text, #0F2528); }
.cb-logo__name b { font-weight: 800; color: var(--cb-primary, #0E6E6B); }
.cb-logo--light .cb-logo__name { color: #FFFFFF; }
.cb-logo--light .cb-logo__name b { color: #7FE3D6; }
.cb-logo--lg img { width: 44px; height: 44px; }
.cb-logo--lg .cb-logo__name { font-size: 26px; }
html[data-theme] .logo-header .logo { display: flex; align-items: center; height: 100%; }