/* Dark theme overrides (Telerik and Syncfusion dark stylesheets are switched by js/theme.js) */
html[data-theme="dark"] {
    color-scheme: dark;
    --dark-bg: #121417;
    --dark-surface: #1e2227;
    --dark-surface-2: #262b31;
    --dark-border: #3a4048;
    --dark-text: #e3e6ea;
    --dark-text-muted: #a3aab3;
    /* Application variables (telerik-fixes-v3.css, site.css) */
    --White: #1e2227;
    --KGridToolbarBkgWhite: #1e2227;
    --GridHeaderBkgGray: #262b31;
    --Secondary-25: #121417;
    --Secondary-500: #c9ced6;
    --Lavender-25: #2a3a52;
    --Primary-500: #6cb6ff;
    --Gray-100: #262b31;
    --Gray-300: #5a616b;
    /* telerik-fixes.css admin vertical tabstrip */
    --left-bg: #1e2227;
    --right-bg: #262b31;
}

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

    html[data-theme="dark"] .sidebar,
    html[data-theme="dark"] .top-header-navbar {
        background-color: #0b1620 !important;
    }

    html[data-theme="dark"] .content,
    html[data-theme="dark"] .modal-content,
    html[data-theme="dark"] .card,
    html[data-theme="dark"] .dropdown-menu,
    html[data-theme="dark"] .list-group-item,
    html[data-theme="dark"] .bg-white,
    html[data-theme="dark"] .bg-light {
        background-color: var(--dark-surface) !important;
        color: var(--dark-text) !important;
        border-color: var(--dark-border) !important;
    }

    html[data-theme="dark"] .topnav-link.active,
    html[data-theme="dark"] .topnav-link.active:hover {
        background-color: var(--dark-surface) !important;
        border-bottom-color: var(--dark-surface) !important;
        color: var(--dark-text) !important;
    }

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

    html[data-theme="dark"] .form-control,
    html[data-theme="dark"] .custom-select,
    html[data-theme="dark"] .input-group-text {
        background-color: var(--dark-surface-2) !important;
        color: var(--dark-text) !important;
        border-color: var(--dark-border) !important;
    }

        html[data-theme="dark"] .form-control:disabled,
        html[data-theme="dark"] .form-control[readonly] {
            background-color: var(--dark-bg) !important;
        }

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

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

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

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

    /* Grid headers and toolbar */
    html[data-theme="dark"] .k-column-title,
    html[data-theme="dark"] .k-grid .k-table-thead,
    html[data-theme="dark"] .k-grid-header {
        color: var(--dark-text);
    }

    /* Status pills: translucent backgrounds + dark text are designed for a light background */
    html[data-theme="dark"] .statusbox {
        filter: brightness(1.9);
    }

    /* Grid toolbar (overrides telerik-fixes-v3.css) */
    html[data-theme="dark"] .gridpage-container .k-grid-toolbar,
    html[data-theme="dark"] .k-grid-toolbar {
        background-color: var(--dark-surface) !important;
        border-color: var(--dark-border) !important;
    }

    html[data-theme="dark"] .k-grid-toolbar .k-button {
        background: var(--dark-surface-2) !important;
        color: var(--dark-text) !important;
        border: 1px solid var(--dark-border) !important;
    }

        html[data-theme="dark"] .k-grid-toolbar .k-button:hover {
            background: #2f3a46 !important;
            color: #6cb6ff !important;
            border-color: #6cb6ff !important;
        }

        html[data-theme="dark"] .k-grid-toolbar .k-button:active {
            background: #006BB4 !important;
            color: #fff !important;
            border-color: #006BB4 !important;
        }

        html[data-theme="dark"] .k-grid-toolbar .k-button:disabled,
        html[data-theme="dark"] .k-grid-toolbar .k-button.k-disabled {
            background: transparent !important;
            color: #6b727c !important;
            border-color: #33383f !important;
        }

    /* Login page */
    html[data-theme="dark"] .k-body:has(.login-form) {
        background-color: var(--dark-bg) !important;
    }

    html[data-theme="dark"] .login-form form,
    html[data-theme="dark"] .login-form .dvOTPStep {
        background-color: var(--dark-surface) !important;
        border: 1px solid var(--dark-border);
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.5) !important;
    }

    html[data-theme="dark"] .login-form .logoBluesymtrax {
        filter: brightness(0) invert(1);
    }

    html[data-theme="dark"] .login-form .loginInfo,
    html[data-theme="dark"] .login-form .terms-conditions {
        color: var(--dark-text-muted) !important;
    }

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

    html[data-theme="dark"] .login-form .form-control {
        background-color: var(--dark-surface-2) !important;
        color: var(--dark-text) !important;
        border-color: var(--dark-border) !important;
    }

    html[data-theme="dark"] .login-form a,
    html[data-theme="dark"] .login-form .redirectionalUrl {
        color: #6cb6ff !important;
    }

    html[data-theme="dark"] a:not(.btn):not(.topnav-link):not(.menu-link) {
        color: #6cb6ff;
    }

    html[data-theme="dark"] .close {
        color: var(--dark-text);
        text-shadow: none;
    }

    html[data-theme="dark"] ::-webkit-scrollbar-track {
        background-color: var(--dark-surface);
    }

    html[data-theme="dark"] ::-webkit-scrollbar-thumb {
        background-color: var(--dark-border);
    }

    html[data-theme="dark"] .menu-link.active {
        background-color: var(--Primary-600, #005690) !important;
        color: #ffffff !important;
        box-shadow: inset 4px 0 0 #6cb6ff;
    }
    /* Schema validation dialog */
    html[data-theme="dark"] .schema-validation-message,
    html[data-theme="dark"] .schema-validation-detail-item,
    html[data-theme="dark"] .schema-validation-xml-context {
        color: var(--dark-text) !important;
    }

    html[data-theme="dark"] .schema-validation-help,
    html[data-theme="dark"] .schema-validation-technical-value {
        color: #c9d1d9 !important;
    }

    html[data-theme="dark"] .schema-validation-details summary {
        color: #6cb6ff !important;
    }

    html[data-theme="dark"] .schema-validation-xml-highlight {
        color: #1f2937;
        background: #ffd966;
        box-shadow: inset 0 0 0 1px #d39e00;
    }

    html[data-theme="dark"] .schema-validation-badge-occurrence {
        background: #6c757d;
    }

    /* Sub-tabs (MainLayout .filter-bar) */
    html[data-theme="dark"] .filter-bar .btn-outline-secondary:not(.active):not(:hover) {
        background-color: var(--dark-surface-2) !important;
        color: var(--dark-text) !important;
        border-color: var(--dark-border) !important;
    }

    /* Grey status pills (#666666 text on translucent grey): no brightness filter, explicit readable colors */
    html[data-theme="dark"] .statusbox[style*="#666666"] {
        filter: none;
        background: #4a5059 !important;
        color: #e3e6ea !important;
    }

    /* Invalid identifiers / schema errors pills (#721C24 text on light yellow): keep the yellow principle */
    html[data-theme="dark"] .statusbox[style*="#721C24" i] {
        filter: none;
        background: #d9b84a !important;
        color: #2b2100 !important;
    }

    /* Disabled toolbar buttons: readable but clearly inactive */
    html[data-theme="dark"] .k-grid-toolbar .k-button:disabled,
    html[data-theme="dark"] .k-grid-toolbar .k-button.k-disabled {
        color: #8b929c !important;
        border-color: #3a4048 !important;
    }

    /* Invoice views (EDI rendering + information panel) */
    html[data-theme="dark"] .edi-body,
    html[data-theme="dark"] .grid-contentEDI,
    html[data-theme="dark"] #invoiceEDIContainer {
        background-color: var(--dark-bg) !important;
    }

    html[data-theme="dark"] .edi-page {
        background: var(--dark-surface) !important;
        border-color: var(--dark-border) !important;
        color: var(--dark-text) !important;
        box-shadow: none !important;
    }

    html[data-theme="dark"] .edi-table-container,
    html[data-theme="dark"] .edi-blk-infos-source-container {
        border-color: var(--dark-border) !important;
    }

    html[data-theme="dark"] .edi-table-title,
    html[data-theme="dark"] .edi-invoice-title,
    html[data-theme="dark"] .edi-invoice-subtitle,
    html[data-theme="dark"] .infoheader {
        color: #6cb4ff !important;
        border-color: #3d7fc4 !important;
    }

    html[data-theme="dark"] .edi-title,
    html[data-theme="dark"] .edi-blk-infos-source-title {
        background-color: var(--dark-surface-2) !important;
        color: var(--dark-text) !important;
    }

    html[data-theme="dark"] .edi-blk-infos-source-title-txt,
    html[data-theme="dark"] .edi-page label,
    html[data-theme="dark"] .edi-page .form-text-small {
        color: var(--dark-text-muted) !important;
    }

    html[data-theme="dark"] .formfields,
    html[data-theme="dark"] .form-field-ovalue,
    html[data-theme="dark"] .form-control-customH18,
    html[data-theme="dark"] .span-ovalue,
    html[data-theme="dark"] .form-control-field-readonly,
    html[data-theme="dark"] .form-field-ovalue .k-textbox,
    html[data-theme="dark"] .cell-readonly,
    html[data-theme="dark"] .datepicker-readonly {
        background-color: var(--dark-surface-2) !important;
        color: var(--dark-text) !important;
        border-color: var(--dark-border) !important;
    }

    /* Tabstrips, windows / dialogs */
    html[data-theme="dark"] .k-tabstrip,
    html[data-theme="dark"] .k-tabstrip-items-wrapper,
    html[data-theme="dark"] .k-tabstrip-items,
    html[data-theme="dark"] .k-tabstrip-content,
    html[data-theme="dark"] .k-tabstrip > .k-content {
        background-color: var(--dark-surface) !important;
        color: var(--dark-text) !important;
        border-color: var(--dark-border) !important;
    }

    html[data-theme="dark"] .k-tabstrip-item,
    html[data-theme="dark"] .k-tabstrip-item .k-link {
        color: var(--dark-text) !important;
        background-color: transparent !important;
    }

    html[data-theme="dark"] .k-tabstrip-item.k-active,
    html[data-theme="dark"] .k-tabstrip-item.k-active .k-link {
        background-color: var(--dark-surface-2) !important;
        color: #6cb4ff !important;
    }

    html[data-theme="dark"] .k-window,
    html[data-theme="dark"] .k-dialog,
    html[data-theme="dark"] .k-window-content,
    html[data-theme="dark"] .k-window-actions,
    html[data-theme="dark"] .k-dialog-actions,
    html[data-theme="dark"] .k-actions,
    html[data-theme="dark"] .modal-content,
    html[data-theme="dark"] .modal-footer {
        background-color: var(--dark-surface) !important;
        color: var(--dark-text) !important;
        border-color: var(--dark-border) !important;
    }

    html[data-theme="dark"] .k-window .k-button:not(.k-button-solid-primary):not(.k-primary),
    html[data-theme="dark"] .modal-footer .btn:not(.btn-primary) {
        background-color: var(--dark-surface-2) !important;
        color: var(--dark-text) !important;
        border-color: #59636f !important;
        opacity: 1 !important;
    }

    html[data-theme="dark"] .k-window .k-button:hover {
        background-color: #323840 !important;
    }

    /* Modern tabstrips (telerik-fixes.css .moderntab overrides) */
    html[data-theme="dark"] .moderntab.ciptabstrip-tabstrip.k-tabstrip-top > .k-tabstrip-items-wrapper .k-tabstrip-item .k-link {
        color: var(--dark-text) !important;
    }

    html[data-theme="dark"] .moderntab.ciptabstrip-tabstrip.k-tabstrip-top > .k-tabstrip-items-wrapper .k-tabstrip-item:hover .k-link {
        color: #ffffff !important;
    }

    html[data-theme="dark"] .moderntab.ciptabstrip-tabstrip.k-tabstrip-top > .k-tabstrip-items-wrapper .k-tabstrip-item:active,
    html[data-theme="dark"] .moderntab.ciptabstrip-tabstrip.k-tabstrip-top > .k-tabstrip-items-wrapper .k-tabstrip-item.k-active,
    html[data-theme="dark"] .moderntab.ciptabstrip-tabstrip.k-tabstrip-top > .k-tabstrip-items-wrapper .k-tabstrip-item.k-selected {
        background-color: var(--dark-surface-2) !important;
        border-color: transparent !important;
        border-bottom: 2px solid #6cb4ff !important;
    }

    html[data-theme="dark"] .moderntab.ciptabstrip-tabstrip.k-tabstrip-top > .k-tabstrip-items-wrapper .k-tabstrip-item.k-active .k-link {
        color: #6cb4ff !important;
    }

    /* Blazored modals (invoice review popup, also while loading) */
    html[data-theme="dark"] .blazored-modal,
    html[data-theme="dark"] .blazored-modal-content,
    html[data-theme="dark"] .blazored-modal-header,
    html[data-theme="dark"] #contentdiv {
        background-color: var(--dark-surface) !important;
        color: var(--dark-text) !important;
        border-color: var(--dark-border) !important;
    }

    /* Top navigation band behind the module tabs */
    html[data-theme="dark"] .topnav {
        background-color: #0b1620 !important;
    }

    html[data-theme="dark"] .topnav-link:not(.active) {
        background-color: #1c2a38 !important;
        border-color: #1c2a38 !important;
        box-shadow: none !important;
    }

    html[data-theme="dark"] .topnav-link:not(.active):hover {
        background-color: #263a4e !important;
        border-color: #263a4e !important;
    }

    /* Address validation proposals and secondary information */
    html[data-theme="dark"] .lookup-address-choice-panel {
        background-color: var(--dark-surface-2) !important;
        border-color: var(--dark-border) !important;
    }

    html[data-theme="dark"] .lookup-address-choice-title {
        color: #8cc8ff !important;
    }

    html[data-theme="dark"] .lookup-address-option-selected {
        background-color: #1f3a55 !important;
        border-color: #6cb6ff !important;
    }

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

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

    html[data-theme="dark"] .inactive-address-group {
        border-top-color: var(--dark-border) !important;
    }
    html[data-theme="dark"] .address-correction-candidates {
        background-color: var(--dark-surface-2) !important;
        color: var(--dark-text) !important;
        border-color: var(--dark-border) !important;
    }

    html[data-theme="dark"] .address-correction-manual > div[style*="color: #666"],
    html[data-theme="dark"] .address-correction-manual > details,
    html[data-theme="dark"] .address-correction-scheme {
        color: var(--dark-text-muted) !important;
    }

    /* Hardcoded light surfaces across pages (settings, cards, panels, dialogs) */
    html[data-theme="dark"] .section-card,
    html[data-theme="dark"] .category-block,
    html[data-theme="dark"] .erp-settings-section,
    html[data-theme="dark"] .totals-section,
    html[data-theme="dark"] .payment-payload-card,
    html[data-theme="dark"] .purchases-payload-card,
    html[data-theme="dark"] .sales-payload-card,
    html[data-theme="dark"] .schema-validation-card,
    html[data-theme="dark"] .schema-validation-actions,
    html[data-theme="dark"] .schema-validation-xml-context,
    html[data-theme="dark"] .lookup-search-panel,
    html[data-theme="dark"] .lookup-address-option,
    html[data-theme="dark"] .address-correction-manual,
    html[data-theme="dark"] .lst-warning-list-container,
    html[data-theme="dark"] .error-container,
    html[data-theme="dark"] .picture-upload-box,
    html[data-theme="dark"] .logo-preview-header,
    html[data-theme="dark"] .pdf-password-dialog,
    html[data-theme="dark"] .lightbox-content,
    html[data-theme="dark"] .invoice-info-toolbar,
    html[data-theme="dark"] .attach-row-title,
    html[data-theme="dark"] .ben-modal-header,
    html[data-theme="dark"] .blk-infos-source-title,
    html[data-theme="dark"] .bkgWhite-imp,
    html[data-theme="dark"] .typing-upload,
    html[data-theme="dark"] .copy-tooltip,
    html[data-theme="dark"] .copy-tooltip-textbox,
    html[data-theme="dark"] #sidebar-main,
    html[data-theme="dark"] #sidebar-main-poedit,
    html[data-theme="dark"] .k-window-titlebar,
    html[data-theme="dark"] .k-dialog-titlebar,
    html[data-theme="dark"] .card-body,
    html[data-theme="dark"] .jumbotron,
    html[data-theme="dark"] .k-form,
    html[data-theme="dark"] .k-form-fieldset,
    html[data-theme="dark"] fieldset {
        background-color: var(--dark-surface) !important;
        color: var(--dark-text) !important;
        border-color: var(--dark-border) !important;
    }

    html[data-theme="dark"] .form-control-field,
    html[data-theme="dark"] .form-control-add-poform-ponumber,
    html[data-theme="dark"] .txtReadOnly,
    html[data-theme="dark"] .read-only,
    html[data-theme="dark"] .invreq-typing-msg-txtarea,
    html[data-theme="dark"] .cip-checkbox-input,
    html[data-theme="dark"] .label,
    html[data-theme="dark"] .infoheader span,
    html[data-theme="dark"] .table th,
    html[data-theme="dark"] .service-table-all tr:nth-child(even),
    html[data-theme="dark"] .tableCell-Hover,
    html[data-theme="dark"] textarea,
    html[data-theme="dark"] select {
        background-color: var(--dark-surface-2) !important;
        color: var(--dark-text) !important;
        border-color: var(--dark-border) !important;
    }

    /* Telerik inputs / pickers / dropdowns */
    html[data-theme="dark"] .k-input,
    html[data-theme="dark"] .k-picker,
    html[data-theme="dark"] .k-textbox,
    html[data-theme="dark"] .k-textarea,
    html[data-theme="dark"] .k-numerictextbox,
    html[data-theme="dark"] .k-dropdownlist,
    html[data-theme="dark"] .k-combobox,
    html[data-theme="dark"] .k-multiselect,
    html[data-theme="dark"] .k-list,
    html[data-theme="dark"] .k-popup,
    html[data-theme="dark"] .k-list-item {
        background-color: var(--dark-surface-2) !important;
        color: var(--dark-text) !important;
        border-color: var(--dark-border) !important;
    }

    html[data-theme="dark"] .k-list-item:hover,
    html[data-theme="dark"] .k-list-item.k-hover {
        background-color: #323840 !important;
    }

    html[data-theme="dark"] .k-list-item.k-selected {
        background-color: #1f4f7a !important;
        color: #ffffff !important;
    }

    /* Filter toolbars (audit, filter-bar, lookup panels) */
    html[data-theme="dark"] {
        --bs-light: #1e2227;
        --bs-border-color: #3a4048;
        --bs-secondary: #a3aab3;
        --bs-body-bg: #1e2227;
        --bs-body-color: #e3e6ea;
    }

    html[data-theme="dark"] .audit-toolbar,
    html[data-theme="dark"] .filter-bar,
    html[data-theme="dark"] .filter-bar-small,
    html[data-theme="dark"] .lookup-address-choice-panel,
    html[data-theme="dark"] .lookup-address-option-selected,
    html[data-theme="dark"] .cip-error-header,
    html[data-theme="dark"] .gridpage-head,
    html[data-theme="dark"] .k-toolbar {
        background: var(--dark-surface) !important;
        color: var(--dark-text) !important;
        border-color: var(--dark-border) !important;
    }

    html[data-theme="dark"] .form-select,
    html[data-theme="dark"] .form-select option,
    html[data-theme="dark"] .form-select optgroup {
        background-color: var(--dark-surface-2) !important;
        color: var(--dark-text) !important;
        border-color: var(--dark-border) !important;
    }

    html[data-theme="dark"] .form-check-label,
    html[data-theme="dark"] .form-check,
    html[data-theme="dark"] .audit-field label {
        color: var(--dark-text) !important;
    }

    html[data-theme="dark"] .form-check-input {
        background-color: var(--dark-surface-2);
        border-color: #6b737e;
    }

    html[data-theme="dark"] .form-check-input:checked {
        background-color: #2c86c3;
        border-color: #2c86c3;
    }

    html[data-theme="dark"] ::placeholder {
        color: #8b929c !important;
        opacity: 1;
    }

    html[data-theme="dark"] .k-grid-toolbar .k-button:not(:disabled):not(.k-disabled),
    html[data-theme="dark"] .k-pager,
    html[data-theme="dark"] .k-grid-pager {
        color: var(--dark-text) !important;
    }

    /* Admin vertical tabstrip content (company edit) */
    html[data-theme="dark"] .admin-tab-vertical.ciptabstrip-tabstrip > .k-tabstrip-content,
    html[data-theme="dark"] .admin-tab-vertical.ciptabstrip-tabstrip > .k-content {
        background-color: var(--dark-surface-2) !important;
        color: var(--dark-text) !important;
    }

    /* Invoice information tables (events, files, attachments, history) */
    html[data-theme="dark"] table[id^="invoice-information-"] tr,
    html[data-theme="dark"] table[id^="invoice-information-"] tr td,
    html[data-theme="dark"] table[id^="sent-invoice-view-"] tr,
    html[data-theme="dark"] table[id^="sent-invoice-view-"] tr td,
    html[data-theme="dark"] table#invoice-events tr,
    html[data-theme="dark"] table#invoice-events tr td {
        background-color: transparent !important;
        color: var(--dark-text) !important;
    }

    html[data-theme="dark"] table[id^="invoice-information-"] tr:nth-child(even),
    html[data-theme="dark"] table[id^="invoice-information-"] tr:nth-child(even) td,
    html[data-theme="dark"] table[id^="sent-invoice-view-"] tr:nth-child(even),
    html[data-theme="dark"] table[id^="sent-invoice-view-"] tr:nth-child(even) td,
    html[data-theme="dark"] table#invoice-events tr:nth-child(even),
    html[data-theme="dark"] table#invoice-events tr:nth-child(even) td {
        background-color: var(--dark-surface-2) !important;
    }

    html[data-theme="dark"] table[id^="invoice-information-"] tr:hover td,
    html[data-theme="dark"] table[id^="sent-invoice-view-"] tr:hover td,
    html[data-theme="dark"] table#invoice-events tr:hover td {
        background-color: rgba(255, 255, 255, 0.08) !important;
    }

    html[data-theme="dark"] table[id^="invoice-information-"] th,
    html[data-theme="dark"] table[id^="sent-invoice-view-"] th,
    html[data-theme="dark"] table#invoice-events th {
        background-color: transparent !important;
        color: var(--dark-text-muted) !important;
    }

    html[data-theme="dark"] table[id^="invoice-information-"] a,
    html[data-theme="dark"] table[id^="sent-invoice-view-"] a,
    html[data-theme="dark"] table#invoice-events a {
        color: #8cc8ff !important;
    }

    /* Grid semantic text colors (unread rows, overdue dates, errors) */
    html[data-theme="dark"] .unread-item {
        color: #8cc8ff !important;
    }

    html[data-theme="dark"] .duedate-alert,
    html[data-theme="dark"] .duedate-alert-unread,
    html[data-theme="dark"] .erp-integration-status {
        color: #f28b82 !important;
    }

    /* Generic text that was forced to dark colors */
    html[data-theme="dark"] .text-dark,
    html[data-theme="dark"] .text-black,
    html[data-theme="dark"] h1, html[data-theme="dark"] h2, html[data-theme="dark"] h3,
    html[data-theme="dark"] h4, html[data-theme="dark"] h5, html[data-theme="dark"] h6,
    html[data-theme="dark"] label,
    html[data-theme="dark"] legend {
        color: var(--dark-text);
    }

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

    /* Inline white backgrounds set in markup */
    html[data-theme="dark"] [style*="background-color: white"],
    html[data-theme="dark"] [style*="background-color:white"],
    html[data-theme="dark"] [style*="background: white"],
    html[data-theme="dark"] [style*="background-color: #fff"],
    html[data-theme="dark"] [style*="background-color:#fff"] {
        background-color: var(--dark-surface) !important;
        color: var(--dark-text) !important;
    }

    html[data-theme="dark"] [style*="color: black"],
    html[data-theme="dark"] [style*="color:black"],
    html[data-theme="dark"] [style*="color: #000"],
    html[data-theme="dark"] [style*="color:#000"] {
        color: var(--dark-text) !important;
    }