:root {
    --text-w-600: white;
    --text-w-400: gainsboro;
    --primary-600: #C4161C;
    --primary-400: #f18689;
    --primary-200: #f9ccce;
    --primary-100: #fcf3f3;
    --secondary-600: #e04248;
    --secondary-100: #fbecec;
    --text-600: #313131;
    --bg-dark: #313131;
    --text-400: #5a5a5a;
    --success-800: #4a8940;
    --success-600: #5dac51;
    --success-200: #cee6ca;
    --success-100: #eef6ed;
    --warning-600: #5dac51;
    --warning-800: #ca712d;
    --warning-400: #fda460;
    --warning-200: #fdbb88;
    --warning-100: #fef3eb;
}

/* ─── Dark theme overrides ─────────────────────────────────────────── */
[data-theme="dark"] {
    /* Surfaces */
    --surface-a0: #1a1a1a;
    --surface-a10: #242424;
    --surface-a25: rgba(255,255,255,0.08);
    --surface-a20: #333333;
    /* Text */
    --color-text: #e0e0e0;
    --color-text-a30: #9e9e9e;
    --color-text-a80: rgba(158,158,158,0.33);
    /* Primary brand stays red — slightly lighter for dark bg readability */
    --color-primary-a0: #e04248;
    --color-primary-a10: #ea7075;
    --color-primary-a30: #c46466;
    --color-primary-a60: rgba(196,22,28,0.18);
    --color-primary-a80: rgba(196,22,28,0.08);
    /* Danger / Warning */
    --color-danger-a0: #f05252;
    --color-danger-a80: rgba(240,82,82,0.15);
    --color-warning-a0: #fbbf24;
    --color-warning-a80: rgba(251,191,36,0.15);
    /* Bootstrap body */
    --bs-body-bg: #1a1a1a;
    --bs-body-color: #e0e0e0;
    --bs-border-color: #333333;
    --bs-secondary-color: #9e9e9e;
    /* Layout */
    --bg-page: #141414;
    --bg-panel-left: #1e1e1e;
    --bg-card: #222222;
    /* Borders & inputs */
    --border-color: #333333;
    --border-focus: #4a4a4a;
    --input-bg: #2a2a2a;
    /* Text scale */
    --text-main: #e2e8f0;
    --text-secondary: #94a3b8;
    --text-muted: #64748b;
    /* Accountant table — group header tints (lightened for dark surfaces) */
    --acc-th-bg: var(--surface-a20);
    --acc-car-color: #9DB4E0;
    --acc-car-bg: #344B7325;
    --acc-domestic-color: #F2A0C0;
    --acc-domestic-bg: #B7095425;
    --acc-foreign-color: #D9A8D0;
    --acc-foreign-bg: #8F317825;
    /* Status */
    --status-online: #4ade80;
    --status-offline: #4b5563;
    /* Component tokens */
    --text-600: #d0d0d0;
    --text-400: #9e9e9e;
    /* Accent scale for dark */
    --primary-100: rgba(196,22,28,0.12);
    --primary-200: rgba(196,22,28,0.22);
    --primary-400: #c46466;
    --secondary-100: rgba(224,66,72,0.12);
    /* Success in dark */
    --success-100: rgba(93,172,81,0.12);
    --success-200: rgba(93,172,81,0.22);
    /* Warning in dark */
    --warning-100: rgba(202,113,45,0.12);
    /* Scrollbar */
    scrollbar-color: rgba(100,100,100,0.5) transparent;
    /* ── Bootstrap 5 component CSS variables ─────────────────────────── */
    --bs-secondary-bg: #242424;
    --bs-tertiary-bg: #1e1e1e;
    --bs-secondary-bg-subtle: #242424;
    --bs-tertiary-bg-subtle: #1e1e1e;
    --bs-light-bg-subtle: #242424;
    --bs-dark-bg-subtle: #1a1a1a;
    --bs-emphasis-color: #e0e0e0;
    --bs-link-color: #ea7075;
    --bs-link-hover-color: #c46466;
    /* Modal */
    --bs-modal-bg: #222222;
    --bs-modal-border-color: #333333;
    --bs-modal-header-border-color: #333333;
    --bs-modal-footer-border-color: #333333;
    --bs-modal-color: #e0e0e0;
    /* Dropdown */
    --bs-dropdown-bg: #242424;
    --bs-dropdown-color: #e0e0e0;
    --bs-dropdown-border-color: #333333;
    --bs-dropdown-link-color: #e0e0e0;
    --bs-dropdown-link-hover-bg: #333333;
    --bs-dropdown-link-hover-color: #e0e0e0;
    --bs-dropdown-link-active-bg: rgba(196,22,28,0.18);
    --bs-dropdown-link-active-color: #ea7075;
    --bs-dropdown-divider-bg: #333333;
    --bs-dropdown-header-color: #9e9e9e;
    /* Card */
    --bs-card-bg: #222222;
    --bs-card-border-color: #333333;
    --bs-card-cap-bg: #2a2a2a;
    --bs-card-color: #e0e0e0;
    /* Input / Form */
    --bs-input-bg: #2a2a2a;
    --bs-input-border-color: #333333;
    --bs-input-color: #e0e0e0;
    --bs-input-placeholder-color: #64748b;
    --bs-input-focus-border-color: #4a4a4a;
    --bs-input-focus-box-shadow: 0 0 0 0.25rem rgba(196,22,28,0.25);
    --bs-form-select-bg: #2a2a2a;
    --bs-form-select-color: #e0e0e0;
    --bs-form-select-border-color: #333333;
    --bs-form-control-bg: #2a2a2a;
    --bs-form-control-color: #e0e0e0;
    --bs-form-check-input-bg: #2a2a2a;
    --bs-form-check-input-border: 1px solid #555555;
    /* Table */
    --bs-table-bg: transparent;
    --bs-table-color: #e0e0e0;
    --bs-table-border-color: #333333;
    --bs-table-striped-bg: rgba(255,255,255,0.03);
    --bs-table-striped-color: #e0e0e0;
    --bs-table-hover-bg: rgba(255,255,255,0.06);
    --bs-table-hover-color: #e0e0e0;
    --bs-table-active-bg: rgba(255,255,255,0.1);
    /* Nav / Tabs */
    --bs-nav-tabs-border-color: #333333;
    --bs-nav-tabs-link-hover-border-color: #444444;
    --bs-nav-tabs-link-active-bg: #222222;
    --bs-nav-tabs-link-active-border-color: #333333 #333333 #222222;
    --bs-nav-tabs-link-active-color: #e0e0e0;
    --bs-nav-link-color: #9e9e9e;
    --bs-nav-link-hover-color: #e0e0e0;
    --bs-nav-pills-link-active-bg: rgba(196,22,28,0.2);
    /* Pagination */
    --bs-pagination-bg: #222222;
    --bs-pagination-border-color: #333333;
    --bs-pagination-color: #e0e0e0;
    --bs-pagination-hover-bg: #333333;
    --bs-pagination-hover-color: #e0e0e0;
    --bs-pagination-hover-border-color: #444444;
    --bs-pagination-active-bg: #e04248;
    --bs-pagination-active-border-color: #e04248;
    --bs-pagination-disabled-bg: #1a1a1a;
    --bs-pagination-disabled-border-color: #2a2a2a;
    --bs-pagination-disabled-color: #555555;
    /* Accordion */
    --bs-accordion-bg: #222222;
    --bs-accordion-border-color: #333333;
    --bs-accordion-btn-bg: #2a2a2a;
    --bs-accordion-btn-color: #e0e0e0;
    --bs-accordion-color: #e0e0e0;
    --bs-accordion-active-bg: rgba(196,22,28,0.15);
    --bs-accordion-active-color: #ea7075;
    --bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%239e9e9e'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ea7075'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    /* List group */
    --bs-list-group-bg: #222222;
    --bs-list-group-border-color: #333333;
    --bs-list-group-color: #e0e0e0;
    --bs-list-group-action-color: #e0e0e0;
    --bs-list-group-action-hover-bg: #333333;
    --bs-list-group-action-hover-color: #e0e0e0;
    --bs-list-group-active-bg: #e04248;
    --bs-list-group-active-border-color: #e04248;
    /* Offcanvas */
    --bs-offcanvas-bg: #222222;
    --bs-offcanvas-color: #e0e0e0;
    --bs-offcanvas-border-color: #333333;
    /* Popover / Tooltip */
    --bs-popover-bg: #2a2a2a;
    --bs-popover-border-color: #444444;
    --bs-popover-header-bg: #333333;
    --bs-popover-header-color: #e0e0e0;
    --bs-popover-body-color: #e0e0e0;
    --bs-tooltip-bg: #333333;
    --bs-tooltip-color: #e0e0e0;
    /* Alert base */
    --bs-alert-color: #e0e0e0;
    --bs-alert-bg: #2a2a2a;
    --bs-alert-border-color: #444444;
    /* Badge */
    --bs-badge-color: #fff;
    /* Progress */
    --bs-progress-bg: #333333;
    --bs-progress-bar-bg: #e04248;
    /* Close button */
    --bs-btn-close-color: #e0e0e0;
    --bs-btn-close-filter: invert(1) grayscale(100%) brightness(200%);
    /* Breadcrumb */
    --bs-breadcrumb-divider-color: #9e9e9e;
    --bs-breadcrumb-item-active-color: #9e9e9e;
}

    /* ─── Dark theme CSS rules (Bootstrap component overrides) ──────────── */

    [data-theme="dark"] body {
        background-color: var(--bg-page);
        color: var(--text-main);
    }

    /* ── Bootstrap utility class overrides ─────────────────────────────── */

    [data-theme="dark"] .bg-light,
    [data-theme="dark"] .bg-light-subtle {
        background-color: var(--surface-a20) !important;
        color: var(--text-main) !important;
    }

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

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

    [data-theme="dark"] .bg-body-secondary,
    [data-theme="dark"] .bg-body-tertiary {
        background-color: var(--surface-a10) !important;
    }

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

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

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

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

    [data-theme="dark"] .shadow-sm {
        box-shadow: 0 0.125rem 0.25rem rgba(0,0,0,0.4) !important;
    }

    [data-theme="dark"] .shadow {
        box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.5) !important;
    }

    /* ── Modal ──────────────────────────────────────────────────────────── */

    [data-theme="dark"] .modal-content {
        background-color: var(--bg-card);
        border-color: var(--border-color);
        color: var(--color-text);
    }

    [data-theme="dark"] .modal-header,
    [data-theme="dark"] .modal-footer {
        border-color: var(--border-color);
    }

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

    /* ── Dropdown ───────────────────────────────────────────────────────── */

    [data-theme="dark"] .dropdown-menu {
        background-color: var(--bg-card);
        border-color: var(--border-color);
        box-shadow: 0 4px 12px rgba(0,0,0,0.4);
    }

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

        [data-theme="dark"] .dropdown-item:hover,
        [data-theme="dark"] .dropdown-item:focus {
            background-color: var(--surface-a20);
            color: var(--text-main);
        }

    [data-theme="dark"] .dropdown-divider {
        border-top-color: var(--border-color);
    }

    [data-theme="dark"] .dropdown-header {
        color: var(--color-text-a30);
    }

    /* ── Forms ──────────────────────────────────────────────────────────── */

    [data-theme="dark"] .form-control,
    [data-theme="dark"] .form-select {
        background-color: var(--input-bg);
        border-color: var(--border-color);
        color: var(--text-main);
    }

        [data-theme="dark"] .form-control:focus,
        [data-theme="dark"] .form-select:focus {
            background-color: var(--input-bg);
            border-color: var(--border-focus);
            color: var(--text-main);
        }

        [data-theme="dark"] .form-control::placeholder {
            color: var(--text-muted);
        }

        [data-theme="dark"] .form-control:disabled,
        [data-theme="dark"] .form-select:disabled,
        [data-theme="dark"] .form-control[readonly] {
            background-color: var(--surface-a20);
            color: var(--color-text-a30);
        }

    [data-theme="dark"] .input-group-text {
        background-color: var(--surface-a20);
        border-color: var(--border-color);
        color: var(--color-text);
    }

    [data-theme="dark"] .form-check-input {
        background-color: var(--input-bg);
        border-color: #555555;
    }

        [data-theme="dark"] .form-check-input:checked {
            background-color: var(--color-primary-a0);
            border-color: var(--color-primary-a0);
        }

    [data-theme="dark"] input[type="checkbox"].check-circle {
        background-color: #3a3a3a;
        border-color: #606060;
    }

        [data-theme="dark"] input[type="checkbox"].check-circle:checked {
            background-color: var(--primary-600);
            border-color: var(--primary-600);
        }

    /* ── Card ───────────────────────────────────────────────────────────── */

    [data-theme="dark"] .card {
        background-color: var(--bg-card);
        border-color: var(--border-color);
        color: var(--color-text);
    }

    [data-theme="dark"] .card-header,
    [data-theme="dark"] .card-footer {
        background-color: var(--surface-a20);
        border-color: var(--border-color);
    }

    [data-theme="dark"] .card-body {
        background-color: var(--bg-card);
        color: var(--color-text);
    }

    /* ── Table ──────────────────────────────────────────────────────────── */

    [data-theme="dark"] .table {
        --bs-table-color: var(--text-main);
        --bs-table-bg: transparent;
        --bs-table-border-color: var(--border-color);
        color: var(--text-main);
    }

        [data-theme="dark"] .table th {
            border-color: var(--border-color);
            color: var(--text-main);
            background-color: var(--surface-a10);
        }

        [data-theme="dark"] .table td {
            border-color: var(--border-color);
        }

    [data-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) > * {
        --bs-table-color-type: var(--text-main);
        --bs-table-bg-type: rgba(255,255,255,0.03);
    }

    [data-theme="dark"] .table-hover > tbody > tr:not(.editing-row):hover > * {
        --bs-table-color-state: var(--primary-400);
        --bs-table-bg-state: var(--primary-100);
    }

    [data-theme="dark"] .table-bordered > :not(caption) > * {
        border-color: var(--border-color);
    }

    /* ── Nav / Tabs ─────────────────────────────────────────────────────── */

    [data-theme="dark"] .nav-tabs {
        border-bottom-color: var(--border-color);
    }

        [data-theme="dark"] .nav-tabs .nav-link {
            color: var(--color-text-a30);
        }

            [data-theme="dark"] .nav-tabs .nav-link:hover,
            [data-theme="dark"] .nav-tabs .nav-link:focus {
                border-color: var(--border-color) var(--border-color) transparent;
                color: var(--text-main);
            }

            [data-theme="dark"] .nav-tabs .nav-link.active,
            [data-theme="dark"] .nav-tabs .nav-item.show .nav-link {
                background-color: var(--bg-card);
                border-color: var(--border-color) var(--border-color) var(--bg-card);
                color: var(--text-main);
            }

    /* ── Accordion ──────────────────────────────────────────────────────── */

    [data-theme="dark"] .accordion-item {
        background-color: var(--bg-card);
        border-color: var(--border-color);
    }

    [data-theme="dark"] .accordion-button {
        background-color: var(--surface-a20);
        color: var(--text-main);
        box-shadow: none;
    }

        [data-theme="dark"] .accordion-button:not(.collapsed) {
            background-color: var(--primary-100);
            color: var(--primary-400);
            box-shadow: inset 0 -1px 0 var(--border-color);
        }

    [data-theme="dark"] .accordion-body {
        background-color: var(--bg-card);
        color: var(--color-text);
    }

    [data-theme="dark"] .accordion-collapse {
        background-color: var(--bg-card);
    }

    /* ── Offcanvas ──────────────────────────────────────────────────────── */

    [data-theme="dark"] .offcanvas,
    [data-theme="dark"] .offcanvas-start,
    [data-theme="dark"] .offcanvas-end,
    [data-theme="dark"] .offcanvas-top,
    [data-theme="dark"] .offcanvas-bottom {
        background-color: var(--bg-card);
        color: var(--color-text);
        border-color: var(--border-color);
    }

    [data-theme="dark"] .offcanvas-header {
        border-bottom-color: var(--border-color);
    }

    [data-theme="dark"] .offcanvas-footer {
        border-top-color: var(--border-color);
    }

    /* ── List group ─────────────────────────────────────────────────────── */

    [data-theme="dark"] .list-group-item {
        background-color: var(--bg-card);
        border-color: var(--border-color);
        color: var(--color-text);
    }

    [data-theme="dark"] .list-group-item-action:hover,
    [data-theme="dark"] .list-group-item-action:focus {
        background-color: var(--surface-a20);
        color: var(--text-main);
    }

    /* ── Pagination ─────────────────────────────────────────────────────── */

    [data-theme="dark"] .page-link {
        background-color: var(--bg-card);
        border-color: var(--border-color);
        color: var(--color-text);
    }

        [data-theme="dark"] .page-link:hover {
            background-color: var(--surface-a20);
            border-color: var(--border-color);
            color: var(--text-main);
        }

    [data-theme="dark"] .page-item.disabled .page-link {
        background-color: var(--surface-a10);
        border-color: var(--border-color);
        color: var(--text-muted);
    }

    /* ── Popover / Tooltip ──────────────────────────────────────────────── */

    [data-theme="dark"] .popover {
        background-color: var(--surface-a20);
        border-color: var(--border-color);
    }

    [data-theme="dark"] .popover-header {
        background-color: var(--surface-a25);
        border-bottom-color: var(--border-color);
        color: var(--text-main);
    }

    [data-theme="dark"] .popover-body {
        color: var(--color-text);
    }

    [data-theme="dark"] .tooltip-inner {
        background-color: var(--surface-a20);
        color: var(--text-main);
    }

    /* ── Toast ──────────────────────────────────────────────────────────── */

    [data-theme="dark"] .toast {
        background-color: var(--bg-card);
        border-color: var(--border-color);
        color: var(--color-text);
    }

    [data-theme="dark"] .toast-header {
        background-color: var(--surface-a20);
        border-bottom-color: var(--border-color);
        color: var(--text-main);
    }

    /* ── Badges & Buttons ───────────────────────────────────────────────── */

    [data-theme="dark"] .badge.bg-light {
        background-color: var(--surface-a20) !important;
        color: var(--text-main) !important;
    }

    [data-theme="dark"] .badge.bg-secondary {
        background-color: var(--surface-a20) !important;
        color: var(--text-main) !important;
    }

    [data-theme="dark"] .btn-light {
        background-color: var(--surface-a20);
        border-color: var(--border-color);
        color: var(--text-main);
    }

        [data-theme="dark"] .btn-light:hover,
        [data-theme="dark"] .btn-light:focus {
            background-color: var(--surface-a25);
            border-color: var(--border-color);
            color: var(--text-main);
        }

    [data-theme="dark"] .btn-outline-secondary {
        color: var(--color-text-a30);
        border-color: var(--border-color);
    }

        [data-theme="dark"] .btn-outline-secondary:hover {
            background-color: var(--surface-a20);
            border-color: var(--border-color);
            color: var(--text-main);
        }

    [data-theme="dark"] .btn-outline-dark {
        color: var(--text-main);
        border-color: var(--border-color);
    }

        [data-theme="dark"] .btn-outline-dark:hover {
            background-color: var(--surface-a20);
            color: var(--text-main);
        }

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

    /* ── Misc ───────────────────────────────────────────────────────────── */

    [data-theme="dark"] hr {
        border-color: var(--border-color);
        opacity: 0.5;
    }

    [data-theme="dark"] .progress {
        background-color: var(--surface-a20);
    }

    [data-theme="dark"] .progress-bar {
        background-color: var(--color-primary-a0);
    }

    [data-theme="dark"] code {
        background-color: var(--surface-a20);
        color: #ea7075;
        border-radius: 3px;
        padding: 0.1em 0.3em;
    }

    [data-theme="dark"] pre {
        background-color: var(--surface-a20);
        border: 1px solid var(--border-color);
        color: var(--text-main);
    }

    [data-theme="dark"] blockquote {
        border-left-color: var(--border-color);
        color: var(--color-text-a30);
    }

    [data-theme="dark"] .breadcrumb-item a {
        color: var(--color-text-a30);
    }

    [data-theme="dark"] .breadcrumb-item.active {
        color: var(--text-muted);
    }

    [data-theme="dark"] .breadcrumb-item + .breadcrumb-item::before {
        color: var(--text-muted);
    }

    /* ── Radzen component overrides ─────────────────────────────────────── */

    [data-theme="dark"] .rz-dialog-wrapper .rz-dialog {
        background-color: var(--bg-card);
        color: var(--color-text);
        border-color: var(--border-color);
    }

    [data-theme="dark"] .rz-dropdown-panel {
        background-color: var(--bg-card);
        border-color: var(--border-color);
        color: var(--color-text);
    }

    /* ── BlazorDateRangePicker ──────────────────────────────────────────── */

    [data-theme="dark"] .daterangepicker {
        background-color: var(--bg-card);
        border-color: var(--border-color);
        color: var(--text-main);
    }

        [data-theme="dark"] .daterangepicker .calendar-table {
            background-color: var(--bg-card);
            border-color: var(--border-color);
        }

            [data-theme="dark"] .daterangepicker .calendar-table th,
            [data-theme="dark"] .daterangepicker .calendar-table td {
                color: var(--text-main);
            }

        [data-theme="dark"] .daterangepicker td.off,
        [data-theme="dark"] .daterangepicker td.off.in-range,
        [data-theme="dark"] .daterangepicker td.off.start-date,
        [data-theme="dark"] .daterangepicker td.off.end-date {
            background-color: var(--bg-card);
            color: var(--text-muted);
        }

        [data-theme="dark"] .daterangepicker td.available:hover,
        [data-theme="dark"] .daterangepicker th.available:hover {
            background-color: var(--surface-a20);
            color: var(--text-main);
        }

        [data-theme="dark"] .daterangepicker select.monthselect,
        [data-theme="dark"] .daterangepicker select.yearselect {
            background-color: var(--input-bg);
            border-color: var(--border-color);
            color: var(--text-main);
        }

        [data-theme="dark"] .daterangepicker .drp-buttons {
            border-top-color: var(--border-color);
        }

    /* ── App layout ─────────────────────────────────────────────────────── */

    [data-theme="dark"] .nav-scrollable {
        background-color: var(--bg-panel-left);
        border-right-color: var(--border-color);
    }

    [data-theme="dark"] .top-row {
        background-color: var(--surface-a0);
        border-bottom: 1px solid var(--border-color);
    }

    [data-theme="dark"] .system-info {
        background-color: var(--surface-a10);
        border-top-color: var(--border-color);
    }

    [data-theme="dark"] .footer {
        background-color: var(--surface-a10);
        border-top: 1px solid var(--border-color);
        box-shadow: none;
    }

    /* ── App-specific components ────────────────────────────────────────── */

    [data-theme="dark"] .client-hero,
    [data-theme="dark"] .form-section,
    [data-theme="dark"] .modern-card,
    [data-theme="dark"] .table-card,
    [data-theme="dark"] .info-card {
        background-color: var(--bg-card);
        border-color: var(--border-color);
        color: var(--color-text);
    }

    [data-theme="dark"] .client-avatar-lg,
    [data-theme="dark"] .client-avatar-xl {
        border-color: var(--surface-a20);
    }

    [data-theme="dark"] .avatar-circle {
        background-color: var(--surface-a20);
        border-color: var(--surface-a10);
        color: var(--color-text-a30);
    }

    [data-theme="dark"] .month-block {
        background: var(--bg-card);
        border-color: var(--border-color);
    }

    [data-theme="dark"] .segmented-control {
        background-color: var(--surface-a20);
    }

    [data-theme="dark"] .segmented-control-input:checked + .segmented-control-label {
        background-color: var(--surface-a0);
        color: var(--text-main);
    }

    [data-theme="dark"] .view-toggle-group {
        background-color: var(--surface-a20);
        border-color: var(--border-color);
    }

    [data-theme="dark"] .toggle-btn {
        color: var(--color-text-a30);
        background-color: var(--surface-a0);
    }

        [data-theme="dark"] .toggle-btn:not(:last-child) {
            border-right-color: var(--border-color);
        }

        [data-theme="dark"] .toggle-btn:hover:not(.active) {
            background-color: var(--surface-a25);
            color: var(--text-main);
        }

    [data-theme="dark"] .grouping-bar {
        background-color: var(--surface-a20) !important;
        border-color: var(--border-color);
    }

    [data-theme="dark"] .summary-bar {
        background-color: var(--surface-a20);
        border-color: var(--border-color);
    }

    [data-theme="dark"] .block-wrapper {
        background-color: var(--surface-a10);
    }

    [data-theme="dark"] .search-wrapper-unified:focus-within {
        background-color: var(--primary-100);
    }

    [data-theme="dark"] .inactive-separator {
        background-color: var(--surface-a20);
        color: var(--text-secondary) !important;
    }

    [data-theme="dark"] .selection,
    [data-theme="dark"] .square-wrap {
        background: var(--surface-a20);
        color: var(--color-text);
        border-color: var(--border-color);
    }

    [data-theme="dark"] .project-list-item {
        background-color: var(--surface-a10);
        border-bottom-color: var(--surface-a20);
    }

        [data-theme="dark"] .project-list-item:hover {
            border-color: var(--border-color);
            box-shadow: 0 2px 4px rgba(0,0,0,0.3);
        }