/* ===========================================================
   MAX3 Momentum OS — Waitlist staff surface
   .wl- prefix, global --m3-* tokens so it renders the same inside
   the Events page tab and the Schedule class-editor drawer.
   =========================================================== */
.wl-wrap{padding:18px 20px 44px;max-width:840px;display:flex;flex-direction:column;gap:16px;font-family:var(--ff)}
.wl-wrap.compact{padding:0;max-width:none;gap:12px}

/* intro / two-actions explainer */
.wl-intro{font-size:11.5px;line-height:1.5;color:var(--m3-text-3);background:var(--m3-surface);border:1px solid var(--m3-line);
  border-radius:10px;padding:12px 14px;text-wrap:pretty}
.wl-intro b{color:var(--m3-text-2)}
.wl-intro .wl-twoacts{display:flex;gap:10px;margin-top:10px;flex-wrap:wrap}
.wl-twoacts .wl-act{flex:1;min-width:220px;border:1px solid var(--m3-line);border-radius:8px;padding:9px 11px;background:var(--m3-bg)}
.wl-twoacts .wl-act .h{font-size:11px;font-weight:800;color:var(--m3-text);letter-spacing:.2px;display:flex;align-items:center;gap:6px}
.wl-twoacts .wl-act .d{font-size:10.5px;color:var(--m3-text-3);margin-top:3px;line-height:1.45}
.wl-twoacts .wl-act.soon{opacity:.85}
.wl-twoacts .wl-act .tag{font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;padding:1px 6px;border-radius:5px;
  background:var(--m3-blue-wash);color:var(--m3-blue)}

/* one waitlist line (a target with a capacity) */
.wl-line{background:var(--m3-surface);border:1px solid var(--m3-line);border-radius:12px;overflow:hidden}
.wl-line + .wl-line{margin-top:0}
.wl-line-h{display:flex;align-items:center;gap:12px;padding:13px 15px;border-bottom:1px solid var(--m3-line-2)}
.wl-line-h .wl-titles{min-width:0;flex:1}
.wl-line-h .wl-t{font-size:13.5px;font-weight:800;color:var(--m3-text);letter-spacing:-.1px}
.wl-line-h .wl-s{font-size:11px;color:var(--m3-text-3);margin-top:2px;display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.wl-combchip{font-size:9.5px;font-weight:800;text-transform:uppercase;letter-spacing:.4px;color:var(--m3-text-3);
  border:1px dashed var(--m3-line);border-radius:5px;padding:1px 6px}

/* capacity readout */
.wl-cap{display:flex;align-items:center;gap:11px;flex:0 0 auto}
.wl-capnum{font-size:20px;font-weight:800;font-family:var(--mono);letter-spacing:-1px;line-height:1;color:var(--m3-text)}
.wl-capnum small{font-size:12px;color:var(--m3-text-3);font-weight:700}
.wl-track{width:88px;height:7px;border-radius:5px;background:var(--m3-surface-2);overflow:hidden}
.wl-track i{display:block;height:100%;background:var(--m3-lime);border-radius:5px}
.wl-track i.full{background:var(--m3-amber)}
.wl-pill{font-size:9.5px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;padding:2px 8px;border-radius:6px;white-space:nowrap}
.wl-pill.full{background:var(--m3-amber-wash);color:var(--m3-amber)}
.wl-pill.open{background:var(--m3-lime-wash);color:var(--m3-lime)}

/* the line body */
.wl-body{padding:9px 11px 11px}
.wl-count{font-size:10.5px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;color:var(--m3-text-3);padding:2px 4px 8px}

.wl-rows{display:flex;flex-direction:column;gap:6px}
.wl-row{display:flex;align-items:center;gap:11px;padding:9px 10px;background:var(--m3-surface-3);border:1px solid var(--m3-line-2);border-radius:9px;transition:border-color .12s}
.wl-row:hover{border-color:var(--m3-line)}
.wl-pos{flex:0 0 auto;width:24px;text-align:center;font-size:12px;font-weight:800;font-family:var(--mono);color:var(--m3-text-3)}
.wl-row.front .wl-pos{color:var(--m3-lime)}
.wl-av{flex:0 0 auto;width:30px;height:30px;border-radius:8px;background:var(--m3-surface-2);color:var(--m3-text-2);
  display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;letter-spacing:.3px}
.wl-who{flex:1;min-width:0}
.wl-name{font-size:13px;font-weight:700;color:var(--m3-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wl-meta{font-size:11px;color:var(--m3-text-3);margin-top:2px;display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.wl-meta .dot{width:2.5px;height:2.5px;border-radius:50%;background:var(--m3-text-3);opacity:.6;flex:0 0 auto}
.wl-loc{font-size:9.5px;font-weight:700;color:var(--m3-text-2);border:1px dashed var(--m3-line);border-radius:5px;padding:0 6px;line-height:15px}
.wl-loc.own{color:var(--m3-lime);border-color:rgba(170,221,68,.4)}
.wl-note{font-size:10.5px;color:var(--m3-text-3);font-style:italic}

/* row actions */
.wl-acts{flex:0 0 auto;display:flex;align-items:center;gap:5px}
.wl-mv{width:26px;height:26px;border-radius:7px;border:1px solid var(--m3-line);background:var(--m3-surface);color:var(--m3-text-2);
  display:flex;align-items:center;justify-content:center;cursor:pointer;transition:border-color .12s,color .12s,opacity .12s;padding:0}
.wl-mv:hover:not(:disabled){border-color:var(--m3-text-3);color:var(--m3-text)}
.wl-mv:disabled{opacity:.3;cursor:default}
.wl-rm{width:26px;height:26px;border-radius:7px;border:1px solid var(--m3-line);background:var(--m3-surface);color:var(--m3-text-3);
  font-size:13px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:border-color .12s,color .12s}
.wl-rm:hover{border-color:rgba(204,34,34,.5);color:#ee6666}
.wl-pull{height:26px;padding:0 11px;border-radius:7px;border:1px solid var(--m3-line);background:var(--m3-surface);color:var(--m3-text);
  font-size:11px;font-weight:700;cursor:pointer;white-space:nowrap;display:inline-flex;align-items:center;gap:5px;transition:border-color .12s,color .12s;font-family:var(--ff)}
.wl-pull:hover{border-color:var(--m3-amber);color:var(--m3-amber)}

/* inline pull-in confirm */
.wl-confirm{margin-top:6px;display:flex;align-items:center;gap:12px;padding:11px 12px;border:1px solid var(--m3-amber);
  background:var(--m3-amber-wash);border-radius:9px}
.wl-confirm .ct{flex:1;min-width:0;font-size:11.5px;color:var(--m3-text-2);line-height:1.45;text-wrap:pretty}
.wl-confirm .ct b{color:var(--m3-text)}
.wl-cbtns{display:flex;gap:7px;flex:0 0 auto}
.wl-cbtn{height:28px;padding:0 13px;border-radius:7px;font-size:11.5px;font-weight:700;cursor:pointer;border:1px solid var(--m3-line);
  background:var(--m3-surface);color:var(--m3-text-2);font-family:var(--ff)}
.wl-cbtn:hover{color:var(--m3-text)}
.wl-cbtn.go{background:var(--m3-amber);border-color:var(--m3-amber);color:#2a1c02}
.wl-cbtn.go:hover{filter:brightness(1.06)}

/* empty line */
.wl-empty{font-size:12px;color:var(--m3-text-3);padding:14px 6px;text-align:center;border:1px dashed var(--m3-line-2);border-radius:9px}

/* footnote */
.wl-foot{font-size:10.5px;color:var(--m3-text-3);line-height:1.5;text-wrap:pretty;padding:0 2px}
.wl-foot b{color:var(--m3-text-2)}

/* ===== step 2 — automatic invite system ===== */
/* body head: count + raise-capacity trigger */
.wl-bodyhead{display:flex;align-items:center;gap:10px;padding:2px 4px 9px}
.wl-bodyhead .wl-count{padding:0;flex:1}
.wl-livedot{color:var(--m3-amber);font-size:8px;vertical-align:middle;margin-right:5px;animation:wl-pulse 1.4s ease-in-out infinite}
@keyframes wl-pulse{0%,100%{opacity:1}50%{opacity:.3}}
.wl-raisebtn{height:26px;padding:0 11px;border-radius:7px;border:1px solid var(--m3-line);background:var(--m3-surface);color:var(--m3-text-2);
  font-size:11px;font-weight:700;cursor:pointer;font-family:var(--ff);white-space:nowrap;transition:border-color .12s,color .12s}
.wl-raisebtn:hover{border-color:var(--m3-lime);color:var(--m3-lime)}

/* raise-capacity stepper */
.wl-raise{display:flex;align-items:center;gap:12px;padding:11px 12px;margin:0 0 9px;border:1px solid var(--m3-line);
  background:var(--m3-bg);border-radius:9px;flex-wrap:wrap}
.wl-raise .rt{flex:1;min-width:240px;font-size:11px;color:var(--m3-text-3);line-height:1.45;text-wrap:pretty}
.wl-raise .rt b{color:var(--m3-text-2)}
.wl-raise .rb{display:flex;gap:7px;flex:0 0 auto}
.wl-rstep{width:40px;height:30px;border-radius:7px;border:1px solid var(--m3-lime);background:var(--m3-lime-wash);color:var(--m3-lime);
  font-size:13px;font-weight:800;cursor:pointer;font-family:var(--mono)}
.wl-rstep:hover{background:rgba(170,221,68,.22)}
.wl-rcancel{height:30px;padding:0 12px;border-radius:7px;border:1px solid var(--m3-line);background:var(--m3-surface);color:var(--m3-text-2);font-size:11.5px;font-weight:700;cursor:pointer;font-family:var(--ff)}

/* an INVITED row (mid-claim) */
.wl-row.invited{align-items:flex-start;border-color:rgba(245,166,35,.45);background:linear-gradient(0deg,var(--m3-amber-wash),var(--m3-amber-wash)),var(--m3-surface-3);background-blend-mode:normal}
.wl-pos.inv{color:var(--m3-amber);font-size:13px;line-height:30px}
.wl-av.inv{background:var(--m3-amber-wash);color:var(--m3-amber)}
.wl-invtag{font-size:9.5px;font-weight:800;text-transform:uppercase;letter-spacing:.4px;color:var(--m3-amber);
  background:var(--m3-amber-wash);border-radius:5px;padding:1px 7px;margin-left:7px;vertical-align:middle}
.wl-chan{font-size:10.5px;font-weight:700;color:var(--m3-text-2)}
.wl-openedby{font-size:10.5px;color:var(--m3-text-3);font-style:italic}
.wl-pdchip{font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.4px;color:#ee6666;border:1px solid rgba(204,34,34,.45);
  border-radius:5px;padding:0 6px;margin-left:7px;line-height:15px}

/* past-due block notice inside an invited row */
.wl-pastdue{display:flex;align-items:center;gap:8px;margin-top:7px;padding:8px 10px;border-radius:8px;
  border:1px solid rgba(204,34,34,.4);background:var(--m3-red-wash);font-size:11px;color:var(--m3-text-2);line-height:1.45;text-wrap:pretty}
.wl-pastdue b{color:var(--m3-text)}
.wl-pastdue.ok{border-color:rgba(170,221,68,.4);background:var(--m3-lime-wash)}
.wl-pastdue .pd-ic{color:#ee6666;font-size:9px;flex:0 0 auto}
.wl-pastdue .pd-ic.ok{color:var(--m3-lime)}
.wl-pd-clear{margin-left:auto;flex:0 0 auto;height:26px;padding:0 11px;border-radius:7px;border:1px solid rgba(204,34,34,.5);
  background:transparent;color:#ee6666;font-size:11px;font-weight:700;cursor:pointer;font-family:var(--ff);white-space:nowrap}
.wl-pd-clear:hover{background:rgba(204,34,34,.12)}

/* claim countdown + invited actions */
.wl-claimwrap{flex:0 0 auto;display:flex;flex-direction:column;align-items:flex-end;gap:7px}
.wl-claim{display:flex;flex-direction:column;align-items:flex-end;line-height:1}
.wl-clock{font-size:18px;font-weight:800;font-family:var(--mono);color:var(--m3-amber);letter-spacing:-.5px;font-variant-numeric:tabular-nums}
.wl-clab{font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:var(--m3-text-3);margin-top:3px}
.wl-pass{height:26px;padding:0 11px;border-radius:7px;border:1px solid var(--m3-line);background:var(--m3-surface);color:var(--m3-text-2);
  font-size:11px;font-weight:700;cursor:pointer;font-family:var(--ff);white-space:nowrap;transition:border-color .12s,color .12s}
.wl-pass:hover{border-color:var(--m3-text-3);color:var(--m3-text)}
.wl-claimbtn{height:26px;padding:0 12px;border-radius:7px;border:1px solid var(--m3-lime);background:var(--m3-lime-wash);color:var(--m3-lime);
  font-size:11px;font-weight:800;cursor:pointer;font-family:var(--ff);white-space:nowrap}
.wl-claimbtn:hover{background:rgba(170,221,68,.22)}

/* recent (claimed / passed) trail */
.wl-recent{margin-top:10px;padding-top:9px;border-top:1px dashed var(--m3-line-2);font-size:10.5px;color:var(--m3-text-3)}
.wl-recent b{color:var(--m3-text-2);font-weight:700}

/* ===== step 3 — combined shared cross-location segmentation ===== */
.wl-seg{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:0 4px 11px}
.wl-seg-l{font-size:9.5px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;color:var(--m3-text-3)}
.wl-seg-c{font-size:11px;font-weight:700;color:var(--m3-text-2);border:1px dashed var(--m3-line);border-radius:6px;padding:1px 8px}
.wl-seg-c.own{color:var(--m3-lime);border-color:rgba(170,221,68,.4);background:var(--m3-lime-wash)}
.wl-segnote{flex-basis:100%;font-size:10.5px;color:var(--m3-text-3);line-height:1.45;text-wrap:pretty;margin-top:2px}
.wl-segnote b{color:var(--m3-text-2)}
.wl-route{font-size:10.5px;font-weight:700;color:var(--m3-blue)}
