/* ==========================================================================
   ControlWMS — Bootstrap design system (pilot)
   §user-request "Bootstrap за UI screens, light/dark toggle" - built на 2
   пилотни модула (dock-scheduling.html, orders.html) преди broader rollout.

   Design plan:
   - Color: пази established indigo brand accent (#4f46e5) за continuity със
     established ~90 немигрирани страници, но structured в пълна light/dark
     token ramp (вместо established !important-override hack в nav.js).
   - Type: established system font stack за UI + monospace за
     identifiers/technical values (item ID, lot номера, JSON резултати) -
     визуално разграничава "данни" от "labels" при бързо сканиране.
   - Layout: Bootstrap 5 grid/cards/forms, един card език (един radius, една
     shadow), mobile-first (44px min tap targets за floor/ръкавица употреба).
   - Principle: статус цвят е единственият силен сигнал - всичко останало
     остава quiet/neutral, цвят е резервиран за значение, не декорация.

   Закача се за established СЪЩИЯ data-theme атрибут/wms_theme localStorage
   key, established зададени от nav.js - toggle бутона в nav работи
   identично на тия страници, established без промяна.
   ========================================================================== */

:root {
  --wms-bg: #f5f6f8;
  --wms-surface: #ffffff;
  --wms-border: #e1e4ea;
  --wms-ink: #171923;
  --wms-ink-muted: #5f6673;   /* Фаза 2 (Н2/Н3, WCAG 1.4.3): 5.3:1 върху --wms-bg (#6b7280 беше 4.47:1) */
  /* Фаза 4 (n4, WCAG 1.4.3): текст върху ТЪМНА повърхност, която е тъмна и в двете теми (заглавна лента, тъмна карта, RF екран, значка #334155) -
     стойностите не зависят от темата; >= 4.5:1 върху #1e293b, #0f172a, #334155 (предпазител scripts/test-no-low-contrast-text.py). Не се ползват върху светъл фон. */
  --wms-ink-muted-on-dark: #94a3b8;
  --wms-ink-on-dark: #cbd5e1;
  --wms-accent: #4f46e5;
  --wms-accent-ink: #ffffff;
  --wms-accent-soft: rgba(79, 70, 229, 0.09);
  --wms-accent-link: #4338ca;   /* n4: текст-връзка върху оцветен фон (--wms-accent-soft): >= 4.5:1; --wms-accent (#818cf8) върху тъмния оцветен фон е 3.94:1 */

  --wms-success: #16a34a;
  --wms-success-soft: rgba(22, 163, 74, 0.1);
  --wms-warning: #d97706;
  --wms-warning-soft: rgba(217, 119, 6, 0.1);
  --wms-danger: #dc2626;
  --wms-danger-soft: rgba(220, 38, 38, 0.1);
  --wms-info: #2563eb;
  --wms-info-soft: rgba(37, 99, 235, 0.1);
  /* Фаза 2 (Н2, WCAG 1.4.3 AA): цветът на ТЕКСТ върху мекия фон (значки, съобщения) - success 2.96, warning 2.86, danger 4.13, info 4.49 беше под 4.5:1;
     с тези - 6.4 / 6.4 / 5.5 / 5.8 върху бяло (5.1-6.0 върху --wms-bg). Фоновете и рамките остават. */
  --wms-success-ink: #166534;
  --wms-warning-ink: #92400e;
  --wms-danger-ink: #b91c1c;
  --wms-info-ink: #1d4ed8;

  --wms-radius: 10px;
  --wms-shadow: 0 1px 3px rgba(23, 25, 35, 0.06), 0 1px 2px rgba(23, 25, 35, 0.04);
  --wms-font-sans: -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --wms-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
}

[data-theme="dark"] {
  --wms-bg: #0b0f17;
  --wms-surface: #131a26;
  --wms-border: #26303f;
  --wms-ink: #e7ebf3;
  --wms-ink-muted: #8b94a6;
  --wms-accent: #818cf8;
  --wms-accent-ink: #0b0f17;
  --wms-accent-soft: rgba(129, 140, 248, 0.14);
  --wms-accent-link: #a5b4fc;

  --wms-success: #4ade80;
  --wms-success-soft: rgba(74, 222, 128, 0.12);
  --wms-warning: #fbbf24;
  --wms-warning-soft: rgba(251, 191, 36, 0.12);
  --wms-danger: #f87171;
  --wms-danger-soft: rgba(248, 113, 113, 0.12);
  --wms-info: #60a5fa;
  --wms-info-soft: rgba(96, 165, 250, 0.12);
  /* тъмната тема: сегашните цветове минават (5.4-8.2:1 върху мекия фон) - ink = цвета */
  --wms-success-ink: var(--wms-success);
  --wms-warning-ink: var(--wms-warning);
  --wms-danger-ink: #fca5a5;   /* Фаза 4: #f87171 беше 4.47:1 върху мекия червен фон на тъмна карта (панелът за задържане) */
  --wms-info-ink: var(--wms-info);

  --wms-shadow: 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.2);
  color-scheme: dark;
}

/* --- Base --- */
.wms-bs {
  background: var(--wms-bg);
  color: var(--wms-ink);
  font-family: var(--wms-font-sans);
  min-height: 100vh;
}
.wms-bs .mono { font-family: var(--wms-font-mono); }
.wms-bs a { color: var(--wms-accent); }

/* --- Header --- */
.wms-bs .wms-header {
  background: var(--wms-surface);
  border-bottom: 1px solid var(--wms-border);
}
.wms-bs .wms-header h1 {
  font-size: 1.05rem;
  font-weight: 700;
  margin: 0;
  color: var(--wms-ink);
}

/* --- Cards (single card language across the pilot) --- */
.wms-bs .card {
  background: var(--wms-surface);
  border: 1px solid var(--wms-border);
  border-radius: var(--wms-radius);
  box-shadow: var(--wms-shadow);
  color: var(--wms-ink);
}
.wms-bs .card-header {
  background: transparent;
  border-bottom: 1px solid var(--wms-border);
  font-weight: 600;
  font-size: 0.95rem;
  padding: 0.9rem 1.25rem;
}
.wms-bs .card-body { padding: 1.25rem; }
.wms-bs .card .meta-note {
  font-size: 0.8rem;
  color: var(--wms-ink-muted);
}

/* --- Forms --- */
.wms-bs .form-control,
.wms-bs .form-select {
  background: var(--wms-bg);
  border: 1px solid var(--wms-border);
  color: var(--wms-ink);
  border-radius: 8px;
  min-height: 44px;
  padding: 0.5rem 0.8rem;
}
.wms-bs .form-control:focus,
.wms-bs .form-select:focus {
  background: var(--wms-bg);
  color: var(--wms-ink);
  border-color: var(--wms-accent);
  box-shadow: 0 0 0 0.2rem var(--wms-accent-soft);
}
.wms-bs .form-control::placeholder { color: var(--wms-ink-muted); opacity: 0.8; }
.wms-bs .form-label {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--wms-ink-muted);
  margin-bottom: 0.5rem;
  display: block;
}
/* --- Field group spacing (label+input pair) - genuine breathing room
   between rows, не default Bootstrap .row.g-2 (0.5rem е твърде сбито за
   формуляр с много полета). --- */
.wms-bs .field-group { margin-bottom: 1.1rem; }
.wms-bs .row.wms-form-row { --bs-gutter-x: 1.25rem; --bs-gutter-y: 1.1rem; }

/* --- Buttons --- */
.wms-bs .btn {
  border-radius: 8px;
  font-weight: 600;
  font-size: 0.85rem;
  min-height: 44px;
  padding: 0.5rem 1rem;
}
.wms-bs .btn-primary {
  background: var(--wms-accent);
  border-color: var(--wms-accent);
  color: var(--wms-accent-ink);
}
.wms-bs .btn-primary:hover,
.wms-bs .btn-primary:focus {
  background: var(--wms-accent);
  border-color: var(--wms-accent);
  filter: brightness(1.08);
  color: var(--wms-accent-ink);
}
.wms-bs .btn-outline-secondary {
  border-color: var(--wms-border);
  color: var(--wms-ink);
  background: transparent;
}
.wms-bs .btn-outline-secondary:hover {
  background: var(--wms-bg);
  border-color: var(--wms-border);
  color: var(--wms-ink);
}
/* §409 (потребителска заявка - "на тези малки форми бутоните ми се струват
   огромни... нещо като лейбълите") - root cause: ".wms-bs .btn" по-горе
   задава padding/min-height/font-size като ТВЪРДИ property стойности
   (не през Bootstrap-овите --bs-btn-* CSS variables), затова .btn-sm
   модификаторът (който само пренаписва variable-ите) е бил напълно
   игнориран - всеки бутон в приложението, включително button-и с
   .btn-sm клас, се рендира на еднакъв (голям) размер. Fix - explicit
   .btn-sm override тук, компактен размер близък до label/input височина
   на редови действия (Receive/Edit/Delete и т.н.). */
.wms-bs .btn-sm {
  min-height: 30px;
  padding: 0.25rem 0.6rem;
  font-size: 0.78rem;
  border-radius: 6px;
}

/* --- Status badges (color is the loudest signal - reserved for meaning) --- */
.wms-bs .badge-wms {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.25rem 0.55rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.01em;
}
.wms-bs .badge-success { background: var(--wms-success-soft); color: var(--wms-success-ink); }
.wms-bs .badge-warning { background: var(--wms-warning-soft); color: var(--wms-warning-ink); }
.wms-bs .badge-danger { background: var(--wms-danger-soft); color: var(--wms-danger-ink); }
.wms-bs .badge-info { background: var(--wms-info-soft); color: var(--wms-info-ink); }
.wms-bs .badge-neutral { background: var(--wms-bg); color: var(--wms-ink-muted); border: 1px solid var(--wms-border); }

/* --- Result / output box --- */
/* --- Result / output box - показва API отговор след действие. Празен
   по default (преди action-а да е изпълнен) - :empty го скрива изцяло,
   вместо да се показва като confusing blank placeholder кутия. */
.wms-bs .result-box:empty { display: none; }
.wms-bs .result-box {
  background: var(--wms-bg);
  border: 1px solid var(--wms-border);
  border-radius: 8px;
  padding: 0.7rem;
  margin-top: 0.6rem;
  font-size: 0.78rem;
  font-family: var(--wms-font-mono);
  white-space: pre-wrap;
  word-break: break-word;
  max-height: 240px;
  overflow-y: auto;
  color: var(--wms-ink);
}
.wms-bs .result-box.error { background: var(--wms-danger-soft); color: var(--wms-danger-ink); border-color: transparent; }
.wms-bs .result-box.success { background: var(--wms-success-soft); color: var(--wms-success-ink); border-color: transparent; }
.wms-bs .result-box.warning { background: var(--wms-warning-soft); color: var(--wms-warning-ink); border-color: transparent; }

/* --- Tables --- */
.wms-bs table {
  color: var(--wms-ink);
}
.wms-bs thead th {
  font-size: 0.72rem;
  text-transform: none;
  color: var(--wms-ink-muted);
  border-bottom: 1px solid var(--wms-border);
  font-weight: 600;
}
.wms-bs tbody td { border-color: var(--wms-border); vertical-align: middle; }
.wms-bs .table-hover tbody tr:hover { background: var(--wms-bg); }

/* --- Stat tiles (compact metric display) --- */
.wms-bs .stat-tile {
  background: var(--wms-surface);
  border: 1px solid var(--wms-border);
  border-radius: var(--wms-radius);
  padding: 0.9rem 1rem;
}
.wms-bs .stat-tile .stat-value { font-size: 1.6rem; font-weight: 700; line-height: 1.1; }
.wms-bs .stat-tile .stat-label { font-size: 0.72rem; color: var(--wms-ink-muted); margin-top: 0.15rem; }

/* --- Focus visibility (accessibility floor) --- */
.wms-bs *:focus-visible {
  outline: 2px solid var(--wms-accent);
  outline-offset: 1px;
}

@media (prefers-reduced-motion: reduce) {
  .wms-bs * { transition: none !important; animation: none !important; }
}

/* ==========================================================================
   §386 (потребителска заявка - "Bootstrap за UI... провери колко още UI
   трябва да промениш" → "1. Билд чак като свършиш с всички страници...
   тъмна тема да работи и на преработените страници") - alias слой за
   established legacy custom CSS класове (86 файла ползват .panel, 58
   .btn-small, и т.н. - identична hardcoded дефиниция, копирана низ ЦЕЛИЯ
   codebase). Вместо ръчно преструктуриране на всяка от 102-те страници
   (огромен риск за established JS wiring, keyed по ID, не clases),
   `.wms-bs .panel` и т.н. по-долу имат ПО-ВИСОКА specificity (2 класа) от
   established inline `.panel{...}` rule-а на всяка страница (1 клас) -
   автоматично overrides established hardcoded светлия стил, БЕЗ да пипа
   HTML структурата/JS logic-a на нито един файл. Established `wms_theme`
   dark toggle continues да работи identично - established alias-ите
   ползват established СЪЩИТЕ `--wms-*` variables, дефинирани по-горе.
   ========================================================================== */

.wms-bs .panel {
  background: var(--wms-surface);
  border: 1px solid var(--wms-border);
  border-radius: var(--wms-radius);
  box-shadow: var(--wms-shadow);
  color: var(--wms-ink);
  padding: 1.25rem;
  margin-bottom: 1.25rem;
}
.wms-bs .panel h2, .wms-bs .panel h3 {
  color: var(--wms-ink);
  margin-top: 0;
}
.wms-bs .meta-note, .wms-bs .subtitle, .wms-bs .hint, .wms-bs .empty-hint, .wms-bs .placeholder {
  color: var(--wms-ink-muted);
  font-size: 0.8rem;
}
.wms-bs .label, .wms-bs .field label { color: var(--wms-ink-muted); font-weight: 600; font-size: 0.8rem; }

/* --- Legacy button classes (визуално еквивалентни на bootstrap .btn/.btn-sm) --- */
.wms-bs .btn-small, .wms-bs .btn-cancel, .wms-bs .btn-danger-small {
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 6px; font-weight: 600; font-size: 0.78rem;
  min-height: 30px; padding: 0.25rem 0.6rem; border: 1px solid transparent;
  cursor: pointer; background: var(--wms-accent); color: var(--wms-accent-ink);
}
/* §412 (потребителска заявка - "бутоните все още ми се струват големи...
   все едно не са на мястото си") - root cause: row-level action бутоните на
   много страници (напр. putaway-tasks-directed.html) ползват established
   ПО-СТАРИЯ legacy ".btn-small" клас (58 файла), НЕ Bootstrap-овия
   ".btn-sm" (виж §409/§410 fix-a там) - двата класа исторически бяха
   поддържани "визуално еквивалентни" (виж коментара горе), но established
   ".btn-small" остана на по-стария, по-голям размер (36px min-height),
   докато ".btn-sm" вече е компактен (30px). Fix - синхронизирани към
   ЕДНАКЪВ компактен размер, за да не изглежда несъответствие между
   страници, ползващи единия срещу другия клас.
   Фаза 2 (v3.756.0): коментарът не беше затворен и поглъщаше правилата до следващия '*/' - .btn-secondary (вторичният бутон изглеждаше като
   основния), .btn-danger-small, button:disabled (неясното „opacity не се прилага“ от §Session-v3.541.0) и .help-btn не действаха. */
.wms-bs .btn-small:hover, .wms-bs .btn-cancel:hover, .wms-bs .btn-danger-small:hover { filter: brightness(1.08); }
.wms-bs .btn-secondary, .wms-bs button.secondary, .wms-bs .btn-cancel {
  background: transparent; border-color: var(--wms-border); color: var(--wms-ink);
}
.wms-bs .btn-secondary:hover { background: var(--wms-bg); }
.wms-bs .btn-danger-small, .wms-bs .btn-decline { background: var(--wms-danger-solid); color: #fff; }
.wms-bs button:disabled { opacity: 0.55 !important; cursor: not-allowed !important; }
.wms-bs .help-btn {
  background: transparent; border: 1px solid var(--wms-border); color: var(--wms-ink-muted);
  border-radius: 999px; width: 26px; height: 26px; min-height: 26px; padding: 0;
  display: inline-flex; align-items: center; justify-content: center; font-size: 0.78rem;
}

/* --- Status / feedback boxes --- */
.wms-bs .error-msg, .wms-bs .error-box, .wms-bs .error {
  background: var(--wms-danger-soft); color: var(--wms-danger-ink); border-radius: 8px; padding: 0.6rem 0.9rem; font-size: 0.85rem;
}
.wms-bs .success-msg, .wms-bs .success {
  background: var(--wms-success-soft); color: var(--wms-success-ink); border-radius: 8px; padding: 0.6rem 0.9rem; font-size: 0.85rem;
}
.wms-bs .warning-banner {
  background: var(--wms-warning-soft); color: var(--wms-warning-ink); border-radius: 8px; padding: 0.6rem 0.9rem; font-size: 0.85rem;
}

/* --- Badges (status-badge/badge/badge-enabled/badge-disabled - established page-specific naming, unified тук) --- */
.wms-bs .badge, .wms-bs .status-badge {
  display: inline-flex; align-items: center; gap: 0.3rem; padding: 0.25rem 0.55rem;
  border-radius: 999px; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.01em;
  background: var(--wms-bg); color: var(--wms-ink-muted); border: 1px solid var(--wms-border);
}
.wms-bs .badge-enabled, .wms-bs .status-active, .wms-bs .status-completed, .wms-bs .status-success {
  background: var(--wms-success-soft); color: var(--wms-success-ink); border-color: transparent;
}
.wms-bs .badge-disabled, .wms-bs .status-cancelled, .wms-bs .status-failed {
  background: var(--wms-danger-soft); color: var(--wms-danger-ink); border-color: transparent;
}
/* v3.755.0: значките с цвят по смисъл (success/warning/danger/info) - СЛЕД общото правило '.wms-bs .badge' (същата тежест): иначе то ги
   покриваше и всички се виждаха сиви (напр. 'Blocked'/'Retired'/'Active' в 'Items'). '.badge-active' - псевдоним на success. */
.wms-bs .badge-success, .wms-bs .badge-active { background: var(--wms-success-soft); color: var(--wms-success-ink); border-color: transparent; }
.wms-bs .badge-warning { background: var(--wms-warning-soft); color: var(--wms-warning-ink); border-color: transparent; }
.wms-bs .badge-danger { background: var(--wms-danger-soft); color: var(--wms-danger-ink); border-color: transparent; }
.wms-bs .badge-info { background: var(--wms-info-soft); color: var(--wms-info-ink); border-color: transparent; }

/* --- Фаза 2 (OUT-011..020, дизайнът ui-design-out-011-020.md §0.2): общите класове на изходящите екрани - СЛЕД значките (§Semantic-Colors-After-Generic).
   .num - числата вдясно; .wms-prio - значката на приоритета (знак + дума, не само цвят); .wms-shortage/.wms-reason - панелът „Защо липсва?“;
   .wms-callout - указание/предупреждение; .wms-dl - етикет-стойност; .wms-stack - таблица -> карти под 640 px (етикетът от data-label);
   .wms-tabs - раздели (role=tablist); .wms-form-dialog - прозорецът на wmsFormDialog (nav.js). --- */
.wms-bs .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.wms-bs .wms-prio { display: inline-flex; align-items: center; gap: .25rem; font-size: .72rem; font-weight: 700; border-radius: 999px; padding: .2rem .55rem; border: 1px solid transparent; white-space: nowrap; }
.wms-bs .wms-prio-urgent { background: var(--wms-danger-soft); color: var(--wms-danger-ink); }
.wms-bs .wms-prio-high { background: var(--wms-warning-soft); color: var(--wms-warning-ink); }
.wms-bs .wms-prio-normal { background: var(--wms-bg); color: var(--wms-ink-muted); border-color: var(--wms-border); }
.wms-bs .wms-prio-low { background: var(--wms-bg); color: var(--wms-ink-muted); border-color: var(--wms-border); }
.wms-bs .wms-shortage { border: 1px solid var(--wms-border); border-left: 4px solid var(--wms-warning); border-radius: 8px; background: var(--wms-surface); padding: .75rem 1rem; margin: .25rem 0 .5rem; }
.wms-bs .wms-shortage-head { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; align-items: center; font-size: .85rem; margin-bottom: .5rem; }
.wms-bs .wms-shortage-head .muted { color: var(--wms-ink-muted); }
.wms-bs .wms-reason { display: grid; grid-template-columns: 1.6rem 4.5rem 1fr auto; gap: .6rem; align-items: start; padding: .55rem 0; border-top: 1px solid var(--wms-border); font-size: .85rem; }
.wms-bs .wms-reason .ico { font-weight: 700; text-align: center; border-radius: 6px; line-height: 1.6rem; height: 1.6rem; background: var(--wms-bg); color: var(--wms-ink-muted); border: 1px solid var(--wms-border); }
.wms-bs .wms-reason .qty { font-weight: 700; text-align: right; font-variant-numeric: tabular-nums; }
.wms-bs .wms-reason .next { color: var(--wms-ink-muted); font-size: .8rem; margin-top: .15rem; }
.wms-bs .wms-reason .act { display: flex; gap: .4rem; flex-wrap: wrap; justify-content: flex-end; }
.wms-bs .wms-callout { border-radius: 8px; padding: .7rem .9rem; font-size: .85rem; border: 1px solid; }
.wms-bs .wms-callout-warning { background: var(--wms-warning-soft); border-color: rgba(217,119,6,.35); color: var(--wms-warning-ink); }
.wms-bs .wms-callout-danger { background: var(--wms-danger-soft); border-color: rgba(220,38,38,.35); color: var(--wms-danger-ink); }
.wms-bs .wms-callout-info { background: var(--wms-info-soft); border-color: rgba(37,99,235,.3); color: var(--wms-info-ink); }
.wms-bs .wms-dl { display: grid; grid-template-columns: max-content 1fr; gap: .25rem 1rem; font-size: .85rem; margin: 0; }
.wms-bs .wms-dl dt { color: var(--wms-ink-muted); font-weight: 600; }
.wms-bs .wms-dl dd { margin: 0; }
.wms-bs .wms-tabs { display: flex; gap: 4px; border-bottom: 2px solid var(--wms-border); margin-bottom: 1rem; flex-wrap: wrap; }
.wms-bs .wms-tabs button { background: none !important; color: var(--wms-ink-muted) !important; border: none !important; border-bottom: 2px solid transparent !important; border-radius: 0 !important; margin-bottom: -2px; font-weight: 600; }
.wms-bs .wms-tabs button[aria-selected=true] { color: var(--wms-accent) !important; border-bottom-color: var(--wms-accent) !important; }
.wms-bs .req::after { content: " *"; color: var(--wms-danger-ink); }
.wms-bs td.mono, .wms-bs td.mono a, .wms-bs .badge-wms, .wms-bs .doc-no { white-space: nowrap; }
.wms-form-dialog-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.45); display: flex; align-items: center; justify-content: center; z-index: 10000; }
.wms-form-dialog { background: var(--wms-surface, #fff); color: var(--wms-ink, #171923); border: 1px solid var(--wms-border, #e1e4ea); border-radius: 12px; box-shadow: 0 12px 40px rgba(0,0,0,.25); padding: 1.25rem 1.5rem; width: min(560px, 94vw); max-height: 88vh; overflow-y: auto; }
.wms-form-dialog h2 { font-size: 1.05rem; margin: 0 0 .35rem; }
.wms-form-dialog .wfd-msg { color: var(--wms-ink-muted, #5f6673); font-size: .85rem; margin-bottom: .75rem; white-space: pre-line; }
.wms-form-dialog .wfd-field { margin-bottom: .6rem; }
.wms-form-dialog .wfd-field label { display: block; font-weight: 600; font-size: .8rem; margin-bottom: .25rem; }
.wms-form-dialog .wfd-field input, .wms-form-dialog .wfd-field select, .wms-form-dialog .wfd-field textarea { width: 100%; }
.wms-form-dialog .wfd-err { color: var(--wms-danger-ink, #b91c1c); font-size: .8rem; min-height: 1.1em; }
.wms-form-dialog footer { display: flex; justify-content: flex-end; gap: .5rem; margin-top: .75rem; padding-top: .75rem; border-top: 1px solid var(--wms-border, #e1e4ea); flex-wrap: wrap; }
.wms-form-dialog .wfd-danger { background: var(--wms-danger-solid, #dc2626) !important; color: #fff !important; }
@media (max-width: 640px) {
  .wms-bs .wms-reason { grid-template-columns: 1.6rem 3.5rem 1fr; }
  .wms-bs .wms-reason .act { grid-column: 2 / -1; justify-content: flex-start; }
  .wms-bs .wms-reason .act .btn-sm, .wms-bs .wms-reason .act .btn-small, .wms-form-dialog footer button { min-height: 44px; }   /* цел за докосване с ръкавица (WCAG 2.5.5) */
  .wms-bs .wms-stack thead { display: none; }
  .wms-bs .wms-stack tr { display: block; border-bottom: 1px solid var(--wms-border); padding: .4rem 0; }
  .wms-bs .wms-stack td { display: flex; justify-content: space-between; gap: 1rem; border: none !important; padding: .2rem .5rem !important; text-align: right; }
  .wms-bs .wms-stack td[data-label]::before { content: attr(data-label); color: var(--wms-ink-muted); font-weight: 600; font-size: .75rem; text-align: left; }
  .wms-bs .wms-stack td.full { display: block; text-align: left; }
  /* Фаза 4 (UX): картата започва със заглавие (номера на документа), празни клетки (отметка, която не се показва) не дават празен ред */
  .wms-bs .wms-stack td:empty { display: none; }
  .wms-bs .wms-stack td.card-title { font-size: 1rem; font-weight: 700; border-bottom: 1px solid var(--wms-border) !important; padding-bottom: .35rem !important; margin-bottom: .2rem; }
  .wms-bs .order-card .btn-small, .wms-bs .order-card .note-link { min-height: 44px; display: inline-flex; align-items: center; }   /* цел за докосване с ръкавица (WCAG 2.5.5) */
}

/* --- Legacy modal pattern (.modal-overlay/.modal-box/.modal-close) - established
   pages control show/hide via `.open` класа (`.modal-overlay{display:none}` default,
   `.modal-overlay.open{display:flex}` toggle) - established alias-ите ТУК explicit
   НЕ задават `display` на базовия selector (би форсирало permanent visible,
   overriding established page-a си hide-by-default логика с по-висока
   specificity) - само styling на ВЕЧЕ показания overlay/box. --- */
.wms-bs .modal-overlay.open {
  position: fixed; inset: 0; background: rgba(0,0,0,0.45); display: flex;
  align-items: center; justify-content: center; z-index: 1050;
}
/* §393 (потребителска заявка - "проиграй Сценарий 2 през UI" - self-caught
   критичен бъг: items.html/inventory-balances.html ползват established
   вложен `.modal` клас за самата кутия - established Bootstrap-овия
   собствен вграден `.modal` component (от `/vendor/bootstrap.min.css`)
   ИМА `display: none` default (Bootstrap-ъt очаква JS toggle към `.show`
   клас, established pattern тук е различен - toggle на `.modal-overlay`
   родителя към `.open`) - established страничната inline `.modal{}` rule
   не override-ва display изобщо (само background/padding/width), затова
   Bootstrap-овия `display:none` "печели" (без конкурираща declaration) -
   резултат: overlay се затъмнява коректно, но кутията вътре е genuinely
   `display:none`, НЕВИДИМА, независимо от background/border/size fix-а
   по-долу. Explicit override-ваме display ТУК, scoped зад established
   `.open` родителския клас.) */
.wms-bs .modal-overlay.open > .modal {
  display: block !important; position: relative !important; width: auto !important; height: auto !important;
  top: auto !important; left: auto !important; z-index: auto !important; overflow: visible !important;
}
.wms-bs .modal-box, .wms-bs .modal-overlay.open > .modal {
  background: var(--wms-surface); color: var(--wms-ink); border: 1px solid var(--wms-border);
  border-radius: var(--wms-radius); box-shadow: var(--wms-shadow); max-width: 92vw; max-height: 88vh; overflow-y: auto;
  padding: 1.5rem;
}
.wms-bs .modal-close { color: var(--wms-ink-muted); background: transparent; border: none; }

/* --- Legacy flex .row (display:flex;gap - НЕ Bootstrap grid .row) - neutralize
   Bootstrap's negative gutter margins, за да не bleed-нат отвъд container padding. --- */
.wms-bs .row { margin-left: 0; margin-right: 0; }
.wms-bs .row > * { margin-left: 0; margin-right: 0; }
.wms-bs .checkbox-row { display: flex; align-items: center; gap: 0.5rem; }

/* --- Raw table/input/select/button (established pages style тия directno, не чрез класове) --- */
.wms-bs table { width: 100%; border-collapse: collapse; }
.wms-bs th, .wms-bs td { padding: 0.6rem 0.75rem; border-bottom: 1px solid var(--wms-border); text-align: left; color: var(--wms-ink); }
.wms-bs th { font-size: 0.72rem; color: var(--wms-ink-muted); font-weight: 600; }
.wms-bs input:not([type=checkbox]):not([type=radio]), .wms-bs select, .wms-bs textarea {
  background: var(--wms-bg); border: 1px solid var(--wms-border); color: var(--wms-ink);
  border-radius: 8px; min-height: 40px; padding: 0.45rem 0.75rem; font-size: 0.85rem;
}
.wms-bs input:focus, .wms-bs select:focus, .wms-bs textarea:focus {
  border-color: var(--wms-accent); outline: none; box-shadow: 0 0 0 0.15rem var(--wms-accent-soft);
}
.wms-bs button:not(.btn):not(.help-btn) {
  border-radius: 8px; font-weight: 600; font-size: 0.85rem; min-height: 40px;
  padding: 0.5rem 1rem; border: 1px solid transparent; cursor: pointer;
  background: var(--wms-accent); color: var(--wms-accent-ink);
}
.wms-bs button:not(.btn):not(.help-btn):hover { filter: brightness(1.08); }

/* --- Empty-row placeholders (established across almost every list table) --- */
.wms-bs .empty-row td { color: var(--wms-ink-muted); text-align: center; padding: 1.2rem; }

/* --- Responsive: tables never force horizontal page scroll on narrow devices --- */
.wms-bs .table-responsive-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
@media (max-width: 640px) {
  .wms-bs main, .wms-bs .container-fluid { padding-left: 0.75rem; padding-right: 0.75rem; }
  .wms-bs .panel, .wms-bs .card { padding: 0.9rem; }
}

/* ==========================================================================
   Фаза 4, кръг поправки 1 (g2, docs/qa/reviews/phase2-ux.md В1-В4 и екраните) - ЕДНО място за оформлението, не по копие на екран (§195.4).
   Защо тук и с тази тежест: общото правило '.wms-bs button:not(.btn):not(.help-btn)' (0,3,1) по-горе боядисва ВСЕКИ бутон без .btn в индиго и биеше
   '.wms-bs .btn-secondary' (0,2,0) - вторичните бутони и табовете изглеждаха като основните. Правилата долу са със същото отрицание + клас (0,4,1).
   ========================================================================== */
:root {
  --wms-danger-solid: #b91c1c;     /* бял текст 6.5:1 (#ef4444 беше 3.76:1) */
  --wms-warning-solid: #f59e0b;    /* тъмен текст --wms-warning-solid-ink 7.9:1 (бял беше 2.15:1) */
  --wms-warning-solid-ink: #451a03;
  --wms-help-ink: #92400e;         /* „?“: 6.4:1 върху #fffbeb (жълтото #facc15 върху бяло беше 1.53:1) */
  --wms-help-bg: #fffbeb;
  --wms-help-border: #d97706;      /* граница 3.2:1 върху бяло (WCAG 1.4.11) */
}
[data-theme="dark"] {
  --wms-danger-solid: #dc2626;     /* бял текст 4.8:1 */
  --wms-help-ink: #fbbf24;
  --wms-help-bg: rgba(251, 191, 36, 0.12);
  --wms-help-border: #d97706;
}

/* В1 - вторичен бутон: прозрачен, рамка, текстът на страницата (същото като .btn-outline-secondary - един вид вторичен бутон на всички екрани) */
.wms-bs button.btn-secondary:not(.btn):not(.help-btn), .wms-bs button.secondary:not(.btn):not(.help-btn), .wms-bs button.btn-cancel:not(.btn):not(.help-btn),
.wms-bs button.btn-secondary-small:not(.btn):not(.help-btn), .wms-bs .btn.btn-secondary {
  background: transparent; color: var(--wms-ink); border: 1px solid var(--wms-border);
}
/* '.btn-secondary-small' ('Orders' - Search/филтрите, 'Printers'...): нямаше правило - беше голям индиго бутон; размерът на .btn-small */
.wms-bs button.btn-secondary-small:not(.btn):not(.help-btn) { border-radius: 6px; font-size: 0.78rem; min-height: 30px; padding: 0.25rem 0.6rem; }
.wms-bs button.btn-secondary:not(.btn):not(.help-btn):hover, .wms-bs button.secondary:not(.btn):not(.help-btn):hover, .wms-bs button.btn-cancel:not(.btn):not(.help-btn):hover, .wms-bs button.btn-secondary-small:not(.btn):not(.help-btn):hover,
.wms-bs .btn.btn-secondary:hover { background: var(--wms-bg); color: var(--wms-ink); filter: none; }
/* тъмна тема: nav.js боядисва '.btn-secondary' и 'button[class*=secondary]' в плътно сиво с !important - тук същият вид като в светлата (рамка, без запълване) */
[data-theme="dark"] .wms-bs button.btn-secondary:not(.btn):not(.help-btn), [data-theme="dark"] .wms-bs button.secondary:not(.btn):not(.help-btn),
[data-theme="dark"] .wms-bs button.btn-cancel:not(.btn):not(.help-btn), [data-theme="dark"] .wms-bs button.btn-secondary-small:not(.btn):not(.help-btn), [data-theme="dark"] .wms-bs .btn.btn-secondary,
[data-theme="dark"] .wms-bs .btn.btn-outline-secondary {
  background: transparent !important; color: var(--wms-ink) !important; border: 1px solid #475569 !important;   /* граница 3.3:1 върху тъмния фон */
}
[data-theme="dark"] .wms-bs button.btn-secondary:not(.btn):not(.help-btn):hover, [data-theme="dark"] .wms-bs .btn.btn-secondary:hover,
[data-theme="dark"] .wms-bs .btn.btn-outline-secondary:hover { background: #1e293b !important; }

/* опасно действие (отказ на поръчка/ред, изтриване, повреда): плътно червено с бял текст; предупредително (нулиране на парола): кехлибар с тъмен текст */
.wms-bs button.btn-danger:not(.btn):not(.help-btn), .wms-bs .btn.btn-danger, .wms-bs .btn-danger-small, .wms-bs .btn-decline {
  background: var(--wms-danger-solid); color: #fff; border: 1px solid var(--wms-danger-solid);
}
.wms-bs button.btn-warning:not(.btn):not(.help-btn), .wms-bs .btn.btn-warning {
  background: var(--wms-warning-solid); color: var(--wms-warning-solid-ink); border: 1px solid var(--wms-warning-solid);
}
/* вторично предупредително (кредитно задържане в реда): рамка и тъмен кехлибарен текст - не изглежда като основното действие */
.wms-bs button.btn-outline-warning:not(.btn):not(.help-btn), .wms-bs .btn.btn-outline-warning {
  background: transparent; color: var(--wms-warning-ink); border: 1px solid var(--wms-warning);
}
[data-theme="dark"] .wms-bs button.btn-outline-warning:not(.btn):not(.help-btn), [data-theme="dark"] .wms-bs .btn.btn-outline-warning { background: transparent !important; color: var(--wms-warning-ink) !important; border-color: #b45309 !important; }

/* В1 - табовете на страница (класът .tab-btn: 'Orders' и екраните с initPageTabs): без запълване, неактивният - приглушен текст, активният - акцент и черта.
   'aria-selected' и '.active' значат едно и също (екраните ги поддържат заедно). */
.wms-bs button.tab-btn:not(.btn):not(.help-btn) {
  background: none; color: var(--wms-ink-muted); border: 0; border-bottom: 2px solid transparent; border-radius: 0; min-height: 44px; margin-bottom: -2px; font-weight: 600;
}
.wms-bs button.tab-btn:not(.btn):not(.help-btn):hover { color: var(--wms-ink); filter: none; }
.wms-bs button.tab-btn.active:not(.btn):not(.help-btn), .wms-bs button.tab-btn[aria-selected="true"]:not(.btn):not(.help-btn) { color: var(--wms-accent); border-bottom-color: var(--wms-accent); }
[data-theme="dark"] .wms-bs button.tab-btn:not(.btn):not(.help-btn) { background: none !important; color: var(--wms-ink-muted) !important; border-color: transparent !important; }
[data-theme="dark"] .wms-bs button.tab-btn.active:not(.btn):not(.help-btn), [data-theme="dark"] .wms-bs button.tab-btn[aria-selected="true"]:not(.btn):not(.help-btn) { color: var(--wms-accent) !important; border-bottom-color: var(--wms-accent) !important; }

/* Фаза 4 (n4): маските на вградения сив цвят ([style*="color:..."] -> приглушения токен) са МАХНАТИ - екраните ползват var(--wms-ink-muted) направо, а маската
   криеше нарушенията от измерването (scripts/test-contrast-ui.py); предпазител: scripts/test-no-low-contrast-text.py. Маската за #6b7280 е махната в n7 - вграден #6b7280 като цвят на текст няма (предпазител: test-no-low-contrast-text.py). */
[data-theme="dark"] .wms-bs [style*="color:#dc2626"], [data-theme="dark"] .wms-bs [style*="color: #dc2626"] { color: #fca5a5 !important; }   /* червеното (звездичка, грешка) върху тъмен фон - 3.0:1 */
/* пояснение под поле (Bootstrap .form-text) - в тъмната тема беше тъмносиво върху тъмно (1.1:1) */
.wms-bs .form-text { color: var(--wms-ink-muted); }

/* В4 - иконата „?“ на панелите (nav.js attachPanelHelp): тъмен кехлибарен знак върху светъл кехлибар с рамка - видима и в двете теми */
.wms-bs .wms-help-icon-btn {
  color: var(--wms-help-ink) !important; background: var(--wms-help-bg) !important; border: 1px solid var(--wms-help-border) !important;
  width: 26px; height: 26px; min-height: 26px; border-radius: 50%; padding: 0; font-size: 0.8rem; font-weight: 700;
}
.wms-bs .wms-help-icon-btn:hover { filter: none; background: var(--wms-help-border) !important; color: var(--wms-warning-solid-ink) !important; }
/* иконата е в горния десен ъгъл на панела (position:absolute) - заглавният ред на панела оставя място за нея, за да не се застъпва с бутоните там
   ('Orders' - CSV/XML/PDF, 'AI Action Sandbox' - „Опресни“); :has() - само панелите с икона */
.wms-bs .card:has(> .wms-help-icon-btn) > .card-header,
.wms-bs .panel:has(> .wms-help-icon-btn) > .panel-header,
.wms-bs .panel:has(> .wms-help-icon-btn) > h2:first-child,
.wms-bs .panel:has(> .wms-help-icon-btn) > h3:first-child,
.wms-bs .panel:has(> button.help-btn) > h2:first-child,
.wms-bs .panel:has(> button.help-btn) > h3:first-child { padding-right: 3.25rem; }   /* иконата: 16 px от ръба + 26 px + въздух */
.wms-bs .panel:has(> .wms-help-icon-btn) > [style*="float:right"], .wms-bs .panel:has(> .wms-help-icon-btn) > [style*="float: right"] { margin-right: 2.25rem; }
/* O82 (Д6): статичните бутони „?“ на много екрани (<button class="help-btn" onclick="openHelp(..)"> с 'position:absolute; top; right' в стила на страницата)
   се позиционираха спрямо СТРАНИЦАТА, защото панелът им не е 'position:relative' - всички „?“ се трупаха в горния десен ъгъл, върху менюто на потребителя и звънчето
   (customers, decision-trees, edi, operation-logs, wave-schedules, waves, wes-dashboard). Елементът, който съдържа такъв бутон, е мястото му (като при attachPanelHelp).
   ':where' - нулева специфичност: ако страницата сама задава позиция (fixed, absolute, sticky) - печели нейната. */
:where(:has(> button.help-btn)) { position: relative; }
/* n7 (O82): и текстът в горния десен ъгъл на панела - първото пояснение/абзац/заглавие след (или преди) „?“ - оставя място за иконата (shipment-tracking: „?“ покриваше края на първия ред на 390 px) */
.wms-bs .panel:has(> .help-btn) > .help-btn + :is(h2, h3, h4, .meta-note, p, .panel-header),
.wms-bs .panel:has(> .help-btn) > :is(h2, h3, h4, .meta-note, p, .panel-header):first-child { padding-right: 3.25rem; }
.wms-bs .card:has(> .help-btn) > .card-body > :is(.meta-note, p):first-child { padding-right: 2.75rem; }
/* n7 (O82): „?“, добавен от скрипта (attachPanelHelp) като ПОСЛЕДЕН елемент, не е пред текста - затова и текстът след заглавието (пояснението) и страничните панели/свитите блокове оставят място (branding-config, warehouse-designer, customers) */
.wms-bs :is(.panel, .side-panel):has(> .help-btn) > :is(h2, h3, h4):first-child,
.wms-bs :is(.panel, .side-panel):has(> .help-btn) > :is(h2, h3, h4):first-child + :is(.meta-note, p),
.wms-bs details:has(> .help-btn) > summary,
.wms-bs details:has(> .help-btn) > summary + :is(.meta-note, p) { padding-right: 3.25rem; }

/* Свита справочна карта (<div class="card"><details class="wms-collapsible"><summary class="card-header">…</summary><div class="card-body">…): заглавието е бутонът за отваряне
   (workflow-triggers: каталогът на събитията - 100+ реда; customization-health: „What the core system offers“). Справочникът не бута работните карти надолу,
   а се отваря с едно натискане. '?' в самото заглавие (бутон в <summary>) не отваря картата - браузърът не превключва при натискане на бутон в <summary>. */
.wms-bs details.wms-collapsible > summary { cursor: pointer; list-style: none; display: flex; align-items: center; gap: .5rem; }
.wms-bs details.wms-collapsible > summary::-webkit-details-marker { display: none; }
.wms-bs details.wms-collapsible > summary::before { content: "\25B8"; color: var(--wms-ink-muted); font-size: .85em; flex: none; }
.wms-bs details.wms-collapsible[open] > summary::before { content: "\25BE"; }
.wms-bs details.wms-collapsible:not([open]) > summary.card-header { border-bottom: 0; }
.wms-bs details.wms-collapsible > summary:focus-visible { outline: 2px solid var(--wms-accent); outline-offset: -2px; }
.wms-bs .card:has(> .wms-help-icon-btn) > details.wms-collapsible > summary.card-header { padding-right: 3.25rem; }

/* Етикетите над полетата на една линия (warehouse-setup, customers, omnichannel, users...): '.row' подравняваше децата си ДОЛУ (align-items:flex-end),
   затова етикет на два реда започваше по-високо от съседите, а поле с подсказка под него - по-високо от съседните полета.
   (а) ред без подсказки под полетата: за поле „етикет + контрола“ етикетът расте - етикетите горе на една линия, полетата долу на една линия;
       бутоните и отметките в реда - долу, на линията на полетата (както досега);
   (б) ред, в който под някое поле има подсказка: децата - горе (етикетите на една линия, полетата на една линия, подсказката под своето поле);
       бутон направо в реда - на линията на полетата (отместен с височината на етикета). */
.wms-bs .row:has(> div > label:first-child + :is(input, select, textarea):last-child):not(:has(> div > :is(input, select, textarea) ~ :not(datalist))) { align-items: stretch; }
.wms-bs .row:has(> div > label:first-child + :is(input, select, textarea):last-child):not(:has(> div > :is(input, select, textarea) ~ :not(datalist))) > :not(div:has(> label:first-child + :is(input, select, textarea):last-child)) { align-self: flex-end; }
.wms-bs .row > div:has(> label:first-child + :is(input, select, textarea):last-child),
.wms-bs .field-grid > div:has(> label:first-child + :is(input, select, textarea):last-child) { display: flex; flex-direction: column; align-self: stretch; }
.wms-bs .row > div:has(> label:first-child + :is(input, select, textarea):last-child) > label:first-child,
.wms-bs .field-grid > div:has(> label:first-child + :is(input, select, textarea):last-child) > label:first-child { flex-grow: 1; }
.wms-bs .row:has(> div > label:first-child + :is(input, select, textarea) ~ :not(datalist)) { align-items: flex-start; }
.wms-bs .row:has(> div > label:first-child + :is(input, select, textarea) ~ :not(datalist)) > div:has(> label:first-child + :is(input, select, textarea):last-child) { align-self: flex-start; }
.wms-bs .row:has(> div > label:first-child + :is(input, select, textarea) ~ :not(datalist)) > div:has(> label:first-child + :is(input, select, textarea):last-child) > label:first-child { flex-grow: 0; }
.wms-bs .row:has(> div > label:first-child + :is(input, select, textarea) ~ :not(datalist)) > :is(button, .btn) { align-self: flex-start; margin-top: 2.35rem; }

/* Процесът над екрана (nav.js attachProcessStepper): „Процес:“ беше #9ca3af (2.5:1 светла) / #64748b (3.1:1 тъмна); стрелките - декоративни, но видими */
.wms-bs .wms-process-stepper .wms-stepper-caption, [data-theme="dark"] .wms-bs .wms-process-stepper .wms-stepper-caption { color: var(--wms-ink-muted) !important; }
.wms-bs .wms-process-stepper .wms-stepper-arrow, [data-theme="dark"] .wms-bs .wms-process-stepper .wms-stepper-arrow { color: var(--wms-ink-muted) !important; }

/* Етикет на бутон с подсказка защо е забранен - курсорът показва подсказката (title) и при забранен бутон */
.wms-bs button[aria-disabled="true"] { opacity: 0.55; cursor: not-allowed; }

/* Фаза 4 (UX - 'Users' и др.): форма от много полета с етикети и пояснения с различна дължина - мрежа, в която всяко поле заема три реда
   (етикет / контрола / пояснение) чрез subgrid: етикетите горе на една линия, контролите на една линия, поясненията под тях. */
.wms-bs .wms-fields { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 0 1rem; align-items: start; }
.wms-bs .wms-fields > div:not(.wms-fields-actions) { display: grid; grid-template-rows: subgrid; grid-row: span 3; align-content: start; min-width: 0; }
.wms-bs .wms-fields > div > label { align-self: start; margin: .75rem 0 .3rem; }
.wms-bs .wms-fields > div > .meta-note { margin-top: .25rem; }
.wms-bs .wms-fields > .wms-fields-actions { grid-column: 1 / -1; margin-top: .75rem; }
/* ред с действия над/под таблица (Опресни, Експорт...) - в един ред, вдясно */
.wms-bs .wms-actions { display: flex; gap: .5rem; flex-wrap: wrap; align-items: center; justify-content: flex-end; margin: .75rem 0 .25rem; }
/* бутон с малък вграден шрифт (10-11 px - цел за докосване около 20 px): поне размерът на .btn-small от темата */
.wms-bs button[style*="font-size:10px"], .wms-bs button[style*="font-size: 10px"], .wms-bs button[style*="font-size:11px"], .wms-bs button[style*="font-size: 11px"] { font-size: .78rem !important; min-height: 30px !important; padding: .25rem .6rem !important; }

/* Тъмна тема - прозорците '.wms-help-modal' (помощта „?“, предпазният запас в 'Items', прозорците в 'ASN Receiving'): кутията оставаше бяла (nav.js), а
   текстът в таблиците/етикетите взимаше светлите цветове на тъмната тема - бяло върху бяло (находка при снимките на Фаза 4). Кутията следва темата. */
[data-theme="dark"] .wms-bs .wms-help-modal { background: var(--wms-surface); color: var(--wms-ink); border: 1px solid var(--wms-border); }
[data-theme="dark"] .wms-bs .wms-help-modal h3, [data-theme="dark"] .wms-bs .wms-help-modal .wms-help-field-list b { color: var(--wms-ink); }
[data-theme="dark"] .wms-bs .wms-help-modal .wms-help-field-list li { color: var(--wms-ink-on-dark); border-bottom-color: var(--wms-border); }
[data-theme="dark"] .wms-bs .wms-help-modal .wms-help-close { color: var(--wms-ink-muted); }
[data-theme="dark"] .wms-bs .wms-help-modal img { border-color: var(--wms-border); background: #fff; }
/* меню „⋯“ в ред на таблица (<details class="wms-more">): отваря се в реда (не изскача над съседните - не се реже от обвивката на таблицата) */
.wms-bs details.wms-more { display: inline-block; vertical-align: top; }
.wms-bs details.wms-more > summary { list-style: none; display: inline-flex; align-items: center; justify-content: center; min-width: 36px; min-height: 30px; padding: 0 .5rem;
  border: 1px solid var(--wms-border); border-radius: 6px; cursor: pointer; font-weight: 700; color: var(--wms-ink); background: transparent; user-select: none; }
.wms-bs details.wms-more > summary::-webkit-details-marker { display: none; }
.wms-bs details.wms-more[open] > summary { background: var(--wms-bg); }
.wms-bs details.wms-more .wms-more-list { display: flex; flex-direction: column; align-items: stretch; gap: 4px; margin-top: 4px; min-width: 150px; }
@media (max-width: 640px) { .wms-bs details.wms-more > summary { min-width: 44px; min-height: 44px; } }
/* подзаглавие в панел (<h3> без вграден размер беше 28 px срещу 15 px на заглавието на панела - 'Operations Monitoring' „История на измерванията“) */
.wms-bs .panel h3 { font-size: 0.95rem; font-weight: 600; }
/* <code> (адреси, пътища): розовото на Bootstrap #d63384 е 4.1:1 върху сивия фон - по-тъмно (светла) / по-светло (тъмна) */
.wms-bs code { color: #a61e5c; }
[data-theme="dark"] .wms-bs code { color: #f9a8d4; }
/* '.placeholder' (празно състояние в 'Area Maintenance', 'Branding'...) съвпада по име с „скелета“ на Bootstrap 5 (background-color: currentcolor; opacity .5) -
   текстът се рисуваше като сив блок (1:1). Тук - обикновен текст. */
.wms-bs .placeholder { background-color: transparent; opacity: 1; cursor: auto; min-height: 0; vertical-align: baseline; }
.wms-bs div.placeholder { display: block; }
/* панелът за задържане ('Orders'): причината и откъде е дошла поръчката - в цвета на текста (не сиво върху розово) */
.wms-bs .order-hold-panel .hold-item-reason, .wms-bs .order-hold-panel .hold-source { color: var(--wms-ink); }
/* nav.js attachPanelHelp задава на '.panel-header' вграден padding-right 34 px - по-малко от мястото на иконата (16 + 26 px); на телефон бутоните там се
   пренасят под иконата ('Inventory balances') */
.wms-bs .panel:has(> .wms-help-icon-btn) > .panel-header { padding-right: 3.25rem !important; }
/* Bootstrap .btn-outline-success ('ASN Receiving' - „Затвори известието“): зеленото #198754 върху светлия фон - 4.2:1 */
.wms-bs .btn.btn-outline-success { color: var(--wms-success-ink); border-color: var(--wms-success); }
.wms-bs .btn.btn-outline-success:hover { color: var(--wms-accent-ink); background: var(--wms-success-ink); }

/* ===== Фаза 4 (n4, WCAG 1.4.3): поправките на контраста, намерени от scripts/test-contrast-ui.py (axe-core, светла и тъмна тема) - през променливите на темата ===== */
/* Bootstrap .btn-outline-primary / .btn-outline-danger / .btn-link в тъмната тема: #0d6efd и #dc3545 са 3.9:1 върху тъмния фон */
[data-theme="dark"] .wms-bs .btn.btn-outline-primary, [data-theme="dark"] .wms-bs .btn.btn-link { color: var(--wms-accent); }
[data-theme="dark"] .wms-bs .btn.btn-outline-primary { border-color: var(--wms-accent); }
[data-theme="dark"] .wms-bs .btn.btn-outline-primary:hover { background: var(--wms-accent); color: var(--wms-accent-ink); }
[data-theme="dark"] .wms-bs .btn.btn-outline-danger { color: var(--wms-danger-ink); border-color: var(--wms-danger); }
[data-theme="dark"] .wms-bs .btn.btn-outline-danger:hover { background: var(--wms-danger); color: var(--wms-accent-ink); }
/* връзка в предупреждение: Bootstrap .alert е светъл и в тъмната тема - връзката взема цвета на текста му (не светлия акцент: 2.7:1 върху бледожълто) */
[data-theme="dark"] .wms-bs .alert a:not(.btn) { color: inherit; text-decoration: underline; }
/* Bootstrap прозорец (.modal-content) в тъмната тема: беше бял със светъл текст (1.2:1) */
[data-theme="dark"] .wms-bs .modal-content { background-color: var(--wms-surface); color: var(--wms-ink); border-color: var(--wms-border); }
[data-theme="dark"] .wms-bs .modal-header, [data-theme="dark"] .wms-bs .modal-footer { border-color: var(--wms-border); }
[data-theme="dark"] .wms-bs .modal-content .btn-close { filter: invert(1) grayscale(100%) brightness(200%); }
[data-theme="dark"] .wms-bs .modal-content .form-label { color: var(--wms-ink-muted); }
/* езиковият превключвател (i18n.js) носи вграден бял фон: върху екран без заглавна лента (вход, портали) в тъмната тема текстът му беше светъл върху бяло (1.2:1) */
/* превключвателят на езика (i18n.js renderLanguageSwitcher): изгледът е тук, не във вграден стил - фонът и рамката следват темата */
select.lang-switcher, .wms-bs select.lang-switcher { font-size: 12px; padding: 5px 6px; border-radius: 6px; border: 1px solid var(--wms-border, #d1d5db); margin-left: 6px;
  background: var(--wms-surface, #ffffff); color: var(--wms-ink, #1a1a2e); width: auto; min-width: 0; flex: 0 0 auto; }
[data-theme="dark"] select.lang-switcher { background: var(--wms-surface) !important; color: var(--wms-ink) !important; border-color: var(--wms-border) !important; }