/* ============================================================
   SPSEK-2 RC3.8 — UI FOUNDATION
   Unified visual system layered over legacy structural styles.
   Business layout classes remain compatible; visual tokens are centralised here.
   ============================================================ */

:root{
  color-scheme:light;
  --ui-page:#f3f6f8;
  --ui-surface:#ffffff;
  --ui-surface-raised:#ffffff;
  --ui-surface-muted:#f7f9fb;
  --ui-surface-hover:#eef3f7;
  --ui-border:#d8e0e7;
  --ui-border-soft:#e8edf1;
  --ui-text:#18222d;
  --ui-text-secondary:#465565;
  --ui-muted:#788696;
  --ui-accent:#1769a8;
  --ui-accent-hover:#105a91;
  --ui-accent-soft:#e8f2f9;
  --ui-success:#327a57;
  --ui-success-soft:#edf7f1;
  --ui-warning:#98651d;
  --ui-warning-soft:#fff7e8;
  --ui-danger:#b44747;
  --ui-danger-soft:#fff0f0;
  --ui-info:#3479a9;
  --ui-info-soft:#eef6fb;
  --ui-sidebar:#101820;
  --ui-sidebar-2:#0d141b;
  --ui-shadow:0 1px 2px rgba(19,32,45,.04),0 12px 32px rgba(19,32,45,.055);
  --ui-shadow-modal:0 28px 80px rgba(8,18,28,.24);
  --ui-radius:12px;
  --ui-radius-sm:8px;
  --ui-control-h:40px;
  --ui-gap-1:8px;
  --ui-gap-2:12px;
  --ui-gap-3:16px;
  --ui-gap-4:24px;
  --ui-header-h:78px;

  /* compatibility aliases — legacy components consume the same system */
  --bg:var(--ui-page);
  --panel:var(--ui-surface);
  --surface:var(--ui-surface);
  --surface-2:var(--ui-surface-muted);
  --surface-3:var(--ui-surface-hover);
  --border:var(--ui-border);
  --line:var(--ui-border);
  --line-soft:var(--ui-border-soft);
  --text:var(--ui-text);
  --text-2:var(--ui-text-secondary);
  --muted:var(--ui-muted);
  --primary:var(--ui-accent);
  --primary2:var(--ui-accent-hover);
  --primary-dark:var(--ui-accent-hover);
  --accent:var(--ui-accent);
  --accent-2:var(--ui-accent-hover);
  --accent-soft:var(--ui-accent-soft);
  --good:var(--ui-success);
  --ok:var(--ui-success);
  --warn:var(--ui-warning);
  --bad:var(--ui-danger);
  --shadow:var(--ui-shadow);
  --radius:var(--ui-radius);
  --radius-sm:var(--ui-radius-sm);
  --sidebar:var(--ui-sidebar);
}

html.dark-theme{
  color-scheme:dark;
  --ui-page:#0f1318;
  --ui-surface:#171c22;
  --ui-surface-raised:#1a2027;
  --ui-surface-muted:#1c2229;
  --ui-surface-hover:#242b33;
  --ui-border:#343c46;
  --ui-border-soft:#282f37;
  --ui-text:#e2e7ec;
  --ui-text-secondary:#bdc6cf;
  --ui-muted:#87939f;
  --ui-accent:#6c9dc2;
  --ui-accent-hover:#80afd1;
  --ui-accent-soft:#20313f;
  --ui-success:#7cab8f;
  --ui-success-soft:#1c2922;
  --ui-warning:#c5a064;
  --ui-warning-soft:#2b251b;
  --ui-danger:#d18484;
  --ui-danger-soft:#302124;
  --ui-info:#7ba9c9;
  --ui-info-soft:#1b2933;
  --ui-sidebar:#090e13;
  --ui-sidebar-2:#0c1218;
  --ui-shadow:0 1px 2px rgba(0,0,0,.20),0 12px 34px rgba(0,0,0,.16);
  --ui-shadow-modal:0 28px 90px rgba(0,0,0,.48);
}

/* ---------- base ---------- */
html,body{background:var(--ui-page)!important;color:var(--ui-text)!important}
body{font-family:Inter,"Segoe UI",Roboto,Arial,sans-serif!important;font-size:14px;line-height:1.45}
body *{scrollbar-color:color-mix(in srgb,var(--ui-muted) 55%,transparent) transparent}
h1,h2,h3,h4,h5,h6,strong,b{color:var(--ui-text)}
p,span,small,label{border-color:var(--ui-border-soft)}
.muted,.sub,.page-sub,small{color:var(--ui-muted)!important}
a{color:var(--ui-accent)}
hr{border:0;border-top:1px solid var(--ui-border-soft)}

/* ---------- application shell ---------- */
.ui8-shell{background:var(--ui-page)!important}
.ui8-main,.ui8-content,#content{background:var(--ui-page)!important}
.ui8-content{padding:24px 28px 44px!important}
.ui8-header{height:var(--ui-header-h)!important;background:color-mix(in srgb,var(--ui-surface) 94%,transparent)!important;border-bottom:1px solid var(--ui-border-soft)!important;box-shadow:none!important}
.ui8-header h1{color:var(--ui-text)!important}.ui8-header p,.ui8-header-right .today{color:var(--ui-muted)!important}
.ui8-header .ui8-icon-button{background:var(--ui-surface)!important;color:var(--ui-text-secondary)!important;border-color:var(--ui-border)!important}
.ui8-header .ui8-icon-button:hover{background:var(--ui-surface-hover)!important;color:var(--ui-text)!important}
.ui8-sidebar{background:linear-gradient(180deg,var(--ui-sidebar),var(--ui-sidebar-2))!important}

/* ---------- one surface language ---------- */
.panel,.stat,.role-card,.settings-sidebar,.request-info-card,.dispatch-card,.warehouse-card,.installer-day,
.ui8-page-command,.ui8-table-card,.ui8-map-toolbar,.ui8-map-filter-panel,.request-filter-panel,.map-filter-panel,
.request-script-panel,.request-contacts-card,.manual-district-box,.legal-parsed-card,.installed-facts-v5,
.import-mode-card,.catalog-row,.column-choice,.district-access-block,.gallery-request-card,.gallery-photo-item,
.settings-salary-links>div,.supply-line,.system-page .panel,.route-order li,.callback-list,
.spsek-map-address-card,.spsek-map-selection-panel{
  background:var(--ui-surface)!important;
  color:var(--ui-text)!important;
  border-color:var(--ui-border)!important;
  border-radius:var(--ui-radius)!important;
  box-shadow:var(--ui-shadow)!important;
}

.panel,.ui8-page-command,.ui8-table-card,.request-info-card,.dispatch-card,.warehouse-card{overflow:hidden}
.panel-head,.settings-card-head,.spsek-map-card-head,.spsek-map-selection-head{
  background:var(--ui-surface)!important;
  color:var(--ui-text)!important;
  border-bottom:1px solid var(--ui-border-soft)!important;
  padding:15px 17px!important;
}
.panel-body,.settings-card-body{background:var(--ui-surface)!important;color:var(--ui-text-secondary)!important;padding:17px!important}
.panel-head h2,.panel-head h3,.panel-head h4{margin-top:0;margin-bottom:2px;color:var(--ui-text)!important}

/* Eliminate historical white/light islands */
.check-line,.address-card,.address-card button,.map-request,.map-route-toggle,.request-pager,
.call-ahead-box,.info-item,.readonly-comment,.task-details-text,.legal-parsed-grid>div,
.quick-days button,.plan-mode-cards button,.quick-intervals.v5 button,.dispatch-job,.dispatch-grid,
.dispatch-head>div,.dispatch-unassigned,.calendar-day-row,.script-row,.request-phone-row,
.column-settings-modal,.global-import-progress,.gip-track,.map-config,.ui8-map-loading,
.filter-summary,.map-filter-summary,.kc-import-box,.brand-preview img,.multi-filter-menu,
.pager button,.pager-buttons button,.page-btn,.pagination,.request-pagination,.page-size{
  background:var(--ui-surface-muted)!important;
  color:var(--ui-text-secondary)!important;
  border-color:var(--ui-border)!important;
}
.address-card button:hover,.map-request:hover,.calendar-day-row:hover,.callback-list button:hover,
.script-row:hover,.request-phone-row:hover{background:var(--ui-surface-hover)!important}
.map-config h3,.map-config h4{color:var(--ui-text)!important}.map-config p{color:var(--ui-muted)!important}
.kc-comment-block .readonly-comment{background:var(--ui-warning-soft)!important;border-color:color-mix(in srgb,var(--ui-warning) 35%,var(--ui-border))!important}

/* ---------- forms ---------- */
label{color:var(--ui-text-secondary)!important;font-weight:600}
input,select,textarea,.input,.select,.multi-filter>button,.filter-control{
  width:auto;
  min-height:var(--ui-control-h)!important;
  background:var(--ui-surface)!important;
  color:var(--ui-text)!important;
  border:1px solid var(--ui-border)!important;
  border-radius:var(--ui-radius-sm)!important;
  box-shadow:none!important;
}
input:not([type="checkbox"]):not([type="radio"]),select,textarea{padding:9px 11px!important}
input::placeholder,textarea::placeholder{color:var(--ui-muted)!important;opacity:.78}
input:focus,select:focus,textarea:focus,.multi-filter>button:focus{
  outline:none!important;
  border-color:var(--ui-accent)!important;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--ui-accent) 16%,transparent)!important;
}
select option{background:var(--ui-surface)!important;color:var(--ui-text)!important}
input[type="checkbox"],input[type="radio"]{accent-color:var(--ui-accent);min-height:0!important}
.form-grid{gap:var(--ui-gap-3)!important;align-items:end}
.form-grid>label,.filter-admin-toolbar label,.script-editor label{display:grid;gap:6px;margin:0!important;min-width:0}

/* ---------- buttons ---------- */
.btn,.ui8-btn{
  min-height:var(--ui-control-h)!important;
  border-radius:var(--ui-radius-sm)!important;
  border:1px solid var(--ui-border)!important;
  padding:8px 13px!important;
  font-weight:700!important;
  box-shadow:none!important;
}
.btn.primary,.ui8-btn.primary{background:var(--ui-accent)!important;color:#fff!important;border-color:var(--ui-accent)!important}
.btn.primary:hover,.ui8-btn.primary:hover{background:var(--ui-accent-hover)!important;border-color:var(--ui-accent-hover)!important}
.btn.secondary,.ui8-btn.secondary,.settings-action{background:var(--ui-surface-muted)!important;color:var(--ui-text-secondary)!important;border-color:var(--ui-border)!important}
.btn.secondary:hover,.ui8-btn.secondary:hover,.settings-action:hover{background:var(--ui-surface-hover)!important;color:var(--ui-text)!important}
.btn.danger,.ui8-btn.danger{background:var(--ui-danger-soft)!important;color:var(--ui-danger)!important;border-color:color-mix(in srgb,var(--ui-danger) 36%,var(--ui-border))!important}
.btn.ghost,.ui8-btn.ghost{background:transparent!important;color:var(--ui-text-secondary)!important;border-color:transparent!important}
.btn.small,.ui8-btn.small{min-height:32px!important;padding:5px 10px!important}
.icon-btn{background:var(--ui-surface-muted)!important;color:var(--ui-text-secondary)!important;border-color:var(--ui-border)!important}

/* ---------- tables ---------- */
.table-wrap,.ui8-table-host{width:100%;max-width:100%;overflow:auto;border-radius:var(--ui-radius-sm)}
table,.data-table,.request-data-table{width:100%;border-collapse:separate;border-spacing:0;color:var(--ui-text-secondary)!important}
table thead th,.data-table th,.request-data-table th{
  background:var(--ui-surface-muted)!important;
  color:var(--ui-muted)!important;
  border-bottom:1px solid var(--ui-border)!important;
  font-size:10px!important;font-weight:800!important;letter-spacing:.05em;text-transform:uppercase;
}
table td,.data-table td,.request-data-table td{background:var(--ui-surface)!important;color:var(--ui-text-secondary)!important;border-bottom:1px solid var(--ui-border-soft)!important}
table tbody tr:nth-child(even) td,.data-table tbody tr:nth-child(even) td{background:color-mix(in srgb,var(--ui-surface-muted) 44%,var(--ui-surface))!important}
table tbody tr:hover td,.data-table tbody tr:hover td{background:var(--ui-surface-hover)!important}

/* ---------- notices / badges ---------- */
.notice{background:var(--ui-info-soft)!important;color:var(--ui-text-secondary)!important;border:1px solid color-mix(in srgb,var(--ui-info) 30%,var(--ui-border))!important;border-radius:var(--ui-radius-sm)!important}
.notice.danger-note,.danger-note{background:var(--ui-danger-soft)!important;color:var(--ui-danger)!important;border-color:color-mix(in srgb,var(--ui-danger) 35%,var(--ui-border))!important}
.import-result.success{background:var(--ui-success-soft)!important;color:var(--ui-success)!important;border-color:color-mix(in srgb,var(--ui-success) 34%,var(--ui-border))!important}
.badge,.district-badge,.spsek-map-request-status{background:var(--ui-surface-hover)!important;color:var(--ui-text-secondary)!important;border:1px solid var(--ui-border)!important}
.new-phone{background:var(--ui-warning-soft)!important;color:var(--ui-warning)!important}

/* ---------- settings: stable composition ---------- */
.ui9-settings-intro{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;padding:2px 2px 8px;margin-bottom:4px}
.ui9-settings-intro h2{font-size:24px;margin:3px 0 2px;letter-spacing:-.025em;color:var(--ui-text)}
.ui9-settings-intro p{margin:0;color:var(--ui-muted)}
.ui9-kicker,.ui8-kicker{font-size:9px;text-transform:uppercase;letter-spacing:.13em;font-weight:800;color:var(--ui-accent)}
.settings-shell{grid-template-columns:232px minmax(0,1fr)!important;gap:16px!important;align-items:start!important}
.settings-sidebar{position:sticky!important;top:calc(var(--ui-header-h) + 16px)!important;padding:8px!important;max-height:calc(100vh - var(--ui-header-h) - 32px)!important;overflow:auto!important;box-shadow:none!important}
.settings-sidebar button{min-height:40px!important;padding:8px 10px!important;border-radius:var(--ui-radius-sm)!important;color:var(--ui-text-secondary)!important}
.settings-sidebar button:hover{background:var(--ui-surface-hover)!important}.settings-sidebar button.active{background:var(--ui-accent-soft)!important;color:var(--ui-accent)!important}
.settings-content{min-width:0}.settings-content>.panel{margin:0 0 14px!important;box-shadow:none!important}
.settings-content>.notice{margin-bottom:14px!important}
.settings-actions-row,.settings-inline-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.permission-matrix-wrap{max-width:100%;overflow:auto;border:1px solid var(--ui-border);border-radius:var(--ui-radius-sm)}
.request-filter-admin-grid,.dashboard-widget-grid{gap:8px!important}.request-filter-admin-grid label,.dashboard-widget-grid label{background:var(--ui-surface-muted)!important;border:1px solid var(--ui-border)!important;border-radius:var(--ui-radius-sm)!important}

/* ---------- modal system ---------- */
.modal{background:rgba(6,10,15,.62)!important;backdrop-filter:blur(6px)!important;padding:20px!important;align-items:center!important;justify-content:center!important}
.modal-box{
  width:min(960px,calc(100vw - 40px))!important;
  max-width:960px!important;
  min-width:0!important;
  max-height:calc(100vh - 40px)!important;
  overflow:auto!important;
  padding:24px 52px 24px 24px!important;
  background:var(--ui-surface-raised)!important;
  color:var(--ui-text)!important;
  border:1px solid var(--ui-border)!important;
  border-radius:16px!important;
  box-shadow:var(--ui-shadow-modal)!important;
}
.modal-close{position:absolute!important;top:12px!important;right:12px!important;width:34px!important;height:34px!important;padding:0!important;background:var(--ui-surface-hover)!important;color:var(--ui-text-secondary)!important;border:1px solid var(--ui-border)!important;border-radius:var(--ui-radius-sm)!important}
.modalBody,#modalBody{min-width:0!important}
.modal-box :is(.gallery-request-modal,.user-editor,.warehouse-op-modal,.calendar-day-modal,.supply-modal,.route-result,.script-editor,.column-settings-modal){min-width:0!important;width:100%!important;max-width:none!important}
#modal:has(.supply-modal) .modal-box{width:min(1180px,calc(100vw - 40px))!important;max-width:1180px!important}
#modal.request-modal .modal-box,#modal:has(.request-workspace) .modal-box{width:min(1380px,calc(100vw - 40px))!important;max-width:1380px!important}
.modal-actions{display:flex!important;justify-content:flex-end!important;gap:8px!important;flex-wrap:wrap!important;margin-top:18px!important;padding-top:14px!important;border-top:1px solid var(--ui-border-soft)!important}

/* ---------- request card ---------- */
.request-workspace{gap:16px!important}.request-layout{gap:16px!important}.request-info-grid{gap:12px!important}
.info-item{border:1px solid var(--ui-border-soft)!important;box-shadow:none!important}
.request-script-panel{box-shadow:none!important}
.request-contacts-card,.manual-district-box,.legal-parsed-card{padding:14px!important;box-shadow:none!important}
.request-phone-row{border:1px solid var(--ui-border-soft)!important;border-radius:var(--ui-radius-sm)!important;padding:10px!important}
.dispatch-card,.request-info-card{box-shadow:none!important}

/* ---------- map ---------- */
.ui8-map-canvas{background:#e6ebef!important;border-color:var(--ui-border)!important;box-shadow:var(--ui-shadow)!important}
html.dark-theme .ui8-map-canvas{background:#20262d!important}
.ui8-map-loading{background:color-mix(in srgb,var(--ui-surface-muted) 88%,#dce4ea)!important;color:var(--ui-muted)!important}
.map-config{min-height:100%;padding:24px!important;background:var(--ui-surface-muted)!important;color:var(--ui-text)!important}
.spsek-map-card-head,.spsek-map-selection-head{background:var(--ui-surface-muted)!important}

/* ---------- warehouse / supply / system ---------- */
.supply-line{padding:14px!important;margin:10px 0!important;box-shadow:none!important}.supply-line label{margin:0!important}
.supply-modal .modal-actions{background:var(--ui-surface-raised)!important}
.system-page{gap:16px!important}.system-page .panel{box-shadow:none!important}
.system-checks .check-line,.district-checks .check-line{background:var(--ui-surface-muted)!important;border:1px solid var(--ui-border)!important;color:var(--ui-text-secondary)!important}
.route-order li{box-shadow:none!important}.maintenance-progress,.metric-track,.gip-track{background:var(--ui-surface-hover)!important}

/* ---------- login participates in theme ---------- */
.login-card{background:var(--ui-surface)!important;color:var(--ui-text)!important}
.login-card h1,.login-card label{color:var(--ui-text)!important}.login-card p{color:var(--ui-muted)!important}
.login-card input{background:var(--ui-surface-muted)!important;color:var(--ui-text)!important;border-color:var(--ui-border)!important}
html.dark-theme .login-screen{background:#0c1217!important}
html.dark-theme .login-brand-panel{filter:saturate(.82) brightness(.82)}

/* ---------- responsive rhythm ---------- */
@media(max-width:1100px){
  .ui8-content{padding:20px!important}
  .settings-shell{grid-template-columns:210px minmax(0,1fr)!important}
  .request-layout{grid-template-columns:1fr!important}
}
@media(max-width:920px){
  .ui8-content{padding:16px 14px 32px!important}
  .settings-shell{grid-template-columns:1fr!important}
  .settings-sidebar{position:static!important;max-height:none!important;display:flex!important;gap:6px!important;overflow-x:auto!important;overflow-y:hidden!important;padding:7px!important}
  .settings-sidebar button{flex:0 0 auto;width:auto!important;white-space:nowrap}
  .modal{padding:10px!important}
  .modal-box,#modal:has(.supply-modal) .modal-box,#modal.request-modal .modal-box,#modal:has(.request-workspace) .modal-box{width:calc(100vw - 20px)!important;max-width:none!important;max-height:calc(100vh - 20px)!important;padding:18px 46px 18px 18px!important}
}
@media(max-width:640px){
  .ui8-header{padding:0 12px!important}.ui8-header-right .today{display:none}
  .ui8-content{padding:12px 10px 28px!important}
  .panel-head,.panel-body{padding:13px!important}
  .ui9-settings-intro{align-items:flex-start;flex-direction:column}
  .form-grid{grid-template-columns:1fr!important}
  .modal-actions>*{flex:1 1 140px}
}

/* ---------- RC3.8 audit refinements ---------- */
/* Panels must not clip dropdowns/popovers; only dedicated scrolling hosts own overflow. */
.panel,.ui8-page-command,.request-info-card,.dispatch-card,.warehouse-card{overflow:visible!important}
.ui8-table-card{overflow:hidden!important}

.role-card h4,.setting-row,.permission-preview-bar,.filter-admin-toolbar,
.column-chooser,.column-drag,.dispatcher-rate-card,.admin-bulk-override,.admin-bulk-status-row,
.maintenance-admin-grid,.maintenance-card.admin,.rq-drawer-group,.rq-filter-drawer-head,.rq-filter-drawer-actions{
  background:var(--ui-surface-muted)!important;
  color:var(--ui-text-secondary)!important;
  border-color:var(--ui-border)!important;
}
.setting-row{border-bottom:1px solid var(--ui-border-soft)!important}.setting-row:hover{background:var(--ui-surface-hover)!important}
.role-card h4{border-bottom:1px solid var(--ui-border)!important}
.callback-list button{background:var(--ui-surface)!important;color:var(--ui-text-secondary)!important;border-color:var(--ui-border-soft)!important}
.rq-filter-drawer{background:var(--ui-surface)!important;border-color:var(--ui-border)!important;color:var(--ui-text)!important}
.rq-filter-drawer-head,.rq-filter-drawer-actions{background:var(--ui-surface)!important}
.rq-related-filter,.rq-filter-drawer .multi-filter-menu{background:var(--ui-surface-muted)!important;border-color:var(--ui-border)!important}

/* Consistent page-level rhythm across legacy modules. */
:is(.calendar-page,.analytics-page,.salary-page,.warehouse-page,.users-page,.imports-page,.gallery-page,.system-page){min-width:0}
:is(.calendar-page-head,.gallery-request-modal-head,.column-settings-head,.detail-head,.dispatch-card-head,.request-contacts-head,.legal-parsed-head){
  color:var(--ui-text)!important;
  border-color:var(--ui-border-soft)!important;
}
:is(.calendar-page-head,.gallery-request-modal-head,.column-settings-head){padding-bottom:12px!important;margin-bottom:12px!important;border-bottom:1px solid var(--ui-border-soft)!important}

/* Charts/metrics and progress controls inherit theme instead of historic fixed fills. */
.stat-icon{background:var(--ui-accent-soft)!important;color:var(--ui-accent)!important}
.metric-track,.maintenance-progress,.gup-track,.gip-track{background:var(--ui-surface-hover)!important}
.global-import-progress{background:var(--ui-surface-raised)!important;color:var(--ui-text)!important;border-color:var(--ui-border)!important;box-shadow:var(--ui-shadow-modal)!important}

/* Native switches stay readable in both themes. */
.switch{background:color-mix(in srgb,var(--ui-muted) 48%,var(--ui-surface-hover))!important}
.switch.on{background:var(--ui-accent)!important}.switch:after{background:#fff!important}

/* Semantic special surfaces keep meaning without becoming foreign-looking cards. */
.danger-zone{border-color:color-mix(in srgb,var(--ui-danger) 42%,var(--ui-border))!important}
.badge.Установленная,.badge.Установлена,.badge.Выполнена,.badge.good{background:var(--ui-success-soft)!important;color:var(--ui-success)!important;border-color:color-mix(in srgb,var(--ui-success) 28%,var(--ui-border))!important}
.badge.Срочный,.badge.Отказ,.badge.bad{background:var(--ui-danger-soft)!important;color:var(--ui-danger)!important;border-color:color-mix(in srgb,var(--ui-danger) 28%,var(--ui-border))!important}
.badge.В-работе,.badge.Вработе,.badge.Перезвонить-позже{background:var(--ui-warning-soft)!important;color:var(--ui-warning)!important;border-color:color-mix(in srgb,var(--ui-warning) 28%,var(--ui-border))!important}

/* Dark mode final guard for components that legacy styles paint explicitly. */
html.dark-theme :is(.demo,.role-card h4,.check-line,.address-card,.address-card button,.map-route-toggle,.request-pager,
.catalog-row,.callback-list button,.call-ahead-box,.info-item,.readonly-comment,.task-details-text,.map-config,
.kc-import-box,.column-choice,.column-chooser,.calendar-day-row,.script-row,.request-phone-row,.dispatcher-rate-card,
.settings-salary-links>div,.supply-line,.rq-related-filter,.rq-filter-drawer,.rq-filter-drawer-head,.rq-filter-drawer-actions){
  background:var(--ui-surface-muted)!important;
  color:var(--ui-text-secondary)!important;
  border-color:var(--ui-border)!important;
}
html.dark-theme :is(.modal-box,.panel,.ui8-page-command,.ui8-table-card,.settings-sidebar,.request-info-card,.dispatch-card,.warehouse-card){
  background:var(--ui-surface)!important;color:var(--ui-text)!important;border-color:var(--ui-border)!important;
}