/* §400 (потребителска заявка - "защо не ги направиш с общ хедър и футер, ами правиш
   дизайн на всяка страница по отделно" - genuine технически дълг затворен: тоя файл е
   единственият източник на истина за base styling (box-sizing/body/header/main/.panel/
   label/input/.row/button/table), reuse-ван от ВСЯКА страница чрез <link>, вместо
   byte-for-byte дублиран inline <style> блок във всеки .html файл. Промяна тук (напр.
   main{max-width}) вече важи МОМЕНТАЛНО за всички reuse-ващи страници - не изисква
   ръчно редактиране на десетки файлове поотделно занапред. */

* { box-sizing: border-box; }

body {
  font-family: -apple-system, "Segoe UI", Roboto, sans-serif;
  background: #f4f5f7;
  margin: 0;
  color: #1a1a2e;
}

header {
  background: white; border-bottom: 1px solid #e5e7eb;
  padding: 16px 24px; display: flex; justify-content: space-between; align-items: center;
  flex-wrap: wrap; gap: 10px;
}
header h1 { font-size: 18px; margin: 0; }
header a { font-size: 13px; color: #4f46e5; text-decoration: none; }

main { max-width: 1200px; margin: 24px auto; padding: 0 16px; }

.panel {
  background: white; border-radius: 12px; box-shadow: 0 1px 4px rgba(0,0,0,0.06);
  padding: 20px; margin-bottom: 20px;
  /* §GAP-72-fix (потребителска заявка "продължи", genuinely намерен чрез
     live viewport testing на spec-файла - Scenario 44 "Responsive design")
     - wide data tables (many columns) не бяха containment-нати, карайки
     ЦЯЛАТА страница да overflow-ва хоризонтално на mobile viewports
     (678px table на 375px viewport). Global, single-line fix - panel-ъt
     сега containment-ва собствения си overflow вместо да разпространява
     overflow-a към body/html. */
  overflow-x: auto;
}
.panel h2 { font-size: 15px; margin: 0 0 16px; }

label { display: block; font-size: 13px; font-weight: 600; margin: 12px 0 6px; color: #374151; }
input, select {
  width: 100%; padding: 9px 10px; border: 1px solid #d1d5db; border-radius: 8px; font-size: 14px;
}

.row { display: flex; gap: 10px; align-items: flex-end; flex-wrap: wrap; }
.row > * { flex: 1; }

/* Двуколонен grid за header полета на форма - виж §400 orders.html redesign. */
.field-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 20px; }
.field-grid > div { min-width: 0; }
@media (max-width: 700px) { .field-grid { grid-template-columns: 1fr; } }

button {
  padding: 9px 16px; border-radius: 8px; border: none;
  background: #4f46e5; color: white; font-size: 13px; font-weight: 600; cursor: pointer;
}
button:hover { background: #4338ca; }
button.btn-small { padding: 5px 10px; font-size: 12px; margin-right: 6px; }
button.btn-secondary { background: #f3f4f6; color: #374151; }
button:disabled { background: #d1d5db; cursor: default; }

table { width: 100%; border-collapse: collapse; font-size: 13px; margin-top: 8px; }
th { text-align: left; color: var(--wms-ink-muted); font-weight: 600; padding: 8px; border-bottom: 1px solid #e5e7eb; }
td { padding: 8px; border-bottom: 1px solid #f3f4f6; }
tbody tr:nth-child(even) { background: #f9fafb; }
.empty-row td, .empty-row { text-align: center; color: #5f6673; padding: 24px; }   /* Фаза 2 (Н3): 5.3:1 (#9ca3af беше 2.4:1) */

.meta-note { font-size: 12px; color: #5f6673; }   /* Фаза 2 (Н3, WCAG 1.4.3): 5.3:1 върху #f4f5f7 (#9ca3af беше 2.5:1) */
.error-msg { color: #b45309; font-size: 13px; }
.success-msg { color: #166534; font-size: 13px; }

/* Page-tabs.js вграден styling (виж §400 tab conversion) - тук вместо дублиран inline
   <style> на всяка от 58-те конвертирани страници. */
.page-tabs-bar { display:flex; gap:4px; margin-bottom:16px; border-bottom:2px solid #e5e7eb; flex-wrap:wrap; }
.page-tabs-bar .tab-btn { padding:10px 18px; border:none; background:none; cursor:pointer; font-size:14px; font-weight:500; color:var(--wms-ink-muted); border-bottom:2px solid transparent; margin-bottom:-2px; }
.page-tabs-bar .tab-btn:hover { color:#374151; }
.page-tabs-bar .tab-btn.active { color:#4f46e5; border-bottom-color:#4f46e5; }
[data-theme="dark"] .page-tabs-bar .tab-btn.active { color:#a5b4fc; border-bottom-color:#a5b4fc; }

/* §Session-v3.552.0 (потребителска заявка - "СуперАдмин css за тъмната
   тема... на много места нищо не се чете") - тоя файл (reuse-ван от 58
   страници, виж §400 бележката горе) имаше почти нулево dark-theme
   покритие - само .page-tabs-bar по-горе. header/.panel/table/form
   елементи оставаха hardcoded светли навсякъде, дет тая страница се
   reuse-ва - explains защо толкова много SuperAdmin (и вероятно други)
   екрани изглеждаха нечетливи в тъмна тема. Палитра, matching
   established конвенцията от nav.js/останалите вече dark-aware екрани. */
[data-theme="dark"] body { background: #0f172a; color: #e2e8f0; }
[data-theme="dark"] header { background: #1e293b; border-color: #334155; }
[data-theme="dark"] header a { color: #a5b4fc; }
[data-theme="dark"] .panel { background: #1e293b; box-shadow: none; border: 1px solid #263041; }
[data-theme="dark"] label { color: var(--wms-ink-muted-on-dark); }
[data-theme="dark"] input, [data-theme="dark"] select {
  background: #0f172a; border-color: #334155; color: #e2e8f0;
}
[data-theme="dark"] button.btn-secondary { background: #334155; color: #e2e8f0; }
[data-theme="dark"] button:disabled { background: #334155; color: #64748b; }
[data-theme="dark"] table { color: #e2e8f0; }
[data-theme="dark"] th { color: var(--wms-ink-muted-on-dark); border-color: #334155; }
[data-theme="dark"] td { border-color: #263041; }
[data-theme="dark"] tbody tr:nth-child(even) { background: #172033; }
[data-theme="dark"] .empty-row td, [data-theme="dark"] .empty-row { color: var(--wms-ink-muted-on-dark); }
[data-theme="dark"] .meta-note { color: var(--wms-ink-muted-on-dark); }   /* 5.7:1 върху .panel (#64748b беше 3.2:1) */
[data-theme="dark"] .error-msg { color: #fca5a5; }
[data-theme="dark"] .success-msg { color: #86efac; }
[data-theme="dark"] .page-tabs-bar { border-bottom-color: #334155; }
[data-theme="dark"] .page-tabs-bar .tab-btn { color: var(--wms-ink-muted-on-dark); }
[data-theme="dark"] .page-tabs-bar .tab-btn:hover { color: #e2e8f0; }