/* admin_nav.css — каркас админки (этап 1 «Каркас и честные цифры», docs/admin-redesign/README.md
 * §2, §6): шапка «Админка · обновлено N сек · Обновить», полоса 7 разделов со счётчиками,
 * подразделы, раздел «По статусам», фильтр приглашений, «Функции». Поверх style.css / vault.css,
 * те же токены; новые классы — adm-*. Вне слоя responsive: перебивает общие .tabs телефона
 * (прокрутка вбок), у админки все разделы видны сразу.
 * Телефон: шапка в одну строку, полоса разделов липнет под .m-header (60 точек) в два ряда
 * (4 + 3), нижняя полоса приложения прежняя. Под пальцем (pointer: coarse) цели не меньше 44.
 * Ревью 18.10: счётчик — в углу вкладки, вне потока: приходит он или уходит, вкладки стоят на месте
 * (раньше «Ночь» уезжала на 41 точку и нажатие попадало в соседнюю); подписи подразделов в одну строку.
 */
:root {
  --adm-c1: #3987e5;   /* синий — готово */
  --adm-c3: #199e70;   /* бирюзовый — ждут выхода */
  --adm-c4: #c98500;   /* жёлтый — очередь */
  --adm-c5: #d55181;   /* малиновый — пауза */
  --adm-c-other: #5c616e;
}

.adm-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* ── Шапка ── */
.adm-head { align-items: center; }
.adm-head-t { min-width: 0; }
.adm-updated { font-size: 12px; color: var(--text-dim); min-height: 1.3em; }
.adm-updated:empty::before { content: '\00a0'; }   /* «Функции» без данных — шапка той же высоты */
.adm-refresh { display: inline-flex; align-items: center; gap: 6px; flex: none; }
.adm-refresh[aria-busy="true"] { opacity: .6; cursor: progress; }   /* не disabled: фокус остаётся на кнопке */
.adm-updated.adm-bad { color: var(--danger, #e5484d); }
.adm-pane:focus { outline: none; }   /* фокус после ссылки из раздела (tabindex=-1) — без рамки */

/* ── Разделы ── */
#page-admin .adm-nav { flex-wrap: wrap; overflow: visible; margin-bottom: 12px; }
.adm-nav .adm-tab { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  font-size: 13px; padding: 7px 14px; text-decoration: none; }
/* Счётчик — в правом верхнем углу, вне потока: ширина и место вкладки от него не зависят. Нажатие
   по значку проходит к тому, что под ним (граница вкладки та же, что без значка). */
.adm-tab > [data-adm-badge], .adm-subtab > [data-adm-badge] { position: absolute; top: -10px; right: -10px; z-index: 1;
  pointer-events: none; line-height: 0; }
.adm-nav .adm-tab:focus-visible, .adm-subtab:focus-visible, .adm-signs a:focus-visible, .adm-chip:focus-visible {
  outline: 2px solid var(--accent); outline-offset: 2px; }
.adm-long { display: inline; }
.adm-short { display: none; }
.adm-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 18px; height: 18px;
  padding: 0 5px; border-radius: 9px; font: 600 11px/1 var(--font-mono, monospace);
  background: var(--border-strong, #3a3f4a); color: var(--text); }
.adm-badge.warn { background: var(--warning, #f0b95e); color: #111; }
.adm-badge.bad { background: var(--danger, #e5484d); color: #fff; }

/* ── Подразделы ── */
.adm-subnavs { margin-bottom: 16px; }
.adm-subnavs:empty { display: none; }
.adm-subnav.seg { display: inline-flex; flex-wrap: wrap; gap: 2px; }
.adm-subnav.hidden { display: none; }
.adm-subtab { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 6px; font-size: 12.5px;
  font-weight: 600; padding: 6px 12px; border-radius: 7px; color: var(--text-dim); text-decoration: none; }
.adm-subtab:hover { color: var(--text); }
.adm-subtab.active { background: var(--accent); color: #fff; }
.adm-subtab.active .adm-badge:not(.warn):not(.bad) { background: rgba(255,255,255,.25); color: #fff; }

.adm-lead { font-size: 12.5px; color: var(--text-dim); max-width: 780px; margin: 0 0 12px; }

/* ── Ночь: три плитки по своим местам, порядок постоянный ── */
.adm-night-grid { margin-bottom: 16px; }
.adm-night-grid:empty { display: none; }

/* ── Загрузки → По статусам ── */
.adm-dl-bar { display: flex; height: 10px; border-radius: 5px; overflow: hidden; background: var(--bg-input);
  margin: 4px 0 14px; }
.adm-dl-seg { display: block; height: 100%; min-width: 2px; }
.adm-g-done { background: var(--adm-c1); }
.adm-g-failed { background: var(--danger, #e5484d); }
.adm-g-queue { background: var(--adm-c4); }
.adm-g-upcoming { background: var(--adm-c3); }
.adm-g-paused { background: var(--adm-c5); }
.adm-g-cancelled, .adm-g-other { background: var(--adm-c-other); }
.adm-dl-list { list-style: none; margin: 0; padding: 0; max-width: 640px; }
.adm-dl-row { display: grid; grid-template-columns: 12px minmax(0, 1fr) auto 64px; align-items: center; gap: 2px 10px;
  padding: 8px 0; border-bottom: 1px solid var(--border); font-size: 13px; }
.adm-dl-dot { width: 10px; height: 10px; border-radius: 50%; }
.adm-dl-name { color: var(--text); }
.adm-dl-n { font-variant-numeric: tabular-nums; color: var(--text-strong); text-align: right; }
.adm-dl-p { font-variant-numeric: tabular-nums; color: var(--text-dim); text-align: right; font-size: 12px; }
.adm-dl-sub { grid-column: 2 / -1; font-size: 11.5px; color: var(--text-dim); overflow-wrap: anywhere; }
.adm-dl-sub code { font-size: 11px; }
.adm-dl-row.adm-zero .adm-dl-name, .adm-dl-row.adm-zero .adm-dl-n { color: var(--text-dim); }
.adm-dl-row.adm-zero .adm-dl-dot { opacity: .35; }
.adm-dl-total { font-size: 12.5px; color: var(--text-mid); margin: 10px 0 0; }

/* ── Фильтр приглашений ── */
.adm-filter { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 10px; }
.adm-chip { display: inline-flex; align-items: center; gap: 6px; background: var(--bg-card); border: 1px solid var(--border);
  color: var(--text-mid); border-radius: 99px; padding: 5px 12px; font-size: 12px; font-weight: 600; cursor: pointer; }
.adm-chip b { font: 600 11px var(--font-mono, monospace); opacity: .85; }
.adm-chip[aria-pressed="true"] { background: var(--accent-soft); border-color: var(--accent); color: var(--text-strong); }

/* ── Функции: где сейчас переключатели ── */
.adm-signs { list-style: none; margin: 0; padding: 0; max-width: 640px; }
.adm-signs li + li { border-top: 1px solid var(--border); }
.adm-signs a { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 2px;
  color: var(--text); text-decoration: none; font-size: 13px; }
.adm-signs a::after { content: '›'; color: var(--text-dim); font-size: 16px; }
.adm-signs a span { margin-left: auto; color: var(--text-dim); font-size: 12px; text-align: right; }
.adm-signs a:hover b { color: var(--accent); }

/* ── Телефон и iPad вертикально (как .m-header приложения) ── */
@media (max-width: 767px), (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
  /* Шапка в одну строку: «Админка · обновлено N сек … ↻». */
  #page-admin .adm-head { flex-direction: row; flex-wrap: nowrap; align-items: center; justify-content: space-between;
    gap: 8px; margin-bottom: 8px; }
  #page-admin .adm-head-t { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
  #page-admin .adm-head .page-title { font-size: 20px; line-height: 1.2; flex: none; }
  #page-admin .adm-updated { font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
  .adm-refresh-t { display: none; }
  .adm-refresh { width: 40px; height: 40px; justify-content: center; padding: 0; font-size: 18px; }
  /* Полоса разделов липнет ПОД шапкой .m-header (60 точек), все 7 видны сразу. */
  #page-admin #adm-nav { position: sticky; top: calc(var(--safe-top) + 60px); z-index: 30;
    display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px;
    margin: 0 -14px 12px; padding: 6px 14px; border-radius: 0; border-left: 0; border-right: 0; background: var(--bg); }
  #page-admin #adm-nav .adm-tab { flex: none; min-width: 0; min-height: 40px; padding: 6px 4px; font-size: 12px; gap: 4px;
    text-align: center; white-space: nowrap; }
  #page-admin #adm-nav .adm-badge { min-width: 16px; height: 16px; font-size: 10px; padding: 0 4px; }
  /* Значок у края ячейки: в зазор сетки (4 точки), к соседу не залезает. */
  #page-admin #adm-nav .adm-tab > [data-adm-badge], .adm-subtab > [data-adm-badge] { top: -6px; right: -3px; }
  .adm-subnav.seg { display: flex; width: 100%; }
  .adm-subnav.hidden { display: none; }
  /* Подписи в одну строку, ширина по подписи; не влезли — второй ряд (flex-wrap), а не обрезка. */
  .adm-subtab { flex: 1 1 auto; min-width: 0; min-height: 36px; padding: 6px 8px; font-size: 12px; text-align: center;
    white-space: nowrap; }
  .adm-dl-row { grid-template-columns: 12px minmax(0, 1fr) auto 52px; }
  /* Перенесённые как есть формы не вылезают за край: «Сгенерировать» и поле выбора архива. */
  #admin-invites form { flex-wrap: wrap; }
  #admin-invites form input { flex: 1 1 160px; min-width: 0; width: auto; }
  #bk-restore-file { min-width: 0; max-width: 100%; }
}
/* Телефон: 7 разделов в два ряда (4 + 3); короткая подпись «ИИ». */
@media (max-width: 767px) {
  #page-admin #adm-nav { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  /* Длинная подпись остаётся именем ссылки для диктора (скрыта только глазу), короткая — aria-hidden. */
  .adm-nav .adm-long { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0);
    white-space: nowrap; }
  .adm-nav .adm-short { display: inline; }
  .adm-signs a { flex-wrap: wrap; }
  .adm-signs a span { margin-left: 0; width: 100%; text-align: left; order: 3; }
  .adm-signs a::after { margin-left: auto; }
}
/* Телефон боком (iPhone SE 568×320): шапка 60, два ряда разделов 106 и вкладки 56 липли — на содержимое
   оставалось 98 точек, подразделы первого экрана уходили под вкладки (смоук 19.10). Разделы — одним рядом
   и уезжают с прокруткой. */
@media (max-width: 767px) and (orientation: landscape) and (max-height: 430px) {
  #page-admin #adm-nav { position: static; grid-template-columns: repeat(7, minmax(0, 1fr)); }
}
/* Узкий телефон (320: SE, mini с «Увеличенным» экраном): «Загрузки» и «Downloads» влезают в ячейку. */
@media (max-width: 359px) {
  #page-admin #adm-nav .adm-tab { font-size: 11.5px; padding: 6px 2px; }
  .adm-subtab { padding: 6px 3px; font-size: 11.5px; }
}
/* Под пальцем — цели не меньше 44 точек. */
@media (pointer: coarse) {
  #page-admin #adm-nav .adm-tab, .adm-nav .adm-tab { min-height: 44px; }
  .adm-subtab, .adm-chip, .adm-signs a { min-height: 44px; }
  .adm-refresh { min-width: 44px; min-height: 44px; }
}
