/* Task Helper — bottom tab bar (phone), More sheet and the "+" action menu (job-intake.md §29 M1–M2; BRIEF-935).
   Copyright Rapid Surveys Pty Ltd. App tokens only. Motion 150–250 ms; none with prefers-reduced-motion. */
.nb-bar[hidden], .nb-plusw[hidden], .nb-menu[hidden] { display: none !important; }
/* ── the bottom bar: phone only ── */
.nb-bar { position: fixed; z-index: 46; left: 0; right: 0; bottom: 0; display: flex; padding: 0 env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
  background: var(--card); border-top: 1px solid var(--line); box-shadow: 0 -4px 16px rgba(20,28,40,.06); }
.nb-item { position: relative; flex: 1 1 0; min-width: 0; min-height: 60px; margin: 0; padding: 6px 2px 4px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
  background: none; border: 0; border-radius: 0; color: var(--muted); font-size: 12px; font-weight: 500; }
.nb-item span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nb-item[aria-current="page"] { color: var(--accent); font-weight: 700; }
.nb-item[aria-current="page"]::before { content: ''; position: absolute; top: 0; left: 22%; right: 22%; height: 3px; border-radius: 0 0 3px 3px; background: var(--accent); }   /* a bar + bold, not colour alone */
.nb-item:focus-visible { outline: 2px solid var(--accent); outline-offset: -4px; }
@media (min-width: 768px) { .nb-bar { display: none !important; } }
@media (max-width: 767px) {
  body.nb-on { padding-bottom: calc(64px + env(safe-area-inset-bottom)); }   /* nothing hides under the bar */
  body.nb-on #overviewSheet.mapview { bottom: calc(60px + env(safe-area-inset-bottom)); }
  body.nb-on .tb-views { display: none !important; }   /* the views live in the bar on a phone */
  body.nb-on .tasklist { padding-bottom: 88px; }       /* the last card clears the + button */
}
/* ── the "+" button and its menu ── */
.nb-plusw { position: fixed; z-index: 45; right: calc(16px + env(safe-area-inset-right)); bottom: calc(76px + env(safe-area-inset-bottom)); display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
@media (min-width: 768px) { .nb-plusw { right: 24px; bottom: 24px; } body.panel-open .nb-plusw { right: calc(var(--pw, var(--pw-def, 420px)) + 24px); } }   /* BRIEF-1260: follows the panel's width (it sat under the 560 px panel) */
@media (max-width: 767px) { body.panel-open .nb-plusw { display: none !important; } }
body.picking .nb-plusw, body.nb-noplus .nb-plusw { display: none !important; }   /* picking a spot (the page's pick, or any module's: add body.nb-noplus) — the + never covers the pick bar */   /* a panel fills the phone screen */
.nb-plus { width: 56px; height: 56px; padding: 0; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; box-shadow: 0 6px 18px rgba(20,28,40,.3); }
.nb-plus[aria-expanded="true"] svg { transform: rotate(45deg); }
.nb-plus svg { transition: transform .18s ease; }
.nb-menu { min-width: 200px; padding: 6px; background: var(--card); border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 10px 28px rgba(20,28,40,.18); }
.nb-mi { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 48px; margin: 0; padding: 0 12px; background: none; border: 0; border-radius: 8px; color: var(--ink); font-size: 15px; font-weight: 500; text-align: left; }
.nb-mi + .nb-mi { margin-top: 2px; }
.nb-mi:hover, .nb-mi:focus-visible { background: var(--hover); }
.nb-mi svg { flex: none; color: var(--muted); }
/* ── the More sheet ── */
.nb-moreov { z-index: 61; display: flex; align-items: flex-end; justify-content: center; }
.nb-sheet { width: 100%; max-width: 520px; max-height: 80vh; overflow-y: auto; padding: 0 12px calc(12px + env(safe-area-inset-bottom)); background: var(--card); border-radius: 16px 16px 0 0; }
.nb-sheethead { display: flex; align-items: center; min-height: 56px; }
.nb-sheethead h2 { flex: 1; margin: 0; font-size: 17px; }
.nb-morelist { list-style: none; margin: 0; padding: 0; }
.nb-moreitem { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 52px; margin: 0 0 4px; padding: 6px 12px; background: none; border: 1px solid var(--line); border-radius: 10px; color: var(--ink); font-size: 15px; font-weight: 500; text-align: left; }
.nb-moreitem[aria-current="page"] { font-weight: 700; box-shadow: inset 3px 0 0 var(--accent); }
.nb-moreitem:disabled { color: var(--muted); background: var(--bg); }
.nb-ml { display: flex; flex-direction: column; gap: 2px; }
.nb-why { font-size: 13px; font-weight: 400; color: var(--muted); }
.nb-none { padding: 12px; }
@media (prefers-reduced-motion: reduce) { .nb-plus svg { transition: none; } }

/* ── the page under the new layout (body.nav2) ── */
body.nav2 #fab, body.nav2 #ntBtn { display: none !important; }   /* replaced by the one "+" (M2) */
.tb-lbl { display: none; }
@media (min-width: 1024px) {   /* BRIEF-1206: 768–1023 (tablets) stay icon-only, as on phones — with every view on, the labels pushed the avatar off the edge */
  body.nav2 #projMenuBtn, body.nav2 #coMenuBtn { width: auto; padding: 0 12px; gap: 6px; }   /* icon + label on a computer (M3) */
  body.nav2 .tb-lbl { display: inline; font-size: 14px; }
}
@media (min-width: 768px) {
  body.nv-open .topbar { margin-left: -300px; }   /* the top bar spans the page; the navigator sits under it */
  body.nv-folded .topbar { margin-left: -48px; }
}
/* the breadcrumb: where in the project the views are looking (N1); ✕ = the whole project */
.sc-bar { position: sticky; top: calc(56px + env(safe-area-inset-top)); z-index: 44; display: flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 8px 0 16px; background: #e8eefc; border-bottom: 1px solid var(--line); color: var(--ink); }
.sc-bar[hidden] { display: none; }
.sc-crumbs { flex: 1; min-width: 0; overflow-x: auto; scrollbar-width: none; }
.sc-crumbs ol { display: flex; align-items: center; gap: 4px; margin: 0; padding: 0; list-style: none; white-space: nowrap; font-size: 14px; }
.sc-crumbs li + li::before { content: '›'; margin: 0 4px 0 0; color: var(--muted); }
.sc-crumbs [aria-current] { font-weight: 700; }
.sc-up { width: auto; min-height: 36px; margin: 0; padding: 0 4px; background: none; border: 0; color: var(--accent); font-size: 14px; font-weight: 600; text-decoration: underline; }
.sc-x { flex: none; width: 44px; height: 44px; margin: 0; padding: 0; display: inline-flex; align-items: center; justify-content: center; background: none; border: 0; border-radius: 8px; color: var(--ink); }
.sc-x:hover { background: rgba(20,28,40,.06); }
body.sc-on #overviewSheet.mapview { top: calc(100px + env(safe-area-inset-top)); }
@media (pointer: coarse) { .sc-up { min-height: 44px; } }
/* BRIEF-1251 UI-S3b: a count on a bar button / More (e.g. unseen replies) — information blue, not an error */
.nb-count { position: absolute; top: 4px; left: calc(50% + 6px); min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--accent); color: #fff; font-size: 11px; font-weight: 700; line-height: 18px; text-align: center; }
.nb-mcount { margin-left: 6px; padding: 0 7px; border-radius: 9px; background: #e6efff; color: #1d4ed8; font-size: 12px; font-weight: 700; }