/* Кабинет ОптМастер — АДМИНКА МЕНЕДЖЕРА (C-4): острова служебных экранов.

   Седьмой, последний слой каскада (порядок — `lib/layout.mjs::STYLESHEETS`), и он
   единственный, кому позволено перекрывать оболочку: служебная шапка должна отличаться от
   клиентской на скриншоте в переписке. Поэтому файл подключается ПОСЛЕ `cabinet.css` —
   при обратном порядке `.hdr-adm` проиграл бы `.hdr` по порядку следования.
   Отдельная оболочка (`lib/admin-view.mjs`), но те же карточки: у менеджера тот же
   телефон, что у клиента, и таблиц здесь нет по той же причине.

   ⚠️ Литеральных цветов здесь больше нет — только токены (UI-4). Причина не в аккуратности:
   гейты палитры (`test/brand.test.mjs`) считают контраст ПО ТОКЕНАМ, и восемь литералов в
   последнем слое каскада были для них невидимы. Ровно так дожил до UI-4 `border-color`
   тихой кнопки с контрастом 2.14 — правило было, экран его не показывал, а тест не смотрел.
   Новый цвет служебного экрана заводится токеном в `tokens.css`, а не числом здесь. */

/* Белые чернила остаются общим `--on-dark`: белое одинаково бело на любой тёмной
   поверхности. Своё у служебной — то, что от поверхности зависит: приглушённый шаг
   (`--on-staff-muted`) и граница контрола (`--line-staff`). */
.hdr-adm { background: var(--surface-staff); }
.hdr-adm .hdr-brand,
.hdr-adm .hdr-who,
.hdr-adm .hdr-lang a,
.hdr-adm .lang-on { color: var(--on-dark); }
.hdr-who {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
}
.hdr-out { margin: 0; }
.hdr-out .btn { width: auto; }
.nav-adm { background: var(--surface-staff-2); }
/* На телефоне полоса меню становится белой панелью снизу (`cabinet.css`, медиазапрос 720px),
   и служебная перебивает её фон обратно на тёмный — вместе с волоском `--line` и тенью,
   рассчитанными на светлую. Граница и цвет чернил здесь свои. */
@media (max-width: 720px) {
  .nav-adm { border-top-color: var(--line-staff-soft); }
  .nav-adm a { color: var(--on-staff-muted); }
  .nav-adm a.on { color: var(--on-dark); }
  .nav-adm a:focus-visible { outline-color: var(--on-dark); }
}
/* Служебная шапка тёмная, а тег роли и кнопка выхода брали общий `--muted`: 1.79 к этому
   фону. Дефект достался от C-4 и жил в общем файле; после разреза он живёт здесь, значит
   чинится здесь.

   ⚠️ Граница у обоих — `--line-staff` (4.35), а не прежние #55636f (2.14). Разницы на
   экране не было видно ровно потому, что границы не было вовсе: её снимал
   `button.btn { border: 0 }` из `components.css`, выигрывая специфичностью (0,1,1) против
   (0,1,0). Правило чинило контраст линии, которой не существовало. */
.hdr-adm .hdr-who .tag {
  color: var(--on-staff-muted);
  border-color: var(--line-staff);
}
.hdr-adm .hdr-out .btn-quiet {
  color: var(--on-staff-muted);
  border-color: var(--line-staff);
}
/* Кольцо фокуса кнопки выхода — светлое: фирменный синий на служебной шапке даёт 2.78 при
   пороге 3.0 (то же решение, что у ссылок тёмной шапки в `cabinet.css`). */
.hdr-adm .hdr-out .btn:focus-visible { outline-color: var(--on-dark); }
.nav-adm a { color: var(--on-staff-muted); }
.nav-adm a.on { color: var(--on-dark); }

.adm-tiles {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.adm-tile a {
  display: block;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  text-decoration: none;
  color: var(--ink);
}
.adm-tile b {
  display: block;
  font-family: var(--font-head);
  /* Явно, а не через `bolder` от браузера: у Oswald самохостятся 500/600/700, и правило
     без веса однажды унаследует 400 — подмена начертания пройдёт незамеченной. */
  font-weight: 700;
  font-size: 26px;
  line-height: 1.2;
}
.adm-tile span { font-size: 14px; color: var(--muted); }
.adm-tile-hot a { border-color: var(--accent); }
.adm-tile-hot b { color: var(--accent-ink); }

/* Фильтр и правка позиции: поля в строку на широком экране, столбиком на телефоне. */
.form-inline {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  align-items: flex-end;
}
.form-inline .fld { margin: 0; }
.form-inline .btn { width: auto; }
.adm-filter { margin-bottom: 16px; }

/* Уточнение даты (UI-4) — вторая форма в карточке статуса, и её надо отделить: два поля
   типа `date` подряд, одно в форме перевода, другое здесь. Без черты сверху они читаются
   как одна форма с двумя датами, а это разные действия с разными последствиями. */
.adm-eta {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}
.adm-eta h3 { margin-top: 0; }
.adm-eta-now { margin: 0 0 12px; }
/* Кнопка по содержимому: полоса во всю колонку рядом с такой же полосой «Перевести»
   означала бы два равных по весу действия, а уточнение даты — заведомо мельче перевода. */
.adm-eta .btn { width: auto; }

.ord-client { font-size: 14px; }
.tag-claim {
  background: var(--notice-bg);
  color: var(--notice-ink);
  border-color: var(--notice-line);
}
.tag-warn {
  background: var(--caution-bg);
  color: var(--caution-ink);
  border-color: var(--caution-line);
}
.flash-warn {
  background: var(--notice-bg);
  color: var(--notice-ink);
  border-color: var(--notice-line);
}

/* Журнал: моноширинное имя действия — его сверяют с логами буквально. */
.adm-audit { font-size: 14px; }
.adm-audit-row {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 12px;
  padding: 8px 0;
  border-bottom: 1px solid var(--line);
}
.adm-audit-row:last-child { border-bottom: 0; }
.adm-action { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.adm-details {
  flex-basis: 100%;
  word-break: break-word;
}