/* «Требуют внимания» одной строкой и явки значком (пачка 1а: Р352-2, Р353-3, Р354-2; замечания ЗВ7–ЗВ9, ЗВ12, ЗВ19).
   Строка (`js/issues.js`) — и на «Заказах», и на «Курьерах»: значок с причиной в окошке, суть, точка и «12 мин»,
   действия значками справа, «глаз»; на узкой ленте суть переносится, а значки остаются справа. Явка точки в карточке
   «На смене» — значком состояния или значком с окошком (`js/couriers/attendance.js`). Красное число у «Курьеров» в шапке
   и скрытые из расписания курьеры — свёрнутой строкой «Скрытые: 12». Размеры — токены, цвета — роли темы. */

/* ── строка «Требуют внимания» ── */
.issue.oc-issue { grid-template-columns: auto minmax(0, 1fr) auto; padding-block: 2px; }
.issue--info { box-shadow: inset var(--space-1) 0 0 var(--accent); }
.oc-issue > .oc-hint { align-self: center; }
.oc-issue .issue__text { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 var(--space-2); }
.issue.oc-issue .issue__title { min-width: 0; overflow: visible; white-space: normal; overflow-wrap: anywhere; }
.oc-issue .issue__meta { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.issue__ago { font-variant-numeric: tabular-nums; }
.issue.oc-issue .issue__actions { grid-column: 3; flex-wrap: nowrap; justify-content: flex-end; gap: 2px; }
.icon-btn.oc-issue__act { width: var(--control-sm); height: var(--control-sm); color: var(--muted); }
.icon-btn.oc-issue__act:hover, .icon-btn.oc-issue__act:focus-visible { color: var(--ink); }
.icon-btn.oc-issue__act svg { width: var(--icon-md); height: var(--icon-md); }
.icon-btn.oc-issue__act[data-accept], .icon-btn.oc-issue__act[data-resend] { color: var(--accent); }
.icon-btn.oc-issue__act:disabled { opacity: 0.45; cursor: default; }
/* Пять действий значками («не готов — решите»: ждать, отвезти остальные, снять, открыть, скрыть; шаг 2в) — на узкой
   ленте вторым рядом под сутью: справа они сжимали суть в столбик по слогу. */
@container feed (max-width: 559px) {
  .issue.oc-issue:has(> .issue__actions > :nth-child(5)) > .issue__actions { grid-column: 2 / -1; justify-content: flex-start; }
}
/* Вопрос «Это не он» — второй строкой под сутью. */
.oc-issue > .oc-confirm { grid-column: 2 / -1; margin-block: var(--space-1); }
@media (max-width: 767px) {
  .icon-btn.oc-issue__act { width: var(--tap); height: var(--tap); }
}

/* ── явки по точкам: значок с окошком — размером значков соседних строк, нажать — не меньше пальца ── */
.oc-att:has(> .oc-hint) { align-items: center; }
.oc-atts .oc-hint__btn { width: var(--icon-lg); height: var(--icon-lg); }
.oc-atts .oc-hint__btn svg { width: var(--icon-sm); height: var(--icon-sm); }
.oc-att > .oc-hint { margin: -2px calc(var(--space-1) * -1); }
@media (max-width: 767px) {
  .oc-atts .oc-hint__btn { width: var(--tap); height: var(--tap); }
  .oc-att > .oc-hint { margin: calc(var(--space-1) * -1) calc(var(--space-2) * -1) calc(var(--space-1) * -1) calc(var(--space-3) * -1); }
}

/* ── красное число у «Курьеров» в шапке ── */
.staff-sections__n { display: inline-flex; align-items: center; justify-content: center; min-width: var(--space-5); height: var(--space-5);
  margin-left: var(--space-2); padding: 0 var(--space-1); border-radius: var(--radius-pill); background: var(--err); color: var(--on-accent);
  font-family: var(--font-text); font-size: var(--text-xs); font-weight: var(--weight-semibold); line-height: 1; }

/* ── «Курьеры ваших точек»: скрытые из расписания — свёрнутой строкой, раскрытые — серыми ── */
.oc-off li.oc-off__hidden { display: flex; align-items: center; gap: var(--space-1); padding-block: var(--space-1); }
.oc-off__hidden .btn svg { width: var(--icon-sm); height: var(--icon-sm); }
.oc-off li.is-hidden, .oc-off li.is-hidden b { color: var(--muted); }
.oc-off li.is-hidden .courier-card__dot { opacity: 0.5; filter: grayscale(1); }