/* Nov 3 2026 (Jeremy t1959u + t1960u + t1964u) — Cabarrus only. Goes with lais-cab-layout.js + lais-cab-eod-easy.js.
   t1964u (Cabarrus manager team meeting): Team chat, Notes and the Stoplight report are gone from this page, so the
   grid is rebuilt without them (no empty column). The .cab-lean class on .layout lifts these rules over the older
   3-column rules (lais-cab-3col.css, lais-cab-roles.css, lais-cabarrus-team.css), which stay untouched for history. */

/* ---------- Dispatch page ---------- */
/* phones/tablets (<861px): New case (with Interpreters today at its bottom, as before) -> Totals -> Recent cases */
@media (min-width: 861px) {
  /* 861-1199px: New case | Interpreters today, then Totals under it */
  html:not(.cab-me-mode):not(.cab-interp-mode) body .layout.cab-3col.cab-lean {
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); grid-template-rows: auto 1fr; }
  html:not(.cab-me-mode):not(.cab-interp-mode) body .layout.cab-3col.cab-lean > .cab-newcase-panel { grid-column: 1; grid-row: 1 / span 2; }
  html:not(.cab-me-mode):not(.cab-interp-mode) body .layout.cab-3col.cab-lean > .cab-avail-panel { grid-column: 2; grid-row: 1; }
  html:not(.cab-me-mode):not(.cab-interp-mode) body .layout.cab-3col.cab-lean > .cab-totals-panel { grid-column: 2; grid-row: 2; align-self: start; }
  html:not(.cab-me-mode):not(.cab-interp-mode) body .layout.cab-3col.cab-lean > .cab-avail-panel .lais-st-list { max-height: 420px; overflow-y: auto; }
}
@media (min-width: 1200px) {
  /* monitors: Interpreters today | New case | Totals, all starting on the same line */
  html:not(.cab-me-mode):not(.cab-interp-mode) body .layout.cab-3col.cab-lean {
    --cab3-h: clamp(560px, calc(100vh - 190px), 860px);
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr) minmax(0, 1fr); grid-template-rows: auto; }
  html:not(.cab-me-mode):not(.cab-interp-mode) body .layout.cab-3col.cab-lean > .cab-avail-panel {
    grid-column: 1; grid-row: 1; align-self: start; height: var(--cab3-h); position: sticky; top: 12px; }
  html:not(.cab-me-mode):not(.cab-interp-mode) body .layout.cab-3col.cab-lean > .cab-avail-panel .lais-st-list { max-height: none; overflow-y: auto; }
  html:not(.cab-me-mode):not(.cab-interp-mode) body .layout.cab-3col.cab-lean > .cab-newcase-panel { grid-column: 2; grid-row: 1; }
  html:not(.cab-me-mode):not(.cab-interp-mode) body .layout.cab-3col.cab-lean > .cab-totals-panel { grid-column: 3; grid-row: 1; align-self: start; }
}

/* ---------- Interpreter page ---------- */
/* phones/tablets: My status -> My day -> New case (Interpreters today at its bottom) */
html.cab-interp-mode body .layout.cab-3col.cab-lean > .cab-avail-panel { order: 1; }
html.cab-interp-mode body .layout.cab-3col.cab-lean > .cab-newcase-panel { order: 2; }
@media (max-width: 860px) {
  html.cab-interp-mode body .layout.cab-3col.cab-lean > .cab-avail-panel:not(:has(#cabAvail)) { display: block !important; }
}
@media (min-width: 861px) {
  /* monitors: My status + My day + Interpreters today | New case (two columns, the form gets the wider one) */
  html.cab-interp-mode body .layout.cab-3col.cab-lean { grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); grid-template-rows: auto; }
  html.cab-interp-mode body .layout.cab-3col.cab-lean > .cab-avail-panel { grid-column: 1; grid-row: 1; }
  html.cab-interp-mode body .layout.cab-3col.cab-lean > .cab-newcase-panel { grid-column: 2; grid-row: 1; }
}
@media (min-width: 1200px) {
  html.cab-interp-mode body .layout.cab-3col.cab-lean { grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); }
}

/* Totals is a narrower column now: let the "Without VRI / same as above" label wrap instead of running under the number */
html body .layout.cab-3col.cab-lean .cab-totals-panel .cvs-row { flex-wrap: wrap; row-gap: 2px; }
html body .layout.cab-3col.cab-lean .cab-totals-panel .cvs-k { flex: 1 1 auto; flex-wrap: wrap; white-space: normal; }
html body .layout.cab-3col.cab-lean .cab-totals-panel .cvs-v { margin-left: auto; }

/* Recent cases now sits right under the grid (Dispatch); keep the usual gap */
html body .layout.cab-lean + .cases-panel { margin-top: 16px; }

/* ---- End of day: easy to find ---- */
.hdr-ctl-eod { display: inline-flex; align-items: center; gap: 6px; }
.hdr-ctl-eod svg, .cab-me-eod svg { width: 15px; height: 15px; flex: 0 0 auto; }
/* My status: End of day on the left, quiet Off shift stays on the right */
.cab-me-offrow { justify-content: space-between; align-items: center; gap: 8px; margin-top: 0; }
.cab-me-card[data-st="off"] .cab-me-offrow { display: flex; }
.cab-me-card[data-st="off"] .cab-me-off { display: none; }
.cab-me-eod { -webkit-appearance: none; appearance: none; margin: 0; cursor: pointer;
  display: inline-flex; align-items: center; gap: 7px; min-height: 40px; padding: 0 14px;
  border-radius: 12px; border: 1.5px solid rgba(226,182,92,.75); background: rgba(226,182,92,.12);
  color: var(--fg); font: 600 14px/1 Outfit, system-ui, sans-serif; letter-spacing: .01em;
  transition: background .18s ease, border-color .18s ease; }
.cab-me-eod:hover { background: rgba(226,182,92,.22); border-color: #E2B65C; }
.cab-me-eod:focus-visible { outline: 2px solid #E2B65C; outline-offset: 2px; }
.cab-me-eod.is-saved { border-color: rgba(34,197,94,.6); background: rgba(34,197,94,.1); }
html[data-theme="maroon"] .cab-me-eod { border-color: #8C1D40; background: #FBF3F5; color: #5E1229; }
html[data-theme="maroon"] .cab-me-eod:hover { background: #F5E3E8; }
html[data-theme="enterprise"] .cab-me-eod { border-color: #1E3A5F; background: #F1F5F9; color: #1E3A5F; }
html[data-theme="enterprise"] .cab-me-eod:hover { background: #E2E8F0; }
html[data-theme="maroon"] .cab-me-eod.is-saved, html[data-theme="enterprise"] .cab-me-eod.is-saved { border-color: #16a34a; background: #F0FDF4; color: #14532d; }
@media (max-width: 860px) { .cab-me-eod { min-height: 44px; } }

/* Interpreter page: the same End of day report opens as a sheet over the page */
.cab-eod-back { position: fixed; inset: 0; z-index: 9990; background: rgba(8,5,20,.72); }
html[data-theme="maroon"] .cab-eod-back, html[data-theme="enterprise"] .cab-eod-back { background: rgba(15,23,42,.55); }
.cab-eod-back[hidden] { display: none; }
html.cab-eod-sheet { overflow: hidden; }
html.cab-eod-sheet.cab-interp-mode body #eodPanel,
html.cab-eod-sheet body #eodPanel { display: block !important; position: fixed !important; z-index: 9991;
  top: max(12px, 4vh); left: 50%; transform: translateX(-50%); margin: 0 !important;
  width: min(760px, calc(100vw - 24px)); max-height: calc(100vh - max(24px, 8vh)); max-height: calc(100dvh - max(24px, 8vh));
  overflow: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
  box-shadow: 0 24px 64px rgba(0,0,0,.45) !important; }
/* sheets need a solid card behind them in every theme */
html.cab-eod-sheet body #eodPanel { background: #160f2e !important; background-image: none !important; }
html.cab-eod-sheet[data-theme="sky"] body #eodPanel { background: #1b1433 !important; border-radius: 22px !important; padding: 22px !important; }
html.cab-eod-sheet[data-theme="maroon"] body #eodPanel, html.cab-eod-sheet[data-theme="enterprise"] body #eodPanel { background: #fff !important; }
@media (max-width: 600px) {
  html.cab-eod-sheet.cab-interp-mode body #eodPanel,
  html.cab-eod-sheet body #eodPanel { top: 0; width: 100vw; max-height: 100vh; max-height: 100dvh; height: 100dvh; border-radius: 0 !important; }
  html.cab-eod-sheet[data-theme="sky"] body #eodPanel { border-radius: 0 !important; padding: 16px !important; }
}
.cab-eod-done { position: fixed; z-index: 9992; left: 50%; bottom: max(16px, env(safe-area-inset-bottom)); transform: translateX(-50%);
  max-width: calc(100vw - 24px); padding: 12px 16px; border-radius: 12px; background: #14532d; color: #fff;
  font: 600 14px/1.35 Outfit, system-ui, sans-serif; box-shadow: 0 10px 30px rgba(0,0,0,.35); text-align: center; }
.cab-eod-done[hidden] { display: none; }
@media (prefers-reduced-motion: reduce) { .cab-me-eod { transition: none; } }
