/* Pineville Team chat — Cabarrus Teams-style chat (Oct 30 2026, Jeremy: "Please add team to Pineville").
   Uses lais-cabarrus-team.css + lais-cab-teams.css for the look; this file only fits it into the
   census | chat pair (.pc-pair from lais-pine-chat.css) and brings over the "Tap to turn on sound" pill. */
.pc-pair > .pine-team-panel { margin-top: 0; min-width: 0; display: flex; flex-direction: column; }
@media (min-width: 861px) {
  .pc-pair > .pine-team-panel { position: sticky; top: 12px; max-height: calc(100vh - 24px); }
  .pc-pair > .pine-team-panel .cab-chat-list { flex: 1 1 0; height: auto; min-height: 220px; }
  .pc-pair > .pine-team-panel .cab-chat-form { flex: 0 0 auto; }
}
/* Oct 30 2026 11:40 (Jeremy: "Pineville page seems incomplete on my monitor"): lais-cabarrus-team.css places
   Cabarrus's .layout children for its own 3-row grid (Totals = 2nd child -> grid-row 2 / span 2). Pineville has
   no Interpreters-today card or chat in .layout, so that pushed Totals far down and left a big empty gap in the
   right column. This file loads only on Pineville: put Pineville's New case | Totals back to the normal grid. */
@media (min-width: 861px) {
  html:not(.pine-x) body .layout > .panel:first-child,
  html:not(.pine-x) body .layout > .panel:nth-child(2) { grid-column: auto; grid-row: auto; align-self: auto; }
}
/* Oct 30 2026 (Jeremy: "team chat on the phone let's put it on the top for Pineville"): phones (<=768px) show
   Team chat first, right under the header / top buttons. An inline script in pineville.html moves the panel
   into #pineTeamTopSlot on phones and back beside the census on wider screens (same DOM node, same listeners). */
#pineTeamTopSlot:empty { display: none; }
#pineTeamTopSlot > .pine-team-panel { margin-top: 16px; margin-bottom: 0; }
/* Oct 29 2026 11:25 (Jeremy: no chime on a Chromebook): "Tap to turn on sound" pill in the chat header,
   shown only while sound is on but the browser has audio paused; it hides itself once audio is running. */
html body .cab-chat-panel .cab-chat-head .cab-sound-pill {
  display: inline-flex; align-items: center; gap: 4px; margin: 6px auto 2px;
  padding: 4px 10px; border-radius: 999px; border: 1px solid rgba(226,182,92,.55);
  background: rgba(226,182,92,.16); color: #F3D58E; font: 600 12px/1.2 inherit; font-family: inherit;
  cursor: pointer; white-space: nowrap; animation: cabPillPulse 2.4s ease-in-out infinite;
}
html body .cab-chat-panel .cab-chat-head .cab-sound-pill:hover { background: rgba(226,182,92,.26); }
html body .cab-chat-panel .cab-chat-head .cab-sound-pill:focus-visible { outline: 2px solid #E2B65C; outline-offset: 2px; }
html[data-theme="maroon"] body .cab-chat-panel .cab-chat-head .cab-sound-pill { border-color: rgba(138,21,56,.35); background: #FBEFF3; color: #8A1538; }
html[data-theme="maroon"] body .cab-chat-panel .cab-chat-head .cab-sound-pill:hover { background: #F6DFE7; }
html[data-theme="enterprise"] body .cab-chat-panel .cab-chat-head .cab-sound-pill { border-color: rgba(26,110,142,.35); background: #EAF4F8; color: #135A75; }
html[data-theme="enterprise"] body .cab-chat-panel .cab-chat-head .cab-sound-pill:hover { background: #DCEDF4; }
html body .cab-chat-panel .cab-chat-head .cab-sound-pill[hidden] { display: none !important; }
@keyframes cabPillPulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(226,182,92,0); } 50% { box-shadow: 0 0 0 3px rgba(226,182,92,.22); } }
@media (prefers-reduced-motion: reduce) { html body .cab-chat-panel .cab-chat-head .cab-sound-pill { animation: none; } }
/* Oct 30 2026 12:09 (Jeremy t1867u "put the chat next to new case", t1868u "OK to put three columns on the
   monitor"). Above 860px the inline script in pineville.html moves Team chat into #pineLayout, between New case
   and Totals. 861-1279px: 2 columns, New case | Team chat, Totals full width under them.
   1280px and up: 3 columns, New case | Team chat | Totals. The chat stretches to the row height and its
   message list scrolls inside. Census then runs full width below. Phones (<=768px) and 769-860px unchanged.
   Ids keep this Pineville-only and beat lais-cabarrus-team.css's Cabarrus grid rules. */
@media (min-width: 861px) {
  html body #pineLayout { grid-template-columns: minmax(0,1fr) minmax(0,1fr); grid-template-rows: auto; align-items: stretch; }
  html body #pineLayout > .panel:first-child { grid-column: 1; grid-row: 1; align-self: stretch; }
  html body #pineLayout > #cabChatPanel {
    grid-column: 2; grid-row: 1; align-self: stretch; margin: 0; min-width: 0; min-height: 0;
    display: flex; flex-direction: column; position: relative; top: auto; max-height: none;
  }
  html body #pineLayout > #cabChatPanel .cab-chat-list { flex: 1 1 0; height: auto; min-height: 320px; }
  html body #pineLayout > #cabChatPanel .cab-chat-form { flex: 0 0 auto; margin-top: 14px; }
  html body #pineLayout > .panel:nth-child(3) { grid-column: 1 / -1; grid-row: 2; align-self: start; }
  html body #pineLayout > :nth-child(n+4) { grid-column: 1 / -1; }
  html body #pineCensusChatPair:not(:has(> #cabChatPanel)) { grid-template-columns: minmax(0,1fr); }
}
@media (min-width: 1280px) {
  html body #pineLayout { grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,1fr); }
  html body #pineLayout > .panel:nth-child(3) { grid-column: 3; grid-row: 1; align-self: stretch; min-width: 0; }
}

/* Nov 1 2026 (Jeremy t1898u: "I try to scroll and it kind of scrolls and it doesn't and then it jumps").
   Phones only (<=768px), Pineville only (body:has(#pineLayout) - this file loads on pineville.html alone).
   1) Team chat list lets a swipe carry on to the page once the thread reaches its end (no scroll trap),
      and is shorter on phones so it no longer fills the lower half of the screen.
   2) Frosted-glass blur off on Pineville panels in Maroon and Enterprise - backdrop-filter makes iPhone
      scrolling stutter. The panels keep their white glass fill; only the live blur is dropped. */
@media (max-width: 768px) {
  html body:has(#pineLayout) .cab-chat-panel .cab-chat-list {
    overscroll-behavior-y: auto !important; overscroll-behavior: auto !important;
    height: 240px !important; min-height: 0 !important; max-height: 240px !important;
  }
  html[data-theme="maroon"] body:has(#pineLayout) :is(.panel, .side, .card, .panel-inner, .status-log-panel, .req-card, .heartbeat-panel, .today-report, .month-story, .live-reports > div, .cab-chat-panel),
  html[data-theme="enterprise"] body:has(#pineLayout) :is(.panel, .side, .card, .panel-inner, .status-log-panel, .req-card, .heartbeat-panel, .today-report, .month-story, .live-reports > div, .cab-chat-panel) {
    -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
  }
}
/* Nov 1 2026 7:51 PM (Jeremy t1908u: "collect the data first and then underneath that the chat option").
   Phones (<=768px): Team chat no longer goes to the top; it sits directly under New case + Totals (#pineLayout). */
@media (max-width: 768px) {
  html body #pineLayout + #cabChatPanel { margin-top: 0; margin-bottom: 16px; }
}
