/* XM 4 — dark appearance for shared components that ship their own light theme. Loaded on every xm-4 page; every rule
   is scoped to html[data-bs-theme="dark"], so light mode is untouched. The Workbench (lib/com/workbench/workbench.css)
   and the data explorer (lib/tag/xm/inc/dataexplorer/v29.1/main.css + _grid.cfm) carry their own generated dark maps;
   this file covers what they load from elsewhere: ParamQuery grid (bootstrap theme), pqSelect, the jQuery contextMenu,
   jQuery UI widgets, selectize, the query builder, tippy's light-border theme and jq-toast. */

/* ===================== ParamQuery grid (.pq-theme, themes/bootstrap/pqgrid.css + pqgrid.dev.css) ===================== */
html[data-bs-theme="dark"] div.pq-theme,
html[data-bs-theme="dark"] .pq-theme .ui-widget-content {color:var(--xm4-text); background:var(--xm4-surface); border-color:var(--xm4-line)!important;}
html[data-bs-theme="dark"] .pq-theme .ui-widget-header {background:var(--xm4-soft); background-image:none; color:var(--xm4-text); border-color:var(--xm4-line);}
html[data-bs-theme="dark"] .pq-theme .ui-state-default,
html[data-bs-theme="dark"] .pq-theme .ui-button,
html[data-bs-theme="dark"] .pq-theme button.ui-state-default:not(.ui-state-hover) {background:var(--xm4-soft); background-image:none; color:var(--xm4-text); border-color:var(--xm4-line);}
html[data-bs-theme="dark"] .pq-theme .ui-state-default a, html[data-bs-theme="dark"] .pq-theme .ui-button .ui-button-text {color:var(--xm4-text);}
html[data-bs-theme="dark"] .pq-theme .ui-state-hover,
html[data-bs-theme="dark"] .pq-theme .ui-state-focus,
html[data-bs-theme="dark"] .pq-theme .ui-button:hover {background:var(--xm4-line-2); color:var(--xm4-text); border-color:var(--xm4-faint);}
html[data-bs-theme="dark"] .pq-theme .ui-state-active:not(.ui-tabs-active) {background:var(--xm4-tint); color:var(--xm4-accent); border-color:var(--xm4-accent);}
html[data-bs-theme="dark"] .pq-theme .ui-state-active a {color:var(--xm4-accent);}
html[data-bs-theme="dark"] .pq-theme li.ui-tabs-active.ui-state-active.ui-state-default {border-bottom-color:var(--xm4-accent);}
html[data-bs-theme="dark"] .pq-theme .ui-icon {filter:invert(.85) hue-rotate(180deg);}
html[data-bs-theme="dark"] .pq-theme *:focus {outline-color:var(--xm4-accent);}
html[data-bs-theme="dark"] .pq-theme select,
html[data-bs-theme="dark"] .pq-theme input,
html[data-bs-theme="dark"] .pq-theme textarea {background:var(--xm4-surface); color:var(--xm4-text); border-color:var(--xm4-line);}
html[data-bs-theme="dark"] .pq-theme > .pq-grid-top,
html[data-bs-theme="dark"] .pq-grid-bottom,
html[data-bs-theme="dark"] .pq-grid-title,
html[data-bs-theme="dark"] .pq-group-header,
html[data-bs-theme="dark"] div.pq-toolbar,
html[data-bs-theme="dark"] div.pq-pager,
html[data-bs-theme="dark"] div.pq-grid-summary,
html[data-bs-theme="dark"] .pq-grid-center > .pq-summary-outer,
html[data-bs-theme="dark"] .pq-body-outer {color:var(--xm4-text); background:var(--xm4-surface); border-color:var(--xm4-line);}
html[data-bs-theme="dark"] .pq-header-outer,
html[data-bs-theme="dark"] .pq-header-outer .pq-cont-inner {background:var(--xm4-soft); background-image:none; border-bottom-color:var(--xm4-line);}
html[data-bs-theme="dark"] .pq-grid-col,
html[data-bs-theme="dark"] .pq-grid-number-col {color:var(--xm4-ink-2); border-color:var(--xm4-line);}
html[data-bs-theme="dark"] .pq-grid-col:hover {background:var(--xm4-line-2);}
html[data-bs-theme="dark"] .pq-col-sort-asc,
html[data-bs-theme="dark"] .pq-col-sort-desc {background:var(--xm4-line); color:var(--xm4-text); border-color:var(--xm4-faint);}
html[data-bs-theme="dark"] .pq-grid-row {background:var(--xm4-surface); color:var(--xm4-text); border-color:var(--xm4-line-2);}
html[data-bs-theme="dark"] .pq-grid-cell,
html[data-bs-theme="dark"] .pq-td-border-right > .pq-grid-row > .pq-grid-cell:not(.pq-focus),
html[data-bs-theme="dark"] .pq-td-border-top > .pq-grid-row > .pq-grid-cell:not(.pq-focus),
html[data-bs-theme="dark"] .pq-cont-inner > .pq-td-border-top > .pq-grid-row,
html[data-bs-theme="dark"] .pq-grid-row > .pq-grid-number-cell {border-color:var(--xm4-line-2);}
html[data-bs-theme="dark"] .pq-grid-row.pq-striped {background:color-mix(in srgb,var(--xm4-surface) 65%,var(--xm4-soft));}
html[data-bs-theme="dark"] .pq-grid-row-hover.ui-state-hover,
html[data-bs-theme="dark"] .pq-grid-cell-hover.ui-state-hover,
html[data-bs-theme="dark"] .pq-grid-row-hover.pq-striped,
html[data-bs-theme="dark"] .pq-striped > .pq-grid-cell-hover {background:var(--xm4-soft); color:var(--xm4-text);}
html[data-bs-theme="dark"] .pq-state-select.ui-state-highlight,
html[data-bs-theme="dark"] .pq-state-select.pq-striped,
html[data-bs-theme="dark"] .pq-theme .pq-state-highlight {background:var(--xm4-tint); color:var(--xm4-text); border-color:var(--xm4-line); background-image:none!important;}
/* The data explorer's inline <style> (_grid.cfm) sets .pq-state-select {background:#fff0c3!important}, which beat the rule
   above: checked rows showed light text on pale yellow. They keep the yellow meaning here as a dark amber. */
html[data-bs-theme="dark"] .pq-grid-row.pq-state-select {background:color-mix(in srgb,var(--xm4-warning) 20%,var(--xm4-surface))!important; color:var(--xm4-text);}
html[data-bs-theme="dark"] .pq-grid-row > .pq-grid-cell.pq-focus,
html[data-bs-theme="dark"] .pq-grid-row > .pq-grid-col.pq-focus {border-color:var(--xm4-accent);}
html[data-bs-theme="dark"] .pq-body-outer .pq-grid-number-cell,
html[data-bs-theme="dark"] .pq-summary-outer .pq-grid-number-cell,
html[data-bs-theme="dark"] .pq-loading-bg,
html[data-bs-theme="dark"] .pq-loading > .pq-loading-mask,
html[data-bs-theme="dark"] div.pq-loading-mask > div,
html[data-bs-theme="dark"] .pq-pivot-pane .pq-sortable,
html[data-bs-theme="dark"] .pq-bg-3 {background:var(--xm4-surface); color:var(--xm4-text); border-color:var(--xm4-line);}
html[data-bs-theme="dark"] .pq-cont-lt, html[data-bs-theme="dark"] .pq-cont-tr, html[data-bs-theme="dark"] .pq-body-outer .pq-cont-left,
html[data-bs-theme="dark"] .pqg-vert-frozen-line, html[data-bs-theme="dark"] .pqg-horiz-frozen-line,
html[data-bs-theme="dark"] .pq-group-item, html[data-bs-theme="dark"] .pq-group-item:hover,
html[data-bs-theme="dark"] .pq-border-0, html[data-bs-theme="dark"] .pq-border-1, html[data-bs-theme="dark"] .pq-border-2 {border-color:var(--xm4-line)!important;}
html[data-bs-theme="dark"] .pq-theme span.pq-separator {border-right-color:var(--xm4-surface); border-left-color:var(--xm4-line);}
html[data-bs-theme="dark"] .pq-bg-0, html[data-bs-theme="dark"] .pq-bg-1 {background-color:var(--xm4-faint);}
html[data-bs-theme="dark"] .pq-bg-2 {background-color:var(--xm4-line);}
html[data-bs-theme="dark"] .pq-grid-summary-table div {background:var(--xm4-soft);}
/* popups, menus, filter and tab strips from pqgrid.dev.css */
html[data-bs-theme="dark"] .pq-popup,
html[data-bs-theme="dark"] .pq-intel,
html[data-bs-theme="dark"] .pq-filter-menu,
html[data-bs-theme="dark"] .pq-cmenu-item,
html[data-bs-theme="dark"] .pq-tab-item:not(.pq-active) {background:var(--xm4-surface); color:var(--xm4-text); border-color:var(--xm4-line); box-shadow:var(--xm4-shadow-lg);}
html[data-bs-theme="dark"] .pq-cmenu-item:hover:not(.pq_disabled) {background:var(--xm4-tint); color:var(--xm4-accent);}
html[data-bs-theme="dark"] .pq-cmenu-item.pq_disabled, html[data-bs-theme="dark"] .pq-theme .pq-dnd-drag {color:var(--xm4-faint);}
html[data-bs-theme="dark"] .pq-editor-inner > .pq-cell-editor, html[data-bs-theme="dark"] div.pq-editor-inner > .pq-cell-editor {background:var(--xm4-surface); color:var(--xm4-text); border-color:var(--xm4-accent);}
html[data-bs-theme="dark"] .pq-select-menu, html[data-bs-theme="dark"] .pq-select-button, html[data-bs-theme="dark"] .pq-select-item {background:var(--xm4-surface); color:var(--xm4-text); border-color:var(--xm4-line);}
html[data-bs-theme="dark"] .pq-select-item.pq-select-item-hover, html[data-bs-theme="dark"] .pq-select-item:hover {background:var(--xm4-tint); color:var(--xm4-accent);}

/* ===================== jQuery contextMenu (grid right-click), jQuery UI menus and dialogs ===================== */
html[data-bs-theme="dark"] .context-menu-list {background:var(--xm4-surface); border-color:var(--xm4-line); box-shadow:var(--xm4-shadow-lg);}
html[data-bs-theme="dark"] .context-menu-item {background:transparent; color:var(--xm4-text);}
html[data-bs-theme="dark"] .context-menu-item.context-menu-hover {background:var(--xm4-tint); color:var(--xm4-accent);}
html[data-bs-theme="dark"] .context-menu-item.context-menu-disabled {color:var(--xm4-faint); background:transparent;}
html[data-bs-theme="dark"] .context-menu-separator {border-bottom-color:var(--xm4-line);}
html[data-bs-theme="dark"] .context-menu-submenu:after {border-left-color:var(--xm4-muted);}
html[data-bs-theme="dark"] .xm4 .ui-widget-content,
html[data-bs-theme="dark"] .xm4 .ui-menu,
html[data-bs-theme="dark"] .xm4 .ui-dialog,
html[data-bs-theme="dark"] .xm4 .ui-autocomplete,
html[data-bs-theme="dark"] .xm4 .ui-datepicker {background:var(--xm4-surface); color:var(--xm4-text); border-color:var(--xm4-line);}
html[data-bs-theme="dark"] .xm4 .ui-widget-header {background:var(--xm4-soft); background-image:none; color:var(--xm4-text); border-color:var(--xm4-line);}
html[data-bs-theme="dark"] .xm4 .ui-widget-content a, html[data-bs-theme="dark"] .xm4 .ui-widget-header a {color:var(--xm4-text);}
html[data-bs-theme="dark"] .xm4 .ui-state-default, html[data-bs-theme="dark"] .xm4 .ui-widget-content .ui-state-default, html[data-bs-theme="dark"] .xm4 .ui-widget-header .ui-state-default {background:var(--xm4-soft); background-image:none; color:var(--xm4-text); border-color:var(--xm4-line);}
html[data-bs-theme="dark"] .xm4 .ui-state-hover, html[data-bs-theme="dark"] .xm4 .ui-widget-content .ui-state-hover, html[data-bs-theme="dark"] .xm4 .ui-state-focus, html[data-bs-theme="dark"] .xm4 .ui-widget-content .ui-state-focus {background:var(--xm4-line-2); background-image:none; color:var(--xm4-text); border-color:var(--xm4-faint);}
html[data-bs-theme="dark"] .xm4 .ui-state-active, html[data-bs-theme="dark"] .xm4 .ui-widget-content .ui-state-active, html[data-bs-theme="dark"] .xm4 .ui-menu .ui-menu-item-wrapper.ui-state-active {background:var(--xm4-tint); background-image:none; color:var(--xm4-accent); border-color:var(--xm4-accent);}
html[data-bs-theme="dark"] .xm4 .ui-menu .ui-menu-item:not(:last-child) {border-bottom-color:var(--xm4-line-2);}
html[data-bs-theme="dark"] .xm4 .ui-widget-overlay {background:#07122799;}

/* ===================== selectize, query builder, tippy light-border, jq-toast ===================== */
html[data-bs-theme="dark"] .xm4 .selectize-input, html[data-bs-theme="dark"] .xm4 .selectize-control.single .selectize-input,
html[data-bs-theme="dark"] .xm4 .selectize-dropdown, html[data-bs-theme="dark"] .xm4 .selectize-dropdown.form-control {background:var(--xm4-surface); color:var(--xm4-text); border-color:var(--xm4-line); box-shadow:none;}
html[data-bs-theme="dark"] .xm4 .selectize-input input, html[data-bs-theme="dark"] .xm4 .selectize-input > div {color:var(--xm4-text); background:transparent;}
html[data-bs-theme="dark"] .xm4 .selectize-control.multi .selectize-input > div {background:var(--xm4-soft); border-color:var(--xm4-line); color:var(--xm4-text);}
html[data-bs-theme="dark"] .xm4 .selectize-dropdown .option.active, html[data-bs-theme="dark"] .xm4 .selectize-dropdown .active {background:var(--xm4-tint); color:var(--xm4-accent);}
html[data-bs-theme="dark"] .xm4 .selectize-dropdown .optgroup-header {background:var(--xm4-soft); color:var(--xm4-muted);}
html[data-bs-theme="dark"] .xm4 .query-builder .rules-group-container {background:var(--xm4-soft); border-color:var(--xm4-line);}
html[data-bs-theme="dark"] .xm4 .query-builder .rule-container, html[data-bs-theme="dark"] .xm4 .query-builder .rule-placeholder {background:var(--xm4-surface); border-color:var(--xm4-line); color:var(--xm4-text);}
html[data-bs-theme="dark"] .xm4 .query-builder .rules-list > ::before, html[data-bs-theme="dark"] .xm4 .query-builder .rules-list > ::after {border-color:var(--xm4-line);}
html[data-bs-theme="dark"] .tippy-box[data-theme~="light-border"] {background:var(--xm4-surface); color:var(--xm4-text); border-color:var(--xm4-line); box-shadow:var(--xm4-shadow-lg);}
html[data-bs-theme="dark"] .tippy-box[data-theme~="light-border"] > .tippy-backdrop {background:var(--xm4-surface);}
html[data-bs-theme="dark"] .tippy-box[data-theme~="light-border"] > .tippy-arrow::before, html[data-bs-theme="dark"] .tippy-box[data-theme~="light-border"] > .tippy-arrow::after {color:var(--xm4-surface); border-color:var(--xm4-surface);}
html[data-bs-theme="dark"] .tippy-box[data-theme~="light"] {background:var(--xm4-surface); color:var(--xm4-text); box-shadow:var(--xm4-shadow-lg);}
html[data-bs-theme="dark"] .tippy-box[data-theme~="light"] > .tippy-arrow::before {color:var(--xm4-surface);}
html[data-bs-theme="dark"] .xm4 .jq-toast-single {background:var(--xm4-soft); color:var(--xm4-text); border:1px solid var(--xm4-line);}
html[data-bs-theme="dark"] .xm4 .jq-toast-single a {color:var(--xm4-accent);}