/* Оболочка отчётов спринта (shell.js): ☰ и вкладки слева сверху, наклейки действий справа.
   Цвета и размеры — токены poh-ds (poh-ds.css); вид — как в референсе владельца «карта акции» 2026-10-19. */
body { background: var(--ds-bg); color: var(--ds-text); font-family: var(--ds-font); }
header.legacy { display: none; }

/* ---------- верхняя строка ---------- */
.sh-top {
  flex: none; display: flex; align-items: center; gap: var(--ds-sp-2);
  padding: calc(var(--ds-sp-2) + env(safe-area-inset-top)) 48px var(--ds-sp-2) var(--ds-sp-3);
  background: var(--ds-bg); border-bottom: 1px solid var(--ds-line); min-width: 0;
}
.sh-burger {
  flex: none; width: var(--ds-tap); height: var(--ds-tap); display: grid; place-items: center; padding: 0;
  border: 0; border-radius: var(--ds-r-md); background: var(--ds-surface); color: var(--ds-text);
  box-shadow: var(--ds-shadow-1); cursor: pointer;
}
.sh-tabs {
  flex: none; display: flex; gap: 2px; padding: 3px; border-radius: var(--ds-r-md);
  background: var(--ds-surface); box-shadow: var(--ds-shadow-1);
}
.sh-tabs button {
  display: inline-flex; align-items: center; gap: 6px; min-height: 38px; padding: 0 var(--ds-sp-3);
  border: 0; border-radius: calc(var(--ds-r-md) - 3px); background: none; cursor: pointer;
  font: var(--ds-fw-medium) var(--ds-fs-caption)/1 var(--ds-font); color: var(--ds-text-2);
}
/* выбранная вкладка — тёмная плашка, как в референсе владельца */
.sh-tabs button[aria-selected="true"] { background: var(--ds-text); color: var(--ds-surface); }
.sh-team {
  min-width: 0; padding: 0 var(--ds-sp-2); border: 0; background: none; cursor: pointer;
  font: var(--ds-fw-medium) var(--ds-fs-caption)/1.2 var(--ds-font); color: var(--ds-text-2);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.sh-n {
  display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px;
  border-radius: var(--ds-r-pill); background: var(--ds-danger); color: var(--ds-on-accent);
  font: var(--ds-fw-bold) var(--ds-fs-label)/1 var(--ds-font); font-variant-numeric: tabular-nums;
}
.sh-actions { margin-left: auto; flex: none; display: flex; align-items: center; gap: var(--ds-sp-2); }
.sh-act {
  display: inline-flex; align-items: center; gap: 6px; min-height: 38px; padding: 0 var(--ds-sp-3);
  border: 0; border-radius: var(--ds-r-md); background: var(--ds-surface); box-shadow: var(--ds-shadow-1); cursor: pointer;
  font: var(--ds-fw-medium) var(--ds-fs-caption)/1 var(--ds-font); color: var(--ds-text);
}
.sh-act[aria-expanded="true"] { background: var(--ds-surface-2); box-shadow: none; }
.sh-act.is-on { background: var(--ds-text); color: var(--ds-surface); }
.sh-act.is-due:not(.is-on) { background: var(--ds-danger); color: var(--ds-on-accent); }
.sh-n--quiet { background: var(--ds-surface-2); color: var(--ds-text); }
html:not([data-tab="sprint"]) [data-only="sprint"] { display: none; }
.sh-burger { position: relative; }
.sh-alarm { position: absolute; top: 8px; right: 8px; width: 8px; height: 8px; border-radius: 50%; background: var(--ds-danger); }

/* ---------- вкладки: видна только своя ---------- */
html:not([data-tab="blockers"]) #daily, html:not([data-tab="blockers"]) #daily-note,
html:not([data-tab="sprint"]) #report, html:not([data-tab="sprint"]) #report-error,
html:not([data-tab="sprint"]) #empty, html:not([data-tab="business"]) #biz,
html:not([data-tab="risks"]) #risks { display: none !important; }
#daily, #biz, #risks { flex: 1; width: 100%; border: 0; background: var(--ds-bg); }

.sh-act:focus-visible, .sh-tabs button:focus-visible, .sh-burger:focus-visible, .sh-item:focus-visible {
  outline: 2px solid var(--ds-accent); outline-offset: 2px;
}

.sh-pop {
  position: fixed; z-index: 31; width: min(320px, calc(100vw - 60px)); max-height: 70vh; overflow-y: auto;
  padding: var(--ds-sp-1) var(--ds-sp-4); border-radius: var(--ds-r-lg); background: var(--ds-surface); box-shadow: var(--ds-shadow-2);
}

/* ---------- строки меню и всплывающего ---------- */
.sh-item {
  display: flex; align-items: center; gap: var(--ds-sp-3); width: 100%; min-height: var(--ds-tap);
  padding: var(--ds-sp-3) 0; border: 0; background: none; cursor: pointer; text-align: left;
  font: var(--ds-fw-medium) var(--ds-fs-body)/var(--ds-lh) var(--ds-font); color: var(--ds-text);
}
.sh-item + .sh-item { border-top: 1px solid var(--ds-line); }
.sh-item svg { flex: none; color: var(--ds-text-2); }
.sh-item__main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.sh-item__main b { font-weight: var(--ds-fw-medium); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sh-item__main small { font: var(--ds-fw-regular) var(--ds-fs-caption)/var(--ds-lh) var(--ds-font); color: var(--ds-text-2);
                       white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sh-item__main small:empty { display: none; }
.sh-item__end { flex: none; font-size: var(--ds-fs-caption); color: var(--ds-text-2); font-variant-numeric: tabular-nums; }
.sh-item__end.is-hot { color: var(--ds-danger); font-weight: var(--ds-fw-medium); }
.sh-item--team[aria-current="true"] .sh-item__main b { font-weight: var(--ds-fw-bold); }
.sh-item--team[aria-current="true"] { background: var(--ds-accent-soft); margin: 0 calc(-1 * var(--ds-sp-3)); padding-left: var(--ds-sp-3);
                                       padding-right: var(--ds-sp-3); width: calc(100% + 2 * var(--ds-sp-3)); border-radius: var(--ds-r-md); }
.sh-item--team[aria-current="true"] + .sh-item, .sh-item + .sh-item--team[aria-current="true"] { border-top-color: transparent; }

/* ---------- меню ☰ ---------- */
.sh-scrim { z-index: 40; }
.sh-menu {
  position: fixed; top: 0; bottom: 0; left: 0; z-index: 41; width: min(340px, 100vw); overflow-y: auto;
  padding: calc(var(--ds-sp-5) + env(safe-area-inset-top)) var(--ds-sp-5) var(--ds-sp-5);
  background: var(--ds-surface); box-shadow: var(--ds-shadow-2);
}
.sh-menu__head { display: flex; align-items: center; justify-content: space-between; gap: var(--ds-sp-2); }
.sh-fresh { display: inline-flex; align-items: center; gap: var(--ds-sp-2); font-size: var(--ds-fs-caption); color: var(--ds-text-2); }
.sh-x { width: 36px; height: 36px; display: grid; place-items: center; padding: 0; border: 0; border-radius: var(--ds-r-pill);
        background: none; color: var(--ds-text-2); cursor: pointer; }
.sh-menu__title { margin: var(--ds-sp-3) 0 var(--ds-sp-4); font: var(--ds-fw-bold) var(--ds-fs-display)/1.15 var(--ds-font); letter-spacing: -.4px; }
.sh-cta {
  width: 100%; min-height: 52px; border: 0; border-radius: var(--ds-r-lg); cursor: pointer;
  background: var(--ds-text); color: var(--ds-surface); font: var(--ds-fw-medium) var(--ds-fs-title)/1 var(--ds-font);
}
.sh-cta[disabled] { opacity: .5; cursor: default; }
.sh-cta-note { margin: var(--ds-sp-2) 0 0; font-size: var(--ds-fs-caption); color: var(--ds-text-2); }
#status { margin: 0 0 var(--ds-sp-3); font-size: var(--ds-fs-caption); color: var(--ds-text-2); }
#status:empty { display: none; }
#status .err { color: var(--ds-danger); }
.sh-menu__list { margin-top: var(--ds-sp-4); padding-top: var(--ds-sp-2); border-top: 1px solid var(--ds-line); }
.sh-label { margin: var(--ds-sp-5) 0 var(--ds-sp-1); font: var(--ds-fw-bold) var(--ds-fs-label)/1.3 var(--ds-font);
            letter-spacing: .4px; text-transform: uppercase; color: var(--ds-text-2); }
.sh-label + .sh-menu__list { margin-top: 0; padding-top: 0; border-top: 0; }

/* ---------- инструкции ---------- */
.sh-help {
  position: fixed; z-index: 43; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: min(560px, calc(100vw - 32px)); max-height: 82vh; overflow-y: auto;
  padding: var(--ds-sp-4) var(--ds-sp-5) var(--ds-sp-5); border-radius: var(--ds-r-lg);
  background: var(--ds-surface); box-shadow: var(--ds-shadow-2);
}
#shHelpScrim { z-index: 42; }
.sh-help__head { display: flex; align-items: center; justify-content: space-between; font-size: var(--ds-fs-title); }
.sh-help__body h3 { margin: var(--ds-sp-4) 0 var(--ds-sp-2); font-size: var(--ds-fs-body); }
.sh-help__body ul { margin: 0; padding-left: 18px; color: var(--ds-text-2); font-size: var(--ds-fs-caption); line-height: 1.5; }
.sh-help__body li + li { margin-top: var(--ds-sp-1); }

/* ---------- телефон: действия — второй строкой ---------- */
@media (max-width: 600px) {
  .sh-top { flex-wrap: wrap; padding-left: var(--ds-sp-2); padding-right: var(--ds-sp-2); gap: var(--ds-sp-1) var(--ds-sp-1); }
  .sh-tabs button { padding: 0 8px; }
  .sh-team { display: none; }
  .sh-actions { width: 100%; justify-content: flex-end; }
  html:not([data-tab="sprint"]) .sh-actions { width: auto; }
  .sh-pop { left: var(--ds-sp-2); right: var(--ds-sp-2) !important; width: auto; }   /* во всю ширину, не за край */
}

.sh-select { width: 100%; min-height: 44px; padding: 0 var(--ds-sp-3); border: 1px solid var(--ds-border, #c9ced6); border-radius: 8px;
  background: var(--ds-surface, #fff); color: inherit; font: inherit; }
