/* «Что вижу» на всю операторскую (Р522; Р528 — предложения 1, 2, 3, 9; Р539; этап 6 `docs/design/operator-workspace-v2.md`
   часть 1 §9, Т6; макеты 025 раздел 2 и 026):
   - одна кнопка в шапке на всех вкладках — заведение и точки (js/seesbar.js); на телефоне — словами, без значка-глаза;
   - меню: заведение, «Все точки» и галочки точек полным именем, последняя не снимается, «Готово»;
   - полоса «Видна не вся сеть · Показать все» под шапкой на всех вкладках, пока выбор сужен;
   - точка вне выбора — серой подписью (у курьера «— не в «Что вижу»») и серым флажком на карте.
   Размеры — только токенами, цвета — только ролями темы: сторож tests/design/test_tokens_guard.py читает и этот файл. */

:root {
  --ops-sees-w: 384px;      /* меню «Что вижу» */
  --ops-sees-value: 280px;  /* слова на кнопке шапки — длинное имя точки обрезается многоточием */
  --ops-strip: 28px;        /* полоса «Видна не вся сеть» */
}

/* ── Кнопка в шапке ──────────────────────────────────────────────────────────────────────────────────────────────── */
.staff-bar .oc-sees { flex: 0 1 auto; min-width: 0; }
.staff-bar .oc-sees .staff-rights { max-width: 100%; min-width: 0; }
.staff-bar .oc-sees .staff-rights__text { min-width: 0; }
.staff-bar .oc-sees .staff-rights__value {
  max-width: var(--ops-sees-value); overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.staff-bar .oc-sees .staff-rights__label { flex: none; white-space: nowrap; }

/* ── Меню ────────────────────────────────────────────────────────────────────────────────────────────────────────── */
.oc-sees .oc-sees__menu {
  left: auto; right: 0; width: min(var(--ops-sees-w), calc(100vw - var(--space-4))); min-width: 0;
  max-height: calc(100dvh - var(--ops-bar) - var(--space-4)); padding: var(--space-2);
}
.oc-sees__top { display: grid; gap: 2px; margin-bottom: var(--space-1); padding: var(--space-1) var(--space-2) var(--space-2); }
.oc-sees__top b { font-size: var(--text-md); }
.oc-sees__h {
  margin: var(--space-2) var(--space-2) var(--space-1); color: var(--muted); font-size: var(--ops-text-sm);
  font-weight: var(--weight-semibold);
}
.oc-sees__menu .menu__item { min-height: var(--ops-row); gap: var(--space-2); padding: var(--space-1) var(--space-2); }
.oc-sees__menu .menu__label { display: grid; line-height: var(--leading-title); white-space: normal; }
.oc-sees__name { font-weight: var(--weight-semibold); overflow-wrap: anywhere; }
.oc-sees__n { flex: none; color: var(--muted); font-size: var(--ops-text-sm); }
.oc-sees__menu .input[type="search"] { width: calc(100% - var(--space-4)); margin: 0 var(--space-2) var(--space-1); }
/* Заведение — кнопками, нажатое — точкой-кружком (выбор заведения переключает всю операторскую). */
.oc-sees__venue[aria-pressed="true"] { background: var(--tint); font-weight: var(--weight-semibold); }
.oc-sees__dot {
  flex: none; width: var(--icon-sm); height: var(--icon-sm); border: 2px solid var(--gold2); border-radius: var(--radius-pill);
  background: var(--panel);
}
.oc-sees__venue[aria-pressed="true"] .oc-sees__dot { border-color: var(--gold); background: var(--gold); box-shadow: inset 0 0 0 var(--space-1) var(--panel); }
/* Последняя отмеченная точка не снимается (Р522): галочка не нажимается, но видна отмеченной; почему — строкой ниже. */
.oc-sees__menu .menu__item.is-lone { cursor: default; }
.oc-sees__menu .menu__item.is-lone input { cursor: not-allowed; }
.oc-sees__last { margin: var(--space-1) var(--space-2) 0; color: var(--muted); font-size: var(--ops-text-sm); }
.oc-sees__foot {
  margin: var(--space-2) 0 0; padding: var(--space-2); border-radius: var(--radius-md); background: var(--tint);
  color: var(--ink); font-size: var(--ops-text-sm); line-height: var(--leading-title);
}
.oc-sees__acts { margin-top: var(--space-2); }

/* ── Полоса «Видна не вся сеть» ──────────────────────────────────────────────────────────────────────────────────── */
.oc-seestrip {
  display: flex; flex: none; align-items: center; gap: var(--space-2); min-height: var(--ops-strip); padding: 0 var(--ops-edge);
  border-bottom: 1px solid var(--border); background: var(--tint); color: var(--ink); font-size: var(--ops-text-sm);
}
.oc-seestrip > svg { flex: none; width: var(--icon-sm); height: var(--icon-sm); color: var(--accent); }
.oc-seestrip__text { flex: 1 1 auto; min-width: 0; margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* Кнопка — ниже полосы (у `.btn--sm` своя высота 32): полоса ровно 28, обзор «Загрузки» вычитает её (load-overview.css). */
.oc-seestrip .oc-seestrip__all { flex: none; min-height: calc(var(--ops-strip) - var(--space-1)); padding-block: 0; }

/* ── Точка вне «Что вижу» — серым ─────────────────────────────────────────────────────────────────────────────────── */
/* Бледнее соседних имён: строка точек курьера и так приглушена, точка вне выбора должна читаться «не здесь». */
.oc-out { color: var(--muted); opacity: 0.7; }
.oc-out small { font-size: var(--ops-text-xs); }
.oc-crew__points .oc-out { display: block; }
/* Флажок на карте: серый, без кольца выбора и без нажатия. */
.ops-flag.is-out { --fc: var(--muted); opacity: 0.75; }
.ops-flag.is-out .place-pin__face { cursor: default; filter: grayscale(1); }

/* ── Телефон и планшет: слова вместо значка-глаза (предложение 9) ─────────────────────────────────────────────────── */
/* До 1100 шапка прежде оставляла от «Что вижу» один глаз (staff.css) — теперь слова: «Что вижу» мелко, выбор крупнее. */
@media (max-width: 1099px) {
  .staff-bar .btn.staff-rights, .staff-bar .staff-rights {
    width: auto; max-width: 100%; min-width: 0; min-height: var(--tap); padding: 0 var(--space-2); justify-content: flex-start;
  }
  .staff-bar .staff-rights > svg:first-child { display: none; }
  .staff-bar .staff-rights .staff-rights__text {
    position: static; display: grid; flex: 0 1 auto; gap: 0; width: auto; height: auto; min-width: 0; overflow: hidden;
    clip: auto; line-height: var(--leading-title); text-align: left;
  }
  .staff-bar .staff-rights .staff-rights__label { color: var(--muted); font-size: var(--ops-text-xs); }
  .staff-bar .staff-rights .staff-rights__label::after { content: none; }
  .staff-bar .staff-rights .staff-rights__value { font-size: var(--ops-text-sm); }
  .staff-bar .staff-rights .staff-ctl__chevron {
    position: static; flex: none; width: var(--icon-sm); height: var(--icon-sm); overflow: visible; clip: auto;
  }
}
@media (max-width: 767px) {
  /* Первая строка шапки: знак, «Что вижу» — всё свободное место, звук и «Выйти»; разделы — второй строкой. */
  .staff-bar .staff-bar__end { flex: 1 1 0; min-width: 0; margin-left: 0; }
  .staff-bar .oc-sees { flex: 1 1 auto; }
  .staff-bar .staff-rights .staff-rights__value { max-width: 100%; }
  .oc-sees .oc-sees__menu { position: fixed; top: calc(var(--ops-bar) + var(--space-1)); left: var(--space-2); right: var(--space-2); width: auto; }
  .oc-seestrip { padding: var(--space-1) var(--space-3); }
  .oc-seestrip .oc-seestrip__all { min-height: var(--tap); }
}