/* ════════════════════════════════════════════════════════════════════
   INTAKE PAGE — Module 9
   Real-time speed-to-lead board.
   All selectors scoped under .intake-page to avoid bleed.
   ════════════════════════════════════════════════════════════════════ */

.intake-page {
  /* Time-state colors (3 columns) */
  --intake-fresh: #4ade80;
  --intake-fresh-glow: rgba(74, 222, 128, 0.18);
  --intake-warn: #facc15;
  --intake-warn-glow: rgba(250, 204, 21, 0.20);
  --intake-breach: #ef4444;
  --intake-breach-glow: rgba(239, 68, 68, 0.22);
  --intake-hold: #818cf8;
  --intake-hold-glow: rgba(129, 140, 248, 0.18);

  /* Category colors */
  --cat-event: #d4ae52;
  --cat-event-bg: rgba(212, 174, 82, 0.10);
  --cat-event-strip: rgba(212, 174, 82, 0.14);
  --cat-paid: #f59e0b;
  --cat-paid-bg: rgba(245, 158, 11, 0.08);
  --cat-paid-strip: rgba(245, 158, 11, 0.10);
  --cat-organic: #4ade80;
  --cat-organic-bg: rgba(74, 222, 128, 0.07);
  --cat-organic-strip: rgba(74, 222, 128, 0.10);
  --cat-other: #8a8a8a;
  --cat-other-bg: rgba(138, 138, 138, 0.06);
  --cat-other-strip: rgba(138, 138, 138, 0.08);

  max-width: 1500px;
}

/* ─── Hero ────────────────────────────────────────────────────── */
.intake-page .ip-hero {
  display: flex; align-items: center; gap: 1rem;
  padding-bottom: 1.15rem; border-bottom: 1px solid var(--border);
  margin-bottom: 1.15rem;
}
.intake-page .ip-logo {
  width: 48px; height: 48px; border-radius: 11px;
  background: var(--gold-glow); border: 1px solid var(--gold-dim);
  display: grid; place-items: center; flex-shrink: 0; overflow: hidden;
}
.intake-page .ip-logo svg {
  width: 26px; height: 26px;
}
.intake-page .ip-hero-text { flex: 1; min-width: 0; }
.intake-page .ip-hero-title {
  font-family: var(--sans);
  font-weight: 700; font-size: 1.55rem;
  letter-spacing: -0.025em; line-height: 1.2;
  color: var(--white);
  margin-bottom: 0.2rem;
}
.intake-page .ip-hero-subtitle {
  font-family: var(--sans);
  font-weight: 500; font-size: 1rem;
  color: var(--muted);
  letter-spacing: -0.01em;
}
.intake-page .ip-hero-subtitle .gold { color: var(--gold-lt); }

/* ─── Status bar ──────────────────────────────────────────────── */
.intake-page .ip-status {
  display: flex; align-items: center; justify-content: space-between;
  gap: 1rem; padding: 0.75rem 1.1rem;
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius-lg); margin-bottom: 1rem; flex-wrap: wrap;
}
.intake-page .ip-status-left {
  display: flex; align-items: center; gap: 1.1rem; flex-wrap: wrap;
}
.intake-page .ip-live {
  display: inline-flex; align-items: center; gap: 0.5rem;
  font-family: var(--mono); font-size: 0.68rem;
  letter-spacing: 0.18em; text-transform: uppercase; color: var(--muted);
}
.intake-page .ip-live-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--intake-fresh);
  box-shadow: 0 0 0 0 var(--intake-fresh-glow);
  animation: ip-pulse 2s ease-in-out infinite;
}
.intake-page .ip-live-dot.disconnected {
  background: var(--intake-breach);
  animation: none;
}
@keyframes ip-pulse {
  0%, 100% { box-shadow: 0 0 0 0 var(--intake-fresh-glow); }
  50%      { box-shadow: 0 0 0 8px transparent; }
}
.intake-page .ip-divider { width: 1px; height: 18px; background: var(--border2); }
.intake-page .ip-hours {
  font-family: var(--mono); font-size: 0.66rem;
  letter-spacing: 0.16em; text-transform: uppercase; color: var(--muted2);
}
.intake-page .ip-hours .gold { color: var(--gold-lt); }

/* Done counter (read-only, persistent) */
.intake-page .ip-done-counter {
  font-family: var(--mono); font-size: 0.66rem;
  letter-spacing: 0.16em; text-transform: uppercase; color: var(--muted);
  display: inline-flex; align-items: center; gap: 0.4rem;
}
.intake-page .ip-done-counter strong {
  color: var(--gold-lt); font-weight: 600; font-size: 0.78rem;
}
.intake-page .ip-done-counter svg {
  width: 12px; height: 12px;
  stroke: var(--gold-lt); fill: none; flex-shrink: 0;
}

.intake-page .ip-rep-select {
  background: var(--bg); border: 1px solid var(--border);
  color: var(--text); font-family: var(--sans);
  font-size: 0.85rem; padding: 0.45rem 0.7rem; border-radius: var(--radius);
  min-width: 200px;
}
.intake-page .ip-pod-info {
  font-family: var(--mono); font-size: 0.68rem;
  letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted);
}
.intake-page .ip-pod-info strong { color: var(--gold-lt); font-weight: 600; }

.intake-page .ip-status-right { display: flex; align-items: center; gap: 0.4rem; }

/* View toggle (Active | Done) — segmented control */
.intake-page .ip-view-toggle {
  display: inline-flex;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 2px;
}
.intake-page .ip-view-btn {
  background: transparent; border: none;
  font-family: var(--mono); font-size: 0.62rem;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--muted); padding: 0.4rem 0.8rem;
  border-radius: calc(var(--radius) - 2px);
  cursor: pointer; transition: all 0.15s ease;
  font-weight: 500;
  display: inline-flex; align-items: center; gap: 0.4rem;
}
.intake-page .ip-view-btn:hover { color: var(--text); }
.intake-page .ip-view-btn.active {
  background: var(--surface2); color: var(--gold-lt);
  border: 1px solid var(--border2);
  padding: calc(0.4rem - 1px) calc(0.8rem - 1px);
}
.intake-page .ip-view-btn-count {
  font-size: 0.58rem; opacity: 0.7;
  background: var(--surface3); padding: 0.05rem 0.35rem; border-radius: 99px;
  min-width: 16px; text-align: center;
}

.intake-page .ip-icon-btn {
  background: var(--bg); border: 1px solid var(--border); color: var(--muted);
  border-radius: var(--radius); padding: 0.5rem 0.8rem;
  font-family: var(--mono); font-size: 0.62rem;
  letter-spacing: 0.16em; text-transform: uppercase;
  cursor: pointer; transition: all 0.15s ease;
  display: inline-flex; align-items: center; gap: 0.5rem;
  position: relative;
}
.intake-page .ip-icon-btn svg {
  width: 14px; height: 14px; flex-shrink: 0;
  stroke: currentColor; fill: none;
}
.intake-page .ip-icon-btn:hover { color: var(--text); border-color: var(--gold-dim); }
.intake-page .ip-icon-btn.active {
  color: var(--gold-lt); border-color: var(--gold-dim);
  background: rgba(184, 150, 46, 0.08);
}

/* ─── Filter bar ──────────────────────────────────────────────── */
.intake-page .ip-filter-bar {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius-lg); margin-bottom: 1rem;
  padding: 0.55rem 0.75rem;
  display: flex; flex-direction: column; gap: 0.4rem;
}
.intake-page .ip-filter-row {
  display: flex; align-items: center; gap: 0.6rem;
  flex-wrap: wrap; min-height: 36px;
}
.intake-page .ip-filter-row + .ip-filter-row {
  padding-top: 0.4rem; border-top: 1px solid var(--border);
}
.intake-page .ip-filter-label {
  font-family: var(--mono); font-size: 0.6rem;
  letter-spacing: 0.18em; text-transform: uppercase; color: var(--muted2);
  padding: 0 0.35rem; flex-shrink: 0; white-space: nowrap;
  width: 70px;
}
.intake-page .ip-filter-pills {
  display: flex; gap: 0.35rem; flex-wrap: wrap; flex: 1;
  align-items: center;
}
.intake-page .ip-pill {
  background: var(--bg); border: 1px solid var(--border);
  color: var(--muted); font-family: var(--mono);
  font-size: 0.66rem; letter-spacing: 0.06em;
  padding: 0.4rem 0.75rem; border-radius: 99px;
  cursor: pointer; transition: all 0.15s ease;
  white-space: nowrap;
  display: inline-flex; align-items: center; gap: 0.4rem;
  position: relative;
}
.intake-page .ip-pill:hover { color: var(--text); border-color: var(--border2); }
.intake-page .ip-pill svg {
  width: 11px; height: 11px;
  stroke: currentColor; fill: none; flex-shrink: 0;
}
.intake-page .ip-pill-count {
  font-size: 0.6rem; opacity: 0.6;
  background: var(--surface3); padding: 0.05rem 0.4rem; border-radius: 99px;
  min-width: 18px; text-align: center;
}
.intake-page .ip-pill.active {
  background: rgba(184, 150, 46, 0.10);
  border-color: var(--gold-dim); color: var(--gold-lt);
}
.intake-page .ip-pill.active .ip-pill-count {
  background: rgba(184, 150, 46, 0.15); color: var(--gold-lt); opacity: 0.9;
}
.intake-page .ip-pill[data-cat="EVENT"] { color: var(--cat-event); }
.intake-page .ip-pill[data-cat="EVENT"]:hover { border-color: var(--cat-event); }
.intake-page .ip-pill[data-cat="EVENT"].active {
  background: var(--cat-event-bg);
  border-color: var(--cat-event); color: var(--cat-event);
}
.intake-page .ip-pill[data-cat="PAID"] { color: var(--cat-paid); }
.intake-page .ip-pill[data-cat="PAID"]:hover { border-color: var(--cat-paid); }
.intake-page .ip-pill[data-cat="PAID"].active {
  background: var(--cat-paid-bg);
  border-color: var(--cat-paid); color: var(--cat-paid);
}
.intake-page .ip-pill[data-cat="ORGANIC"] { color: var(--cat-organic); }
.intake-page .ip-pill[data-cat="ORGANIC"]:hover { border-color: var(--cat-organic); }
.intake-page .ip-pill[data-cat="ORGANIC"].active {
  background: var(--cat-organic-bg);
  border-color: var(--cat-organic); color: var(--cat-organic);
}
.intake-page .ip-pill-notif {
  position: absolute; top: -2px; right: -2px;
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--gold-lt); border: 2px solid var(--surface);
  animation: ip-pulse 1.5s ease-in-out infinite;
}
.intake-page .ip-show-all {
  margin-left: auto; flex-shrink: 0;
  font-family: var(--mono); font-size: 0.6rem;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--muted2); cursor: pointer;
  border: 1px solid transparent; padding: 0.4rem 0.6rem; border-radius: var(--radius);
  background: transparent;
}
.intake-page .ip-show-all:hover { color: var(--text); border-color: var(--border2); }

/* ─── 3-column board ──────────────────────────────────────────── */
.intake-page .ip-board {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 0.85rem; align-items: start;
}
.intake-page .ip-col {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius-lg); padding: 1rem;
  min-height: 460px; position: relative;
}
.intake-page .ip-col-header {
  display: flex; align-items: center; justify-content: space-between;
  padding-bottom: 0.85rem; border-bottom: 1px solid var(--border);
  margin-bottom: 0.85rem;
}
.intake-page .ip-col-title {
  font-family: var(--sans); font-weight: 700; font-size: 1rem;
  letter-spacing: -0.012em; color: var(--white);
  display: inline-flex; align-items: center; gap: 0.6rem;
}
.intake-page .ip-col-dot {
  width: 9px; height: 9px; border-radius: 50%;
  background: var(--intake-fresh);
  box-shadow: 0 0 6px var(--intake-fresh-glow);
}
.intake-page .ip-col[data-col="breached"] .ip-col-dot {
  background: var(--intake-breach);
  box-shadow: 0 0 6px var(--intake-breach-glow);
}
.intake-page .ip-col[data-col="hold"] .ip-col-dot {
  background: var(--intake-hold);
  box-shadow: 0 0 6px var(--intake-hold-glow);
}
.intake-page .ip-col-meta {
  font-family: var(--mono); font-size: 0.62rem;
  text-transform: uppercase; letter-spacing: 0.16em; color: var(--muted);
}
.intake-page .ip-col-count {
  font-family: var(--mono); font-size: 0.85rem; font-weight: 600;
  color: var(--gold-lt); margin-left: 0.4rem;
}
.intake-page .ip-col-empty {
  text-align: center; padding: 2.5rem 1rem; color: var(--muted2);
  font-family: var(--mono); font-size: 0.7rem;
  letter-spacing: 0.16em; text-transform: uppercase;
}

/* ─── Lead card ───────────────────────────────────────────────── */
.intake-page .ip-lead {
  background: var(--bg); border: 1px solid var(--border);
  border-radius: var(--radius);
  margin-bottom: 0.55rem; position: relative;
  transition: border-color 0.2s ease;
  overflow: hidden;
}
.intake-page .ip-lead:hover { border-color: var(--border2); }

.intake-page .ip-lead.is-new {
  animation: ip-slide-in 0.45s cubic-bezier(0.2, 0.8, 0.2, 1) both,
             ip-pulse-border 3s ease-out 0.45s both;
}
@keyframes ip-slide-in {
  from { opacity: 0; transform: translateY(-8px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes ip-pulse-border {
  0%   { border-color: var(--gold); box-shadow: 0 0 0 0 rgba(184, 150, 46, 0.35); }
  60%  { border-color: var(--gold); box-shadow: 0 0 0 6px transparent; }
  100% { border-color: var(--border); box-shadow: 0 0 0 0 transparent; }
}

/* Slide-out animation when lead is touched */
.intake-page .ip-lead.is-leaving {
  animation: ip-slide-out 0.35s cubic-bezier(0.4, 0, 0.6, 1) forwards;
  pointer-events: none;
}
@keyframes ip-slide-out {
  0%   { opacity: 1; transform: translateX(0); max-height: 200px; margin-bottom: 0.55rem; }
  60%  { opacity: 0; transform: translateX(24px); max-height: 200px; margin-bottom: 0.55rem; }
  100% { opacity: 0; transform: translateX(24px); max-height: 0; margin-bottom: 0; border-width: 0; padding-top: 0; padding-bottom: 0; }
}
.intake-page .ip-lead.is-restoring {
  animation: ip-restore 0.4s cubic-bezier(0.2, 0.8, 0.2, 1) both;
}
@keyframes ip-restore {
  0%   { opacity: 0; transform: translateX(-12px); }
  100% { opacity: 1; transform: translateX(0); }
}

/* Category strip across top of card */
.intake-page .ip-cat-strip {
  display: flex; align-items: center; gap: 0.42rem;
  padding: 0.32rem 0.85rem;
  font-family: var(--mono); font-size: 0.6rem;
  letter-spacing: 0.18em; text-transform: uppercase; font-weight: 600;
  border-bottom: 1px solid var(--border);
  cursor: help; position: relative;
}
.intake-page .ip-cat-strip svg {
  width: 11px; height: 11px;
  stroke: currentColor; fill: none; flex-shrink: 0;
}
.intake-page .ip-cat-strip-meta {
  margin-left: auto;
  font-size: 0.55rem;
  letter-spacing: 0.14em;
  opacity: 0.55; font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 50%;
}
.intake-page .ip-lead[data-cat="EVENT"] .ip-cat-strip {
  background: var(--cat-event-strip); color: var(--cat-event);
  border-bottom-color: rgba(212, 174, 82, 0.2);
}
.intake-page .ip-lead[data-cat="PAID"] .ip-cat-strip {
  background: var(--cat-paid-strip); color: var(--cat-paid);
  border-bottom-color: rgba(245, 158, 11, 0.18);
}
.intake-page .ip-lead[data-cat="ORGANIC"] .ip-cat-strip {
  background: var(--cat-organic-strip); color: var(--cat-organic);
  border-bottom-color: rgba(74, 222, 128, 0.18);
}
.intake-page .ip-lead[data-cat="OTHER"] .ip-cat-strip {
  background: var(--cat-other-strip); color: var(--cat-other);
  border-bottom-color: rgba(138, 138, 138, 0.15);
}

/* Tooltip showing raw UTM/tags on hover */
.intake-page .ip-cat-tooltip {
  position: absolute; top: calc(100% + 6px); left: 0.85rem;
  background: var(--surface3); border: 1px solid var(--border2);
  border-radius: var(--radius);
  padding: 0.55rem 0.7rem;
  font-family: var(--mono); font-size: 0.6rem;
  letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--text); white-space: nowrap;
  opacity: 0; pointer-events: none;
  transition: opacity 0.15s ease;
  z-index: 100;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.5);
}
.intake-page .ip-cat-tooltip strong { color: var(--gold-lt); font-weight: 600; }
.intake-page .ip-cat-tooltip-row { display: flex; gap: 0.5rem; }
.intake-page .ip-cat-tooltip-row + .ip-cat-tooltip-row { margin-top: 0.25rem; }
.intake-page .ip-cat-tooltip-key { color: var(--muted2); min-width: 80px; }
.intake-page .ip-cat-strip:hover .ip-cat-tooltip { opacity: 1; }

/* Lead body */
.intake-page .ip-lead-body { padding: 0.75rem 0.85rem; }
.intake-page .ip-lead-top {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 0.75rem;
}
.intake-page .ip-lead-idblock { flex: 1; min-width: 0; }
.intake-page .ip-lead-label {
  font-family: var(--mono); font-size: 0.85rem; font-weight: 600;
  color: var(--white); letter-spacing: 0.04em; line-height: 1.2;
  display: flex; align-items: center; gap: 0.4rem; flex-wrap: wrap;
}
.intake-page .ip-lead-loc {
  font-family: var(--sans); font-size: 0.78rem;
  color: var(--muted); font-weight: 500;
  margin-top: 0.18rem;
}
.intake-page .ip-lead-release {
  font-family: var(--mono); font-size: 0.6rem;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--muted2); margin-top: 0.32rem;
}

/* Done card metadata (rep + when + how) */
.intake-page .ip-lead-done-meta {
  font-family: var(--mono); font-size: 0.62rem;
  letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--muted); margin-top: 0.4rem;
  display: flex; align-items: center; gap: 0.5rem;
  flex-wrap: wrap;
}
.intake-page .ip-lead-done-meta strong { color: var(--text); font-weight: 600; }
.intake-page .ip-lead-done-meta svg {
  width: 11px; height: 11px;
  stroke: var(--cat-organic); fill: none; flex-shrink: 0;
}
.intake-page .ip-done-action-tag {
  font-size: 0.55rem; padding: 0.1rem 0.35rem;
  border: 1px solid var(--border2); border-radius: 3px;
  color: var(--muted2);
}

/* Timer */
.intake-page .ip-timer {
  font-family: var(--mono); font-size: 0.7rem; font-weight: 600;
  letter-spacing: 0.04em; padding: 0.16rem 0.45rem;
  border-radius: 4px; border: 1px solid currentColor;
  background: transparent; white-space: nowrap;
  flex-shrink: 0; line-height: 1.4;
}
.intake-page .ip-timer.fresh {
  color: var(--intake-fresh); background: rgba(74, 222, 128, 0.10);
  border-color: rgba(74, 222, 128, 0.45);
}
.intake-page .ip-timer.warn {
  color: var(--intake-warn); background: rgba(250, 204, 21, 0.10);
  border-color: rgba(250, 204, 21, 0.45);
}
.intake-page .ip-timer.breach {
  color: var(--intake-breach); background: rgba(239, 68, 68, 0.10);
  border-color: rgba(239, 68, 68, 0.45);
  animation: ip-breach-pulse 1.5s ease-in-out infinite;
}
@keyframes ip-breach-pulse {
  0%, 100% { opacity: 1; } 50% { opacity: 0.6; }
}
.intake-page .ip-timer.hold {
  color: var(--intake-hold); background: rgba(129, 140, 248, 0.08);
  border-color: rgba(129, 140, 248, 0.35);
  font-size: 0.6rem; letter-spacing: 0.16em;
  padding: 0.14rem 0.42rem;
}
/* Event leads carry no SLA — a static gold chip stands in for the timer. */
.intake-page .ip-timer.event {
  color: var(--gold-lt); background: rgba(212, 174, 82, 0.12);
  border-color: var(--gold-dim);
  font-size: 0.6rem; letter-spacing: 0.16em;
  padding: 0.14rem 0.42rem;
}

/* Action buttons */
.intake-page .ip-lead-actions {
  display: flex; gap: 0.35rem; margin-top: 0.7rem;
}
/* Done-card actions: only 2 buttons — keep them compact, not full-width.
   Overrides the flex:1 stretch that .ip-btn uses on the 4-button board cards. */
.intake-page .ip-done-actions {
  justify-content: flex-start;
}
.intake-page .ip-done-actions .ip-btn {
  flex: 0 0 auto;
  padding-left: 1.1rem; padding-right: 1.1rem;
}
.intake-page .ip-btn {
  flex: 1; min-width: 0;
  background: var(--surface2); border: 1px solid var(--border); color: var(--text);
  font-family: var(--mono); font-size: 0.62rem;
  letter-spacing: 0.13em; text-transform: uppercase; font-weight: 500;
  padding: 0.42rem 0.55rem; border-radius: var(--radius);
  cursor: pointer; transition: all 0.15s ease;
  text-align: center; text-decoration: none; white-space: nowrap;
  display: inline-flex; align-items: center; justify-content: center; gap: 0.3rem;
  height: 30px; line-height: 1;
}
.intake-page .ip-btn:hover { color: var(--white); border-color: var(--gold-dim); }
.intake-page .ip-btn-primary {
  background: linear-gradient(135deg, var(--gold-lt) 0%, var(--gold) 50%, var(--gold-dim) 100%);
  border: 1px solid var(--gold);
  color: var(--bg); font-weight: 700;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.15),
    inset 0 -1px 0 rgba(0, 0, 0, 0.15);
}
.intake-page .ip-btn-primary:hover {
  background: linear-gradient(135deg, #e2bb5e 0%, var(--gold-lt) 50%, var(--gold) 100%);
  border-color: var(--gold-lt); color: var(--bg);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.25),
    inset 0 -1px 0 rgba(0, 0, 0, 0.15),
    0 0 12px rgba(184, 150, 46, 0.25);
}
/* Was .ip-btn-icon at a fixed 36px holding the two letters "ES" — the same two letters the badge
   in the label line uses to mean "this lead IS Spanish-speaking". One was a state, the other an
   action, and only a hover tooltip told them apart. It is a labelled toggle now, so it sizes to
   its text. */
.intake-page .ip-btn-es {
  flex: 0 0 auto; padding: 0.4rem 0.55rem;
}
.intake-page .ip-btn-actions {
  color: var(--gold-lt);
  border-color: var(--gold-dim);
  background: rgba(184, 150, 46, 0.07);
  display: inline-flex; align-items: center; gap: 0.3rem;
}
.intake-page .ip-btn-actions:hover {
  color: var(--gold-lt);
  border-color: var(--gold-lt);
  background: rgba(184, 150, 46, 0.14);
}
.intake-page .ip-btn-actions .ip-btn-ico {
  width: 11px; height: 11px;
  stroke: currentColor; fill: none;
}
.intake-page .ip-btn-restore {
  color: var(--muted); border-color: var(--border);
}
.intake-page .ip-btn-restore:hover {
  color: var(--cat-organic); border-color: var(--cat-organic);
}
.intake-page .ip-btn-restore svg {
  width: 11px; height: 11px;
  stroke: currentColor; fill: none;
}

.intake-page .ip-lead-es {
  display: inline-flex; align-items: center; gap: 0.3rem;
  font-family: var(--mono); font-size: 0.58rem;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--cat-organic); background: rgba(74, 222, 128, 0.1);
  border: 1px solid rgba(74, 222, 128, 0.3);
  padding: 0.14rem 0.4rem; border-radius: 3px;
}

/* ─── Done view (single column flat list) ─────────────────────── */
.intake-page .ip-done-board {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius-lg); padding: 1.25rem;
  min-height: 400px;
}
.intake-page .ip-done-header {
  display: flex; align-items: center; justify-content: space-between;
  padding-bottom: 1rem; border-bottom: 1px solid var(--border);
  margin-bottom: 1rem;
}
.intake-page .ip-done-title {
  font-family: var(--sans); font-weight: 700; font-size: 1.1rem;
  color: var(--white);
  display: inline-flex; align-items: center; gap: 0.6rem;
}
.intake-page .ip-done-title svg {
  width: 16px; height: 16px;
  stroke: var(--cat-organic); fill: none;
}
.intake-page .ip-done-meta {
  font-family: var(--mono); font-size: 0.62rem;
  text-transform: uppercase; letter-spacing: 0.16em; color: var(--muted);
}
.intake-page .ip-done-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(420px, 1fr));
  gap: 0.55rem;
  align-items: start;
}
.intake-page .ip-done-empty {
  text-align: center; padding: 3rem 1rem; color: var(--muted2);
  font-family: var(--mono); font-size: 0.7rem;
  letter-spacing: 0.16em; text-transform: uppercase;
}

/* ── Events board ──────────────────────────────────────────────────────────
   Same shell as the done board; the list is a responsive grid since event
   leads are browsed-with-context, not raced down a queue. */
.intake-page .ip-events-board {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius-lg); padding: 1.25rem;
  min-height: 400px;
}
.intake-page .ip-events-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(330px, 1fr));
  gap: 0.7rem;
}
.intake-page .ip-events-board .ip-done-title svg {
  stroke: var(--gold-lt);
}
.intake-page .ip-lead-event {
  border-color: var(--gold-dim);
}

/* ─── Toast ───────────────────────────────────────────────────── */
.intake-page .ip-toast-stack {
  position: fixed; bottom: 1.5rem; right: 1.5rem;
  display: flex; flex-direction: column; gap: 0.55rem;
  z-index: 10000; pointer-events: none;
}
.intake-page .ip-toast {
  background: var(--surface2); border: 1px solid var(--border2);
  border-radius: var(--radius); padding: 0.85rem 1rem;
  display: flex; align-items: center; gap: 0.85rem;
  min-width: 280px; max-width: 380px; pointer-events: auto;
  animation: ip-toast-in 0.3s cubic-bezier(0.2, 0.8, 0.2, 1) both;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
  position: relative; overflow: hidden;
}
@keyframes ip-toast-in {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}
.intake-page .ip-toast.leaving {
  animation: ip-toast-out 0.25s ease-in forwards;
}
@keyframes ip-toast-out { to { opacity: 0; transform: translateY(8px); } }
.intake-page .ip-toast-text {
  flex: 1; font-size: 0.82rem; color: var(--text); line-height: 1.35;
}
.intake-page .ip-toast-text strong { color: var(--white); }
.intake-page .ip-toast-action {
  background: var(--gold); border: none; color: var(--bg);
  font-family: var(--mono); font-size: 0.66rem;
  letter-spacing: 0.16em; text-transform: uppercase; font-weight: 700;
  padding: 0.45rem 0.75rem; border-radius: 4px; cursor: pointer;
}
.intake-page .ip-toast-progress {
  position: absolute; bottom: 0; left: 0; height: 2px;
  background: var(--gold); width: 100%; transform-origin: left;
  animation: ip-progress 5s linear forwards;
}
@keyframes ip-progress { from { transform: scaleX(1); } to { transform: scaleX(0); } }

/* ─── All-clear celebration ───────────────────────────────────── */
.intake-page .ip-allclear {
  text-align: center; padding: 3rem 2rem;
  background: var(--surface); border: 1px solid var(--gold-dim);
  border-radius: var(--radius-lg); position: relative; overflow: hidden;
}
.intake-page .ip-allclear::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg, transparent 0%, var(--gold) 50%, transparent 100%);
}
.intake-page .ip-allclear-title {
  font-family: var(--sans); font-weight: 700; font-size: 1.85rem;
  letter-spacing: -0.025em; color: var(--white); margin-bottom: 0.65rem;
}
.intake-page .ip-allclear-title .gold { color: var(--gold-lt); }
.intake-page .ip-allclear-sub {
  color: var(--muted); font-size: 0.95rem; margin-bottom: 1.5rem;
  max-width: 480px; margin-left: auto; margin-right: auto; line-height: 1.55;
}
.intake-page .ip-allclear-actions {
  display: flex; gap: 0.65rem; justify-content: center; flex-wrap: wrap;
}
.intake-page .ip-allclear-btn {
  background: var(--bg); border: 1px solid var(--border2);
  color: var(--text); font-family: var(--mono); font-size: 0.7rem;
  letter-spacing: 0.16em; text-transform: uppercase; font-weight: 500;
  padding: 0.75rem 1.25rem; border-radius: var(--radius);
  cursor: pointer; text-decoration: none;
  display: inline-flex; align-items: center; gap: 0.5rem;
  transition: all 0.15s ease;
}
.intake-page .ip-allclear-btn:hover { border-color: var(--gold); color: var(--white); }

/* ─── Pod modal ───────────────────────────────────────────────── */
.intake-page .ip-modal-backdrop {
  position: fixed; inset: 0;
  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(4px);
  display: grid; place-items: center;
  z-index: 9999;
  animation: ip-fade-in 0.2s ease;
}
@keyframes ip-fade-in { from { opacity: 0; } to { opacity: 1; } }
.intake-page .ip-modal {
  background: var(--surface);
  border: 1px solid var(--border2);
  border-radius: var(--radius-lg);
  padding: 1.75rem;
  max-width: 520px; width: calc(100% - 2rem);
  max-height: 80vh; overflow-y: auto;
}
.intake-page .ip-modal-header {
  display: flex; justify-content: space-between; align-items: flex-start;
  margin-bottom: 1.25rem;
}
.intake-page .ip-modal-title {
  font-family: var(--sans); font-weight: 700; font-size: 1.1rem;
  color: var(--white);
}
.intake-page .ip-modal-close {
  background: transparent; border: none; color: var(--muted);
  font-size: 1.4rem; cursor: pointer; line-height: 1; padding: 0.2rem;
}
.intake-page .ip-modal-close:hover { color: var(--white); }
.intake-page .ip-rep-grid {
  display: grid; grid-template-columns: repeat(2, 1fr);
  gap: 0.5rem; margin-bottom: 1.5rem;
}
.intake-page .ip-rep-toggle {
  display: flex; align-items: center; gap: 0.6rem;
  background: var(--bg); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 0.65rem 0.85rem;
  cursor: pointer; font-size: 0.85rem; color: var(--text);
  transition: all 0.15s ease;
}
.intake-page .ip-rep-toggle:hover { border-color: var(--border2); }
.intake-page .ip-rep-toggle.active {
  background: rgba(184, 150, 46, 0.08);
  border-color: var(--gold-dim); color: var(--white);
}
.intake-page .ip-rep-toggle input { display: none; }
.intake-page .ip-rep-check {
  width: 16px; height: 16px;
  border: 1px solid var(--border2); border-radius: 3px;
  display: grid; place-items: center;
  font-size: 0.7rem; color: transparent;
}
.intake-page .ip-rep-toggle.active .ip-rep-check {
  background: var(--gold); border-color: var(--gold); color: var(--bg);
}
.intake-page .ip-modal-section-label {
  font-family: var(--mono); font-size: 0.62rem;
  text-transform: uppercase; letter-spacing: 0.18em;
  color: var(--muted); margin-bottom: 0.65rem; margin-top: 1.25rem;
}
.intake-page .ip-modal-section-label:first-child { margin-top: 0; }
.intake-page .ip-modal-select {
  width: 100%;
  background: var(--bg); border: 1px solid var(--border);
  border-radius: var(--radius); color: var(--text);
  font-family: var(--sans); font-size: 0.9rem;
  padding: 0.65rem 0.85rem;
}
.intake-page .ip-modal-actions {
  display: flex; justify-content: flex-end; gap: 0.6rem;
  margin-top: 1.5rem; padding-top: 1.25rem;
  border-top: 1px solid var(--border);
}

/* ─── Responsive ──────────────────────────────────────────────── */
@media (max-width: 1024px) {
  .intake-page .ip-board {
    grid-template-columns: repeat(3, 1fr); gap: 0.5rem;
  }
  .intake-page .ip-col { padding: 0.7rem; min-height: 380px; }
  .intake-page .ip-lead-body { padding: 0.65rem 0.7rem; }
  .intake-page .ip-btn { font-size: 0.55rem; padding: 0.4rem; }
}
@media (max-width: 767px) {
  .intake-page .ip-board { grid-template-columns: 1fr; }
  .intake-page .ip-col { min-height: 200px; }
}
@media (max-width: 640px) {
  .intake-page .ip-hero {
    flex-direction: column; align-items: flex-start;
  }
  .intake-page .ip-status,
  .intake-page .ip-status-left,
  .intake-page .ip-status-right { flex-wrap: wrap; }
  .intake-page .ip-toast-stack {
    bottom: 0.75rem; right: 0.75rem; left: 0.75rem;
  }
  .intake-page .ip-toast { min-width: 0; max-width: none; }
  .intake-page .ip-rep-grid { grid-template-columns: 1fr; }
}

/* ── Done board: two-column Paid | Organic split (B-tall, scrollable windows) ── */
.intake-page .ip-done-split{
  display:grid; grid-template-columns:1fr 1fr; gap:1rem;
  align-items:start;
}
.intake-page .ip-done-col{
  min-width:0; height:620px;
  display:flex; flex-direction:column;
}
.intake-page .ip-done-col-head{
  display:flex; align-items:center; justify-content:space-between;
  padding:0 .2rem .65rem; margin-bottom:.65rem; border-bottom:1px solid var(--border);
}
.intake-page .ip-done-col-title{
  display:inline-flex; align-items:center; gap:.5rem;
  font-family:var(--mono); font-size:.68rem; letter-spacing:.16em;
  text-transform:uppercase; font-weight:600;
}
.intake-page .ip-done-col-dot{ width:8px; height:8px; border-radius:50%; }
.intake-page .ip-done-col[data-bucket="paid"] .ip-done-col-dot{ background:var(--cat-paid); }
.intake-page .ip-done-col[data-bucket="organic"] .ip-done-col-dot{ background:var(--cat-organic); }
.intake-page .ip-done-col[data-bucket="paid"] .ip-done-col-title{ color:var(--cat-paid); }
.intake-page .ip-done-col[data-bucket="organic"] .ip-done-col-title{ color:var(--cat-organic); }
.intake-page .ip-done-col-count{
  font-family:var(--mono); font-size:.62rem; color:var(--muted); letter-spacing:.12em;
}
/* the scrollable window */
.intake-page .ip-done-col-list{
  display:flex; flex-direction:column; gap:.55rem;
  flex:1 1 auto; min-height:0; overflow-y:auto; padding-right:.35rem;
}
.intake-page .ip-done-col-list > *{ flex:0 0 auto; }
.intake-page .ip-done-col-list::-webkit-scrollbar{ width:8px; }
.intake-page .ip-done-col-list::-webkit-scrollbar-thumb{ background:var(--border2); border-radius:4px; }
.intake-page .ip-done-col-list::-webkit-scrollbar-track{ background:transparent; }
/* stack on narrow screens */
@media (max-width:760px){
  .intake-page .ip-done-split{ grid-template-columns:1fr; }
}
/* ─── Module 25: Qualify board + transcript drawer ─── */
.ip-qualify-board{padding:4px 0}
.qz-head{display:flex;align-items:baseline;gap:10px;margin:2px 2px 12px}
.qz-head h2{font-size:1.05rem;font-weight:700;color:var(--white);letter-spacing:.01em}
.qz-subhead{font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted2)}
.qz-empty{color:var(--muted);font-size:.9rem;padding:24px 4px}
.qz-board{display:flex;flex-direction:column;gap:10px}
.qz-card{position:relative;display:flex;gap:14px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:14px 16px 14px 18px;overflow:hidden;cursor:pointer;transition:.15s}
.qz-card:hover{border-color:var(--border2);transform:translateY(-1px)}
.qz-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--muted)}
.qz-card[data-band=green]::before{background:var(--intake-fresh)}
.qz-card[data-band=yellow]::before{background:var(--intake-warn)}
.qz-card.hot{border-color:var(--gold-dim);box-shadow:0 0 0 1px var(--gold-dim),0 0 22px -6px var(--gold-glow);animation:qzHot 2s infinite}
@keyframes qzHot{0%,100%{box-shadow:0 0 0 1px var(--gold-dim),0 0 22px -8px rgba(184,150,46,.30)}50%{box-shadow:0 0 0 1px var(--gold),0 0 26px -4px rgba(184,150,46,.55)}}
.qz-score{flex:none;width:54px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border-right:1px solid var(--border);padding-right:12px}
.qz-score .n{font-family:var(--mono);font-size:1.5rem;font-weight:700;line-height:1;color:var(--white)}
.qz-score .b{font-family:var(--mono);font-size:.56rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--muted)}
.qz-card[data-band=green] .qz-score .b{color:var(--intake-fresh)}
.qz-card[data-band=yellow] .qz-score .b{color:var(--intake-warn)}
.qz-body{flex:1;min-width:0}
.qz-row1{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.qz-path{font-family:var(--mono);font-size:.6rem;font-weight:700;letter-spacing:.12em;padding:2px 7px;border-radius:5px;background:var(--surface2);color:var(--muted);border:1px solid var(--border)}
.qz-path.wl{color:var(--intake-fresh);border-color:rgba(74,222,128,.3)}
.qz-path.hrt{color:var(--gold-lt);border-color:var(--gold-dim)}
.qz-name{font-weight:600;color:var(--text);font-size:.95rem}
.qz-loc{color:var(--muted);font-size:.82rem}
.qz-hot-tag{margin-left:auto;font-family:var(--mono);font-size:.6rem;font-weight:700;letter-spacing:.12em;color:#1a1205;background:var(--gold-lt);padding:3px 9px;border-radius:20px}
.qz-action{margin-top:6px;font-size:.86rem;color:var(--gold-lt)}
.qz-meta{margin-top:8px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.qz-sig{font-family:var(--mono);font-size:.64rem;color:var(--muted);background:var(--bg);border:1px solid var(--border);border-radius:5px;padding:2px 7px}
.qz-sig.neg{color:#d96b6b;border-color:rgba(217,107,107,.3)}
.qz-time{margin-left:auto;font-family:var(--mono);font-size:.66rem;color:var(--muted2)}
.qz-actions{flex:none;display:flex;flex-direction:column;gap:6px;align-self:center;padding-left:12px;border-left:1px solid var(--border)}
.qz-btn{font-family:var(--sans);font-size:.74rem;font-weight:600;padding:7px 12px;border-radius:8px;border:1px solid var(--border);background:var(--bg);color:var(--muted);cursor:pointer;white-space:nowrap;display:inline-flex;align-items:center;gap:6px;justify-content:center;text-decoration:none}
.qz-btn:hover{color:var(--gold-lt);border-color:var(--gold-dim)}
.qz-btn.gold{background:linear-gradient(135deg,var(--gold-lt),var(--gold) 55%,var(--gold-dim));color:#1a1205;border:none}
.qz-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:1400}
.qz-drawer{position:fixed;top:0;right:0;height:100vh;width:400px;max-width:92vw;z-index:1401;background:var(--surface);border-left:1px solid var(--border);box-shadow:-22px 0 55px -22px rgba(0,0,0,.85);display:flex;flex-direction:column;transform:translateX(100%);transition:transform .28s cubic-bezier(.22,1,.36,1)}
.qz-drawer.open{transform:translateX(0)}
.qz-dr-head{padding:16px 18px;border-bottom:1px solid var(--border)}
.qz-dr-top{display:flex;align-items:center;gap:10px}
.qz-dr-score{font-family:var(--mono);font-size:1.7rem;font-weight:700;color:var(--white);line-height:1}
.qz-dr-band{font-family:var(--mono);font-size:.6rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;padding:3px 9px;border-radius:20px;color:var(--muted);background:var(--surface2)}
.qz-dr-band.green{color:var(--intake-fresh);background:var(--intake-fresh-glow)}
.qz-dr-band.yellow{color:var(--intake-warn);background:var(--intake-warn-glow)}
.qz-dr-close{margin-left:auto;background:none;border:none;color:var(--muted);font-size:1.4rem;cursor:pointer;line-height:1}
.qz-dr-who{margin-top:10px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.qz-dr-action{margin-top:12px;background:var(--gold-glow);border:1px solid var(--gold-dim);border-radius:10px;padding:10px 12px;font-size:.84rem;color:var(--gold-lt)}
.qz-dr-sigs{padding:12px 18px;border-bottom:1px solid var(--border);display:flex;flex-wrap:wrap;gap:6px}
.qz-dr-convo{flex:1;overflow-y:auto;padding:16px 18px;display:flex;flex-direction:column;gap:10px;background:var(--bg)}
.qz-msg{max-width:88%;font-size:.85rem;padding:9px 12px;border-radius:13px}
.qz-msg.lead{align-self:flex-end;background:var(--gold-dim);color:#fff;border-bottom-right-radius:4px}
.qz-msg.bot{align-self:flex-start;background:var(--surface2);border:1px solid var(--border);border-bottom-left-radius:4px;color:var(--text)}
.qz-dr-foot{padding:12px 18px;border-top:1px solid var(--border);display:flex;gap:8px}
.qz-dr-foot .qz-btn{flex:1;padding:11px}
.qz-label{font-family:var(--mono);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted2);margin-bottom:6px}
@media(max-width:520px){.qz-actions{flex-direction:row;border-left:none;padding-left:0;width:100%}.qz-drawer{width:100vw}}

/* ─── Intake remodel: identity chip + secondary view group ─── */
.intake-page .ip-rep-chip{font-family:var(--mono);font-size:.72rem;letter-spacing:.04em;color:var(--gold-lt);background:var(--gold-glow);border:1px solid var(--gold-dim);border-radius:20px;padding:4px 11px;white-space:nowrap}
.intake-page .ip-view-toggle--secondary{margin-left:1.25rem}

.qz-mine{font-family:var(--mono);font-size:.58rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--intake-fresh);background:var(--intake-fresh-glow);border-radius:20px;padding:2px 8px;margin-left:6px}

@keyframes qzTabPulse{0%,100%{box-shadow:0 0 0 0 rgba(184,150,46,0)}50%{box-shadow:0 0 0 3px var(--gold-glow)}}
.intake-page .ip-view-btn.qz-pulse{color:var(--gold-lt);border-radius:7px;animation:qzTabPulse 1.4s infinite}

.qz-esc-tag{font-family:var(--mono);font-size:.6rem;font-weight:700;letter-spacing:.12em;color:#fff;background:var(--intake-breach);padding:3px 9px;border-radius:20px;margin-left:6px}
@keyframes qzEsc{0%,100%{box-shadow:0 0 0 1px var(--intake-breach),0 0 22px -8px rgba(239,68,68,.4)}50%{box-shadow:0 0 0 1px var(--intake-breach),0 0 26px -2px rgba(239,68,68,.7)}}
.qz-card.esc{border-color:var(--intake-breach);animation:qzEsc 1.3s infinite}

/* Module 28 — Book in Zenoti button (teal accent, matches Convert) */
.intake-page .ip-btn-book {
  flex: 0 0 auto;                       /* size to text — no clipping */
  border-color: #2bb8a3;
  color: #3fd4bd;
  background: rgba(43, 184, 163, 0.10);
}
.intake-page .ip-btn-book:hover {
  background: rgba(43, 184, 163, 0.20);
  border-color: #3fd4bd;
  color: #5ee3d0;
}

/* ── Qualify board: handled rows + the toggle that reveals them ────────────────
   A handled lead is off the working board; when the toggle brings it back it has to be
   unmistakably not-live, or a rep works a row someone already closed. Dimmed, and the
   left band stripe goes neutral so it cannot read as hot. */
.qz-card.handled{opacity:.55}
.qz-card.handled::before{background:var(--muted)!important}
.qz-card.handled:hover{opacity:.8}
.qz-toggle{margin-left:auto;font-size:11px;padding:3px 9px}
.qz-toggle.on{border-color:var(--gold);color:var(--gold)}
/* The score cell reads ASK / Call for a lead who asked to be contacted. Narrower than a
   two-digit score, so keep the column from collapsing and the label from wrapping. */
.qz-score .n{white-space:nowrap}

/* ── Qualify board: lead source ───────────────────────────────────────────────
   "Voice AI" tag on a card whose chat was started from the AI receptionist's text, and the
   All / Voice AI / Form & web filter in the header. Teal, the Convert/booking accent, so it
   cannot be mistaken for the gold HRT path tag or the gold HOT tag on the same row. The group
   takes the header's auto margin, so the handled toggle sits right beside it. */
.qz-entry-tag{font-family:var(--mono);font-size:.6rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#3fd4bd;border:1px solid rgba(43,184,163,.45);background:rgba(43,184,163,.10);padding:2px 8px;border-radius:20px;white-space:nowrap}
.qz-entry{margin-left:auto;display:flex;gap:4px}
.qz-entry .qz-btn{font-size:11px;padding:3px 9px}
.qz-entry .qz-btn.on{border-color:var(--gold);color:var(--gold)}
.qz-entry + .qz-toggle{margin-left:0}
/* The header now holds three more buttons; let it wrap on a phone instead of overflowing. */
.qz-head{flex-wrap:wrap}