/* watchtower-posts.css — Posts & Assignments (Dispatch - Posts.dc.html).
 * The fixed-post staffing board: which posts are covered, which are GAPS, and the
 * available roster to fill them. Backed by /api/watchtower/posts + /field/roster.
 * Renders into the EOC shell content area; tokens from watchtower.css. */

.wtp { display:flex; flex-direction:column; height:100%; overflow:hidden; background:var(--bg-0); color:var(--t-0); font-family:var(--sans); }
.wtp * { box-sizing:border-box; }
.wtp button { color:inherit; font-family:inherit; cursor:pointer; }

.wtp-chead { flex:0 0 auto; min-height:46px; display:flex; align-items:center; gap:10px; padding:10px 18px; border-bottom:1px solid var(--l-2); background:var(--bg-1); flex-wrap:wrap; }
.wtp-ti { font-family:var(--label); font-size:14px; letter-spacing:0.1em; text-transform:uppercase; font-weight:700; }
.wtp-sep { color:var(--t-3); }
.wtp-right { margin-left:auto; display:flex; align-items:center; gap:7px; flex-wrap:wrap; }
.wtp-pill { font-family:var(--label); font-size:11px; letter-spacing:0.05em; text-transform:uppercase; padding:6px 11px; border-radius:5px; border:1px solid var(--l-2); background:var(--bg-2); color:var(--t-2); display:inline-flex; gap:5px; align-items:center; }
.wtp-pill .n { font-family:var(--mono); font-size:9px; color:var(--t-3); }
.wtp-pill.on { border-color:var(--sky); background:color-mix(in oklab,var(--sky) 16%,var(--bg-1)); color:var(--sky); }
.wtp-pill.on .n { color:var(--sky); }

.wtp-split { flex:1; min-height:0; display:grid; grid-template-columns:1fr 380px; }
.wtp-lcol { min-height:0; overflow:auto; border-right:1px solid var(--l-2); }
.wtp-zhdr { position:sticky; top:0; z-index:2; display:grid; grid-template-columns:13px 1fr 150px 92px; gap:14px; padding:9px 18px; background:var(--bg-1); border-bottom:1px solid var(--l-2); font-family:var(--label); font-size:11px; letter-spacing:0.12em; text-transform:uppercase; color:var(--t-2); }
.wtp-prow { display:grid; grid-template-columns:13px 1fr 150px 92px; gap:14px; align-items:center; padding:13px 18px; border-bottom:1px solid var(--l-1); cursor:pointer; }
.wtp-prow.on { background:var(--bg-2); box-shadow:inset 3px 0 0 var(--sky); }
.wtp-dot { width:11px; height:11px; border-radius:50%; background:var(--t-3); }
.wtp-dot.staffed { background:var(--green); box-shadow:0 0 0 3px color-mix(in oklab,var(--green) 22%,transparent); }
.wtp-dot.gap { background:var(--red); box-shadow:0 0 0 3px color-mix(in oklab,var(--red) 24%,transparent); }
.wtp-pname { font-size:14px; font-weight:600; }
.wtp-req { font-family:var(--label); font-size:9px; letter-spacing:0.06em; text-transform:uppercase; color:var(--sky); margin-left:8px; border:1px solid color-mix(in oklab,var(--sky) 45%,var(--l-2)); border-radius:3px; padding:1px 5px; }
.wtp-pzone { font-family:var(--mono); font-size:11px; color:var(--t-3); margin-top:2px; }
.wtp-assignee { display:flex; align-items:center; gap:9px; font-size:13px; }
.wtp-assignee.empty { font-family:var(--mono); font-size:11.5px; color:var(--red); letter-spacing:0.04em; }
.wtp-av { width:30px; height:30px; border-radius:7px; display:grid; place-items:center; font-family:var(--mono); font-weight:700; font-size:10px; background:color-mix(in oklab,var(--sky) 18%,var(--bg-2)); color:var(--sky); flex:0 0 auto; }
.wtp-shift { font-family:var(--mono); font-size:11px; color:var(--t-2); }

.wtp-rcol { min-height:0; overflow:auto; padding:14px; display:flex; flex-direction:column; gap:13px; background:var(--bg-0); }
.wtp-card { background:var(--bg-1); border:1px solid var(--l-2); border-radius:9px; overflow:hidden; }
.wtp-card > header { display:flex; align-items:center; padding:11px 14px; border-bottom:1px solid var(--l-2); font-family:var(--label); font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--t-2); }
.wtp-card > header .rt { margin-left:auto; font-family:var(--mono); font-size:10px; }
.wtp-detbody { padding:14px; display:flex; flex-direction:column; gap:13px; }
.wtp-bigstat { display:flex; align-items:center; gap:13px; }
.wtp-ic { width:46px; height:46px; border-radius:10px; display:grid; place-items:center; font-family:var(--label); font-weight:700; font-size:18px; flex:0 0 auto; border:1px solid var(--l-2); }
.wtp-ttl { font-family:var(--label); font-size:19px; letter-spacing:0.03em; }
.wtp-sub2 { font-family:var(--mono); font-size:12px; color:var(--t-2); margin-top:3px; }
.wtp-metarow { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.wtp-meta { background:var(--bg-2); border:1px solid var(--l-2); border-radius:7px; padding:10px 12px; }
.wtp-k { font-family:var(--label); font-size:9px; letter-spacing:0.1em; text-transform:uppercase; color:var(--t-3); }
.wtp-v { font-size:13px; font-weight:600; margin-top:3px; font-family:var(--mono); }
.wtp-curass { display:flex; align-items:center; gap:11px; padding:11px; border-radius:8px; border:1px solid var(--l-2); background:var(--bg-2); }
.wtp-nm { font-size:13px; font-weight:600; } .wtp-rl { font-family:var(--mono); font-size:10px; color:var(--t-3); margin-top:1px; }
.wtp-actbtns { display:flex; gap:8px; }
.wtp-btn { font-family:var(--label); font-size:11px; letter-spacing:0.06em; text-transform:uppercase; padding:9px 12px; border-radius:6px; border:1px solid var(--l-2); background:var(--bg-2); color:var(--t-2); flex:1; }
.wtp-btn.red { border-color:var(--red); color:var(--red); } .wtp-btn.gold { border-color:var(--gold); color:var(--gold); }
.wtp-gapwarn { font-family:var(--mono); font-size:12px; color:var(--red); letter-spacing:0.04em; padding:2px 0; }
.wtp-rosrow { display:flex; align-items:center; gap:10px; padding:9px 14px; border-bottom:1px solid var(--l-1); }
.wtp-rosrow:last-child { border-bottom:0; }
.wtp-asgn { margin-left:auto; font-family:var(--label); font-size:10px; letter-spacing:0.05em; text-transform:uppercase; padding:6px 11px; border-radius:6px; border:1px solid var(--sky); color:var(--sky); background:transparent; }
.wtp-empty { padding:40px 18px; text-align:center; color:var(--t-3); font-size:13px; }