/* styles/planchg.css -- EVERY PLAN CHANGE, SAID (Calendar connect v1.1,
   cal/uix; screens/planchg.js). Sizes MEASURED off the references
   (`Vol_PC1`, `Vol_PC3`, `Vol_MV2`, `Vol_MV3`, `Vol_MV4`, `Vol_MV7`, a 390
   px frame): the banner 14 px corners, 11 x 14 padding, a 32 px icon
   tile; the sheet the session sheet's surface (sesheet.css), its title
   23/800, its rows 16/800 names, 14.5 times, 13.5 reasons; MV4's options
   58 px, 14 px corners, the picked one blue. Colours are the app's tokens.
   The sheets ride calm.css's `cSheet` and start.css's `.st-svlayer` (over
   any screen, outside it).

   2026-11-07 (the owner's "Schedule screens, 1c look" handoff, boards 36
   and 39-43): the sheets MEASURED off `reference/36_T8_Pick_Other_Times
   .html` and `39`-`43` (a 390 px frame) and drawn in onec.css's tokens --
   the sheet #0c1420 under a #34496a line, its × a 44 px round at the top
   right; the titles 24/800; the cards the 1c card (22 px corners, 4 px
   wider than the words); Got it and Move the bright 58 px button; What
   changed, the day chips, Starts and the answers raised; Skip session red
   text on a raised tile; the reason lines flat grey. The banners (PC1,
   MV3) and the dashed outline are not on these boards and stay as they
   were. */

/* ───────────────────────── PC1 / PC2 / MV3 · the banner */
button.pc-banner { display: flex; align-items: center; gap: 12px;
  width: calc(100% - 40px); margin: 0 20px 12px; padding: 11px 14px;
  min-height: 0; border-radius: 14px; text-align: left; font: inherit;
  color: var(--ink); background: rgba(140, 196, 245, .08);
  border: 1px solid rgba(140, 196, 245, .24); box-shadow: none; }
.tp-today button.pc-banner { width: 100%; margin: 0 0 12px; }
.pc-bi { flex: none; width: 32px; height: 32px; border-radius: 10px;
  background: rgba(140, 196, 245, .12); display: flex; align-items: center;
  justify-content: center; }
.pc-bi svg { width: 16px; height: 16px; fill: none;
  stroke: var(--accent-soft); stroke-width: 2.2; stroke-linecap: round;
  stroke-linejoin: round; }
.pc-bt { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.pc-bt b { font-size: 15px; font-weight: 800; }
.pc-bt span { font-size: 13px; color: #c3c8d1; margin-top: 1px; }
.pc-bgo { flex: none; display: inline-flex; align-items: center; gap: 4px;
  font-size: 14px; font-weight: 700; color: var(--accent-soft);
  white-space: nowrap; }
.pc-bgo .lchev { border-color: var(--accent-soft); }

/* ───────────────────────── the sheets: the session sheet's surface */
.sheetwrap.pc-layer { background: rgba(2, 3, 5, .72); }
.pc-layer .sheet { position: relative; gap: 0;
  max-height: calc(100% - 44px - env(safe-area-inset-top));
  overflow-y: auto; padding: 0 20px calc(24px + env(safe-area-inset-bottom));
  border-radius: 28px 28px 0 0; border: 0;
  border-top: 1px solid var(--c1-sheet-line); color: var(--c1-ink);
  background: var(--c1-sheet); box-shadow: 0 -20px 50px rgba(0, 0, 0, .7); }
.pc-layer .c-grab i { background: #3d5170; border-radius: 3px; }
/* the × (cSheet's `x`): 27 px down, 12 px from the edge, over the first
   line -- which keeps clear of it */
.pc-layer .sheet > .c-sheethead { position: relative; z-index: 2;
  justify-content: flex-end; margin: 8px -8px -44px 0; }
.pc-layer .sheet > .c-sheethead button.c-back { padding: 0;
  display: flex; align-items: center; justify-content: center;
  border: 1px solid #2f4262; background: #17233a; color: #c3cddb; }
.pc-layer .sheet > .c-sheethead button.c-back svg { width: 18px;
  height: 18px; }
.pc-title { margin: 6px 44px 0 0; font-size: 24px; font-weight: 800;
  line-height: 1.2; }
.pc-kick { margin: 8px 44px 0 0; font-size: 12.5px; font-weight: 800;
  letter-spacing: .12em; text-transform: uppercase; color: var(--c1-icon); }
.pc-kick + .pc-title { margin-top: 6px; }
.pc-trig { margin: 14px 0 0; font-size: 14.5px; color: var(--c1-sub);
  line-height: 1.4; }
.pc-trig.more { margin-top: 18px; }
.pc-line { margin: 12px 0 0; font-size: 15px; line-height: 1.5;
  color: var(--c1-sub); }
.pc-label { margin: 22px 0 8px; font-size: 12.5px; font-weight: 800;
  letter-spacing: .12em; text-transform: uppercase; color: var(--c1-lab); }
.pc-note { margin: 12px 0 0; font-size: 13px; line-height: 1.45;
  color: var(--c1-hint); }
.pc-err { margin: 10px 0 0; padding: 0 4px; font-size: 13.5px;
  line-height: 1.4; color: var(--bad-ink); }

/* ───────────────────────── the sessions-updated sheet (Schedule changes
   v1, boards Main / P2_First_Schedule): a 44 px kicker tile (green the
   first time), the title 23/800, the server's count pill and reason, one
   blue button and two text links side by side */
.pc-ukic { display: flex; flex: none; width: 54px; height: 54px;
  border-radius: 50%; align-items: center; justify-content: center;
  margin-top: 14px; background: rgba(140, 196, 245, .14); }
.pc-ukic svg { width: 28px; height: 28px; fill: none;
  stroke: var(--c1-icon); stroke-width: 2; stroke-linecap: round;
  stroke-linejoin: round; }
.pc-ukic.first { background: rgba(111, 207, 151, .16); }
.pc-ukic.first svg { stroke: #6fcf97; }
.pc-title.pc-utitle { margin: 16px 0 0; }
.pc-usays { display: flex; flex-direction: column; align-items: flex-start;
  gap: 8px; margin-top: 16px; }
.pc-usays:empty { display: none; }
.pc-upill { padding: 7px 14px; border-radius: 999px; font-size: 14px;
  font-weight: 800; color: #c9d3e0; background: #17233a;
  border: 1px solid #2f4262; }
.pc-ureason { font-size: 14px; color: #9aa6b6; }
/* What changed: a plain raised button (1c: WAS a text link) */
.pc-foot button.pc-what { justify-content: center; text-align: center;
  font-size: 16px; font-weight: 800; }

/* ───────────────────────── PC3 / MV5 / MV2 · the changes */
.pc-card { margin: 14px -4px 0; padding: 4px 14px; border-radius: 22px;
  background: var(--c1-card); border: 1px solid var(--c1-card-line);
  box-shadow: none; }
.pc-row { padding: 12px 0; }
.pc-row + .pc-row { border-top: 1px solid #22324a; }
.pc-rh { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pc-dot { flex: none; width: 10px; height: 10px; border-radius: 50%;
  background: var(--sc, var(--c1-icon)); }
.pc-rn { font-size: 15.5px; font-weight: 800; }
.pc-mine { margin-left: auto; font-size: 12.5px; font-weight: 800;
  color: var(--c1-icon); }
.pc-when { display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  margin: 4px 0 0; font-size: 14.5px; }
.pc-old { color: var(--c1-hint); text-decoration: line-through; }
.pc-new { font-weight: 800; color: var(--c1-ink); }
.pc-arr { display: inline-flex; }
.pc-arr svg { width: 16px; height: 16px; fill: none;
  stroke: var(--c1-icon); stroke-width: 2; stroke-linecap: round;
  stroke-linejoin: round; }
/* the reason lines: flat grey (1c, board 42 -- WAS soft blue) */
.pc-why { margin: 4px 0 0; font-size: 13.5px; line-height: 1.4;
  color: #9aa6b6; }

/* the footer: the bright button, then a raised one */
.pc-foot { display: flex; flex-direction: column; gap: 10px; margin-top: 30px; }
/* "Can you train?" (2026-11-05): an all-day event's card -- the question,
   its days, the line, then No (kept free, the default) and Yes. */
.pc-card.pc-ask { margin-top: 16px; padding: 14px; }
.pc-askq { display: block; font-size: 16px; font-weight: 800; line-height: 1.3; }
.pc-askw { display: block; margin-top: 2px; font-size: 13.5px; color: #9aa6b6; }
.pc-ask .pc-why { margin: 8px 0 12px; }
.pc-asktwo { display: flex; gap: 10px; }
/* two raised answers, each its ring; No (the default) chosen */
.pc-asktwo button.pc-askopt { flex: 1 1 0; width: auto; min-width: 0;
  margin: 0; justify-content: flex-start; font-size: 16px; font-weight: 800;
  line-height: 1.25; }
.pc-rg { flex: none; width: 26px; height: 26px; border-radius: 50%;
  box-sizing: border-box; border: 2px solid #7d93b2; display: flex;
  align-items: center; justify-content: center; }
.pc-rg svg { display: none; width: 14px; height: 14px; fill: none;
  stroke: #1478cc; stroke-width: 3.2; stroke-linecap: round;
  stroke-linejoin: round; }
.pc-askopt.on .pc-rg { background: #fff; border-color: #fff; }
.pc-askopt.on .pc-rg svg { display: block; }
.pc-ask.busy { opacity: .55; pointer-events: none; }
.pc-foot button.c-btn { width: 100%; min-height: 58px; margin: 0;
  border: 0; border-radius: 18px; background: var(--c1-pri);
  box-shadow: var(--c1-pri-lift); color: #fff; font-size: 17px;
  font-weight: 800; justify-content: center; }
.pc-foot button.c-link { align-self: stretch; min-height: 46px; margin: 0;
  font-size: 15.5px; font-weight: 700; color: var(--accent-soft); }
/* Skip session (board 36): red text on a raised tile */
.pc-foot button.pc-skipbtn { justify-content: center; text-align: center;
  font-size: 16px; font-weight: 800; color: var(--c1-red); }

/* ───────────────────────── the soft-blue reason line (MV4, MV7, CC6) */
.pc-whybox { margin-top: 12px; display: flex; gap: 10px;
  align-items: flex-start; padding: 10px 12px; border-radius: 12px;
  background: rgba(140, 196, 245, .07);
  border: 1px solid rgba(140, 196, 245, .18); }
.pc-whybox p { margin: 0; flex: 1 1 auto; min-width: 0; font-size: 14px;
  line-height: 1.4; color: var(--accent-soft); }
.pc-whyi { flex: none; display: inline-flex; margin-top: 2px; }
.pc-whyi svg { width: 16px; height: 16px; fill: none;
  stroke: var(--accent-soft); stroke-width: 2.1; stroke-linecap: round;
  stroke-linejoin: round; }
.td-card .pc-whybox { margin-top: 12px; }
.pc-layer .pc-whybox { margin: 16px -4px 0; padding: 12px 14px; gap: 10px;
  border-radius: 16px; background: var(--c1-card);
  border: 1px solid var(--c1-card-line); }
.pc-layer .pc-whybox p { font-size: 14px; line-height: 1.45;
  color: var(--c1-sub); }
.pc-layer .pc-whyi { margin-top: 1px; }
.pc-layer .pc-whyi svg { width: 20px; height: 20px; stroke: var(--c1-icon);
  stroke-width: 2; }

/* ───────────────────────── MV4 · DAY and TIME (1c, board 36: WAS the
   server's three better times as a ranked list, and Other times) */
.pc-days { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 -4px; }
.pc-days button.pc-day { flex: none; width: auto; height: 48px;
  min-height: 0; margin: 0; padding: 0 14px; font-size: 15px;
  font-weight: 800; }
/* Starts: a raised row, the phone's time wheel over all of it */
.pc-trow.c1-tile { margin: 0 -4px; width: calc(100% + 8px); }
.pc-tri { flex: none; display: inline-flex; }
.pc-tri svg { width: 22px; height: 22px; fill: none; stroke: var(--c1-icon);
  stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.pc-trl { flex: 1 1 auto; font-size: 16px; font-weight: 600; color: #c9d3e0; }
.pc-trv { font-size: 16px; font-weight: 800; }
.pc-trow .c1-go svg, .pc-layer .c1-go svg { width: 14px; height: 14px;
  fill: none; stroke: currentColor; stroke-width: 2.6;
  stroke-linecap: round; stroke-linejoin: round; }
.pc-trow input.pc-time { position: absolute; inset: 0; width: 100%;
  height: 100%; min-height: 0; margin: 0; padding: 0; border: 0;
  opacity: 0; cursor: pointer; -webkit-appearance: none; appearance: none;
  color-scheme: dark; }

/* ───────────────────────── MV3 · the dashed outline at the dragged time */
button.pc-ghost { position: absolute; left: 2px; right: 2px; z-index: 3;
  min-height: 0; margin: 0; padding: 3px 5px; box-sizing: border-box;
  border-radius: 8px; border: 2px dashed var(--accent-soft);
  background: rgba(140, 196, 245, .06); color: var(--accent-soft);
  font-size: 11px; font-weight: 800; text-align: left; overflow: hidden;
  display: block; }
button.pc-ghost span { display: block; white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis; }

/* ───────────────────────── the push ask */
.pc-bell { display: flex; width: 48px; height: 48px; margin-top: 6px;
  border-radius: 14px; background: rgba(140, 196, 245, .12);
  align-items: center; justify-content: center; }
.pc-bell svg { width: 24px; height: 24px; fill: none;
  stroke: var(--accent-soft); stroke-width: 2; stroke-linecap: round;
  stroke-linejoin: round; }
.pc-bell + .pc-title { margin-top: 12px; }