/* 021: те же рабочие вкладки и действия; подробности не занимают всю первую страницу. */
#couriers { gap: var(--space-3); }
#couriers [hidden] { display: none !important; }
#couriers .oc-couriers__top:empty { display: none; }
#couriers .oc-couriers__views { padding: var(--space-1); }
#couriers .oc-couriers__views .segments__item {
  min-height: var(--tap); padding-inline: var(--space-4); font-weight: var(--weight-semibold);
}
#couriers .oc-couriers__main { gap: var(--space-3); }
#couriers .feed-section__head { margin-bottom: var(--space-2); }
#couriers .feed-section__head h2 { font-size: var(--title-sm); }
#couriers .oc-onshift { gap: var(--space-2) var(--space-4); }
#couriers .oc-onshift .courier-card__meta { margin: 0; }
#couriers .oc-onshift .courier-card__name { overflow-wrap: anywhere; font-size: var(--text-lg); }
#couriers .oc-onshift .courier-card__head { grid-area: who; }
#couriers .oc-onshift .courier-card__meta { grid-area: plan; }
#couriers .oc-onshift .oc-atts { grid-area: attendance; margin: 0; }
#couriers .oc-onshift .courier-card__actions { grid-area: actions; align-items: start; }
#couriers .oc-onshift .oc-shift-details { grid-area: details; }
#couriers .oc-onshift {
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas: "who" "plan" "attendance" "details" "actions";
}
#couriers .oc-onshift :is(.btn, .icon-btn),
#couriers .oc-off :is(.btn, .icon-btn),
#couriers .oc-courier-link .btn,
#couriers .oc-letin,
#couriers .oc-shift-modes .segments__item {
  min-height: var(--tap); min-width: var(--tap);
}
.oc-workspace-details { min-width: 0; }
.oc-workspace-details > summary {
  cursor: pointer; min-height: var(--tap); padding-block: var(--space-3);
  font-size: var(--text-sm); font-weight: var(--weight-semibold); line-height: var(--leading-title);
}
.oc-workspace-details > summary::marker { color: var(--muted); }
.oc-workspace-details > summary:focus-visible,
.oc-shift-points > summary:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; border-radius: var(--radius-sm); }
.oc-shift-details .courier-card__fresh { padding-bottom: var(--space-2); }
.oc-plan-help { color: var(--muted); }
.oc-plan-help > summary { width: fit-content; }
.oc-plan-help .oc-plan__rule { margin: 0 0 var(--space-2); }
.oc-directory-tools { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-4); }
.oc-directory-tools > .search { flex: 1 1 20rem; max-width: 36rem; min-width: 0; }
.oc-directory-tools .search input { min-height: var(--tap); }
/* «Не на смене» группами (Р523): заголовок группы — строкой с числом, окно часов — следом у «Закончили смену»,
   «Позже сегодня» — тише, «Выходной» свёрнут. */
#couriers .oc-off-groups { display: grid; gap: var(--space-3); min-width: 0; }
#couriers .oc-off-group { display: grid; gap: var(--space-1); min-width: 0; }
#couriers .oc-off-group__head { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-1) var(--space-2); }
#couriers .oc-off-group__head h3 { margin: 0; font-size: var(--text-sm); font-weight: var(--weight-semibold); }
#couriers .oc-off-group.is-quiet .oc-off-group__head h3 { color: var(--muted); }
#couriers .oc-off-group__head .feed-closed__hours { margin: 0; }
#couriers details.oc-off-group > summary { min-height: var(--tap); list-style: none; cursor: pointer; }
#couriers details.oc-off-group > summary::-webkit-details-marker { display: none; }
#couriers details.oc-off-group > summary:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; border-radius: var(--radius-sm); }
.oc-off-group__chevron { width: var(--icon-md); height: var(--icon-md); color: var(--muted); transition: transform var(--motion-fast) var(--ease); }
details.oc-off-group[open] .oc-off-group__chevron { transform: rotate(180deg); }
#couriers .oc-off li { padding: var(--space-2) var(--space-3); gap: var(--space-2) var(--space-3); }
#couriers .oc-off li > span:nth-child(2) { min-width: 0; }
#couriers .oc-off li small { display: block; }
#couriers .oc-courier-link {
  display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--space-1) var(--space-4);
  align-items: start; border-top: 1px solid var(--border2); padding-top: var(--space-2);
}
#couriers .oc-courier-link__row { min-height: var(--tap); align-self: start; justify-content: flex-end; }
#couriers .oc-courier-link__row code { overflow-wrap: anywhere; min-width: 0; }
#couriers .oc-courier-link .oc-qr { grid-column: 1 / -1; }
.oc-shift-points { position: relative; width: min(100%, 38rem); min-width: 0; }
.oc-shift-points > summary {
  display: flex; gap: var(--space-2); align-items: center; min-height: var(--tap); cursor: pointer;
  border: 1px solid var(--border); border-radius: var(--radius-md); padding: var(--space-2) var(--space-3);
  background: var(--panel); list-style: none;
}
.oc-shift-points > summary::-webkit-details-marker { display: none; }
.oc-shift-points > summary > svg { width: var(--icon-md); height: var(--icon-md); flex: none; color: var(--muted); }
.oc-shift-points > summary > svg:last-child { margin-left: auto; }
.oc-shift-points > summary > span { display: grid; min-width: 0; }
.oc-shift-points small { display: block; font-size: var(--text-xs); color: var(--muted); font-weight: var(--weight-regular); }
.oc-shift-point-pop {
  position: absolute; z-index: 20; left: 0; right: 0; top: calc(100% + var(--space-1));
  border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--panel); box-shadow: var(--shadow-2);
  padding: var(--space-2); max-height: min(60vh, 28rem); overflow-y: auto; overscroll-behavior: contain;
}
.oc-shift-point-pop > .search { position: sticky; top: 0; background: var(--panel); z-index: 1; }
.oc-shift-point-pop input { min-height: var(--tap); }
.oc-shift-point-list { display: grid; margin-top: var(--space-2); }
.oc-shift-point-list .oc-shift-point {
  display: flex; justify-content: space-between; align-items: center; gap: var(--space-3); min-height: var(--tap);
  padding: var(--space-2); border: 0; background: transparent; text-align: left; white-space: normal;
}
.oc-shift-point-list .oc-shift-point > span { min-width: 0; overflow-wrap: anywhere; }
.oc-shift-point-list .oc-shift-point > small { text-align: right; flex: none; }
.oc-shift-point-list .oc-shift-point[aria-pressed="true"] { background: var(--tint); color: var(--accent); }
.oc-shift-point-list .oc-shift-point:hover { background: var(--cream); }
.sc-sheet :is(.icon-btn, .menu__item) { min-height: var(--tap); min-width: var(--tap); }

@media (min-width: 1000px) {
  #couriers .oc-onshift {
    grid-template-columns: minmax(13rem, 1fr) minmax(15rem, 1.3fr) minmax(12rem, auto);
    grid-template-areas: "who plan actions" "details attendance actions";
  }
  #couriers .oc-onshift .courier-card__actions { justify-content: flex-end; max-width: 26rem; }
}
@media (max-width: 767px) {
  #couriers .oc-couriers__views .segments__item { padding-inline: var(--space-1); }
  #couriers .oc-courier-link { grid-template-columns: minmax(0, 1fr); }
  #couriers .oc-courier-link__row { flex-wrap: wrap; justify-content: flex-start; }
  #couriers .oc-onshift .courier-card__actions { gap: var(--space-1) var(--space-2); }
  .oc-shift-point-list .oc-shift-point { flex-wrap: wrap; gap: var(--space-1); }
  .oc-shift-point-list .oc-shift-point > small { flex-basis: 100%; text-align: left; }
}