/**
 * Dark theme — full-app dark backgrounds + white/light text.
 * Requires html[data-hkits-theme="dark"] (variables in hkits-themes.css).
 */

/* ── Base & layout shell ─────────────────────────────────────────────── */
html[data-hkits-theme="dark"] body.hkits-app,
html[data-hkits-theme="dark"] body.hkits-app .hkits-wrapper,
html[data-hkits-theme="dark"] body.hkits-app .hkits-main,
html[data-hkits-theme="dark"] body.hkits-app .hkits-main-inner,
html[data-hkits-theme="dark"] body.hkits-app .hkits-service-page {
    background: var(--hkits-bg) !important;
    color: #ffffff !important;
}

/* Override layout.css hardcoded black-on-white page rules */
html[data-hkits-theme="dark"] body.hkits-app .hkits-main-inner,
html[data-hkits-theme="dark"] body.hkits-app .panel-body,
html[data-hkits-theme="dark"] body.hkits-app .modal-body,
html[data-hkits-theme="dark"] body.hkits-app .hkits-service-modal .modal-body {
    background: var(--hkits-surface) !important;
    color: #ffffff !important;
}

html[data-hkits-theme="dark"] body.hkits-app .hkits-main-inner a:not(.btn):not(.hkits-page-bar a) {
    color: var(--hkits-link) !important;
}
html[data-hkits-theme="dark"] body.hkits-app .hkits-main-inner a:not(.btn):hover {
    color: var(--hkits-link-hover) !important;
}

/* ── Top nav & sidebar ───────────────────────────────────────────────── */
html[data-hkits-theme="dark"] .hkits-topnav.navbar-default {
    background: var(--hkits-topnav-bg) !important;
    border-bottom-color: var(--hkits-border) !important;
}
html[data-hkits-theme="dark"] .hkits-topnav .navbar-brand,
html[data-hkits-theme="dark"] .hkits-topnav .hkits-facility-brand,
html[data-hkits-theme="dark"] .hkits-topnav .notify,
html[data-hkits-theme="dark"] .hkits-topnav .user-greeting-text,
html[data-hkits-theme="dark"] .hkits-topnav .dropdown-toggle,
html[data-hkits-theme="dark"] .hkits-topnav .navbar-text {
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] .hkits-topnav .icon-bar {
    background-color: #ffffff;
}
html[data-hkits-theme="dark"] .hkits-sidebar {
    background: var(--hkits-sidebar-bg) !important;
}
html[data-hkits-theme="dark"] .hkits-menu-head {
    color: var(--hkits-sidebar-item-text) !important;
}
html[data-hkits-theme="dark"] .hkits-menu-head:not(.active),
html[data-hkits-theme="dark"] .hkits-menu-head.active {
    border-left-color: var(--hkits-accent-secondary);
}
html[data-hkits-theme="dark"] .hkits-menu-head.active {
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] .hkits-submenu {
    border-left-color: var(--hkits-accent);
    background: var(--hkits-sidebar-submenu-bg) !important;
}
html[data-hkits-theme="dark"] .hkits-submenu li a {
    color: #e2e8f0 !important;
}
html[data-hkits-theme="dark"] .hkits-submenu li a:hover {
    color: #ffffff !important;
    background: var(--hkits-sidebar-item-hover) !important;
}
html[data-hkits-theme="dark"] .hkits-submenu li a .hkits-submenu-icon,
html[data-hkits-theme="dark"] .hkits-menu-head:not(.active) .fa-fw {
    color: var(--hkits-accent) !important;
}
html[data-hkits-theme="dark"] .hkits-sidebar-footer a {
    color: #e2e8f0 !important;
}

/* ── Page bar & headings ─────────────────────────────────────────────── */
html[data-hkits-theme="dark"] .hkits-page-bar,
html[data-hkits-theme="dark"] .hkits-page-bar h1,
html[data-hkits-theme="dark"] .hkits-page-bar .hkits-page-heading,
html[data-hkits-theme="dark"] .hkits-page-bar a {
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] .hkits-page-bar {
    background: var(--hkits-page-bar-bg) !important;
    border-bottom-color: var(--hkits-border) !important;
}

/* ── Panels & cards ──────────────────────────────────────────────────── */
html[data-hkits-theme="dark"] .panel,
html[data-hkits-theme="dark"] .hkits-dash-card,
html[data-hkits-theme="dark"] .hkits-dash-panel,
html[data-hkits-theme="dark"] .hkits-pcard {
    background: var(--hkits-surface) !important;
    border-color: var(--hkits-border) !important;
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] .panel-default > .panel-heading,
html[data-hkits-theme="dark"] .hkits-dash-v2 .panel-default > .panel-heading,
html[data-hkits-theme="dark"] .hkits-dash-card-head {
    background: #334155 !important;
    border-color: var(--hkits-border) !important;
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] .panel-default > .panel-heading .fa,
html[data-hkits-theme="dark"] .hkits-dash-v2 .panel-default > .panel-heading .fa,
html[data-hkits-theme="dark"] .hkits-dash-card-head .fa {
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] .panel-body,
html[data-hkits-theme="dark"] .hkits-dash-v2 .panel-body,
html[data-hkits-theme="dark"] .hkits-dash-card-body,
html[data-hkits-theme="dark"] .hkits-pcard-body {
    background: var(--hkits-surface) !important;
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] .panel-footer {
    background: #172033 !important;
    border-color: var(--hkits-border) !important;
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] .panel-title,
html[data-hkits-theme="dark"] .panel-heading strong {
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] .well {
    background: #172033 !important;
    border-color: var(--hkits-border) !important;
    color: #ffffff !important;
}

/* ── Tables (high specificity — beats layout #000 !important on th) ─── */
html[data-hkits-theme="dark"] body.hkits-app .table,
html[data-hkits-theme="dark"] body.hkits-app .hkits-dash-table,
html[data-hkits-theme="dark"] .table-responsive .table {
    color: #ffffff !important;
    background: var(--hkits-surface) !important;
}

/* Column labels — all thead/tfoot headers */
html[data-hkits-theme="dark"] body.hkits-app .table > thead > tr > th,
html[data-hkits-theme="dark"] body.hkits-app .table > tfoot > tr > th,
html[data-hkits-theme="dark"] body.hkits-app .table:not(.hkits-dash-table) > thead > tr > th,
html[data-hkits-theme="dark"] body.hkits-app .hkits-dash-v2 .hkits-dash-table > thead > tr > th,
html[data-hkits-theme="dark"] body.hkits-app .hkits-dash-v2 .hkits-dash-table > thead > tr:not(:first-child) > th,
html[data-hkits-theme="dark"] body.hkits-app .hkits-items-table thead th,
html[data-hkits-theme="dark"] body.hkits-app .hkits-cw-records-table thead th,
html[data-hkits-theme="dark"] body.hkits-app .hkits-checkin-ticket-table thead th,
html[data-hkits-theme="dark"] body.hkits-app .hkits-pharmacy-workspace .hkits-ph-ws-table th,
html[data-hkits-theme="dark"] body.hkits-app .hkits-lab-result-fields .hkits-lab-result-table th,
html[data-hkits-theme="dark"] body.hkits-app .hkits-lab-result-table thead th,
html[data-hkits-theme="dark"] body.hkits-app .hkits-lab-result-hc .hkits-lab-result-params-table th,
html[data-hkits-theme="dark"] body.hkits-app .hkits-ph-records-body-lab-result .hkits-cw-records-table th,
html[data-hkits-theme="dark"] body.hkits-app table thead th,
html[data-hkits-theme="dark"] body.hkits-app .dataTable thead th {
    color: #ffffff !important;
    border-color: var(--hkits-border) !important;
}

/* Standard list tables — dark header row */
html[data-hkits-theme="dark"] body.hkits-app .table:not(.hkits-dash-table) > thead > tr > th,
html[data-hkits-theme="dark"] body.hkits-app .hkits-items-table thead th,
html[data-hkits-theme="dark"] body.hkits-app .hkits-dash-v2 .hkits-dash-table > thead > tr:not(:first-child) > th,
html[data-hkits-theme="dark"] body.hkits-app .hkits-cw-records-table thead th,
html[data-hkits-theme="dark"] body.hkits-app .hkits-pharmacy-workspace .hkits-ph-ws-table th {
    background: #334155 !important;
}

/* Dashboard / accent header row — keep accent bg, white labels */
html[data-hkits-theme="dark"] body.hkits-app .hkits-dash-v2 .hkits-dash-table > thead > tr:first-child > th,
html[data-hkits-theme="dark"] body.hkits-app .hkits-pharm-form .hkits-pharm-items-table thead th,
html[data-hkits-theme="dark"] body.hkits-app .hkits-billing-queue-table thead th,
html[data-hkits-theme="dark"] body.hkits-app .hkits-lab-result-table thead th {
    background: var(--hkits-accent) !important;
    color: #ffffff !important;
    border-color: var(--hkits-primary-dark) !important;
}
html[data-hkits-theme="dark"] body.hkits-app .hkits-pharm-form .hkits-pharm-items-table thead th .fa {
    color: #ffffff !important;
}

/* Table body cells */
html[data-hkits-theme="dark"] body.hkits-app .table > tbody > tr > td,
html[data-hkits-theme="dark"] body.hkits-app .table > tbody > tr > th,
html[data-hkits-theme="dark"] body.hkits-app .hkits-dash-v2 .hkits-dash-table tbody td,
html[data-hkits-theme="dark"] body.hkits-app .hkits-dash-v2 .hkits-dash-table tfoot td,
html[data-hkits-theme="dark"] body.hkits-app .hkits-dash-table tbody td,
html[data-hkits-theme="dark"] body.hkits-app .hkits-main-inner .table tbody td,
html[data-hkits-theme="dark"] body.hkits-app .hkits-main-inner .table tbody th,
html[data-hkits-theme="dark"] body.hkits-app .hkits-service-page .table tbody td,
html[data-hkits-theme="dark"] body.hkits-app .hkits-cw-records-table tbody td,
html[data-hkits-theme="dark"] .hkits-dash-collapse-child td {
    background: var(--hkits-surface) !important;
    color: #ffffff !important;
    border-color: var(--hkits-border) !important;
}

html[data-hkits-theme="dark"] body.hkits-app .table-striped > tbody > tr:nth-of-type(odd) > td,
html[data-hkits-theme="dark"] body.hkits-app .hkits-dash-v2 .hkits-dash-table tbody tr:nth-of-type(odd) > td {
    background: #172033 !important;
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] body.hkits-app .table-striped > tbody > tr:nth-of-type(even) > td,
html[data-hkits-theme="dark"] body.hkits-app .hkits-dash-v2 .hkits-dash-table tbody tr:nth-of-type(even) > td {
    background: var(--hkits-surface) !important;
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] body.hkits-app .table-hover > tbody > tr:hover > td,
html[data-hkits-theme="dark"] body.hkits-app .hkits-dash-v2 .hkits-dash-table tbody tr:hover > td,
html[data-hkits-theme="dark"] body.hkits-app .hkits-cw-records-table tbody tr:hover > td,
html[data-hkits-theme="dark"] body.hkits-app .hkits-checkin-ticket-row:hover td {
    background: #334155 !important;
    color: #ffffff !important;
}

html[data-hkits-theme="dark"] body.hkits-app .hkits-dash-v2 .hkits-dash-collapse-parent > td,
html[data-hkits-theme="dark"] body.hkits-app .hkits-dash-v2 .hkits-dash-collapse-child > td,
html[data-hkits-theme="dark"] body.hkits-app .hkits-dash-v2 .hkits-dash-subtotal-row > td {
    background: #172033 !important;
    color: #ffffff !important;
}

html[data-hkits-theme="dark"] body.hkits-app .hkits-dash-table .list-name,
html[data-hkits-theme="dark"] body.hkits-app .hkits-dash-col-toggle,
html[data-hkits-theme="dark"] body.hkits-app .hkits-dash-table-foot {
    color: #ffffff !important;
    background: #172033 !important;
}

/* Lab result rows */
html[data-hkits-theme="dark"] body.hkits-app .hkits-lab-result-table tbody tr.hkits-lab-row-odd,
html[data-hkits-theme="dark"] body.hkits-app .hkits-lab-result-table tbody tr.hkits-lab-row-even {
    background: var(--hkits-surface) !important;
}
html[data-hkits-theme="dark"] body.hkits-app .hkits-lab-col-param,
html[data-hkits-theme="dark"] body.hkits-app .hkits-lab-result-table tbody td {
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] body.hkits-app .hkits-lab-result-table tbody tr.hkits-lab-row-abnormal .hkits-lab-col-result {
    color: #fca5a5 !important;
}

html[data-hkits-theme="dark"] body.hkits-app .hkits-dash-v2 .table-responsive,
html[data-hkits-theme="dark"] body.hkits-app .hkits-filter-panel--table .hkits-filter-body {
    background: var(--hkits-surface) !important;
}

html[data-hkits-theme="dark"] body.hkits-app .hkits-billing-queue-table tbody tr:hover,
html[data-hkits-theme="dark"] body.hkits-app .hkits-billing-queue-table tbody tr.active {
    background: #334155 !important;
    color: #ffffff !important;
}

html[data-hkits-theme="dark"] body.hkits-app label.caption,
html[data-hkits-theme="dark"] body.hkits-app .caption {
    color: #cbd5e1 !important;
}
html[data-hkits-theme="dark"] body.hkits-app .form-control[readonly],
html[data-hkits-theme="dark"] body.hkits-app .form-control[readonly]:focus {
    color: #ffffff !important;
    background-color: transparent !important;
}
html[data-hkits-theme="dark"] body.hkits-app .hkits-billing-overlay-box {
    background: var(--hkits-surface) !important;
    color: #ffffff !important;
}

/* ── Forms & inputs ──────────────────────────────────────────────────── */
html[data-hkits-theme="dark"] body.hkits-app input.form-control,
html[data-hkits-theme="dark"] body.hkits-app textarea.form-control,
html[data-hkits-theme="dark"] body.hkits-app select.form-control,
html[data-hkits-theme="dark"] body.hkits-app select:not(.btn):not([multiple]),
html[data-hkits-theme="dark"] .form-control,
html[data-hkits-theme="dark"] input,
html[data-hkits-theme="dark"] textarea,
html[data-hkits-theme="dark"] select {
    background-color: #172033 !important;
    border-color: var(--hkits-border) !important;
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] body.hkits-app .hkits-main-inner select option,
html[data-hkits-theme="dark"] select option {
    background: #1e293b !important;
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] .input-group-addon {
    background: #334155 !important;
    border-color: var(--hkits-border) !important;
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] label,
html[data-hkits-theme="dark"] .control-label,
html[data-hkits-theme="dark"] legend {
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] .help-block,
html[data-hkits-theme="dark"] .checkbox label,
html[data-hkits-theme="dark"] .radio label {
    color: #cbd5e1 !important;
}
html[data-hkits-theme="dark"] .hkits-filter-panel {
    background: var(--hkits-surface) !important;
    border-color: var(--hkits-border) !important;
}
html[data-hkits-theme="dark"] .hkits-filter-panel .hkits-filter-body {
    background: #172033 !important;
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] .bootstrap-select > .dropdown-toggle,
html[data-hkits-theme="dark"] .bootstrap-select .dropdown-menu {
    background: #172033 !important;
    color: #ffffff !important;
    border-color: var(--hkits-border) !important;
}
html[data-hkits-theme="dark"] .bootstrap-select .dropdown-menu li a {
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] .bootstrap-select .dropdown-menu li a:hover {
    background: #334155 !important;
}

/* ── Modals & popups ─────────────────────────────────────────────────── */
html[data-hkits-theme="dark"] .modal-content {
    background: var(--hkits-surface) !important;
    border-color: var(--hkits-border) !important;
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] .modal-header {
    background: #334155 !important;
    border-color: var(--hkits-border) !important;
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] .modal-title {
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] .modal-body {
    background: var(--hkits-surface) !important;
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] .modal-footer {
    background: #172033 !important;
    border-color: var(--hkits-border) !important;
}
html[data-hkits-theme="dark"] .modal-header .close {
    color: #ffffff !important;
    opacity: 0.8;
}
html[data-hkits-theme="dark"] .dropdown-menu {
    background: var(--hkits-surface) !important;
    border-color: var(--hkits-border) !important;
}
html[data-hkits-theme="dark"] .dropdown-menu > li > a {
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] .dropdown-menu > li > a:hover,
html[data-hkits-theme="dark"] .dropdown-menu > li > a:focus {
    background: #334155 !important;
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] .popover {
    background: var(--hkits-surface) !important;
    border-color: var(--hkits-border) !important;
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] .popover-title {
    background: #334155 !important;
    border-color: var(--hkits-border) !important;
    color: #ffffff !important;
}

/* ── Tabs & navigation ───────────────────────────────────────────────── */
html[data-hkits-theme="dark"] .nav-tabs {
    border-bottom-color: var(--hkits-border) !important;
}
html[data-hkits-theme="dark"] .nav-tabs > li > a {
    color: #cbd5e1 !important;
    background: #172033 !important;
}
html[data-hkits-theme="dark"] .nav-tabs > li.active > a,
html[data-hkits-theme="dark"] .nav-tabs > li.active > a:hover,
html[data-hkits-theme="dark"] .nav-tabs > li.active > a:focus,
html[data-hkits-theme="dark"] .hkits-file-tabs > li.active > a,
html[data-hkits-theme="dark"] .hkits-file-tabs > li.active > a:hover {
    background: var(--hkits-surface) !important;
    color: #ffffff !important;
    border-color: var(--hkits-border) !important;
    border-top-color: var(--hkits-accent) !important;
}
html[data-hkits-theme="dark"] .hkits-file-tabs > li > a {
    color: #cbd5e1 !important;
    background: #172033 !important;
}
html[data-hkits-theme="dark"] .list-group-item {
    background: var(--hkits-surface) !important;
    border-color: var(--hkits-border) !important;
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] .list-group-item.active {
    background: var(--hkits-accent) !important;
    border-color: var(--hkits-accent) !important;
    color: #ffffff !important;
}

/* ── Buttons (secondary) ─────────────────────────────────────────────── */
html[data-hkits-theme="dark"] .btn-default {
    background: #334155 !important;
    border-color: var(--hkits-border) !important;
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] .btn-default:hover,
html[data-hkits-theme="dark"] .btn-default:focus {
    background: #475569 !important;
    color: #ffffff !important;
}

/* ── Dashboard & reports ─────────────────────────────────────────────── */
html[data-hkits-theme="dark"] .hkits-stat-label,
html[data-hkits-theme="dark"] .hkits-stat-value,
html[data-hkits-theme="dark"] .hkits-stat-change,
html[data-hkits-theme="dark"] .hkits-top-rev-head,
html[data-hkits-theme="dark"] .hkits-top-rev-rank,
html[data-hkits-theme="dark"] .hkits-top-rev-name,
html[data-hkits-theme="dark"] .hkits-top-rev-amt,
html[data-hkits-theme="dark"] .hkits-income-dept-name,
html[data-hkits-theme="dark"] .hkits-income-dept-meta,
html[data-hkits-theme="dark"] .hkits-income-dept-amt,
html[data-hkits-theme="dark"] .hkits-dept-list li,
html[data-hkits-theme="dark"] .hkits-dash-period-label {
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] .hkits-dept-icon {
    background: #334155 !important;
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] .hkits-donut-label,
html[data-hkits-theme="dark"] .hkits-donut-label strong,
html[data-hkits-theme="dark"] .hkits-bed-legend li,
html[data-hkits-theme="dark"] .hkits-bed-legend li strong {
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] .hkits-pcard-meta,
html[data-hkits-theme="dark"] .hkits-pcard-name,
html[data-hkits-theme="dark"] .hkits-pcard-demo,
html[data-hkits-theme="dark"] .hkits-pcard-info,
html[data-hkits-theme="dark"] .hkits-pcard-info .fa,
html[data-hkits-theme="dark"] body.hkits-app .hkits-pcard--report .hkits-pcard-info,
html[data-hkits-theme="dark"] body.hkits-app .hkits-pcard--report .hkits-pcard-demo {
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] .hkits-pcard-body {
    background: var(--hkits-surface) !important;
}
html[data-hkits-theme="dark"] .hkits-empty-state,
html[data-hkits-theme="dark"] .hkits-empty-state .fa {
    color: #cbd5e1 !important;
}
html[data-hkits-theme="dark"] .hkits-pager-info {
    color: #cbd5e1 !important;
}
html[data-hkits-theme="dark"] .hkits-top-rev-bar {
    background: #334155 !important;
}

/* ── Typography utilities ────────────────────────────────────────────── */
html[data-hkits-theme="dark"] .text-muted,
html[data-hkits-theme="dark"] body.hkits-app .hkits-main-inner .text-muted,
html[data-hkits-theme="dark"] body.hkits-app .hkits-donut-label span,
html[data-hkits-theme="dark"] small,
html[data-hkits-theme="dark"] .small {
    color: #cbd5e1 !important;
}
html[data-hkits-theme="dark"] .text-danger {
    color: #fca5a5 !important;
}
html[data-hkits-theme="dark"] .text-success {
    color: #86efac !important;
}
html[data-hkits-theme="dark"] .text-warning,
html[data-hkits-theme="dark"] .hkits-text-warn {
    color: #fcd34d !important;
}
html[data-hkits-theme="dark"] .hkits-text-danger {
    color: #fca5a5 !important;
}

/* ── Alerts & badges ─────────────────────────────────────────────────── */
html[data-hkits-theme="dark"] .alert {
    border-color: var(--hkits-border) !important;
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] .alert-info {
    background: #1e3a5f !important;
}
html[data-hkits-theme="dark"] .alert-success {
    background: #14532d !important;
}
html[data-hkits-theme="dark"] .alert-warning {
    background: #713f12 !important;
}
html[data-hkits-theme="dark"] .alert-danger {
    background: #7f1d1d !important;
}
html[data-hkits-theme="dark"] .hkits-badge--new,
html[data-hkits-theme="dark"] .hkits-badge--seen,
html[data-hkits-theme="dark"] .hkits-badge--warn {
    background: #334155 !important;
    color: #ffffff !important;
    border-color: var(--hkits-border) !important;
}
html[data-hkits-theme="dark"] .hkits-badge--danger {
    background: #991b1b !important;
    color: #ffffff !important;
}

/* ── Pagination & misc ───────────────────────────────────────────────── */
html[data-hkits-theme="dark"] .pagination > li > a,
html[data-hkits-theme="dark"] .pagination > li > span {
    background: var(--hkits-surface) !important;
    border-color: var(--hkits-border) !important;
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] .pagination > .active > a {
    background: var(--hkits-accent) !important;
    border-color: var(--hkits-accent) !important;
}
html[data-hkits-theme="dark"] hr {
    border-color: var(--hkits-border) !important;
}
html[data-hkits-theme="dark"] .hkits-toolbar,
html[data-hkits-theme="dark"] .hkits-list-container {
    background: transparent !important;
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] .hkits-view-toggle-btn {
    background: #172033 !important;
    color: #ffffff !important;
    border-color: var(--hkits-border) !important;
}
html[data-hkits-theme="dark"] .hkits-view-toggle-btn.active {
    background: var(--hkits-accent) !important;
    color: #ffffff !important;
}

/* Theme settings page on dark */
html[data-hkits-theme="dark"] .hkits-theme-card,
html[data-hkits-theme="dark"] .hkits-ui-shape-card,
html[data-hkits-theme="dark"] .hkits-theme-custom-panel {
    background: var(--hkits-surface) !important;
    color: #ffffff !important;
}
html[data-hkits-theme="dark"] .hkits-theme-card-body small,
html[data-hkits-theme="dark"] .hkits-ui-shape-card small {
    color: #cbd5e1 !important;
}