.theme-toggle { display: inline-flex; align-items: center; gap: 4px; margin: 0; font: inherit; white-space: nowrap; cursor: pointer; }
.theme-toggle input { margin: 0; vertical-align: middle; }
#etn-group { flex-wrap: wrap; }
#etn-group label { flex-basis: 100%; }
#etn-group input { min-width: 4.5rem; text-align: center; }

[data-bs-theme="dark"] { --wl-bg: #181c21; --wl-panel: #222830; --wl-raised: #2c3540; --wl-border: #485565; --wl-text: #e2e7ed; --wl-link: #92c5ff; }
[data-bs-theme="dark"] body { background-color: var(--wl-bg); color: var(--wl-text); }
[data-bs-theme="dark"] a:not(.btn) { color: var(--wl-link); }
[data-bs-theme="dark"] a:not(.btn):visited { color: #c4b5fd; }
[data-bs-theme="dark"] .bg-light,
[data-bs-theme="dark"] .afos-pre,
[data-bs-theme="dark"] .afos-block,
[data-bs-theme="dark"] .afos-toolbar,
[data-bs-theme="dark"] .ol-popup,
[data-bs-theme="dark"] .ol-popup-closer { background: var(--wl-panel) !important; color: var(--wl-text); border-color: var(--wl-border) !important; }
[data-bs-theme="dark"] .ol-popup:after { border-top-color: var(--wl-panel); }
[data-bs-theme="dark"] .btn-outline-secondary { color: #c2cbd5; }
[data-bs-theme="dark"] .brand-legend { color: var(--wl-link); }
[data-bs-theme="dark"] .afos-bulk-heading { color: var(--wl-text); border-color: var(--wl-border); }
[data-bs-theme="dark"] #bulk-help { background: var(--wl-bg); }
[data-bs-theme="dark"] .card-header-tabs .nav-link.active { background: var(--wl-panel); color: var(--wl-text); border-color: var(--wl-border); }
[data-bs-theme="dark"] .ts-wrapper .ts-control,
[data-bs-theme="dark"] .ts-dropdown,
[data-bs-theme="dark"] .ts-dropdown .active { background: var(--wl-panel); color: var(--wl-text); border-color: var(--wl-border); }
[data-bs-theme="dark"] .ts-control input { color: var(--wl-text); }
[data-bs-theme="dark"] .ts-wrapper.single .ts-control:after { border-top-color: #c2cbd5; }
[data-bs-theme="dark"] .ts-dropdown .active { background: var(--wl-raised); }

/* Preserve the original Ext JS layout and icons; change its light surfaces. */
[data-bs-theme="dark"] #wlbot-header,
[data-bs-theme="dark"] .x-panel-body,
[data-bs-theme="dark"] .x-layout-collapsed,
[data-bs-theme="dark"] .x-window-mc,
[data-bs-theme="dark"] .x-grid3,
[data-bs-theme="dark"] .x-grid3-row,
[data-bs-theme="dark"] .x-tab-panel-body,
[data-bs-theme="dark"] .x-form-field,
[data-bs-theme="dark"] .x-combo-list { background: var(--wl-bg); color: var(--wl-text); border-color: var(--wl-border); }
[data-bs-theme="dark"] .x-panel-header,
[data-bs-theme="dark"] .x-panel-tbar,
[data-bs-theme="dark"] .x-panel-bbar,
[data-bs-theme="dark"] .x-toolbar,
[data-bs-theme="dark"] .x-tab-panel-header,
[data-bs-theme="dark"] .x-tab-strip-spacer,
[data-bs-theme="dark"] .x-grid3-header,
[data-bs-theme="dark"] .x-grid3-hd-row td,
[data-bs-theme="dark"] .x-window-tl,
[data-bs-theme="dark"] .x-window-tr,
[data-bs-theme="dark"] .x-window-tc,
[data-bs-theme="dark"] .x-window-ml,
[data-bs-theme="dark"] .x-window-mr,
[data-bs-theme="dark"] .x-window-bl,
[data-bs-theme="dark"] .x-window-br,
[data-bs-theme="dark"] .x-window-bc,
[data-bs-theme="dark"] .x-menu { background: var(--wl-panel); color: var(--wl-text); border-color: var(--wl-border); }
[data-bs-theme="dark"] ul.x-tab-strip-top,
[data-bs-theme="dark"] .x-tab-strip-top .x-tab-right,
[data-bs-theme="dark"] .x-tab-strip-top .x-tab-left,
[data-bs-theme="dark"] .x-tab-strip-top .x-tab-strip-inner { background: var(--wl-raised); }
[data-bs-theme="dark"] .x-tab-strip span.x-tab-strip-text,
[data-bs-theme="dark"] .x-btn button,
[data-bs-theme="dark"] .x-window-header-text,
[data-bs-theme="dark"] .x-menu-list-item a,
[data-bs-theme="dark"] .x-toolbar .xtb-text,
[data-bs-theme="dark"] .x-statusbar .x-status-text { color: var(--wl-text); }
[data-bs-theme="dark"] .x-tab-strip .x-tab-strip-active .x-tab-strip-inner { background: #40546d; }
[data-bs-theme="dark"] .x-grid3-row-selected,
[data-bs-theme="dark"] .x-grid3-row-over,
[data-bs-theme="dark"] .x-combo-list .x-combo-selected { background: #344963 !important; border-color: #6b8fb6 !important; }
[data-bs-theme="dark"] .x-btn-over td,
[data-bs-theme="dark"] .x-btn-focus td,
[data-bs-theme="dark"] .x-btn-click td { background: #344963; }
[data-bs-theme="dark"] .x-grid3-row,
[data-bs-theme="dark"] .x-grid3-row td,
[data-bs-theme="dark"] .x-tab-panel-header,
[data-bs-theme="dark"] .x-panel-header,
[data-bs-theme="dark"] .x-panel-body { border-color: var(--wl-border); }
[data-bs-theme="dark"] .x-grid3-cell-selected { background: #344963 !important; }
[data-bs-theme="dark"] .x-btn td { background: var(--wl-raised); }
[data-bs-theme="dark"] .x-btn-over td { background: #344963; }
[data-bs-theme="dark"] .x-panel-tl,
[data-bs-theme="dark"] .x-panel-tr,
[data-bs-theme="dark"] .x-panel-tc,
[data-bs-theme="dark"] .x-panel-ml,
[data-bs-theme="dark"] .x-panel-mr,
[data-bs-theme="dark"] .x-panel-mc,
[data-bs-theme="dark"] .x-panel-bl,
[data-bs-theme="dark"] .x-panel-br,
[data-bs-theme="dark"] .x-panel-bc { background: var(--wl-panel); color: var(--wl-text); border-color: var(--wl-border); }
[data-bs-theme="dark"] .x-grid3-hd-row .sort-asc,
[data-bs-theme="dark"] .x-grid3-hd-row .sort-desc { background: #344963; }
