/**
 * FieldStar portal dark theme
 * Loaded after theme.css on master/auth/public layouts.
 * html.dark-mode is the single authority (set by theme-mode.js).
 */

/* ------------------------------------------------------------------ */
/* Light-mode design tokens (defaults)                                 */
/* ------------------------------------------------------------------ */
html {
    --fs-canvas: #fafbfe;
    --fs-rail: #313a46;
    --fs-surface: #ffffff;
    --fs-raised: #f1f3fa;
    --fs-input-bg: #ffffff;
    --fs-hover-bg: rgba(0, 0, 0, 0.04);
    --fs-selected-bg: rgba(114, 124, 245, 0.12);
    --fs-overlay: rgba(49, 58, 70, 0.45);
    --fs-border: #eef2f7;
    --fs-border-strong: #dee2e6;
    --fs-focus-ring: rgba(114, 124, 245, 0.35);
    --fs-text: #6c757d;
    --fs-text-strong: #313a46;
    --fs-text-muted: #8391a2;
    --fs-text-disabled: #adb5bd;
    --fs-link: #727cf5;
    --fs-link-hover: #5a63d4;
    --fs-placeholder: #adb5bd;
    --fs-success: #0acf97;
    --fs-success-bg: rgba(10, 207, 151, 0.12);
    --fs-warning: #f0ad4e;
    --fs-warning-bg: rgba(240, 173, 78, 0.14);
    --fs-danger: #f1556c;
    --fs-danger-bg: rgba(241, 85, 108, 0.14);
    --fs-info: #39afd1;
    --fs-info-bg: rgba(57, 175, 209, 0.14);
    --fs-primary: #727cf5;
    --fs-primary-bg: rgba(114, 124, 245, 0.14);
    --fs-secondary: #6c757d;
    --fs-secondary-bg: rgba(108, 117, 125, 0.14);
    --fs-scrollbar-track: #f1f3fa;
    --fs-scrollbar-thumb: #c8ced6;
}

/* ------------------------------------------------------------------ */
/* Dark-mode token overrides                                           */
/* ------------------------------------------------------------------ */
html.dark-mode {
    --fs-canvas: #12151a;
    --fs-rail: #171c23;
    --fs-surface: #1e242c;
    --fs-raised: #252c35;
    --fs-input-bg: #161b22;
    --fs-hover-bg: rgba(255, 255, 255, 0.05);
    --fs-selected-bg: rgba(114, 124, 245, 0.16);
    --fs-overlay: rgba(0, 0, 0, 0.55);
    --fs-border: rgba(255, 255, 255, 0.07);
    --fs-border-strong: rgba(255, 255, 255, 0.14);
    --fs-focus-ring: rgba(114, 124, 245, 0.35);
    --fs-text: #c9d1d9;
    --fs-text-strong: #f0f3f6;
    --fs-text-muted: #8b949e;
    --fs-text-disabled: #6e7681;
    --fs-link: #8ea0ff;
    --fs-link-hover: #a8b4ff;
    --fs-placeholder: #6e7681;
    --fs-success: #7ee2bf;
    --fs-success-bg: rgba(10, 207, 151, 0.14);
    --fs-warning: #f0d27a;
    --fs-warning-bg: rgba(249, 200, 81, 0.14);
    --fs-danger: #f0a8a0;
    --fs-danger-bg: rgba(241, 85, 108, 0.18);
    --fs-info: #7ec8e3;
    --fs-info-bg: rgba(57, 175, 209, 0.14);
    --fs-primary: #8ea0ff;
    --fs-primary-bg: rgba(114, 124, 245, 0.16);
    --fs-secondary: #8b949e;
    --fs-secondary-bg: rgba(139, 148, 158, 0.16);
    --fs-scrollbar-track: #171c23;
    --fs-scrollbar-thumb: #3d4654;
    --bs-body-bg: #12151a;
    --bs-body-bg-rgb: 18, 21, 26;
    --bs-body-color: #c9d1d9;
}

/* ------------------------------------------------------------------ */
/* Shared component dark layer                                         */
/* ------------------------------------------------------------------ */
/* Typography & links */
html.dark-mode a:not(.btn):not(.nav-link):not(.dropdown-item):not(.page-link):not(.badge) {
    color: var(--fs-link);
}
html.dark-mode a:not(.btn):not(.nav-link):not(.dropdown-item):not(.page-link):not(.badge):hover {
    color: var(--fs-link-hover);
}
html.dark-mode hr,
html.dark-mode .dropdown-divider {
    border-color: var(--fs-border);
    opacity: 1;
}
html.dark-mode .text-dark,
html.dark-mode .text-body {
    color: var(--fs-text-strong) !important;
}
html.dark-mode .text-black {
    color: var(--fs-text-strong) !important;
}
html.dark-mode .border,
html.dark-mode .border-top,
html.dark-mode .border-bottom,
html.dark-mode .border-start,
html.dark-mode .border-end {
    border-color: var(--fs-border) !important;
}
html.dark-mode .border-light {
    border-color: var(--fs-border) !important;
}
html.dark-mode .bg-white {
    background-color: var(--fs-surface) !important;
    color: var(--fs-text);
}

/* Forms */
html.dark-mode .form-control::placeholder,
html.dark-mode .form-select::placeholder,
html.dark-mode textarea.form-control::placeholder {
    color: var(--fs-placeholder);
    opacity: 1;
}
html.dark-mode .form-control:disabled,
html.dark-mode .form-control[readonly],
html.dark-mode .form-select:disabled {
    background-color: var(--fs-raised);
    color: var(--fs-text-disabled);
    border-color: var(--fs-border);
}
html.dark-mode .form-check-input {
    background-color: var(--fs-input-bg);
    border-color: var(--fs-border-strong);
}
html.dark-mode .form-check-input:checked {
    background-color: var(--fs-primary);
    border-color: var(--fs-primary);
}
html.dark-mode .form-check-label,
html.dark-mode label {
    color: var(--fs-text);
}
html.dark-mode .form-switch .form-check-input {
    background-color: var(--fs-raised);
}

/* Select2 */
html.dark-mode .select2-container--default .select2-selection--single,
html.dark-mode .select2-container--default .select2-selection--multiple {
    background-color: var(--fs-input-bg);
    border-color: var(--fs-border);
    color: var(--fs-text-strong);
}
html.dark-mode .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--fs-text-strong);
}
html.dark-mode .select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: var(--fs-placeholder);
}
html.dark-mode .select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-color: var(--fs-text-muted) transparent transparent transparent;
}
html.dark-mode .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
    border-color: transparent transparent var(--fs-text-muted) transparent;
}
html.dark-mode .select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: var(--fs-raised);
    border-color: var(--fs-border);
    color: var(--fs-text-strong);
}
html.dark-mode .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    color: var(--fs-text-muted);
}
html.dark-mode .select2-dropdown {
    background-color: var(--fs-surface);
    border-color: var(--fs-border);
    color: var(--fs-text);
}
html.dark-mode .select2-container--default .select2-search--dropdown .select2-search__field {
    background-color: var(--fs-input-bg);
    border-color: var(--fs-border);
    color: var(--fs-text-strong);
}
html.dark-mode .select2-container--default .select2-results__option {
    color: var(--fs-text);
}
html.dark-mode .select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
    background-color: var(--fs-selected-bg);
    color: var(--fs-text-strong);
}
html.dark-mode .select2-container--default .select2-results__option--selected {
    background-color: var(--fs-raised);
    color: var(--fs-text-strong);
}

/* Buttons */
html.dark-mode .btn-light:hover,
html.dark-mode .btn-light:focus,
html.dark-mode .btn-light:active,
html.dark-mode .btn-light.active {
    background-color: var(--fs-hover-bg);
    border-color: var(--fs-border-strong);
    color: var(--fs-text-strong);
}
html.dark-mode .btn-outline-secondary,
html.dark-mode .btn-outline-dark {
    color: var(--fs-text);
    border-color: var(--fs-border-strong);
}
html.dark-mode .btn-outline-secondary:hover,
html.dark-mode .btn-outline-dark:hover {
    background-color: var(--fs-raised);
    color: var(--fs-text-strong);
    border-color: var(--fs-border-strong);
}
html.dark-mode .btn-link {
    color: var(--fs-link);
}
html.dark-mode .btn-link:hover {
    color: var(--fs-link-hover);
}
html.dark-mode .btn:disabled,
html.dark-mode .btn.disabled {
    opacity: 0.55;
}

/* Tables & sticky columns */
html.dark-mode th.sticky,
html.dark-mode td.sticky {
    background: var(--fs-surface) !important;
    background-color: var(--fs-surface) !important;
}
html.dark-mode thead th.sticky {
    background: var(--fs-raised) !important;
    background-color: var(--fs-raised) !important;
}
html.dark-mode .table-bordered,
html.dark-mode .table-bordered > :not(caption) > * {
    border-color: var(--fs-border);
}
html.dark-mode .table > :not(caption) > * > * {
    border-bottom-color: var(--fs-border);
    box-shadow: none;
}
html.dark-mode tr.table-active,
html.dark-mode .table-active > td,
html.dark-mode .table-active > th {
    background-color: var(--fs-selected-bg) !important;
    color: var(--fs-text-strong);
}

/* Modals */
html.dark-mode .modal-backdrop.show {
    opacity: 0.65;
}
html.dark-mode .modal-header,
html.dark-mode .modal-footer {
    border-color: var(--fs-border);
}
html.dark-mode .modal-title {
    color: var(--fs-text-strong);
}
html.dark-mode .modal-body {
    color: var(--fs-text);
}
html.dark-mode .modal-content .close,
html.dark-mode .modal-content .btn-close,
html.dark-mode .modal-header .close,
html.dark-mode .modal-header .btn-close {
    color: var(--fs-text-muted);
    opacity: 1;
}

/* Alerts */
html.dark-mode .alert {
    border-color: var(--fs-border);
}
html.dark-mode .alert-primary { background-color: var(--fs-primary-bg); color: var(--fs-primary); border-color: transparent; }
html.dark-mode .alert-secondary { background-color: var(--fs-secondary-bg); color: var(--fs-text); border-color: transparent; }
html.dark-mode .alert-success { background-color: var(--fs-success-bg); color: var(--fs-success); border-color: transparent; }
html.dark-mode .alert-danger { background-color: var(--fs-danger-bg); color: var(--fs-danger); border-color: transparent; }
html.dark-mode .alert-warning { background-color: var(--fs-warning-bg); color: var(--fs-warning); border-color: transparent; }
html.dark-mode .alert-info { background-color: var(--fs-info-bg); color: var(--fs-info); border-color: transparent; }
html.dark-mode .alert-light {
    background-color: var(--fs-raised);
    color: var(--fs-text);
    border-color: var(--fs-border);
}

/* Badges */
html.dark-mode .badge.bg-light,
html.dark-mode .badge-light {
    background-color: var(--fs-raised) !important;
    color: var(--fs-text-strong) !important;
    border: 1px solid var(--fs-border);
}
html.dark-mode .badge.bg-white {
    background-color: var(--fs-raised) !important;
    color: var(--fs-text-strong) !important;
}

/* Nav tabs & pills */
html.dark-mode .nav-tabs {
    border-bottom-color: var(--fs-border);
}
html.dark-mode .nav-tabs .nav-link {
    color: var(--fs-text-muted);
    border-color: transparent;
}
html.dark-mode .nav-tabs .nav-link:hover {
    color: var(--fs-text-strong);
    border-color: var(--fs-border) var(--fs-border) transparent;
}
html.dark-mode .nav-tabs .nav-link.active {
    color: var(--fs-text-strong);
    background-color: var(--fs-surface);
    border-color: var(--fs-border) var(--fs-border) var(--fs-surface);
}
html.dark-mode .nav-pills .nav-link {
    color: var(--fs-text-muted);
}
html.dark-mode .nav-pills .nav-link.active {
    background-color: var(--fs-primary);
    color: #fff;
}

/* Breadcrumb */
html.dark-mode .breadcrumb-item,
html.dark-mode .breadcrumb-item a {
    color: var(--fs-text-muted);
}
html.dark-mode .breadcrumb-item.active {
    color: var(--fs-text-strong);
}

/* List group */
html.dark-mode .list-group-item {
    background-color: var(--fs-surface);
    border-color: var(--fs-border);
    color: var(--fs-text);
}
html.dark-mode .list-group-item:hover,
html.dark-mode .list-group-item:focus {
    background-color: var(--fs-raised);
    color: var(--fs-text-strong);
}
html.dark-mode .list-group-item.active {
    background-color: var(--fs-primary);
    border-color: var(--fs-primary);
    color: #fff;
}

/* Tooltips & popovers */
html.dark-mode .tooltip .tooltip-inner {
    background-color: var(--fs-raised);
    color: var(--fs-text-strong);
    border: 1px solid var(--fs-border);
}
html.dark-mode .tooltip.bs-tooltip-top .tooltip-arrow::before,
html.dark-mode .tooltip.bs-tooltip-auto[data-popper-placement^="top"] .tooltip-arrow::before {
    border-top-color: var(--fs-border);
}
html.dark-mode .popover {
    background-color: var(--fs-surface);
    border-color: var(--fs-border);
}
html.dark-mode .popover-header {
    background-color: var(--fs-raised);
    border-bottom-color: var(--fs-border);
    color: var(--fs-text-strong);
}
html.dark-mode .popover-body {
    color: var(--fs-text);
}

/* Hyper toast / jq-toast */
html.dark-mode .jq-toast-wrap .jq-toast-single {
    background-color: var(--fs-surface);
    color: var(--fs-text-strong);
    border: 1px solid var(--fs-border);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45);
}
html.dark-mode .jq-toast-wrap .jq-toast-single.jq-icon-success { border-left: 4px solid var(--fs-success); }
html.dark-mode .jq-toast-wrap .jq-toast-single.jq-icon-error { border-left: 4px solid var(--fs-danger); }
html.dark-mode .jq-toast-wrap .jq-toast-single.jq-icon-info { border-left: 4px solid var(--fs-info); }
html.dark-mode .jq-toast-wrap .jq-toast-single.jq-icon-warning { border-left: 4px solid var(--fs-warning); }
html.dark-mode .jq-toast-close-jqti {
    color: var(--fs-text-muted);
}

/* Loader overlay */
html.dark-mode .loader-overlay,
html.dark-mode .preloader,
html.dark-mode .spinner-overlay {
    background-color: rgba(18, 21, 26, 0.72) !important;
}

/* Date / time pickers */
html.dark-mode .datepicker-dropdown,
html.dark-mode .datepicker.datepicker-inline,
html.dark-mode .datepicker table tr td,
html.dark-mode .datepicker table tr th {
    background-color: var(--fs-surface);
    color: var(--fs-text);
    border-color: var(--fs-border);
}
html.dark-mode .datepicker table tr td.day:hover,
html.dark-mode .datepicker table tr td.focused {
    background: var(--fs-raised);
    color: var(--fs-text-strong);
}
html.dark-mode .datepicker table tr td.active,
html.dark-mode .datepicker table tr td.active:hover,
html.dark-mode .datepicker table tr td.active.disabled,
html.dark-mode .datepicker table tr td.active.disabled:hover {
    background: var(--fs-primary);
    color: #fff;
}
html.dark-mode .datepicker .datepicker-switch:hover,
html.dark-mode .datepicker .next:hover,
html.dark-mode .datepicker .prev:hover,
html.dark-mode .datepicker tfoot tr th:hover {
    background: var(--fs-raised);
    color: var(--fs-text-strong);
}
html.dark-mode .bootstrap-datetimepicker-widget,
html.dark-mode .bootstrap-datetimepicker-widget.dropdown-menu {
    background-color: var(--fs-surface);
    border-color: var(--fs-border);
    color: var(--fs-text);
}
html.dark-mode .bootstrap-datetimepicker-widget table td,
html.dark-mode .bootstrap-datetimepicker-widget table th {
    color: var(--fs-text);
}
html.dark-mode .bootstrap-datetimepicker-widget table td.active,
html.dark-mode .bootstrap-datetimepicker-widget table td.active:hover {
    background-color: var(--fs-primary);
    color: #fff;
}
html.dark-mode .daterangepicker {
    background-color: var(--fs-surface);
    border-color: var(--fs-border);
    color: var(--fs-text);
}
html.dark-mode .daterangepicker .calendar-table {
    background-color: var(--fs-surface);
    border-color: var(--fs-border);
}
html.dark-mode .daterangepicker td.available:hover,
html.dark-mode .daterangepicker th.available:hover {
    background-color: var(--fs-raised);
    color: var(--fs-text-strong);
}
html.dark-mode .daterangepicker td.active,
html.dark-mode .daterangepicker td.active:hover {
    background-color: var(--fs-primary);
    color: #fff;
}
html.dark-mode .daterangepicker .ranges li:hover {
    background-color: var(--fs-raised);
    color: var(--fs-text-strong);
}
html.dark-mode .daterangepicker .ranges li.active {
    background-color: var(--fs-primary);
    color: #fff;
}
html.dark-mode .bootstrap-timepicker-widget table td a {
    color: var(--fs-text);
}
html.dark-mode .bootstrap-timepicker-widget table td a:hover {
    background-color: var(--fs-raised);
    border-color: var(--fs-border);
}

/* vue-multiselect */
html.dark-mode .multiselect__tags {
    background: var(--fs-input-bg);
    border-color: var(--fs-border);
    color: var(--fs-text-strong);
}
html.dark-mode .multiselect__input,
html.dark-mode .multiselect__single {
    background: transparent;
    color: var(--fs-text-strong);
}
html.dark-mode .multiselect__content-wrapper {
    background: var(--fs-surface);
    border-color: var(--fs-border);
}
html.dark-mode .multiselect__option {
    color: var(--fs-text);
}
html.dark-mode .multiselect__option--highlight {
    background: var(--fs-selected-bg);
    color: var(--fs-text-strong);
}
html.dark-mode .multiselect__option--selected {
    background: var(--fs-raised);
    color: var(--fs-text-strong);
}

/* Dropzone */
html.dark-mode .dropzone {
    background: var(--fs-raised);
    border-color: var(--fs-border);
    color: var(--fs-text-muted);
}
html.dark-mode .dropzone .dz-message {
    color: var(--fs-text-muted);
}

/* FullCalendar (global) */
html.dark-mode .fc {
    --fc-page-bg-color: var(--fs-surface);
    --fc-neutral-bg-color: var(--fs-raised);
    --fc-border-color: var(--fs-border);
    --fc-button-bg-color: var(--fs-raised);
    --fc-button-border-color: var(--fs-border);
    --fc-button-text-color: var(--fs-text-strong);
    --fc-button-hover-bg-color: var(--fs-hover-bg);
    --fc-button-hover-border-color: var(--fs-border-strong);
    --fc-today-bg-color: rgba(114, 124, 245, 0.12);
    color: var(--fs-text);
}
html.dark-mode .fc-toolbar-title,
html.dark-mode .fc-col-header-cell-cushion,
html.dark-mode .fc-daygrid-day-number,
html.dark-mode .fc-list-day-text,
html.dark-mode .fc-list-day-side-text {
    color: var(--fs-text-strong);
}
html.dark-mode .fc-theme-standard td,
html.dark-mode .fc-theme-standard th {
    border-color: var(--fs-border);
}

/* ApexCharts (global CSS labels) */
html.dark-mode .apexcharts-text,
html.dark-mode .apexcharts-title-text,
html.dark-mode .apexcharts-legend-text,
html.dark-mode .apexcharts-datalabel,
html.dark-mode .apexcharts-yaxis-label,
html.dark-mode .apexcharts-xaxis-label {
    fill: var(--fs-text-muted) !important;
    color: var(--fs-text-muted) !important;
}
html.dark-mode .apexcharts-gridline,
html.dark-mode .apexcharts-xaxis-tick,
html.dark-mode .apexcharts-yaxis-tick {
    stroke: var(--fs-border);
}
html.dark-mode .apexcharts-tooltip {
    background: var(--fs-surface) !important;
    border-color: var(--fs-border) !important;
    color: var(--fs-text) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45);
}
html.dark-mode .apexcharts-tooltip-title {
    background: var(--fs-raised) !important;
    border-bottom-color: var(--fs-border) !important;
    color: var(--fs-text-strong) !important;
}

/* SweetAlert2 — !important beats inline background:#fff */
html.dark-mode .swal2-popup {
    background-color: var(--fs-surface) !important;
    background: var(--fs-surface) !important;
    border: 1px solid var(--fs-border);
    color: var(--fs-text);
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.04), 0 10px 28px rgba(0, 0, 0, 0.45);
}
html.dark-mode .swal2-title {
    color: var(--fs-text-strong) !important;
}
html.dark-mode .swal2-html-container,
html.dark-mode .swal2-content {
    color: var(--fs-text) !important;
}
html.dark-mode .swal2-footer {
    border-top-color: var(--fs-border);
    color: var(--fs-text-muted);
}
html.dark-mode .swal2-actions {
    background: transparent;
}
html.dark-mode .swal2-popup.swal2-toast {
    background-color: var(--fs-surface) !important;
    background: var(--fs-surface) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45);
}

/* Auth pages */
html.dark-mode.auth-fluid-pages .auth-fluid-form-box,
html.dark-mode .auth-fluid-form-box {
    background-color: var(--fs-surface);
}
html.dark-mode .auth-brand-text {
    color: var(--fs-text-strong);
}

/* Action icons (global) */
html.dark-mode .action-icon {
    color: var(--fs-text-muted);
}
html.dark-mode .action-icon:hover {
    color: var(--fs-link);
}
html.dark-mode .form-action-icon .fa {
    color: var(--fs-text-muted);
}

/* Scrollbars */
html.dark-mode ::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}
html.dark-mode ::-webkit-scrollbar-track {
    background: var(--fs-scrollbar-track);
}
html.dark-mode ::-webkit-scrollbar-thumb {
    background: var(--fs-scrollbar-thumb);
    border-radius: 999px;
}
html.dark-mode ::-webkit-scrollbar-thumb:hover {
    background: #556070;
}

/* Images / documents — no inversion */
html.dark-mode img,
html.dark-mode video,
html.dark-mode canvas,
html.dark-mode embed,
html.dark-mode object,
html.dark-mode iframe {
    filter: none !important;
}

/* jQuery UI datepicker */
html.dark-mode .ui-datepicker {
    background: var(--fs-surface);
    border-color: var(--fs-border);
    color: var(--fs-text);
}
html.dark-mode .ui-datepicker-header {
    background: var(--fs-raised);
    border-color: var(--fs-border);
    color: var(--fs-text-strong);
}
html.dark-mode .ui-datepicker td a,
html.dark-mode .ui-datepicker td span {
    color: var(--fs-text);
}
html.dark-mode .ui-datepicker td a.ui-state-active,
html.dark-mode .ui-datepicker td a.ui-state-hover {
    background: var(--fs-primary);
    color: #fff;
}

/* Catalog / outlet action hover box */
html.dark-mode .outlet-action-btn {
    background: var(--fs-surface) !important;
    border: 1px solid var(--fs-border);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.35);
}
html.dark-mode .outlet-action-btn .action-icon {
    color: var(--fs-text-muted);
}
html.dark-mode .outlet-action-btn .action-icon:hover {
    color: var(--fs-link);
}

/* Sidebar menu search & org switcher extras */
html.dark-mode .side-nav .side-nav-link {
    color: var(--fs-text-muted);
}
html.dark-mode .side-nav .side-nav-link:hover,
html.dark-mode .side-nav .side-nav-link:focus,
html.dark-mode .side-nav .side-nav-link.active {
    color: var(--fs-text-strong);
}
html.dark-mode .organization-dropdown .dropdown-menu {
    background-color: var(--fs-surface);
    border-color: var(--fs-border);
}

/* Status text colours on dark surfaces */
html.dark-mode .text-success { color: var(--fs-success) !important; }
html.dark-mode .text-danger { color: var(--fs-danger) !important; }
html.dark-mode .text-warning { color: var(--fs-warning) !important; }
html.dark-mode .text-info { color: var(--fs-info) !important; }
html.dark-mode .text-primary { color: var(--fs-primary) !important; }

/* Card headers */
html.dark-mode .card-header,
html.dark-mode .card-footer {
    background-color: var(--fs-raised);
    border-color: var(--fs-border);
    color: var(--fs-text-strong);
}

/* Offcanvas / end-bar extras */
html.dark-mode .offcanvas-header {
    border-bottom-color: var(--fs-border);
    color: var(--fs-text-strong);
}

/* Empty states */
html.dark-mode .text-center.text-muted,
html.dark-mode .empty-state {
    color: var(--fs-text-muted) !important;
}

/* ------------------------------------------------------------------ */
/* Module-specific dark overrides                                      */
/* ------------------------------------------------------------------ */
/* ------------------------------------------------------------------ */
/* Module-specific dark overrides                                      */
/* ------------------------------------------------------------------ */

/* Tasks — standard list expand button */
html.dark-mode .standard-task-row:hover .standard-task-expand-button {
    background: var(--fs-raised);
    color: var(--fs-link);
}

/* Tasks — question builder inputs (unscoped global hooks) */
html.dark-mode .task-question-input,
html.dark-mode .task-question-textarea {
    background: var(--fs-input-bg) !important;
    border-color: var(--fs-border) !important;
    color: var(--fs-text-strong) !important;
}
html.dark-mode .task-question-input:focus,
html.dark-mode .task-question-textarea:focus {
    background: var(--fs-input-bg) !important;
    border-color: rgba(255, 255, 255, 0.18) !important;
    color: var(--fs-text-strong) !important;
}
html.dark-mode .task-question-type-menu {
    background: var(--fs-surface);
    border-color: var(--fs-border);
    color: var(--fs-text);
}
html.dark-mode .task-question-type-menu::-webkit-scrollbar-thumb {
    background: var(--fs-scrollbar-thumb);
}

/* Task card panel */
html.dark-mode .task-card-panel-inner {
    background: var(--fs-surface) !important;
    border-color: var(--fs-border) !important;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.04);
}
html.dark-mode .task-card-panel-subtitle {
    color: var(--fs-text-muted) !important;
}

/* Task add question panel */
html.dark-mode .task-add-question-panel,
html.dark-mode .add-question-card {
    background: var(--fs-surface) !important;
    border-color: var(--fs-border) !important;
}

/* Reports filter drawer */
html.dark-mode .report-filter-panel,
html.dark-mode .column-filter-panel {
    background: var(--fs-surface);
    border-color: var(--fs-border);
    color: var(--fs-text);
}

/* Calendar field view */
html.dark-mode .fc .fc-button-primary:not(:disabled).fc-button-active,
html.dark-mode .fc .fc-button-primary:not(:disabled):active {
    background-color: var(--fs-primary);
    border-color: var(--fs-primary);
}

/* Mobile profile panels */
html.dark-mode .mobile-profile-card,
html.dark-mode .profile-section-card {
    background: var(--fs-surface) !important;
    border-color: var(--fs-border) !important;
}

/* Upload / dropzone color picker */
html.dark-mode .color-upload-zone,
html.dark-mode .upload-preview-box {
    background: var(--fs-raised) !important;
    border-color: var(--fs-border) !important;
}

/* Workforce deployment */
html.dark-mode .deployment-grid-cell,
html.dark-mode .deployment-slot {
    background: var(--fs-surface);
    border-color: var(--fs-border);
    color: var(--fs-text);
}
html.dark-mode .deployment-slot.is-selected {
    background: var(--fs-selected-bg);
}

/* Form builder */
html.dark-mode .form-builder-panel,
html.dark-mode .form-section-card,
html.dark-mode .preview-section-box {
    background: var(--fs-surface) !important;
    border-color: var(--fs-border) !important;
    color: var(--fs-text);
}

/* Claims details timeline */
html.dark-mode .claim-timeline-item,
html.dark-mode .claim-detail-card {
    background: var(--fs-surface);
    border-color: var(--fs-border);
}

/* Project list tabs */
html.dark-mode .project-tab-content,
html.dark-mode .project-task-panel {
    background: var(--fs-surface);
    border-color: var(--fs-border);
}

/* Case details table sticky cells */
html.dark-mode .case-table td.sticky,
html.dark-mode .case-table th.sticky {
    background: var(--fs-surface) !important;
}
html.dark-mode .case-table thead th.sticky {
    background: var(--fs-raised) !important;
}

/* Preventive maintenance schedule */
html.dark-mode .pm-schedule-cell,
html.dark-mode .pm-calendar-day {
    background: var(--fs-surface);
    border-color: var(--fs-border);
    color: var(--fs-text);
}

/* Messages / chat bubbles */
html.dark-mode .message-bubble.inbound {
    background: var(--fs-raised);
    color: var(--fs-text);
}
html.dark-mode .message-bubble.outbound {
    background: var(--fs-primary-bg);
    color: var(--fs-text-strong);
}

/* Field matrix */
html.dark-mode .field-matrix-cell,
html.dark-mode .matrix-grid td {
    background: var(--fs-surface);
    border-color: var(--fs-border);
    color: var(--fs-text);
}

/* Packing list filters */
html.dark-mode .packing-filter-bar {
    background: var(--fs-surface);
    border-color: var(--fs-border);
}

/* Core loader overlay */
html.dark-mode .loader-div {
    background: rgba(18, 21, 26, 0.72);
    color: var(--fs-text-strong);
}
html.dark-mode .loader-container,
html.dark-mode .loader-backdrop {
    background-color: rgba(18, 21, 26, 0.72) !important;
}

/* jQuery UI autocomplete */
html.dark-mode .ui-autocomplete {
    background: var(--fs-surface);
    border-color: var(--fs-border);
    color: var(--fs-text);
}
html.dark-mode .ui-menu-item-wrapper.ui-state-active {
    background: var(--fs-selected-bg);
    color: var(--fs-text-strong);
    border-color: transparent;
}

/* Select2 in filter bars (higher specificity) */
html.dark-mode .filter-bar .select2-container--default .select2-selection--single,
html.dark-mode #filterTable .select2-container--default .select2-selection--single {
    background-color: var(--fs-input-bg);
    border-color: var(--fs-border);
}

/* Data export / import toolbars */
html.dark-mode .toolbar-actions .btn-light {
    background-color: var(--fs-raised);
    border-color: var(--fs-border);
    color: var(--fs-text-strong);
}

/* Inline empty table rows forced white */
html.dark-mode tr[style*="background:white"],
html.dark-mode tr[style*="background: white"],
html.dark-mode tr[style*="background:#fff"],
html.dark-mode tr[style*="background: #fff"],
html.dark-mode tr[style*="background:#ffffff"],
html.dark-mode td[style*="background:white"],
html.dark-mode td[style*="background: white"] {
    background: transparent !important;
    background-color: transparent !important;
    color: var(--fs-text) !important;
}

/* Priority badge case 4 (white bg) — override inline */
html.dark-mode [style*="background:white;color:black"],
html.dark-mode [style*="background: white; color: black"],
html.dark-mode [style*="background:#fff;color:black"],
html.dark-mode [style*="background: white;color:black"] {
    background: var(--fs-raised) !important;
    color: var(--fs-text-strong) !important;
    border: 1px solid var(--fs-border);
}

/* Long text in tables */
html.dark-mode .table td,
html.dark-mode .table th {
    word-break: break-word;
}

/* Responsive — preserve dark on mobile offcanvas sidebar */
@media (max-width: 991.98px) {
    html.dark-mode .leftside-menu {
        background-color: var(--fs-rail) !important;
    }
    html.dark-mode .navbar-custom {
        background-color: var(--fs-rail) !important;
    }
    html.dark-mode .content-page {
        background-color: var(--fs-canvas);
    }
    html.dark-mode .end-bar,
    html.dark-mode .offcanvas {
        background-color: var(--fs-surface) !important;
    }
    html.dark-mode .quick-tools-drawer-panel {
        background: var(--fs-surface);
        border-left-color: var(--fs-border);
    }
    html.dark-mode th.sticky,
    html.dark-mode td.sticky {
        background: var(--fs-surface) !important;
    }
    html.dark-mode .table-responsive {
        border-color: var(--fs-border);
    }
}

@media (max-width: 767.98px) {
    html.dark-mode .filter-bar {
        background-color: var(--fs-surface);
    }
    html.dark-mode .page-title-box .page-title {
        color: var(--fs-text-strong);
    }
    html.dark-mode .home-board-aside,
    html.dark-mode .home-panel {
        background: var(--fs-surface);
        border-color: var(--fs-border);
    }
}

/* Scroll containers */
html.dark-mode .table-x-scroll,
html.dark-mode .table-responsive {
    scrollbar-color: var(--fs-scrollbar-thumb) var(--fs-scrollbar-track);
}

/* List-page utilities */
html.dark-mode .fs-filter-bar {
    background: var(--fs-card-bg);
    border-color: var(--fs-border);
}
html.dark-mode .fs-filter-bar td {
    background: transparent !important;
}
html.dark-mode .fs-sticky-col,
html.dark-mode #timecard td.fs-sticky-col {
    background: var(--fs-card-bg) !important;
}
html.dark-mode .fs-avatar-sm.emptyimg {
    background-color: var(--fs-raised);
    color: var(--fs-text-strong);
}
html.dark-mode .warehouse-tab {
    background: var(--fs-card-bg);
}

/* ------------------------------------------------------------------ */
/* Module-specific dark overrides (from theme.css)                     */
/* ------------------------------------------------------------------ */
html.dark-mode body,
html.dark-mode .wrapper,
html.dark-mode .content-page,
html.dark-mode .content {
    background-color: var(--fs-canvas);
    color: var(--fs-text);
}

html.dark-mode .leftside-menu,
html.dark-mode .leftside-menu .logo,
html.dark-mode .navbar-custom,
html.dark-mode .navbar-custom .topbar-left {
    background-color: var(--fs-rail) !important;
    background: var(--fs-rail) !important;
    box-shadow: none;
}
html.dark-mode .topbar-product-name {
    color: var(--fs-text-strong);
}
html.dark-mode .topbar-product-badge {
    color: #a5adf8;
    background: rgba(114, 124, 245, 0.18);
    border-color: rgba(114, 124, 245, 0.32);
}

html.dark-mode .card,
html.dark-mode .card-box,
html.dark-mode .widget-flat,
html.dark-mode .modal-content,
html.dark-mode .dropdown-menu,
html.dark-mode .offcanvas {
    background-color: var(--fs-surface);
    border: 1px solid var(--fs-border);
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.04), 0 10px 28px rgba(0, 0, 0, 0.35);
}

html.dark-mode .page-title-box .page-title,
html.dark-mode .header-title,
html.dark-mode h1, html.dark-mode h2, html.dark-mode h3, html.dark-mode h4, html.dark-mode h5 {
    color: var(--fs-text-strong);
}

html.dark-mode .text-muted,
html.dark-mode .text-secondary {
    color: var(--fs-text-muted) !important;
}

html.dark-mode .form-control,
html.dark-mode .form-select,
html.dark-mode .input-group-text {
    background-color: #161b22;
    border-color: var(--fs-border);
    color: var(--fs-text-strong);
}

html.dark-mode .form-control:focus,
html.dark-mode .form-select:focus {
    background-color: #161b22;
    border-color: rgba(255, 255, 255, 0.18);
    color: var(--fs-text-strong);
}

html.dark-mode .nav-user {
    background-color: transparent !important;
    border: none !important;
}

html.dark-mode .table {
    color: var(--fs-text);
    border-color: var(--fs-border);
    --bs-table-bg: transparent;
    --bs-table-striped-bg: rgba(255, 255, 255, 0.03);
    --bs-table-hover-bg: rgba(255, 255, 255, 0.05);
}

html.dark-mode .table thead th,
html.dark-mode .thead-light,
html.dark-mode .thead-light th,
html.dark-mode .table-light,
html.dark-mode .table-light > th,
html.dark-mode .table-light > td,
html.dark-mode .bg-light {
    background-color: var(--fs-raised) !important;
    color: var(--fs-text-strong) !important;
    border-color: var(--fs-border) !important;
}

html.dark-mode .table thead a,
html.dark-mode .table thead .columnName {
    color: var(--fs-text-strong) !important;
}

html.dark-mode .table thead a:hover,
html.dark-mode .table thead .columnName:hover {
    color: #fff !important;
}

html.dark-mode .btn-light,
html.dark-mode .btn-secondary {
    background-color: var(--fs-raised);
    border-color: var(--fs-border);
    color: var(--fs-text-strong);
}

html.dark-mode .footer {
    background-color: var(--fs-canvas);
    border-top-color: var(--fs-border);
    color: var(--fs-text-muted);
}

html.dark-mode .menu-search-palette-card {
    background: var(--fs-surface);
    border-color: var(--fs-border);
}

html.dark-mode .menu-search-palette-card .form-control {
    background: var(--fs-surface);
    color: var(--fs-text-strong);
    border-bottom-color: var(--fs-border);
}

html.dark-mode .menu-search-palette-empty {
    color: var(--fs-text-muted);
}

html.dark-mode .menu-search-palette-item.is-active,
html.dark-mode .menu-search-palette-item:hover {
    background: var(--fs-raised);
}

html.dark-mode .menu-search-palette-label {
    color: var(--fs-text-strong);
}

html.dark-mode .organization-dropdown .org-switch-search .form-control {
    background: #161b22;
    border-color: var(--fs-border);
    color: var(--fs-text-strong);
}

html.dark-mode .filter-bar {
    background-color: var(--fs-surface);
    border-bottom: 1px solid var(--fs-border);
}

html.dark-mode .filter-bar table,
html.dark-mode #filterTable,
html.dark-mode #filterTable tr td {
    background: var(--fs-surface) !important;
    background-color: var(--fs-surface) !important;
    border-color: var(--fs-border) !important;
    color: var(--fs-text);
}

html.dark-mode .top-filter-label,
html.dark-mode .grey-btn-color {
    color: var(--fs-text-muted) !important;
}

html.dark-mode .icon-btn {
    color: var(--fs-text-muted) !important;
}

html.dark-mode .icon-btn:hover {
    color: var(--fs-text-strong) !important;
}

html.dark-mode .icon-btn.border-btn {
    background-color: var(--fs-raised) !important;
    border-color: var(--fs-border);
    color: var(--fs-text) !important;
}

html.dark-mode .end-bar {
    background-color: var(--fs-surface) !important;
    box-shadow: -8px 0 24px rgba(0, 0, 0, 0.45);
}

html.dark-mode .end-bar .rightbar-title {
    background-color: var(--fs-rail) !important;
    color: var(--fs-text-strong);
}

html.dark-mode .end-bar label,
html.dark-mode .filter-body label {
    color: var(--fs-text);
}

html.dark-mode .filter-footer {
    background: var(--fs-surface) !important;
    border-top-color: var(--fs-border);
    box-shadow: none;
}

html.dark-mode .custom-select {
    color: var(--fs-text-strong);
    background-color: #161b22;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23c9d1d9' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e");
    border-color: var(--fs-border);
}

html.dark-mode .dropdown-item {
    color: var(--fs-text);
}

html.dark-mode .dropdown-item:hover,
html.dark-mode .dropdown-item:focus,
html.dark-mode .dropdown-item.active,
html.dark-mode .dropdown-item:active {
    background-color: var(--fs-raised);
    color: var(--fs-text-strong);
}

html.dark-mode .page-link {
    background-color: var(--fs-raised);
    border-color: var(--fs-border);
    color: var(--fs-text);
}

html.dark-mode .page-link:hover {
    background-color: var(--fs-surface);
    border-color: var(--fs-border);
    color: var(--fs-text-strong);
}

html.dark-mode .page-item.active .page-link {
    background-color: #727cf5;
    border-color: #727cf5;
    color: #fff;
}

html.dark-mode .page-item.disabled .page-link {
    background-color: var(--fs-surface);
    border-color: var(--fs-border);
    color: var(--fs-text-muted);
}

html.dark-mode .pagination-text {
    color: var(--fs-text-muted);
}

html.dark-mode .table-responsive table thead th {
    background: var(--fs-raised) !important;
    box-shadow: 0 1px 0 var(--fs-border);
}

html.dark-mode .progress {
    background-color: var(--fs-raised);
}

html.dark-mode .btn-close {
    filter: invert(1) grayscale(1) brightness(1.4);
}

html.dark-mode .action-wrapper {
    background: var(--fs-raised);
    box-shadow: 0 0 16px rgba(0, 0, 0, 0.45);
}

html.dark-mode .wo-drawer-panel {
    background: var(--fs-surface) !important;
    box-shadow: -4px 0 24px rgba(0, 0, 0, 0.45);
}

html.dark-mode .wo-drawer-header {
    background: var(--fs-raised) !important;
    border-bottom-color: var(--fs-border) !important;
}

html.dark-mode .wo-drawer-header-left,
html.dark-mode .wo-drawer-case-no,
html.dark-mode .wo-field-value {
    color: var(--fs-text-strong) !important;
}

html.dark-mode .wo-field-label,
html.dark-mode .wo-drawer-loading,
html.dark-mode .wo-no-tech {
    color: var(--fs-text-muted) !important;
}

html.dark-mode .wo-drawer-divider {
    background: var(--fs-border) !important;
}

html.dark-mode .wo-tech-item {
    border-bottom-color: var(--fs-border) !important;
}

html.dark-mode .wo-description {
    background: var(--fs-raised) !important;
    border-color: var(--fs-border) !important;
    color: var(--fs-text) !important;
}

html.dark-mode .wo-tech-trigger,
html.dark-mode .wo-tech-dropdown {
    background: #161b22 !important;
    border-color: var(--fs-border) !important;
    color: var(--fs-text);
}

html.dark-mode .wo-tech-trigger-selected,
html.dark-mode .wo-tech-option {
    color: var(--fs-text-strong) !important;
}

html.dark-mode .wo-tech-option:hover,
html.dark-mode .wo-tech-option.active {
    background-color: rgba(114, 124, 245, 0.16) !important;
}

html.dark-mode .wo-tech-search-wrap {
    border-bottom-color: var(--fs-border) !important;
}

html.dark-mode .wo-tech-search-input {
    background: transparent;
    color: var(--fs-text-strong);
}

html.dark-mode .wo-list-row:hover {
    background-color: rgba(114, 124, 245, 0.12);
}

html.dark-mode .wo-col-picker-panel {
    background: var(--fs-surface) !important;
    border-color: var(--fs-border) !important;
}

html.dark-mode .wo-col-picker-header,
html.dark-mode .wo-col-picker-footer {
    border-color: var(--fs-border) !important;
    color: var(--fs-text-strong) !important;
}

html.dark-mode .wo-col-picker-label {
    color: var(--fs-text) !important;
}

html.dark-mode .wo-col-picker-row:hover {
    background: var(--fs-raised) !important;
}

html.dark-mode .quick-tools-drawer-panel {
    background: var(--fs-rail);
    border-left-color: var(--fs-border);
}

html.dark-mode .quick-tools-drawer-btn {
    background: var(--fs-raised);
    border-color: var(--fs-border);
    color: var(--fs-text-muted);
}

html.dark-mode .quick-tools-drawer-btn:hover,
html.dark-mode .quick-tools-drawer-btn:focus-visible {
    color: var(--fs-text-strong);
    border-color: var(--fs-border);
    background: var(--fs-surface);
}

html.dark-mode .home-panel {
    background: var(--fs-surface);
    border-color: var(--fs-border);
}

html.dark-mode .home-panel-title {
    color: var(--fs-text-strong);
}

html.dark-mode .home-panel-count,
html.dark-mode .home-team-role {
    color: var(--fs-text-muted);
}

html.dark-mode .home-quick-btn {
    background: transparent;
    border-color: var(--fs-border);
    color: var(--fs-text-strong);
}

html.dark-mode .home-quick-btn-primary {
    background: #f0a14a;
    border-color: #f0a14a;
    color: #1a140c;
}

html.dark-mode .home-team-row {
    border-top-color: var(--fs-border);
}

html.dark-mode .home-team-avatar {
    background: var(--fs-raised);
    color: var(--fs-text);
}

html.dark-mode .home-team-name {
    color: var(--fs-text-strong);
}

html.dark-mode .home-team-status.is-onsite {
    color: #3dcc84;
    background: rgba(61, 204, 132, 0.14);
}

html.dark-mode .home-team-status.is-enroute {
    color: #f0a14a;
    background: rgba(240, 161, 74, 0.16);
}

html.dark-mode .home-team-status.is-idle {
    color: var(--fs-text-muted);
    background: var(--fs-raised);
}

html.dark-mode .home-team-status.is-scheduled {
    color: #9aa8c2;
    background: rgba(238, 242, 247, 0.12);
}

html.dark-mode .home-team-status.is-leave {
    color: #8eb4ea;
    background: rgba(47, 93, 159, 0.28);
}

html.dark-mode .home-team-status.is-off {
    color: var(--fs-text-muted);
    background: var(--fs-raised);
}

html.dark-mode .home-team-chip,
html.dark-mode .home-team-search {
    background: transparent;
    border-color: var(--fs-border);
    color: var(--fs-text-strong);
}

html.dark-mode .home-team-chip span {
    color: var(--fs-text-muted);
}

html.dark-mode .home-team-chip.is-active {
    background: #f0a14a;
    border-color: #f0a14a;
    color: #1a140c;
}

html.dark-mode .home-team-chip.is-active span {
    color: #1a140c;
}

html.dark-mode a.home-quick-btn:hover,
html.dark-mode a.home-quick-btn:focus {
    background: var(--fs-raised);
    border-color: var(--fs-border);
}

html.dark-mode a.home-quick-btn-primary:hover,
html.dark-mode a.home-quick-btn-primary:focus {
    background: #f0a14a;
    border-color: #f0a14a;
    color: #1a140c;
}

html.dark-mode .home-board-empty,
html.dark-mode .home-region-frac {
    color: var(--fs-text-muted);
}

html.dark-mode .home-region-row {
    border-top-color: var(--fs-border);
}

html.dark-mode .home-region-name {
    color: var(--fs-text-strong);
}

html.dark-mode .home-region-track,
html.dark-mode .home-glance-hour-track {
    background: var(--fs-raised);
}

html.dark-mode .home-glance-face {
    border-color: var(--fs-surface);
    background: var(--fs-raised);
    color: var(--fs-text);
    box-shadow: 0 0 0 1px var(--fs-border);
}

html.dark-mode .home-glance-face-more {
    background: var(--fs-text-strong);
    color: var(--fs-surface);
}

html.dark-mode .home-territory-value {
    color: var(--fs-text-strong);
}

html.dark-mode .home-territory-value.is-positive,
html.dark-mode .home-territory-trend.is-up {
    color: #3dcc84;
}

html.dark-mode .home-territory-label {
    color: var(--fs-text-muted);
}

html.dark-mode .home-planner-day-num {
    color: var(--fs-text-strong);
}

html.dark-mode .home-planner-grid,
html.dark-mode .home-planner-day,
html.dark-mode .home-planner-day-head,
html.dark-mode .home-planner-day-num {
    border-color: var(--fs-border);
}

html.dark-mode .home-planner-day {
    background: var(--fs-surface);
}

html.dark-mode .home-planner-day-name,
html.dark-mode .home-planner-empty {
    color: var(--fs-text-muted);
}

html.dark-mode .home-planner-event {
    color: var(--fs-text-strong);
}

html.dark-mode .home-planner-event.is-holiday .home-planner-event-title {
    color: #ff8a80;
}

html.dark-mode .home-planner-day.is-today {
    background: rgba(240, 161, 74, 0.08);
}

html.dark-mode .home-planner-day.is-today .home-planner-day-head {
    border-bottom-color: rgba(240, 161, 74, 0.4);
}

html.dark-mode .home-planner-day.is-today .home-planner-day-num {
    color: #f0a14a;
}

html.dark-mode .field-day-card {
    background: var(--fs-surface);
    border-color: var(--fs-border);
}

html.dark-mode .field-day-meta {
    color: var(--fs-text-muted);
}

html.dark-mode .field-day-date,
html.dark-mode .field-day-clock {
    color: var(--fs-text-strong);
}

html.dark-mode .field-day-time-pill {
    background: var(--fs-raised);
    border-color: var(--fs-border);
}

html.dark-mode .home-glance-meta,
html.dark-mode .home-glance-hours,
html.dark-mode .home-glance-stat-label,
html.dark-mode .home-glance-time,
html.dark-mode .home-glance-who {
    color: var(--fs-text-muted);
}

html.dark-mode .home-glance-stat-frac,
html.dark-mode .home-glance-title {
    color: var(--fs-text-strong);
}

html.dark-mode .home-glance-stat-pct {
    color: #3dcc84;
}

html.dark-mode .home-glance-km {
    color: #f0a14a;
}

html.dark-mode .home-glance-tab {
    background: transparent;
    border-color: var(--fs-border);
    color: var(--fs-text-strong);
}

html.dark-mode .home-glance-sep {
    color: var(--fs-border);
}

html.dark-mode .home-glance-select {
    background-color: transparent;
    border-color: var(--fs-border);
    color: var(--fs-text-strong);
}

html.dark-mode .home-glance-select:focus {
    border-color: #f0a14a;
}

html.dark-mode .home-glance-tab.is-active {
    background: #f0a14a;
    border-color: #f0a14a;
    color: #1a140c;
}

html.dark-mode .home-glance-row {
    border-top-color: var(--fs-border);
}

html.dark-mode .todos-panel {
    background: var(--fs-surface);
    border-left-color: var(--fs-border);
    box-shadow: -8px 0 24px rgba(0, 0, 0, 0.28);
}

html.dark-mode .todos-panel-body {
    scrollbar-color: rgba(255, 255, 255, 0.22) transparent;
}

html.dark-mode .todos-panel-body::-webkit-scrollbar-track {
    background: transparent;
}

html.dark-mode .todos-panel-body::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.22);
    border: 2px solid transparent;
    background-clip: padding-box;
}

html.dark-mode .todos-panel-body::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.36);
    border: 2px solid transparent;
    background-clip: padding-box;
}

html.dark-mode .todos-panel-header,
html.dark-mode .todos-editor-toolbar {
    border-color: var(--fs-border);
}

html.dark-mode .todos-panel-title,
html.dark-mode .todos-card-title,
html.dark-mode .todos-picker-item,
html.dark-mode .todos-list-toggle,
html.dark-mode .todos-list-option {
    color: var(--fs-text-strong);
}

html.dark-mode .todos-list-dropdown {
    background: var(--fs-raised);
    border-color: var(--fs-border);
}

html.dark-mode .todos-list-rename-input {
    background: var(--fs-canvas);
    border-color: var(--fs-border);
    color: var(--fs-text-strong);
}

html.dark-mode .todos-list-rename-input:focus {
    border-color: rgba(240, 161, 74, 0.55);
    box-shadow: 0 0 0 3px rgba(240, 161, 74, 0.18);
}

html.dark-mode .todos-list-rename .todos-icon-btn {
    color: var(--fs-text-muted);
}

html.dark-mode .todos-list-rename-confirm {
    color: #f0a14a !important;
}

html.dark-mode .todos-list-rename-confirm:hover {
    background: rgba(240, 161, 74, 0.16);
    color: #f0a14a !important;
}

html.dark-mode .todos-list-option:hover {
    background: var(--fs-canvas);
}

html.dark-mode .todos-list-dropdown-divider {
    background: var(--fs-border);
}

html.dark-mode .todos-composer-form {
    background: rgba(255, 255, 255, 0.04);
    border-color: var(--fs-border);
}

html.dark-mode .todos-input-title,
html.dark-mode .todos-input-body,
html.dark-mode .todos-input-field {
    background: var(--fs-raised);
    border-color: var(--fs-border);
    color: var(--fs-text-strong);
}

html.dark-mode .todos-input-title:focus,
html.dark-mode .todos-input-body:focus,
html.dark-mode .todos-input-field:focus {
    background: var(--fs-raised);
    border-color: rgba(240, 161, 74, 0.55);
    box-shadow: 0 0 0 3px rgba(240, 161, 74, 0.18);
}

html.dark-mode .todos-checklist-row {
    background: rgba(0, 0, 0, 0.28);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    padding: 6px 8px;
    margin-bottom: 6px;
}

html.dark-mode .todos-input-inline {
    color: var(--fs-text-strong);
    background: transparent;
    caret-color: var(--fs-text-strong);
}

html.dark-mode .todos-input-inline:focus {
    background: transparent;
    color: var(--fs-text-strong);
}

html.dark-mode .todos-input-inline::placeholder {
    color: rgba(255, 255, 255, 0.45);
}

html.dark-mode .todos-checklist-row.is-completed .todos-input-inline {
    color: var(--fs-text-muted);
}

html.dark-mode .todos-check-circle {
    border-color: rgba(255, 255, 255, 0.4);
}

html.dark-mode .todos-check-btn {
    color: rgba(255, 255, 255, 0.55);
}

html.dark-mode .todos-check-btn:hover,
html.dark-mode .todos-check-btn.is-checked {
    color: #f0a14a;
}

html.dark-mode .todos-checklist-row .todos-icon-btn {
    color: rgba(255, 255, 255, 0.5);
}

html.dark-mode .todos-checklist-row .todos-icon-btn:hover {
    background: rgba(255, 255, 255, 0.08);
    color: #ef6b6b;
}

html.dark-mode .todos-text-btn {
    color: var(--fs-text-muted);
}

html.dark-mode .todos-text-btn:hover {
    color: #f0a14a;
}

html.dark-mode .todos-date-calendar-btn {
    background: var(--fs-canvas);
    border-color: var(--fs-border);
    color: var(--fs-text-muted);
}

html.dark-mode .todos-due-chip {
    background: var(--fs-canvas);
    border: 1px solid var(--fs-border);
    color: var(--fs-text-muted);
}

html.dark-mode .todos-due-chip.is-active,
html.dark-mode .todos-date-calendar-btn:hover,
html.dark-mode .todos-date-calendar-btn.is-active {
    background: rgba(240, 161, 74, 0.14);
    border-color: rgba(240, 161, 74, 0.35);
    color: #f0a14a;
}

html.dark-mode .todos-color-swatch {
    width: 24px;
    height: 24px;
    border: 2px solid rgba(255, 255, 255, 0.28);
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.35);
}

html.dark-mode .todos-color-swatch.is-small {
    width: 20px;
    height: 20px;
}

html.dark-mode .todos-color-swatch.is-active {
    border-color: #f0a14a;
    box-shadow: 0 0 0 2px rgba(240, 161, 74, 0.35);
}

html.dark-mode .todos-color-swatch.is-default {
    background-color: #3a4250;
    border-color: rgba(255, 255, 255, 0.35);
}

html.dark-mode .todos-color-swatch.is-orange { background-color: #e09a4f; }

html.dark-mode .todos-color-swatch.is-green { background-color: #4fba80; }

html.dark-mode .todos-color-swatch.is-blue { background-color: #5d96d6; }

html.dark-mode .todos-color-swatch.is-purple { background-color: #9d7adb; }

html.dark-mode .todos-color-swatch.is-teal { background-color: #4bbdb0; }

html.dark-mode .todos-color-swatch.is-pink { background-color: #de86ab; }

html.dark-mode .todos-assign-toggle {
    color: var(--fs-text-muted);
}

html.dark-mode .todos-assign-toggle:hover,
html.dark-mode .todos-assign-toggle.is-active {
    color: #f0a14a;
}

html.dark-mode .todos-panel-search,
html.dark-mode .todos-composer-trigger,
html.dark-mode .todos-card,
html.dark-mode .todos-editor-card,
html.dark-mode .todos-picker-results {
    background: var(--fs-raised);
    border-color: var(--fs-border);
}

html.dark-mode .todos-panel-search i {
    color: var(--fs-text-muted);
}

html.dark-mode .todos-panel-search input {
    color: var(--fs-text-strong);
    background: transparent;
    -webkit-text-fill-color: var(--fs-text-strong);
    caret-color: var(--fs-text-strong);
}

html.dark-mode .todos-panel-search input::placeholder {
    color: var(--fs-text-muted);
    opacity: 1;
    -webkit-text-fill-color: var(--fs-text-muted);
}

html.dark-mode .todos-card.is-orange,
html.dark-mode .todos-editor-card.is-orange,
html.dark-mode .todos-composer-form.is-orange {
    background: rgba(224, 154, 79, 0.22);
    border-color: rgba(224, 154, 79, 0.4);
}

html.dark-mode .todos-card.is-green,
html.dark-mode .todos-editor-card.is-green,
html.dark-mode .todos-composer-form.is-green {
    background: rgba(79, 186, 128, 0.2);
    border-color: rgba(79, 186, 128, 0.38);
}

html.dark-mode .todos-card.is-blue,
html.dark-mode .todos-editor-card.is-blue,
html.dark-mode .todos-composer-form.is-blue {
    background: rgba(93, 150, 214, 0.2);
    border-color: rgba(93, 150, 214, 0.38);
}

html.dark-mode .todos-card.is-purple,
html.dark-mode .todos-editor-card.is-purple,
html.dark-mode .todos-composer-form.is-purple {
    background: rgba(157, 122, 219, 0.22);
    border-color: rgba(157, 122, 219, 0.4);
}

html.dark-mode .todos-card.is-teal,
html.dark-mode .todos-editor-card.is-teal,
html.dark-mode .todos-composer-form.is-teal {
    background: rgba(75, 189, 176, 0.2);
    border-color: rgba(75, 189, 176, 0.38);
}

html.dark-mode .todos-card.is-pink,
html.dark-mode .todos-editor-card.is-pink,
html.dark-mode .todos-composer-form.is-pink {
    background: rgba(222, 134, 171, 0.22);
    border-color: rgba(222, 134, 171, 0.4);
}

html.dark-mode .todos-completed-section {
    border-top-color: var(--fs-border);
}

html.dark-mode .todos-completed-toggle {
    color: var(--fs-text-muted);
}

html.dark-mode .todos-completed-toggle:hover {
    color: var(--fs-text-strong);
}

html.dark-mode .todos-card.is-complete .todos-card-title {
    color: var(--fs-text-muted);
}

html.dark-mode .todos-drag-handle {
    color: rgba(255, 255, 255, 0.35);
}

html.dark-mode .todos-drag-handle:hover {
    color: var(--fs-text-muted);
    background: rgba(255, 255, 255, 0.06);
}

html.dark-mode .todos-card-dragging {
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.45);
}

html.dark-mode .todos-card-due {
    color: var(--fs-text-muted);
}

html.dark-mode .todos-card-due.is-overdue,
html.dark-mode .todos-note-due.is-overdue {
    color: #ef6b6b;
}

html.dark-mode .todos-note-check {
    color: var(--fs-text-muted);
}

html.dark-mode .todos-card-action-btn:hover,
html.dark-mode .todos-card-action-btn.is-active {
    background: rgba(255, 255, 255, 0.06);
    color: var(--fs-text-strong);
}

html.dark-mode .todos-card-menu {
    background: var(--fs-raised);
    border-color: var(--fs-border);
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.35);
}

html.dark-mode .todos-card-menu-item {
    color: var(--fs-text-strong);
}

html.dark-mode .todos-card-menu-item:hover {
    background: rgba(255, 255, 255, 0.06);
}

html.dark-mode .todos-card-menu-divider {
    background: var(--fs-border);
}

html.dark-mode .todos-editor-actions .todos-btn-ghost {
    color: var(--fs-text-muted);
}

html.dark-mode .todos-star-btn.is-starred {
    color: #f4b400;
}

html.dark-mode .todos-input {
    background: var(--fs-raised);
    border-color: var(--fs-border);
    color: var(--fs-text-strong);
}

html.dark-mode .todos-person-chip {
    background: var(--fs-canvas);
    color: var(--fs-text);
}

html.dark-mode .quick-tools-drawer-btn.is-active {
    color: #f0a14a;
    border-color: rgba(240, 161, 74, 0.45);
    background: rgba(240, 161, 74, 0.12);
}

html.dark-mode .weekly-plan-backdrop {
    background: rgba(0, 0, 0, 0.45);
}

html.dark-mode .weekly-plan-overlay {
    background: var(--fs-surface);
    border-left-color: var(--fs-border);
    box-shadow: -8px 0 28px rgba(0, 0, 0, 0.35);
}

html.dark-mode .weekly-plan-header {
    background: var(--fs-raised);
    border-bottom-color: var(--fs-border);
}

html.dark-mode .weekly-plan-kicker,
html.dark-mode .weekly-plan-empty,
html.dark-mode .weekly-plan-todos-label,
html.dark-mode .weekly-plan-day-name {
    color: var(--fs-text-muted);
}

html.dark-mode .weekly-plan-week-label,
html.dark-mode .weekly-plan-day-num,
html.dark-mode .weekly-plan-event,
html.dark-mode .weekly-plan-todo-title {
    color: var(--fs-text-strong);
}

html.dark-mode .weekly-plan-nav-btn,
html.dark-mode .weekly-plan-close-btn,
html.dark-mode .weekly-plan-todo-check {
    color: var(--fs-text-muted);
}

html.dark-mode .weekly-plan-nav-btn:hover,
html.dark-mode .weekly-plan-nav-btn:focus-visible,
html.dark-mode .weekly-plan-close-btn:hover,
html.dark-mode .weekly-plan-close-btn:focus-visible {
    background: rgba(255, 255, 255, 0.06);
    color: var(--fs-text-strong);
}

html.dark-mode .weekly-plan-loading {
    background: var(--fs-raised);
    border-color: var(--fs-border);
    color: var(--fs-text-muted);
}

html.dark-mode .weekly-plan-day,
html.dark-mode .weekly-plan-day-head,
html.dark-mode .weekly-plan-day-num {
    border-color: var(--fs-border);
}

html.dark-mode .weekly-plan-day {
    background: var(--fs-surface);
}

html.dark-mode .weekly-plan-todos {
    background: var(--fs-raised);
    border-top-color: var(--fs-border);
}

html.dark-mode .weekly-plan-day.is-today {
    background: rgba(240, 161, 74, 0.08);
}

html.dark-mode .weekly-plan-day.is-today .weekly-plan-day-head {
    border-bottom-color: rgba(240, 161, 74, 0.4);
}

html.dark-mode .weekly-plan-day.is-today .weekly-plan-day-num {
    color: #f0a14a;
}

html.dark-mode .weekly-plan-day.is-today .weekly-plan-todos {
    background: rgba(240, 161, 74, 0.1);
}

html.dark-mode .weekly-plan-event.is-holiday .weekly-plan-event-title {
    color: #ff8a80;
}

html.dark-mode .weekly-plan-todo.is-complete .weekly-plan-todo-title {
    color: var(--fs-text-muted);
}
