/* Shared theme tokens. Light mode preserves the existing customer styling.
   Dark rules are screen-only, so printed reports retain their light palette. */
:root {
    --helpit-surface: #fff;
    --helpit-text: #000;
    --helpit-border: #ddd;
    --helpit-muted: #666;
}
.helpit-theme-toggle {
    display: inline-block;
    width: auto;
    min-height: 34px;
    margin: 8px 10px;
    padding: 6px 10px;
    border: 1px solid #687891;
    border-radius: 6px;
    background: #fff;
    color: #172033;
    font: inherit;
    line-height: 20px;
    cursor: pointer;
    vertical-align: middle;
}
.helpit-theme-toggle:hover { background: #e7edf5; color: #172033; }
.helpit-theme-toggle:focus-visible { outline: 3px solid #56adff; outline-offset: 3px; }
.helpit-theme-floating { position: fixed; top: 8px; right: 8px; z-index: 1100; }
#topNavigation .helpit-theme-menu {
    width: 36px;
    min-height: 36px;
    margin: 7px 10px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #b8c5d8;
    font-size: 20px;
    line-height: 36px;
}
#topNavigation .helpit-theme-menu:hover,
#topNavigation .helpit-theme-menu:focus-visible { background: rgba(255,255,255,.1); color: #fff; }
@media screen and (max-width: 767px) {
    #topNavigation .helpit-theme-menu { width: 44px; min-height: 44px; margin: 0 5px; line-height: 44px; }
}
@media print { .helpit-theme-toggle { display: none !important; } }

@media screen {
    html[data-theme="dark"] {
        color-scheme: dark;
        --helpit-bg: #111827;
        --helpit-surface: #1b2535;
        --helpit-raised: #253247;
        --helpit-hover: #30415a;
        --helpit-text: #e6edf7;
        --helpit-muted: #afbdd0;
        --helpit-border: #485b73;
        --helpit-link: #8dc5ff;
        --helpit-danger: #ffabab;
        --helpit-success: #8edbad;
        --helpit-info-tab: #492b35;
        background: var(--helpit-bg);
    }
    html[data-theme="dark"] body { background-color: var(--helpit-bg); color: var(--helpit-text); }
    html[data-theme="dark"] a,
    html[data-theme="dark"] a:visited { color: var(--helpit-link); }
    html[data-theme="dark"] a:hover { color: #c3e1ff; }
    html[data-theme="dark"] :is(.norm, .normB, .normI, .normSmall, legend, .close) { color: var(--helpit-text); }
    html[data-theme="dark"] :is(.text-muted, .normGrey, .inActive, .help-block) { color: var(--helpit-muted) !important; }
    html[data-theme="dark"] :is(.normInternal, .normRed, .text-danger, .validationError, .systemMessage) { color: var(--helpit-danger); }
    html[data-theme="dark"] :is(.normSolution, .saved, .text-success) { color: var(--helpit-success); }
    html[data-theme="dark"] .normCustomerInternal { color: var(--helpit-link); }
    html[data-theme="dark"] :is(.panel, .modal-content, .well, .list-group-item, .dropdown-menu, .popover, .card, .thumbnail) {
        background-color: var(--helpit-surface);
        color: var(--helpit-text);
        border-color: var(--helpit-border);
    }
    html[data-theme="dark"] .card { opacity: 1; }
    html[data-theme="dark"] .card p { color: var(--helpit-text); }
    html[data-theme="dark"] .card .tenant { background: var(--helpit-raised); color: var(--helpit-muted); }
    html[data-theme="dark"] :is(.panel-default > .panel-heading, .panel-footer, .popover-title, .navColor, .level2, .level4, thead > tr) {
        background-color: var(--helpit-raised);
        color: var(--helpit-text);
        border-color: var(--helpit-border);
    }
    html[data-theme="dark"] :is(.modal-header, .modal-footer, hr, .mainTable, .nav-tabs, .table > thead > tr > th, .table > tbody > tr > td, .table > tbody > tr > th, .table-bordered, .table-bordered th, .table-bordered td) { border-color: var(--helpit-border); }
    html[data-theme="dark"] :is(.form-control, input:not([type]), input[type="text"], input[type="password"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="url"], input[type="date"], input[type="time"], select, textarea) {
        background-color: var(--helpit-surface);
        color: var(--helpit-text);
        border-color: var(--helpit-border);
    }
    html[data-theme="dark"] :is(input, select, textarea):focus { outline-color: var(--helpit-link); border-color: var(--helpit-link); }
    html[data-theme="dark"] :is(input, textarea)::placeholder { color: var(--helpit-muted); opacity: 1; }
    html[data-theme="dark"] :is(.form-control[disabled], .form-control[readonly], input:disabled, select:disabled, textarea:disabled) { background-color: var(--helpit-raised) !important; color: var(--helpit-muted); }
    html[data-theme="dark"] :is(input[type="checkbox"], input[type="radio"]) { accent-color: #69b2ff; }
    html[data-theme="dark"] :is(.btn-default, input[type="submit"], input[type="button"], .helpit-theme-toggle, .customer-follow-caseview, .customer-follow-toggle) {
        background: var(--helpit-raised); color: var(--helpit-text); border-color: var(--helpit-border);
    }
    html[data-theme="dark"] :is(.btn-default:hover, .btn-default:focus, .helpit-theme-toggle:hover, .customer-follow-caseview:hover, .customer-follow-toggle:hover, .customer-follow-toggle:focus) { background: var(--helpit-hover); color: var(--helpit-text); }
    html[data-theme="dark"] :is(.btn-primary, .btn-success, .btn-danger, .btn-info, .btn-warning) { color: #fff; }
    html[data-theme="dark"] .btn-warning { background: #805800; border-color: #b88a25; }
    html[data-theme="dark"] .btn-info { background: #236482; border-color: #4b98b9; }
    html[data-theme="dark"] .btn-success { background: #28633d; border-color: #498b61; }
    html[data-theme="dark"] :is(.dropdown-menu > li > a, .nav-tabs > li > a, .pagination > li > a, .pagination > li > span) { color: var(--helpit-link); background-color: var(--helpit-surface); border-color: var(--helpit-border); }
    html[data-theme="dark"] :is(.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus, .nav > li > a:hover, .nav > li > a:focus, .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus, .pagination > .active > a) { background-color: var(--helpit-hover); color: var(--helpit-text); border-color: var(--helpit-border); }
    html[data-theme="dark"] .list-group-item.active { background-color: var(--helpit-hover) !important; color: var(--helpit-text) !important; border-color: var(--helpit-border) !important; }
    html[data-theme="dark"] :is(.navbar-inverse, .dd-container, .dd-select) { background: #101c30 !important; }
    html[data-theme="dark"] :is(.navbar-inverse .navbar-nav > li > a, .menu, .dd-selected-text) { color: var(--helpit-text) !important; }
    html[data-theme="dark"] .dd-pointer { border-top-color: var(--helpit-text) !important; }
    html[data-theme="dark"] :is(.dd-options, .dd-option) { background: var(--helpit-surface); color: var(--helpit-text); }
    html[data-theme="dark"] :is(.dd-option:hover, .dd-option-selected) { background: var(--helpit-hover); }
    html[data-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) { background-color: #202d40; }
    html[data-theme="dark"] .table-hover > tbody > tr:hover { background-color: var(--helpit-hover); }
    html[data-theme="dark"] :is(.sla1, .alert-warning, .table > tbody > tr.warning > td) { background-color: #493c21; color: #ffe4a3; border-color: #a17c30; }
    html[data-theme="dark"] :is(.sla2, .alert-danger, .table > tbody > tr.danger > td) { background-color: #492b35; color: #ffc3c3; border-color: #a25767; }
    html[data-theme="dark"] :is(.alert-success, .table > tbody > tr.success > td) { background-color: #203e32; color: #a8ebc4; border-color: #4d8868; }
    html[data-theme="dark"] :is(.reminder, .alert-info, .table > tbody > tr.info > td) { background-color: #213d52; color: #b3defa; border-color: #4c7c9b; }
    html[data-theme="dark"] :is(#searchResultDiv, #searchResultDivContacts, #statsAffix, .text-on-pannel, .rrow + .tooltip > .tooltip-inner) { background-color: var(--helpit-surface) !important; color: var(--helpit-text) !important; border-color: var(--helpit-border) !important; }
    html[data-theme="dark"] :is(.dropzone, pre, code) { background-color: var(--helpit-raised); color: var(--helpit-text); border-color: var(--helpit-border); }
    html[data-theme="dark"] :is(#divDisable, .disable) { background-color: rgba(17, 24, 39, .8); }

    /* Kendo grids, filter menus, dropdowns, calendars and their body-level popups. */
    html[data-theme="dark"] :is(.k-widget, .k-grid, .k-grid-content, .k-popup, .k-list-container, .k-list, .k-window-content, .k-calendar, .k-calendar td, .k-input, .k-dropdown-wrap, .k-picker-wrap, .k-numeric-wrap, .k-multiselect-wrap) { background-color: var(--helpit-surface); color: var(--helpit-text); border-color: var(--helpit-border); }
    html[data-theme="dark"] :is(.k-header, .k-grid-header, .k-grid-header th.k-header, .k-grid thead, .k-pager-wrap, .k-grouping-header, .k-grouping-row td, .k-footer-template td, .k-button, .k-calendar th) { background: var(--helpit-raised); color: var(--helpit-text); border-color: var(--helpit-border); }
    html[data-theme="dark"] .k-grid td { border-color: var(--helpit-border); }
    html[data-theme="dark"] :is(.k-grid table, .table .table) { background-color: var(--helpit-surface); }
    html[data-theme="dark"] .k-grid .k-group-cell { background-color: var(--helpit-raised); }
    html[data-theme="dark"] #divCaseList :is(input[type="image"], img[id*="img"], #imgReportExcel, #imgReportPdf) { background-color: #dce5f0; border-radius: 2px; }
    html[data-theme="dark"] .k-grid .k-alt { background-color: #202d40; }
    html[data-theme="dark"] .k-grid col.k-sorted { background-color: transparent !important; }
    html[data-theme="dark"] :is(.k-state-hover, .k-state-selected, .k-state-focused, .k-button:hover, .k-list > .k-state-selected, .k-grid tr.k-state-selected) { background: var(--helpit-hover); color: var(--helpit-text); border-color: var(--helpit-link); }
    html[data-theme="dark"] :is(.k-link, .k-grid-header .k-link) { color: var(--helpit-link); }
    html[data-theme="dark"] .k-grid .k-state-selected { background-color: var(--helpit-hover) !important; }
    /* Kendo's legacy icons use a dark bitmap sprite. */
    html[data-theme="dark"] .k-icon { filter: brightness(0) invert(1); }

    /* DataTables sets its own white row and sorted-column backgrounds. */
    html[data-theme="dark"] table.dataTable tbody tr { background-color: var(--helpit-surface); color: var(--helpit-text); }
    /* RowGroup paints the cells themselves, overriding the row background. */
    html[data-theme="dark"] table.dataTable tbody tr:is(.group, .dtrg-group) > :is(td, th) {
        background-color: var(--helpit-raised);
        color: var(--helpit-text);
        border-color: var(--helpit-border);
    }
    html[data-theme="dark"] table.dataTable tbody tr:is(.group, .dtrg-group):hover > :is(td, th) {
        background-color: var(--helpit-hover);
    }
    /* RowGroup paints the cells themselves, overriding the row background. */
    html[data-theme="dark"] table.dataTable tbody tr:is(.group, .dtrg-group) > :is(td, th) {
        background-color: var(--helpit-raised);
        color: var(--helpit-text);
        border-color: var(--helpit-border);
    }
    html[data-theme="dark"] table.dataTable tbody tr:is(.group, .dtrg-group):hover > :is(td, th) {
        background-color: var(--helpit-hover);
    }
    html[data-theme="dark"] table.dataTable.stripe tbody tr.odd,
    html[data-theme="dark"] table.dataTable.display tbody tr.odd { background-color: #202d40; }
    html[data-theme="dark"] table.dataTable.display tbody tr > :is(.sorting_1, .sorting_2, .sorting_3),
    html[data-theme="dark"] table.dataTable.order-column tbody tr > :is(.sorting_1, .sorting_2, .sorting_3) { background-color: var(--helpit-raised); }
    html[data-theme="dark"] table.dataTable tbody tr.selected,
    html[data-theme="dark"] table.dataTable.display tbody tr.selected > td { background-color: var(--helpit-hover); color: var(--helpit-text); }
    html[data-theme="dark"] table.dataTable.hover tbody tr:hover,
    html[data-theme="dark"] table.dataTable.display tbody tr:hover > td { background-color: var(--helpit-hover); }
    html[data-theme="dark"] :is(.dataTables_wrapper .dataTables_info, .dataTables_wrapper .dataTables_length, .dataTables_wrapper .dataTables_filter, .dataTables_wrapper .dataTables_processing, .dataTables_wrapper .dataTables_paginate) { color: var(--helpit-text); }
    html[data-theme="dark"] :is(button.dt-button, a.dt-button, div.dt-button, div.dt-button-collection, .dataTables_wrapper .dataTables_paginate .paginate_button) { background: var(--helpit-raised); color: var(--helpit-text) !important; border-color: var(--helpit-border); }
    html[data-theme="dark"] :is(.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button:hover, button.dt-button:hover:not(.disabled)) { background: var(--helpit-hover); color: var(--helpit-text) !important; border-color: var(--helpit-link); }

    /* Telerik's embedded skins may be injected after this stylesheet. */
    html[data-theme="dark"] :is(.RadTabStrip .rtsLink, .RadTabStrip .rtsOut, .RadTabStrip .rtsIn, .RadGrid .rgHeader, .RadGrid .rgPager, .RadWindow .rwTitlebar, .RadEditor .reToolbar, .RadEditor .reToolCell, .RadEditor .reBottomZone) { background: var(--helpit-raised) !important; color: var(--helpit-text) !important; border-color: var(--helpit-border) !important; }
    html[data-theme="dark"] :is(.RadTabStrip .rtsSelected, .RadTabStrip .rtsSelected .rtsOut, .RadTabStrip .rtsSelected .rtsIn) { background: var(--helpit-hover) !important; color: var(--helpit-text) !important; }
    html[data-theme="dark"] :is(.RadGrid, .RadGrid .rgRow, .RadGrid .rgAltRow, .RadComboBox .rcbInput, .RadComboBox .rcbInputCell, .RadComboBoxDropDown, .RadListBox, .RadListBox .rlbGroup, .RadTreeView, .RadWindow .rwContent, .RadCalendar, .RadCalendar .rcMain, .RadCalendar .rcRow td, .RadInput .riTextBox, .RadEditor, .RadEditor_Material, .reDropDownBody) { background-color: var(--helpit-surface) !important; color: var(--helpit-text) !important; border-color: var(--helpit-border) !important; }
    html[data-theme="dark"] :is(.RadComboBoxDropDown .rcbHovered, .RadListBox .rlbHovered, .RadListBox .rlbSelected, .RadTreeView .rtSelected .rtIn, .RadGrid .rgSelectedRow) { background: var(--helpit-hover) !important; color: var(--helpit-text) !important; }
    html[data-theme="dark"] :is(.RadEditor_Material .reTool, .RadEditor_Material .reDropdown, .RadEditor_Material .reDropdown:before) { color: var(--helpit-text) !important; }
    html[data-theme="dark"] .RadTabStrip .rtsSelected .rtsLink { background-color: var(--helpit-hover) !important; }
    html[data-theme="dark"] .RadLabel { color: var(--helpit-text) !important; }
    html[data-theme="dark"] :is(.RadSlider .rslItem, .RadSlider .rslItem span, .RadSlider .rslItemsWrapper span) { color: var(--helpit-muted) !important; }
    html[data-theme="dark"] :is(.breadcrumb, .input-group-addon) { background-color: var(--helpit-raised); color: var(--helpit-muted); border-color: var(--helpit-border); }
    html[data-theme="dark"] .breadcrumb > .active { color: var(--helpit-muted); }
    html[data-theme="dark"] .RadGrid a { color: var(--helpit-link) !important; }
    html[data-theme="dark"] :is(.RadGrid .rgNumPart a, .RadGrid .rgNumPart a span, .RadGrid .rgActionButton) { background: var(--helpit-raised) !important; color: var(--helpit-link) !important; border-color: var(--helpit-border) !important; }
    html[data-theme="dark"] .RadEditor .reDropdown { background: var(--helpit-raised) !important; color: var(--helpit-text) !important; }
    html[data-theme="dark"] .ic-help { color: var(--helpit-muted); text-shadow: none !important; }
    html[data-theme="dark"] :is(.RadDropDownList .rddlInner, .RadDropDownList .rddlPopup, .RadButton, .RadButton .rbDecorated, .RadButton .rbText) { background: var(--helpit-raised) !important; color: var(--helpit-text) !important; border-color: var(--helpit-border) !important; }
    html[data-theme="dark"] .RadComboBox .rcbInputCell { background-image: none !important; border: 1px solid var(--helpit-border); }
    html[data-theme="dark"] :is(.RadComboBox .rcbInner, .RadComboBox .rcbActionButton, .rddlPopup) { background: var(--helpit-raised) !important; color: var(--helpit-text) !important; border-color: var(--helpit-border) !important; }
    html[data-theme="dark"] .RadComboBox .rcbArrowCell { background: var(--helpit-raised) !important; border: 1px solid var(--helpit-border); }
    html[data-theme="dark"] .RadComboBox .rcbArrowCell a::after { content: '\25be'; display: block; text-align: center; text-indent: 0; color: var(--helpit-text); position: absolute; inset: 0; }
    html[data-theme="dark"] img[id$="imgLogo"] { background-color: #fff; border-radius: 3px; padding: 3px; }

    /* State colors must win over alternating/sorted table row backgrounds. */
    html[data-theme="dark"] :is(.k-grid, table.dataTable, .table) tr.sla1,
    html[data-theme="dark"] :is(.k-grid, table.dataTable, .table) tr.sla1 > td { background-color: #493c21; color: #ffe4a3; }
    html[data-theme="dark"] :is(.k-grid, table.dataTable, .table) tr.sla2,
    html[data-theme="dark"] :is(.k-grid, table.dataTable, .table) tr.sla2 > td { background-color: #492b35; color: #ffc3c3; }
    html[data-theme="dark"] :is(.k-grid, table.dataTable, .table) tr.reminder,
    html[data-theme="dark"] :is(.k-grid, table.dataTable, .table) tr.reminder > td { background-color: #213d52; color: #b3defa; }
    html[data-theme="dark"] .selectedItem { background-color: #28513b !important; color: #c5f7d7 !important; }
    html[data-theme="dark"] :is(.td-NoRepeat, #noRepeatDiv) { background-color: #3f5426 !important; color: #eef8df !important; }
    html[data-theme="dark"] :is(.td-Monthly, .td-Daily, .td-Weekly, #repeatDiv) { background-color: #155746 !important; color: #d4f8e9 !important; }
    html[data-theme="dark"] select:is([id$="selPriority"], [id$="selCategory"], [id$="selCategoryFault"]) { background-color: var(--helpit-surface) !important; }
    html[data-theme="dark"] [id$="tblCases"] tr.normB:is([style*="lightgray" i], [style*="lightgrey" i], [style*="silver" i]) { background-color: var(--helpit-raised) !important; }
    html[data-theme="dark"] [id$="tblCases"] tr.normB[style*="cornflowerblue" i] { background-color: #294c79 !important; }
    html[data-theme="dark"] [id$="tblCases"] tr.normB:hover { background-color: var(--helpit-hover) !important; }
    html[data-theme="dark"] [id$="btnFollowerModal"] { color: var(--helpit-text) !important; border-color: var(--helpit-border) !important; }
    html[data-theme="dark"] #tblFollowers thead tr { background-color: var(--helpit-raised) !important; }
    html[data-theme="dark"] #div1.norm { background-color: #493c21 !important; border-color: var(--helpit-border) !important; }
    html[data-theme="dark"] .axis :is(path, line) { stroke: var(--helpit-muted); }
    html[data-theme="dark"] .axis text { fill: var(--helpit-text); }
    html[data-theme="dark"] svg .node text { fill: var(--helpit-text); }
    html[data-theme="dark"] svg .link { stroke: var(--helpit-muted); }
    html[data-theme="dark"] :is(.k-grid, table.dataTable, .table) td.sla1 { background-color: #493c21; color: #ffe4a3; }
    html[data-theme="dark"] :is(.k-grid, table.dataTable, .table) td.sla2 { background-color: #492b35; color: #ffc3c3; }
    html[data-theme="dark"] :is(.k-grid, table.dataTable, .table) td.reminder { background-color: #213d52; color: #b3defa; }
    html[data-theme="dark"] svg .node text { fill: var(--helpit-text); }
    html[data-theme="dark"] svg .link { stroke: var(--helpit-muted); }
    html[data-theme="dark"] :is(.k-grid, table.dataTable, .table) td.sla1 { background-color: #493c21; color: #ffe4a3; }
    html[data-theme="dark"] :is(.k-grid, table.dataTable, .table) td.sla2 { background-color: #492b35; color: #ffc3c3; }
    html[data-theme="dark"] :is(.k-grid, table.dataTable, .table) td.reminder { background-color: #213d52; color: #b3defa; }

    /* Keep application chrome dark, including disabled and popup states. */
    html[data-theme="dark"] :is(.customer-information-heading, .customer-information-footer) { background-color: var(--helpit-raised) !important; color: var(--helpit-text); border-color: var(--helpit-border) !important; }
    /* Presentation only: do not rewrite the stored customer information HTML. */
    html[data-theme="dark"] .customer-information-body [style*="background-color"] { background-color: var(--helpit-raised) !important; }
    html[data-theme="dark"] .customer-information-body :is([style*="color: rgb(0, 0, 0)"], [style*="color:rgb(0,0,0)"], [style*="color: black" i], [style*="color:black" i], [style*="color: #000" i], [style*="color:#000" i], [color="black" i], [color="#000000" i]) { color: var(--helpit-text) !important; }
    html[data-theme="dark"] :is(.RadGrid .rgPagerCell, .RadDropDownTree .rddtInner, .RadDropDownTree .rddtDisabled, .RadDropDownTree .rddtPopup, .RadCalendar, .RadCalendarMonthView, .RadCalendarTimeView, .RadPicker .rcSelect, .RadPicker .rcCalPopup, .RadPicker .rcTimePopup, .k-content, .k-loading-color) {
        background-color: var(--helpit-surface) !important;
        color: var(--helpit-text) !important;
        border-color: var(--helpit-border) !important;
    }
    html[data-theme="dark"] :is(.RadCalendar .rcTitlebar, .RadCalendar .rcRow th, .RadCalendar .rcMainTable td, .RadCalendarMonthView td, .RadCalendarTimeView td) {
        background-color: var(--helpit-raised); color: var(--helpit-text); border-color: var(--helpit-border);
    }
    html[data-theme="dark"] :is(.RadCalendar, .RadCalendarMonthView, .RadCalendarTimeView) a { color: var(--helpit-link); }
    html[data-theme="dark"] :is(.RadPicker .RadInput, .RadCalendar .rcWeek th) { background-color: var(--helpit-raised) !important; color: var(--helpit-text) !important; border-color: var(--helpit-border); }
    html[data-theme="dark"] .RadCalendar .rcToday a { outline: 1px solid var(--helpit-link); }
    /* The title skin uses a light background image above the month label. */
    html[data-theme="dark"] .RadCalendar .rcTitlebar {
        background: var(--helpit-raised) !important;
        color: var(--helpit-text) !important;
    }
    html[data-theme="dark"] .RadCalendar .rcTitlebar .t-button { filter: brightness(0) invert(1); }
    /* Override the Telerik skin on the date links themselves, including its sprites. */
    html[data-theme="dark"] .RadCalendar .rcMainTable :is(td, td a, td span) {
        background-image: none !important;
        color: var(--helpit-text) !important;
    }
    html[data-theme="dark"] .RadCalendar .rcMainTable td a { background-color: transparent !important; }
    html[data-theme="dark"] .RadCalendar .rcMainTable .rcOtherMonth :is(a, span) { color: #aab8cc !important; }
    html[data-theme="dark"] .RadCalendar .rcMainTable :is(.rcHover, .rcSelected) a,
    html[data-theme="dark"] .RadCalendar .rcMainTable td a:is(:hover, :focus-visible) {
        background: #365b85 !important;
        color: #fff !important;
    }
    html[data-theme="dark"] .RadCalendar .rcMainTable .rcSelected a { font-weight: bold; }
    html[data-theme="dark"] .k-chart svg > g > path[fill="#fff"][stroke="none"] { fill: var(--helpit-surface); }
    html[data-theme="dark"] .k-chart svg text { fill: var(--helpit-text); }
    html[data-theme="dark"] .k-chart svg [stroke="#dfdfdf"] { stroke: var(--helpit-border); }

    /* Rich HTML/email and editor documents retain a white reading surface.
       Keep application chrome dark, including disabled and popup states. */
    html[data-theme="dark"] :is(.RadGrid .rgPagerCell, .RadDropDownTree .rddtInner, .RadDropDownTree .rddtDisabled, .RadDropDownTree .rddtPopup, .RadCalendar, .RadCalendarMonthView, .RadCalendarTimeView, .RadPicker .rcSelect, .RadPicker .rcCalPopup, .RadPicker .rcTimePopup, .k-content, .k-loading-color) {
        background-color: var(--helpit-surface) !important;
        color: var(--helpit-text) !important;
        border-color: var(--helpit-border) !important;
    }
    html[data-theme="dark"] :is(.RadCalendar .rcTitlebar, .RadCalendar .rcRow th, .RadCalendar .rcMainTable td, .RadCalendarMonthView td, .RadCalendarTimeView td) {
        background-color: var(--helpit-raised); color: var(--helpit-text); border-color: var(--helpit-border);
    }
    html[data-theme="dark"] :is(.RadCalendar, .RadCalendarMonthView, .RadCalendarTimeView) a { color: var(--helpit-link); }
    html[data-theme="dark"] .k-chart svg > g > path[fill="#fff"][stroke="none"] { fill: var(--helpit-surface); }
    html[data-theme="dark"] .k-chart svg text { fill: var(--helpit-text); }
    html[data-theme="dark"] .k-chart svg [stroke="#dfdfdf"] { stroke: var(--helpit-border); }

    /* Rich HTML/email and editor documents retain a white reading surface.
       Their author-supplied colors must not be rewritten or saved as theme colors. */
    html[data-theme="dark"] :is(.reContent, .reContentArea, .reContentCell, iframe) { color-scheme: light; background-color: #fff; color: #111; }
    /* Case content follows the theme; administrative editors remain light. */
    html[data-theme="dark"].helpit-case-page :is(.reContent, .reContentArea, .reContentCell, .RadEditor iframe),
    html[data-theme="dark"] :is(iframe.iframeTask, #divTaskDescr) { background: var(--helpit-surface); color: var(--helpit-text); color-scheme: dark; }
    html[data-theme="dark"] #divTaskDescr *:not(img):not(svg):not(path) { background-color: transparent !important; color: inherit !important; }
    html[data-theme="dark"] #divTaskDescr a[href],
    html[data-theme="dark"] #divTaskDescr a[href] *,
    html[data-theme="dark"].helpit-case-page [id$="_txtDescription"] a[href],
    html[data-theme="dark"].helpit-case-page [id$="_txtDescription"] a[href] * { color: var(--helpit-link) !important; }
    html[data-theme="dark"] #divTaskDescr.normInternal { color: var(--helpit-danger); }
    html[data-theme="dark"] #divTaskDescr.normSolution { color: var(--helpit-success); }
    html[data-theme="dark"] #divTaskDescr.normCustomerInternal { color: var(--helpit-link); }
    /* Telerik renders dropdown popups outside their parent control. */
    html[data-theme="dark"] :is(.rddtPopup, .rddtPopup .rddtFilter, .rddtPopup .rddtFilterInput, .rddtPopup .rtIn, .rddtPopup .rtLI, .RadDropDownTree .rddtInner, .RadDropDownList .rddlInner, .rddlPopup, .rddlPopup .rddlItem, .RadComboBoxDropDown .rcbItem, .RadComboBoxDropDown .rcbList) {
        background: var(--helpit-surface) !important; color: var(--helpit-text) !important; border-color: var(--helpit-border) !important;
    }
    html[data-theme="dark"] :is(.rddtPopup .rtHover .rtIn, .rddtPopup .rtSelected .rtIn, .rddlPopup .rddlItemHovered, .rddlPopup .rddlItemSelected, .RadComboBoxDropDown .rcbHovered, .RadComboBoxDropDown .rcbSelected) { background: var(--helpit-hover) !important; color: var(--helpit-text) !important; }
    /* Code editor syntax was authored for light mode. */
    html[data-theme="dark"] .CodeMirror { background: #fff; color: #111; color-scheme: light; }
    html[data-theme="dark"] .CodeMirror :is(pre, code, textarea) { background: transparent; color: #111; }
}
