/* ================================================================
   Qonda Reports — Dark Theme
   Complements the Qonda blue navbar (#2196f3) with a deep navy
   palette. Apply by adding class "theme-dark" to <body>.
   Does not modify w2ui-2.0.min.css — all rules are scoped under
   .theme-dark and override via specificity.
   ================================================================ */

/* ---- CSS custom properties --------------------------------- */
.theme-dark {
    --dk-bg:        #0f1117;   /* page / deepest background     */
    --dk-surface:   #1a1f2e;   /* panels, cards, grid body      */
    --dk-surface2:  #141824;   /* toolbar, sidebar, footer      */
    --dk-surface3:  #212840;   /* slightly lifted / active      */
    --dk-input:     #1e2438;   /* input / textarea backgrounds  */
    --dk-border:    #2d3550;   /* standard border               */
    --dk-border2:   #252d45;   /* subtle / row-divider border   */
    --dk-text:      #e2e8f0;   /* primary text                  */
    --dk-text2:     #94a3b8;   /* secondary / muted text        */
    --dk-text3:     #4a5568;   /* very muted / disabled text    */
    --dk-hover:     #1e2d50;   /* hover background              */
    --dk-sel-bg:    #1a3565;   /* selected-row background       */
    --dk-sel-text:  #bfdbfe;   /* selected-row text             */
    --dk-blue:      #2196f3;   /* Qonda blue accent (unchanged) */
    --dk-blue-dim:  #1565c0;   /* darker blue for borders       */
    --dk-blue-pale: #162848;   /* dark blue tint for row cells  */
}

/* ---- Base -------------------------------------------------- */
.theme-dark {
    color-scheme: dark;
}
.theme-dark body {
    background-color: var(--dk-bg);
    color: var(--dk-text);
}

/* ================================================================
   NAVBAR
   The blue navbar itself stays unchanged. Only the white dropdown
   panels need re-colouring for dark mode.
   ================================================================ */

.theme-dark .navbar-dropdown-content {
    background-color: var(--dk-surface);
    border-color: var(--dk-border);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5);
}

.theme-dark .navbar-dropdown-content a {
    color: var(--dk-text);
    background-color: var(--dk-surface);
}

.theme-dark .navbar-dropdown-content a:hover,
.theme-dark .navbar-dropdown-content a.active {
    background-color: var(--dk-hover);
    color: var(--dk-text);
}

.theme-dark .navbar-search {
    background-color: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.3);
    color: #fff;
}

.theme-dark .navbar-search::placeholder {
    color: rgba(255, 255, 255, 0.55);
}

/* ================================================================
   W2UI LAYOUT AND PANELS
   ================================================================ */

.theme-dark .w2ui-layout > div .w2ui-panel .w2ui-panel-content {
    background-color: var(--dk-surface);
    color: var(--dk-text);
}

.theme-dark .w2ui-layout > div .w2ui-panel .w2ui-panel-title {
    background-color: var(--dk-surface2);
    color: var(--dk-text) !important;
    border-color: var(--dk-border);
}

.theme-dark .w2ui-layout > div .w2ui-panel .w2ui-panel-tabs {
    background-color: var(--dk-surface);
}

.theme-dark .w2ui-layout > div .w2ui-panel .w2ui-panel-tabs > .w2ui-tab.active {
    background-color: var(--dk-surface);
}

.theme-dark .w2ui-layout > div .w2ui-panel .w2ui-panel-toolbar {
    background-color: var(--dk-surface2);
    border-bottom-color: var(--dk-border);
}

.theme-dark .w2ui-layout > div .w2ui-resizer.active,
.theme-dark .w2ui-layout > div .w2ui-resizer:hover {
    background-color: var(--dk-blue);
}

/* ================================================================
   W2UI TOOLBAR
   ================================================================ */

.theme-dark .w2ui-toolbar {
    background-color: var(--dk-surface2);
}

.theme-dark .w2ui-toolbar .w2ui-tb-line:nth-child(2),
.theme-dark .w2ui-toolbar .w2ui-tb-line:nth-child(3),
.theme-dark .w2ui-toolbar .w2ui-tb-line:nth-child(4) {
    border-top-color: var(--dk-border);
}

.theme-dark .w2ui-toolbar .w2ui-scroll-wrapper .w2ui-tb-button .w2ui-tb-icon > span {
    color: var(--dk-text2);
}

.theme-dark .w2ui-toolbar .w2ui-scroll-wrapper .w2ui-tb-button .w2ui-tb-text {
    color: var(--dk-text);
}

.theme-dark .w2ui-toolbar .w2ui-scroll-wrapper .w2ui-tb-button .w2ui-tb-text .w2ui-tb-down > span {
    border-top-color: var(--dk-text2);
}

.theme-dark .w2ui-toolbar .w2ui-scroll-wrapper .w2ui-tb-button.over {
    border-color: transparent;
    background-color: var(--dk-hover);
}

.theme-dark .w2ui-toolbar .w2ui-scroll-wrapper .w2ui-tb-button.over .w2ui-tb-text {
    color: var(--dk-text);
}

.theme-dark .w2ui-toolbar .w2ui-scroll-wrapper .w2ui-tb-button.checked {
    background-color: var(--dk-surface3);
    border-color: var(--dk-border);
}

.theme-dark .w2ui-toolbar .w2ui-scroll-wrapper .w2ui-tb-button.checked .w2ui-tb-text {
    color: var(--dk-text);
}

.theme-dark .w2ui-toolbar .w2ui-scroll-wrapper .w2ui-tb-button.down {
    background-color: var(--dk-surface2);
    border-color: var(--dk-border);
}

.theme-dark .w2ui-toolbar .w2ui-scroll-wrapper .w2ui-tb-break {
    background-image: linear-gradient(
        to bottom,
        transparent 0,
        var(--dk-border) 40%,
        var(--dk-border) 60%,
        transparent 100%
    );
}

/* ================================================================
   W2UI TABS
   ================================================================ */

.theme-dark .w2ui-tabs {
    background-color: var(--dk-surface);
}

.theme-dark .w2ui-tabs .w2ui-tabs-line {
    background-color: var(--dk-border);
}

.theme-dark .w2ui-tabs .w2ui-scroll-wrapper .w2ui-tab {
    color: var(--dk-text);
}

.theme-dark .w2ui-tabs .w2ui-scroll-wrapper .w2ui-tab:hover {
    background-color: var(--dk-hover);
}

.theme-dark .w2ui-tabs .w2ui-scroll-wrapper .w2ui-tab.active {
    color: var(--dk-blue);
    border-bottom-color: var(--dk-blue);
}

.theme-dark .w2ui-tabs .w2ui-scroll-wrapper .w2ui-tab.moving {
    background-color: var(--dk-surface2);
}

/* ================================================================
   W2UI GRID
   ================================================================ */

.theme-dark .w2ui-grid {
    border-color: var(--dk-border);
}

/* Header bar */
.theme-dark .w2ui-grid .w2ui-grid-header {
    background-color: var(--dk-surface2);
    color: var(--dk-text);
    border-bottom-color: var(--dk-border) !important;
}

/* Toolbar strip */
.theme-dark .w2ui-grid .w2ui-grid-toolbar {
    background-color: var(--dk-surface2);
    border-bottom-color: var(--dk-border);
    box-shadow: none;
}

.theme-dark .w2ui-grid .w2ui-grid-toolbar .w2ui-grid-search-input .w2ui-search-all {
    border-color: var(--dk-border) !important;
    color: var(--dk-text) !important;
    background-color: var(--dk-input) !important;
}

.theme-dark .w2ui-grid .w2ui-grid-toolbar .w2ui-grid-search-input .w2ui-search-all:focus {
    border-color: var(--dk-blue) !important;
    background-color: var(--dk-surface) !important;
}

.theme-dark .w2ui-grid .w2ui-grid-toolbar .w2ui-grid-search-input .w2ui-grid-search-name {
    background-color: var(--dk-surface);
    border-color: var(--dk-border);
    color: var(--dk-text);
}

.theme-dark .w2ui-grid .w2ui-grid-toolbar .w2ui-grid-searches {
    background-color: var(--dk-surface2);
    border-top-color: var(--dk-border);
    border-bottom-color: var(--dk-border);
}

/* Grid body area */
.theme-dark .w2ui-grid .w2ui-grid-body {
    background-color: var(--dk-surface);
}

/* Column header cells */
.theme-dark .w2ui-grid .w2ui-grid-body table .w2ui-head {
    color: var(--dk-text2);
    background-image: linear-gradient(var(--dk-surface2), var(--dk-surface3));
    border-right-color: var(--dk-border);
    border-bottom-color: var(--dk-border);
}

/* Column resizer shadow */
.theme-dark .w2ui-grid .w2ui-grid-body .w2ui-grid-columns,
.theme-dark .w2ui-grid .w2ui-grid-body .w2ui-grid-fcolumns {
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.5);
}

/* Data cells */
.theme-dark .w2ui-grid .w2ui-grid-body table td {
    border-right-color: var(--dk-border2);
}

.theme-dark .w2ui-grid-body .w2ui-grid-records table td,
.theme-dark .w2ui-grid-body .w2ui-grid-frecords table td {
    border-bottom-color: var(--dk-border2);
}

/* Odd rows */
.theme-dark .w2ui-grid .w2ui-grid-body .w2ui-grid-frecords table tr.w2ui-odd,
.theme-dark .w2ui-grid .w2ui-grid-body .w2ui-grid-records table tr.w2ui-odd {
    background-color: var(--dk-surface);
    border-bottom-color: var(--dk-border2);
}

.theme-dark .w2ui-grid .w2ui-grid-body .w2ui-grid-frecords table tr.w2ui-odd.w2ui-record-hover,
.theme-dark .w2ui-grid .w2ui-grid-body .w2ui-grid-frecords table tr.w2ui-odd:hover,
.theme-dark .w2ui-grid .w2ui-grid-body .w2ui-grid-records table tr.w2ui-odd.w2ui-record-hover,
.theme-dark .w2ui-grid .w2ui-grid-body .w2ui-grid-records table tr.w2ui-odd:hover {
    background-color: var(--dk-hover);
}

.theme-dark .w2ui-grid .w2ui-grid-body .w2ui-grid-frecords table tr.w2ui-odd.w2ui-empty-record:hover,
.theme-dark .w2ui-grid .w2ui-grid-body .w2ui-grid-records table tr.w2ui-odd.w2ui-empty-record:hover {
    background-color: var(--dk-surface);
}

/* Even rows */
.theme-dark .w2ui-grid .w2ui-grid-body .w2ui-grid-frecords table tr.w2ui-even,
.theme-dark .w2ui-grid .w2ui-grid-body .w2ui-grid-records table tr.w2ui-even {
    background-color: var(--dk-surface2);
    border-bottom-color: var(--dk-border2);
}

.theme-dark .w2ui-grid .w2ui-grid-body .w2ui-grid-frecords table tr.w2ui-even.w2ui-record-hover,
.theme-dark .w2ui-grid .w2ui-grid-body .w2ui-grid-frecords table tr.w2ui-even:hover,
.theme-dark .w2ui-grid .w2ui-grid-body .w2ui-grid-records table tr.w2ui-even.w2ui-record-hover,
.theme-dark .w2ui-grid .w2ui-grid-body .w2ui-grid-records table tr.w2ui-even:hover {
    background-color: var(--dk-hover);
}

.theme-dark .w2ui-grid .w2ui-grid-body .w2ui-grid-frecords table tr.w2ui-even.w2ui-empty-record:hover,
.theme-dark .w2ui-grid .w2ui-grid-body .w2ui-grid-records table tr.w2ui-even.w2ui-empty-record:hover {
    background-color: var(--dk-surface2);
}

/* Selected rows */
.theme-dark .w2ui-grid .w2ui-grid-body .w2ui-grid-frecords table tr td.w2ui-selected,
.theme-dark .w2ui-grid .w2ui-grid-body .w2ui-grid-frecords table tr.w2ui-selected,
.theme-dark .w2ui-grid .w2ui-grid-body .w2ui-grid-records table tr td.w2ui-selected,
.theme-dark .w2ui-grid .w2ui-grid-body .w2ui-grid-records table tr.w2ui-selected {
    color: var(--dk-sel-text) !important;
    background-color: var(--dk-sel-bg) !important;
    border-bottom-color: transparent;
}

.theme-dark .w2ui-grid-body .w2ui-grid-records table tr td.w2ui-selected,
.theme-dark .w2ui-grid-body .w2ui-grid-frecords table tr td.w2ui-selected {
    background-color: var(--dk-blue-pale) !important;
}

/* Inactive rows */
.theme-dark .w2ui-grid .w2ui-grid-body .w2ui-grid-frecords table tr td.w2ui-inactive,
.theme-dark .w2ui-grid .w2ui-grid-body .w2ui-grid-frecords table tr.w2ui-inactive,
.theme-dark .w2ui-grid .w2ui-grid-body .w2ui-grid-records table tr td.w2ui-inactive,
.theme-dark .w2ui-grid .w2ui-grid-body .w2ui-grid-records table tr.w2ui-inactive {
    background-color: var(--dk-surface3) !important;
}

/* Row / col number gutter */
.theme-dark .w2ui-grid .w2ui-grid-body table .w2ui-col-number {
    color: var(--dk-text3);
    background-color: rgba(20, 24, 36, 0.6);
}

/* Col/row highlight on click-drag selection */
.theme-dark .w2ui-grid .w2ui-grid-body table .w2ui-col-selected {
    background-color: var(--dk-surface3) !important;
}

.theme-dark .w2ui-grid .w2ui-grid-body table .w2ui-row-selected {
    background-color: var(--dk-surface3) !important;
}

/* Scroll corner */
.theme-dark .w2ui-grid .w2ui-grid-body .w2ui-grid-scroll1 {
    background-color: var(--dk-surface2);
    border-top-color: var(--dk-border);
    border-right-color: var(--dk-border);
}

/* Footer */
.theme-dark .w2ui-grid .w2ui-grid-footer {
    background-color: var(--dk-surface2);
    color: var(--dk-text2);
    border-top-color: var(--dk-border);
    box-shadow: none;
}

.theme-dark .w2ui-grid .w2ui-grid-footer .w2ui-footer-center .w2ui-footer-nav a.w2ui-footer-btn:hover {
    background-color: var(--dk-hover);
    color: var(--dk-text);
}

/* Summary rows */
.theme-dark .w2ui-grid .w2ui-grid-summary {
    border-top-color: var(--dk-border);
    box-shadow: none;
}

.theme-dark .w2ui-grid .w2ui-grid-summary table .w2ui-odd {
    background-color: var(--dk-surface);
}

.theme-dark .w2ui-grid .w2ui-grid-summary table .w2ui-even {
    background-color: var(--dk-surface2);
}

/* Empty message */
.theme-dark .w2ui-grid .w2ui-grid-empty-msg {
    background-color: rgba(15, 17, 23, 0.7);
}

.theme-dark .w2ui-grid .w2ui-grid-empty-msg > div {
    color: var(--dk-text2);
}

/* Inline edit box */
.theme-dark .w2ui-grid .w2ui-edit-box {
    border-color: var(--dk-blue);
    background-color: var(--dk-input);
}

.theme-dark .w2ui-grid .w2ui-editable div.w2ui-input {
    background-color: var(--dk-input);
    color: var(--dk-text);
}

/* Advanced search panel */
.theme-dark .w2ui-grid-search-advanced {
    background-color: var(--dk-surface);
    border-color: var(--dk-border);
    box-shadow: 0 3px 14px 1px rgba(0, 0, 0, 0.5);
    color: var(--dk-text);
    text-shadow: none;
    color-scheme: dark;
}

.theme-dark .w2ui-grid-search-advanced .search-title {
    color: var(--dk-text);
}

.theme-dark .w2ui-grid-search-advanced table {
    color: var(--dk-text2);
}

.theme-dark .w2ui-grid-search-advanced td.caption {
    color: var(--dk-text2);
}

.theme-dark .w2ui-grid-search-advanced input,
.theme-dark .w2ui-grid-search-advanced select {
    background-color: var(--dk-input) !important;
    border-color: var(--dk-border) !important;
    color: var(--dk-text) !important;
}

.theme-dark .w2ui-grid-search-advanced input:focus,
.theme-dark .w2ui-grid-search-advanced select:focus {
    background-color: var(--dk-surface) !important;
}

.theme-dark .w2ui-grid-search-advanced td.actions {
    background-color: var(--dk-surface2) !important;
    border-top-color: var(--dk-border);
}

.theme-dark .w2ui-grid-search-advanced .w2ui-field-helper.w2ui-list {
    background-color: var(--dk-input) !important;
    border-color: var(--dk-border) !important;
    color: var(--dk-text) !important;
}

/* Mirror w2ui's high-specificity selectors to guarantee override */
.theme-dark .w2ui-overlay .w2ui-grid-search-advanced table td.operator select {
    background-color: var(--dk-input) !important;
    border-color: var(--dk-border) !important;
    color: var(--dk-text) !important;
}
.theme-dark .w2ui-overlay .w2ui-grid-search-advanced table td.value input[type=text] {
    background-color: var(--dk-input) !important;
    border-color: var(--dk-border) !important;
    color: var(--dk-text) !important;
}
.theme-dark .w2ui-overlay .w2ui-grid-search-advanced table td.value .w2ui-field-helper.w2ui-list {
    background-color: var(--dk-input) !important;
    border-color: var(--dk-border) !important;
    color: var(--dk-text) !important;
}

.theme-dark .w2ui-grid-search-suggest {
    background-color: var(--dk-surface);
    border-bottom-color: var(--dk-border);
    color: var(--dk-text);
}

/* ================================================================
   W2UI SIDEBAR
   ================================================================ */

.theme-dark .w2ui-sidebar {
    background-color: var(--dk-surface2);
}

.theme-dark .w2ui-sidebar .w2ui-sidebar-top .w2ui-flat-left,
.theme-dark .w2ui-sidebar .w2ui-sidebar-top .w2ui-flat-right {
    background-color: var(--dk-surface2);
}

.theme-dark .w2ui-sidebar .w2ui-sidebar-top .w2ui-flat-left:hover,
.theme-dark .w2ui-sidebar .w2ui-sidebar-top .w2ui-flat-right:hover {
    background-color: var(--dk-hover);
}

.theme-dark .w2ui-sidebar .w2ui-sidebar-body .w2ui-node .w2ui-node-text {
    color: var(--dk-text);
    text-shadow: none;
}

.theme-dark .w2ui-sidebar .w2ui-sidebar-body .w2ui-node .w2ui-node-image > span {
    color: var(--dk-text2);
}

.theme-dark .w2ui-sidebar .w2ui-sidebar-body .w2ui-node:hover {
    background-color: var(--dk-hover);
}

/* Selected node */
.theme-dark .w2ui-sidebar .w2ui-sidebar-body .w2ui-selected,
.theme-dark .w2ui-sidebar .w2ui-sidebar-body .w2ui-selected:hover {
    background-color: var(--dk-sel-bg);
    border-color: var(--dk-blue-dim);
}

.theme-dark .w2ui-sidebar .w2ui-sidebar-body .w2ui-selected .w2ui-node-text,
.theme-dark .w2ui-sidebar .w2ui-sidebar-body .w2ui-selected .w2ui-node-image > span,
.theme-dark .w2ui-sidebar .w2ui-sidebar-body .w2ui-selected:hover .w2ui-node-text,
.theme-dark .w2ui-sidebar .w2ui-sidebar-body .w2ui-selected:hover .w2ui-node-image > span {
    color: var(--dk-sel-text);
    text-shadow: none;
}

/* Group headers */
.theme-dark .w2ui-sidebar .w2ui-sidebar-body .w2ui-node-group {
    color: var(--dk-blue);
}

/* Badge count */
.theme-dark .w2ui-sidebar .w2ui-sidebar-body .w2ui-node-data .w2ui-node-count {
    background-color: var(--dk-surface3);
    border-color: var(--dk-border);
    color: var(--dk-text2);
    box-shadow: none;
    text-shadow: none;
}

.theme-dark .w2ui-sidebar .w2ui-sidebar-body .w2ui-node-data .w2ui-node-image > span {
    color: var(--dk-text2);
    text-shadow: none;
}

.theme-dark .w2ui-sidebar .w2ui-sidebar-body .w2ui-node-flat .w2ui-node-image > span {
    color: var(--dk-text2);
    text-shadow: none;
}

/* Disabled node */
.theme-dark .w2ui-sidebar .w2ui-sidebar-body .w2ui-node.w2ui-disabled .w2ui-node-text,
.theme-dark .w2ui-sidebar .w2ui-sidebar-body .w2ui-node.w2ui-disabled .w2ui-node-image > span {
    color: var(--dk-text3);
    text-shadow: none;
}

/* ================================================================
   W2UI FORM
   ================================================================ */

.theme-dark .w2ui-form {
    background-color: var(--dk-surface);
    border-color: var(--dk-border);
    color: var(--dk-text);
}

.theme-dark .w2ui-form .w2ui-form-header {
    background-color: var(--dk-surface2);
    color: var(--dk-text);
    border-bottom-color: var(--dk-border);
}

.theme-dark .w2ui-form .w2ui-form-toolbar {
    border-bottom-color: var(--dk-border);
}

.theme-dark .w2ui-form .w2ui-form-tabs {
    background-color: var(--dk-surface);
}

.theme-dark .w2ui-form .w2ui-form-tabs .w2ui-tab.active {
    background-color: var(--dk-surface);
}

.theme-dark .w2ui-form .w2ui-page {
    background-color: var(--dk-surface);
    color: var(--dk-text);
}

.theme-dark .w2ui-form .w2ui-buttons {
    background-color: var(--dk-surface2);
    border-top-color: var(--dk-border);
}

/* ================================================================
   W2UI POPUP
   ================================================================ */

.theme-dark .w2ui-popup {
    background-color: var(--dk-surface);
    border-color: var(--dk-border);
    box-shadow: 0 0 30px rgba(0, 0, 0, 0.7);
}

.theme-dark .w2ui-popup .w2ui-popup-title {
    background-color: var(--dk-surface2);
    color: var(--dk-text);
    border-bottom-color: var(--dk-border);
}

.theme-dark .w2ui-popup .w2ui-popup-title-btns .w2ui-popup-button {
    color: var(--dk-text2);
}

.theme-dark .w2ui-popup .w2ui-popup-title-btns .w2ui-popup-button.w2ui-popup-close:hover,
.theme-dark .w2ui-popup .w2ui-popup-title-btns .w2ui-popup-button.w2ui-popup-max:hover {
    color: var(--dk-text);
}

.theme-dark .w2ui-popup .w2ui-popup-body {
    background-color: var(--dk-surface);
    color: var(--dk-text);
}

.theme-dark .w2ui-popup .w2ui-popup-buttons {
    background-color: var(--dk-surface2);
    border-top-color: var(--dk-border);
}

/* Inline message (w2confirm, w2alert etc.) */
.theme-dark .w2ui-message {
    background-color: var(--dk-surface);
    border-color: var(--dk-border);
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.5);
}

.theme-dark .w2ui-message .w2ui-message-buttons {
    background-color: var(--dk-surface2);
    border-top-color: var(--dk-border);
}

/* ================================================================
   W2UI MENU / OVERLAY
   ================================================================ */

.theme-dark .w2ui-overlay .w2ui-overlay-body {
    background-color: var(--dk-surface);
    border-color: var(--dk-border);
}

.theme-dark .w2ui-overlay .w2ui-overlay-body.w2ui-white {
    color: var(--dk-text);
    background-color: var(--dk-surface);
    border-color: var(--dk-border);
    box-shadow: none;
}

.theme-dark .w2ui-menu {
    color: var(--dk-text);
}

.theme-dark .w2ui-menu-search,
.theme-dark .w2ui-menu-top {
    background-color: var(--dk-surface2);
    border-bottom-color: var(--dk-border);
}

.theme-dark .w2ui-menu .w2ui-menu-item.w2ui-even {
    color: inherit;
    background-color: var(--dk-surface);
}

.theme-dark .w2ui-menu .w2ui-menu-item.w2ui-odd {
    color: inherit;
    background-color: var(--dk-surface2);
}

.theme-dark .w2ui-menu .w2ui-menu-item:hover {
    background-color: var(--dk-hover);
}

.theme-dark .w2ui-menu .w2ui-menu-item.w2ui-selected {
    background-color: var(--dk-sel-bg);
}

.theme-dark .w2ui-menu .w2ui-menu-item .menu-icon span {
    color: var(--dk-text2);
}

.theme-dark .w2ui-menu .w2ui-menu-divider.has-text {
    background-color: var(--dk-surface2);
    border-top-color: var(--dk-border2);
    border-bottom-color: var(--dk-border2);
}

.theme-dark .w2ui-menu .w2ui-menu-divider.has-text .text {
    background-color: var(--dk-surface2);
    color: var(--dk-text3);
}

.theme-dark .w2ui-menu .w2ui-no-items {
    color: var(--dk-text3);
}

.theme-dark .w2ui-menu .w2ui-sub-menu-box {
    background-color: var(--dk-surface2);
    border-top-color: var(--dk-border);
    border-bottom-color: var(--dk-border);
}

/* ================================================================
   W2UI INPUTS AND FORM FIELDS
   ================================================================ */

.theme-dark .w2ui-reset input:not([type=button]):not([type=submit]):not([type=checkbox]):not([type=radio]),
.theme-dark .w2ui-reset select,
.theme-dark .w2ui-reset textarea {
    background-color: var(--dk-input);
    border-color: var(--dk-border);
    color: var(--dk-text);
}

.theme-dark .w2ui-select {
    color: var(--dk-text) !important;
    background-color: var(--dk-input) !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%2394a3b8'/%3E%3C/svg%3E") !important;
    background-size: 10px 6px !important;
    background-position: right 7px center !important;
    background-repeat: no-repeat !important;
}

.theme-dark select.w2ui-input {
    background-color: var(--dk-input) !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%2394a3b8'/%3E%3C/svg%3E") !important;
    background-size: 10px 6px !important;
    background-position: right 7px center !important;
    background-repeat: no-repeat !important;
    border-color: var(--dk-border) !important;
    color: var(--dk-text) !important;
}

.theme-dark .w2ui-reset input:not([type=button]):not([type=submit]):not([type=checkbox]):not([type=radio]):focus,
.theme-dark .w2ui-reset select:focus,
.theme-dark .w2ui-reset textarea:focus {
    background-color: var(--dk-surface);
}

.theme-dark .w2ui-field > label {
    color: var(--dk-text2) !important;
}

.theme-dark .w2ui-input,
.theme-dark textarea.w2ui-input {
    background-color: var(--dk-input);
    border-color: var(--dk-border);
    color: var(--dk-text) !important;
}

.theme-dark .w2ui-input:focus,
.theme-dark textarea.w2ui-input:focus {
    background-color: var(--dk-surface) !important;
    color: var(--dk-text) !important;
}

.theme-dark .w2ui-disabled,
.theme-dark .w2ui-readonly {
    background-color: var(--dk-surface2);
    color: var(--dk-text2) !important;
}

.theme-dark .w2ui-input:disabled,
.theme-dark .w2ui-input[disabled],
.theme-dark .w2ui-input[readonly] {
    background-color: var(--dk-surface2) !important;
    color: #b0bfcf !important;
    opacity: 1;
}

.theme-dark .w2ui-field.w2ui-disabled input:not([type=button]):not([type=submit]):not([type=checkbox]):not([type=radio]),
.theme-dark .w2ui-field.w2ui-disabled select,
.theme-dark .w2ui-field.w2ui-disabled textarea,
.theme-dark .w2ui-field.w2ui-readonly input:not([type=button]):not([type=submit]):not([type=checkbox]):not([type=radio]),
.theme-dark .w2ui-field.w2ui-readonly select,
.theme-dark .w2ui-field.w2ui-readonly textarea {
    background-color: var(--dk-surface2) !important;
    border-color: var(--dk-border) !important;
    color: #b0bfcf !important;
    opacity: 1;
}

.theme-dark .w2ui-field-helper {
    color: var(--dk-text2);
}

/* Resting (unfocused) state - without this, list/file helpers keep w2ui's default
   white background until focused (first noticed on the Thumbnail Studio file fields). */
.theme-dark .w2ui-field-helper.w2ui-list {
    background-color: var(--dk-input) !important;
    border-color: var(--dk-border) !important;
    color: var(--dk-text) !important;
}

.theme-dark .w2ui-field-helper.w2ui-list input {
    background: transparent !important;
    color: var(--dk-text) !important;
}

.theme-dark .w2ui-field-helper.w2ui-list.has-focus,
.theme-dark .w2ui-field-helper.w2ui-list:focus-within {
    background-color: var(--dk-surface) !important;
    color: var(--dk-text) !important;
}

.theme-dark .w2ui-select.has-focus {
    background-color: var(--dk-surface) !important;
    color: var(--dk-text) !important;
}

/* ================================================================
   W2UI BUTTONS
   ================================================================ */

.theme-dark .w2ui-btn,
.theme-dark input[type=button].w2ui-btn {
    background-image: linear-gradient(var(--dk-surface2) 0, var(--dk-surface2) 100%);
    border-color: var(--dk-border);
    color: var(--dk-text2);
    box-shadow: none;
}

.theme-dark .w2ui-btn:hover,
.theme-dark input[type=button].w2ui-btn:hover {
    background-image: linear-gradient(var(--dk-hover) 0, var(--dk-hover) 100%);
    color: var(--dk-text);
}

.theme-dark .w2ui-btn:disabled,
.theme-dark input[type=button].w2ui-btn:disabled {
    background: var(--dk-surface2);
    border-color: var(--dk-border2);
    color: var(--dk-text3);
}

/* ================================================================
   W2UI LOCK / SPINNER
   ================================================================ */

.theme-dark .w2ui-lock {
    background-color: #000;
    opacity: 0.45;
}

.theme-dark .w2ui-lock-msg {
    background-color: var(--dk-surface2);
    border-color: var(--dk-border);
    color: var(--dk-text);
}

/* ================================================================
   SIMPLE TREE (tree.css)
   ================================================================ */

.theme-dark .simple-tree summary {
    background-color: var(--dk-surface);
}

.theme-dark .simple-tree details::before,
.theme-dark .simple-tree details > :not(summary)::before {
    background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 2 2" xmlns="http://www.w3.org/2000/svg"><g><rect x="0" y="0" width="1" height="1" fill="%232d3550"/></g></svg>');
}

.theme-dark .select-tree .selected {
    background-color: var(--dk-sel-bg);
    border-color: var(--dk-blue-dim);
}

/* ================================================================
   DIAGRAM MODAL BUTTONS
   ================================================================ */

.theme-dark .diag-btn {
    background: var(--dk-surface);
    border-color: var(--dk-border);
    color: var(--dk-text);
}

.theme-dark .diag-btn:hover {
    background: var(--dk-surface3);
    border-color: var(--dk-border);
}

/* ================================================================
   LOADING SPINNER
   ================================================================ */

.theme-dark .lds-ellipsis div {
    background: #475569cc;
}

/* ================================================================
   W2UI FORM GROUP SECTIONS (system settings page)
   ================================================================ */

.theme-dark .w2ui-group-fields {
    background-color: var(--dk-surface);
    border-top-color: var(--dk-border);
    border-bottom-color: var(--dk-border);
}

.theme-dark .w2ui-group-title {
    color: var(--dk-text2);
    text-shadow: none;
}

/* ================================================================
   PIVOT TABLE
   ================================================================ */

.theme-dark .w2ui-pivot {
    background: var(--dk-surface);
    border-color: var(--dk-border);
    color: var(--dk-text);
}

.theme-dark .pvt-panel {
    background: var(--dk-surface2);
    border-right-color: var(--dk-border);
}

.theme-dark .pvt-toolbar {
    background: var(--dk-surface2);
    border-bottom-color: var(--dk-border);
}

.theme-dark .pvt-sel-label {
    color: var(--dk-text3);
}

.theme-dark .pvt-select {
    background-color: var(--dk-input);
    border-color: var(--dk-border);
    color: var(--dk-text);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%2394a3b8'/%3E%3C/svg%3E");
}

.theme-dark .pvt-select:hover {
    border-color: var(--dk-border);
}

.theme-dark .pvt-select:focus {
    border-color: var(--dk-blue);
    box-shadow: 0 0 0 2px rgba(33, 150, 243, 0.2);
}

.theme-dark .pvt-zone {
    background: var(--dk-surface);
    border-color: var(--dk-border);
}

.theme-dark .pvt-zone-hdr {
    background: var(--dk-surface2);
    border-bottom-color: var(--dk-border);
    color: var(--dk-text3);
}

.theme-dark .pvt-pills.pvt-pills-over {
    background: var(--dk-blue-pale);
    border-color: var(--dk-blue-dim);
}

.theme-dark .pvt-pill {
    background: var(--dk-surface2);
    border-color: var(--dk-border);
    box-shadow: none;
}

.theme-dark .pvt-pill:hover {
    border-color: var(--dk-blue);
    box-shadow: 0 1px 4px rgba(33, 150, 243, 0.2);
}

/* ================================================================
   DASHBOARD
   ================================================================ */

.theme-dark .dash-kpi {
    background: var(--dk-surface);
    border-color: var(--dk-border);
}

.theme-dark .dash-kpi:hover {
    background: var(--dk-surface3);
}

.theme-dark .dash-chart-box {
    background: var(--dk-surface);
    border-color: var(--dk-border);
}

.theme-dark .pvt-pill.pvt-pill-filtered {
    border-color: #f3a021;
    background: rgba(243, 160, 33, 0.1);
}

.theme-dark .pvt-pill-name {
    color: var(--dk-text);
}

.theme-dark .pvt-pill-btn {
    color: var(--dk-text3);
}

.theme-dark .pvt-pill-btn:hover {
    color: var(--dk-text);
    background: rgba(255, 255, 255, 0.06);
}

.theme-dark .pvt-pill-remove-btn {
    border-left-color: var(--dk-border);
}

.theme-dark .pvt-pill-remove-btn:hover {
    color: #f87171;
    background: rgba(248, 113, 113, 0.1);
}

.theme-dark .pvt-output {
    background: var(--dk-surface);
}

/* Pivot table cells */
.theme-dark .pvt-table {
    color: var(--dk-text);
}

.theme-dark .pvt-table th {
    background: linear-gradient(to bottom, var(--dk-surface2), var(--dk-surface3));
    border-color: var(--dk-border);
}

.theme-dark .pvt-th-row-dim,
.theme-dark .pvt-th-col-group {
    background: linear-gradient(to bottom, var(--dk-surface2), var(--dk-surface3));
    color: var(--dk-text2);
}

.theme-dark .pvt-th-col {
    color: var(--dk-text);
}

.theme-dark .pvt-th-total {
    background: linear-gradient(to bottom, var(--dk-surface3), var(--dk-hover));
    color: var(--dk-text);
}

.theme-dark .pvt-table td {
    border-color: var(--dk-border2);
}

.theme-dark .pvt-td-row-dim {
    background: var(--dk-surface2);
    border-color: var(--dk-border);
    color: var(--dk-text);
}

.theme-dark .pvt-td-val {
    color: var(--dk-text);
}

.theme-dark .pvt-td-row-total {
    background: var(--dk-surface3);
    border-color: var(--dk-border);
    color: var(--dk-text);
}

.theme-dark .pvt-row-total td {
    background: var(--dk-surface3);
    border-color: var(--dk-border);
    border-top-color: var(--dk-border);
}

.theme-dark .pvt-td-total-label {
    color: var(--dk-text2);
}

.theme-dark .pvt-td-col-total {
    color: var(--dk-text);
}

.theme-dark .pvt-td-grand-total {
    background: var(--dk-hover) !important;
    color: var(--dk-text);
}

.theme-dark .pvt-row-odd .pvt-td-val {
    background: var(--dk-surface);
}

.theme-dark .pvt-row-even .pvt-td-val {
    background: var(--dk-surface2);
}

.theme-dark .pvt-table tbody tr:hover td {
    background: var(--dk-hover) !important;
}

.theme-dark .pvt-row-total:hover td {
    background: var(--dk-surface3) !important;
}

/* Filter menu */
.theme-dark .pvt-filter-menu {
    background: var(--dk-surface);
    border-color: var(--dk-border);
    color: var(--dk-text);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);
}

.theme-dark .pvt-filter-menu-hdr {
    background: var(--dk-surface2);
    border-bottom-color: var(--dk-border);
    color: var(--dk-text2);
}

.theme-dark .pvt-filter-menu-actions {
    border-bottom-color: var(--dk-border2);
}

.theme-dark .pvt-filter-item:hover {
    background: var(--dk-hover);
}

.theme-dark .pvt-filter-menu-footer {
    border-top-color: var(--dk-border);
    background: var(--dk-surface2);
}

.theme-dark .pvt-error {
    background: rgba(248, 113, 113, 0.08);
    border-color: rgba(248, 113, 113, 0.3);
    color: #f87171;
}

/* ================================================================
   SCROLLBARS (Chromium-based browsers)
   ================================================================ */

.theme-dark ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.theme-dark ::-webkit-scrollbar-track {
    background: var(--dk-surface2);
}

.theme-dark ::-webkit-scrollbar-thumb {
    background: var(--dk-border);
    border-radius: 4px;
}

.theme-dark ::-webkit-scrollbar-thumb:hover {
    background: var(--dk-blue-dim);
}

/* ================================================================
   MOVED FROM theme.css
   ================================================================ */

.theme-dark {
    color: #fff;
    background-color: #040520;
}

.theme-dark.navbar {
    color: #fff;
}

.theme-dark.navbar-menu.navbar-link {
    &:hover { color: #2196f3; }
}