/* «Список» и «История» — вариант Б (Р528, Р534, Р539; этап 5 `docs/design/operator-workspace-v2.md` §8, Т1, Т6; макет
   026): таблица слева, справа «Курьеры» над картой (раскладку ставит js/orders/layout.js). Столбцы Время · Номер · Сумма ·
   Состояние · Канал · Способ · Оплата · Точка · зона · «на карте» — на любой ширине компьютера: у значков мелкая подпись
   словами (10,5), «Точка · зона» — двумя строками, строка — 36. Таблица не уже 740: теснее (680–740) листается вбок
   внутри своей панели, страница — нет; уже 680 — строка карточкой, как прежде (oc.css). Строка и метка подсвечивают
   друг друга (предложение 4, js/orders/glance.js). Прошлый день «Истории» — «Кто вёз» и «Сейчас ждут курьера» в колонке
   «Курьеры», «Карта дня» без мест курьеров (предложение 5, js/orders/pastday.js).
   Размеры — только токенами, цвета — только ролями темы: сторож tests/design/test_tokens_guard.py читает и этот файл. */

:root {
  --ops-table-min: 740px;  /* таблица не уже — теснее листается вбок (Т1) */
  --ops-cap: 10.5px;       /* подпись под значком канала, способа и оплаты (§5) */
  --ops-ic: 14px;          /* значок в ячейке таблицы */
  --ops-cell-max: 180px;   /* «Точка · зона»: длиннее — многоточием, целиком — подсказкой */
  --ops-sub-max: 150px;    /* подпись под номером («Иван Петров · 2-я остановка…»): таблица 760 помещается целиком */
  --ops-z-glance: 5;       /* подсвеченная метка — над выбранной (operator.css: 4) */
}

/* ── Таблица (шире 680) ──────────────────────────────────────────────────────────────────────────────────────────── */
@container feed (min-width: 680px) {
  /* Тело панели (`#feed-body`) листается и вбок: обёртка таблицу не обрезает, заголовок столбцов стоит сверху. */
  #feed .oc-lt__wrap { overflow: visible; }
  #feed .oc-lt { min-width: var(--ops-table-min); }
  #feed .oc-lt td, #feed .oc-lt td.oc-lt__no, #feed .oc-lt td.oc-lt__point, #feed .oc-lt td.oc-lt__method,
  #feed .oc-lt td.oc-lt__pay { white-space: nowrap; }
  #feed .oc-lt :is(th, td):is(.oc-lt__h-chan, .oc-lt__h-method, .oc-lt__h-pay, .oc-lt__chan, .oc-lt__method, .oc-lt__pay) {
    text-align: center;
  }
  /* Значок и под ним подпись: «сайт», «доставка», «наличные». */
  #feed .oc-lt__ic { display: inline-grid; justify-items: center; row-gap: 1px; line-height: 1; }
  #feed .oc-lt__ic svg { width: var(--ops-ic); height: var(--ops-ic); }
  #feed .oc-lt__word { color: var(--muted); font-size: var(--ops-cap); line-height: 1; }
}

/* Номер: квадрат цвета метки и номер, под ними одной строкой — тревога, кто везёт, «вёз …». */
#feed .oc-lt__top { display: flex; align-items: center; gap: var(--ops-tight); }
/* Своим мелким шрифтом, а не шрифтом ячейки: иначе строка подписи выше на высоту строки 13 и строка таблицы — 37. */
#feed .oc-lt__sub {
  display: block; max-width: var(--ops-sub-max); overflow: hidden; font-size: var(--ops-text-xs); line-height: var(--leading-title);
  text-overflow: ellipsis; white-space: nowrap;
}
#feed .oc-lt__sub .oc-lt__why { display: inline; }
#feed .oc-lt__sub > small + small::before { content: " · "; color: var(--muted); }
/* «Точка · зона»: точка, под ней — зона или «самовывоз». */
#feed .oc-lt__pt { display: grid; max-width: var(--ops-cell-max); }
#feed .oc-lt__ptname, #feed .oc-lt__pt .oc-lt__zone { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#feed .oc-lt__ptname { color: var(--ink); }
#feed .oc-lt__pt .oc-lt__zone { color: var(--muted); font-size: var(--ops-text-xs); }
/* «на карте»: подсвечивает метку, ничего не закрывает. */
#feed .oc-lt td.oc-lt__map { width: var(--ops-small); padding-right: var(--ops-tight); }
#feed .oc-lt__tomap {
  display: inline-grid; place-items: center; width: var(--ops-small); height: var(--ops-small); padding: 0; border: 0;
  border-radius: var(--ops-ctl-radius); background: transparent; color: var(--accent); cursor: pointer;
}
#feed .oc-lt__tomap svg { width: var(--icon-sm); height: var(--icon-sm); }
#feed .oc-lt__tomap:hover, #feed .oc-lt__tomap.is-on { background: var(--tint); }
#feed .oc-lt__tomap:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }

/* Узко (до 680): строка карточкой — подпись под номером во всю ширину, «на карте» — в конце. */
@container feed (max-width: 679px) {
  #feed .oc-lt__sub { flex-basis: 100%; max-width: 100%; }
  #feed .oc-lt td.oc-lt__map { order: 9; width: auto; margin-left: auto; padding: 0; }
  #feed .oc-lt__pt { display: inline-flex; gap: var(--space-1); }
  #feed .oc-lt__pt .oc-lt__zone::before { content: "· "; }
}

/* ── Строка и метка подсвечивают друг друга (предложение 4) ──────────────────────────────────────────────────────── */
#feed .oc-lt__row:hover, #feed .oc-lt__row.is-glanced, #feed .order-row.is-glanced { background: var(--tint); }
#feed .oc-lt__row.is-glanced td:first-child { box-shadow: inset 2px 0 0 var(--accent); }
.ops-mark.is-glanced { z-index: var(--ops-z-glance); }
.ops-mark.is-glanced .ops-pin { outline: 2px solid var(--accent); outline-offset: 2px; transform: scale(1.3); }

/* ── Прошлый день «Истории»: «Сейчас ждут курьера» и «Кто вёз» в колонке «Курьеры» ──────────────────────────────── */
/* Живая часть колонки рисуется и звенит, как прежде, но не видна (crew.js `past`). */
#oc-crew .oc-crew__body.is-past > :not(.oc-past) { display: none; }
/* Узел колонки, а не класс страницы (у страницы прошлого дня — `oc-pastday`). */
div.oc-past { display: grid; align-content: start; }
.oc-past__now {
  display: flex; align-items: center; gap: var(--space-2); min-height: var(--ops-row); margin: 0; padding: 0 var(--space-1) 0 var(--ops-pad);
  border-bottom: 1px solid var(--border2); background: color-mix(in srgb, var(--going) 12%, var(--panel)); font-size: var(--ops-text);
}
.oc-past__now > svg { flex: none; width: var(--icon-sm); height: var(--icon-sm); color: var(--going); }
.oc-past__now b.is-hot { color: var(--err); }
.oc-past__today.btn { min-height: var(--ops-small); margin-left: auto; font-size: var(--ops-text-sm); }
.oc-past .oc-crew__h { display: flex; align-items: center; gap: var(--space-2); }
.oc-past__note { margin-left: auto; color: var(--muted); font-size: var(--ops-text-xs); font-weight: var(--weight-regular); }
.oc-past__list { margin: 0; padding: 0; list-style: none; }
.oc-past__who {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--space-2); min-height: var(--ops-row);
  padding: 0 var(--ops-pad); border-bottom: 1px solid var(--border2); font-size: var(--ops-text);
}
/* Кружок курьера не нажимается — одного размера на любом экране. */
.oc-past__who .courier-card__dot { width: var(--icon-lg); height: var(--icon-lg); font-size: var(--ops-text-sm); }
.oc-past__name { min-width: 0; overflow: hidden; font-weight: var(--weight-semibold); text-overflow: ellipsis; white-space: nowrap; }
.oc-past__n { color: var(--muted); font-size: var(--ops-text-sm); white-space: nowrap; }
.oc-past__none { margin: 0; padding: var(--space-2) var(--ops-pad); color: var(--muted); font-size: var(--ops-text-sm); }
/* «Карта дня»: мест курьеров сейчас на ней нет — и кнопки «Курьеры» в её заголовке тоже. */
body.oc-pastday #staff-side .oc-gps-tools, body.oc-pastday #staff-side > .oc-gps { display: none; }