/* ============================================================
   SALES CRM — redesigned (Clients / Properties / Calendar + Analytics + detail)
   Everything is token-based (design-system.css) so it is dark-mode correct, and
   scoped to #salesScreen so it wins over the legacy dashboard.css crm-* base and
   never touches other screens. The Sales team now gets the sidebar shell, so
   this is the ONLY styling path for the dashboard.
   ============================================================ */

/* ---------- layout canvas ---------- */
#salesScreen #salesBody{ background:transparent; padding:40px 48px 76px; min-height:100%; }
#salesScreen .crm-header,
#salesScreen #crmMain{ max-width:1280px; margin:0 auto; }
#salesScreen .crm-loading{ padding:48px 4px; color:var(--text-muted); font-size:14px; }
#salesScreen .installer-muted{ color:var(--text-muted); }

/* ---------- workspace header ---------- */
#salesScreen .crm-header{ border:none; padding:0; }
#salesScreen .crm-head-top{ display:flex; justify-content:space-between; align-items:flex-start; gap:24px; flex-wrap:wrap; }
#salesScreen .crm-eyebrow{ font-size:11px; letter-spacing:.2em; color:var(--gold-dark); font-weight:600; margin:0 0 9px; }
#salesScreen .crm-title{ font-family:var(--font-serif); font-weight:600; font-size:33px; line-height:1.03; letter-spacing:-0.01em; color:var(--text-head); margin:0; display:flex; align-items:baseline; gap:12px; }
#salesScreen .crm-count{ font-family:var(--font-sans); font-size:13px; font-weight:600; color:var(--gold-dark); background:var(--gold-faint); border:1px solid var(--gold-pill-border); border-radius:999px; padding:2px 11px; }
#salesScreen .crm-subtitle{ margin:11px 0 0; font-size:14.5px; color:var(--text-muted); max-width:60ch; }
#salesScreen .crm-head-actions{ display:flex; flex-wrap:wrap; gap:9px; align-items:center; justify-content:flex-end; }

#salesScreen .crm-head-controls{ display:flex; flex-wrap:wrap; gap:12px; align-items:center; margin-top:24px; padding-bottom:0; }

/* segmented view switcher (Clients / Properties / Calendar) */
#salesScreen .crm-switcher{ display:inline-flex; background:var(--surface-2); border:1px solid var(--hairline); border-radius:10px; padding:3px; gap:2px; }
#salesScreen .crm-seg{ font-family:var(--font-sans); font-size:12.5px; font-weight:500; color:var(--text-muted); background:transparent; border:none; border-radius:7px; padding:8px 16px; cursor:pointer; transition:color .15s, background .15s; }
#salesScreen .crm-seg:hover{ color:var(--text-head); }
#salesScreen .crm-switcher .crm-seg.active{ font-weight:600; color:var(--text-head); background:var(--surface); box-shadow:0 1px 2px rgba(0,0,0,.10); }
[data-theme="dark"] #salesScreen .crm-switcher .crm-seg.active{ background:var(--sidebar-active); color:var(--sidebar-text-strong); }

/* "Group by agent" ghost toggle */
#salesScreen .crm-seg-toggle{ border:1px solid var(--border-btn); border-radius:9px; padding:9px 14px; color:var(--text-muted); background:transparent; font-size:12.5px; font-weight:500; cursor:pointer; transition:all .15s; }
#salesScreen .crm-seg-toggle:hover{ border-color:var(--gold); color:var(--gold-dark); }
#salesScreen .crm-seg-toggle.active{ border-color:var(--gold); color:var(--gold-dark); background:var(--gold-faint); }

/* search field */
#salesScreen .crm-search{ position:relative; flex:1 1 240px; min-width:180px; display:flex; align-items:center; gap:10px; border:1px solid var(--border-btn); border-radius:10px; padding:9px 14px; background:var(--surface); transition:border-color .15s, box-shadow .15s; }
#salesScreen .crm-search:focus-within{ border-color:var(--gold); box-shadow:0 0 0 3px var(--gold-faint); }
#salesScreen .crm-search-ico{ position:static; transform:none; color:var(--text-faint); font-size:15px; }
#salesScreen .crm-search-input{ flex:1; min-width:0; width:auto; padding:0; border:none; outline:none; background:transparent; font-family:var(--font-sans); font-size:13px; color:var(--text-strong); }
#salesScreen .crm-search-input::placeholder{ color:var(--text-faint); }
#salesScreen .crm-search-input:focus{ box-shadow:none; }

/* agent <select> */
#salesScreen .crm-select{ font-family:var(--font-sans); font-size:12.5px; color:var(--text-head); background:var(--surface); border:1px solid var(--border-btn); border-radius:10px; padding:9px 12px; cursor:pointer; }
#salesScreen .crm-select:focus{ outline:none; border-color:var(--gold); }

/* buttons */
#salesScreen .btn-secondary{ font-family:var(--font-sans); font-size:12.5px; font-weight:500; color:var(--text-head); background:var(--surface); border:1px solid var(--border-btn); border-radius:9px; padding:9px 14px; cursor:pointer; transition:all .15s; box-shadow:none; }
#salesScreen .btn-secondary:hover{ border-color:var(--gold); color:var(--gold-dark); }
#salesScreen .btn-secondary:disabled{ opacity:.5; cursor:not-allowed; }
#salesScreen .btn-primary,
#salesScreen .btn-gold{ font-family:var(--font-sans); font-size:12.5px; font-weight:700; letter-spacing:.02em; color:#1f2533; background:var(--gold); border:1px solid var(--gold); border-radius:9px; padding:9px 16px; cursor:pointer; transition:all .15s; box-shadow:none; }
#salesScreen .btn-primary:hover,
#salesScreen .btn-gold:hover{ background:var(--gold-soft); border-color:var(--gold-soft); }
#salesScreen .btn-primary:disabled{ opacity:.5; cursor:not-allowed; }

/* ---------- follow-up strip ---------- */
#salesScreen .crm-strip,
#salesScreen .crm-strip.overdue{ margin:22px 0 0; border:1px solid color-mix(in srgb, var(--red) 30%, transparent); background:var(--red-bg); border-radius:12px; overflow:hidden; }
#salesScreen .crm-strip-row.overdue{ background:transparent; }
#salesScreen .crm-strip-row.overdue .crm-strip-lead strong{ color:var(--red); }
#salesScreen .crm-strip-head{ display:flex; align-items:center; gap:8px; padding:13px 16px; font-size:13px; color:var(--text-strong); }
#salesScreen .crm-strip-dot{ color:var(--red); font-size:9px; }
#salesScreen .crm-strip-head strong{ color:var(--red); }
#salesScreen .crm-strip-spacer{ flex:1; }
#salesScreen .crm-strip-btn{ font-size:11px; font-weight:600; color:var(--text-head); background:var(--surface); border:1px solid var(--border-btn); border-radius:7px; padding:5px 11px; cursor:pointer; }
#salesScreen .crm-strip-x{ background:none; border:none; color:var(--text-faint); cursor:pointer; font-size:13px; padding:4px; }
#salesScreen .crm-strip-list{ background:var(--surface); border-top:1px solid var(--hairline); }
#salesScreen .crm-strip-row{ display:flex; justify-content:space-between; align-items:center; gap:12px; padding:11px 16px; border-top:1px solid var(--rule); font-size:12.5px; }
#salesScreen .crm-strip-row:first-child{ border-top:none; }
#salesScreen .crm-strip-lead strong{ color:var(--text-strong); }
#salesScreen .crm-strip-meta{ display:flex; align-items:center; gap:8px; color:var(--text-faint); font-size:11.5px; white-space:nowrap; }

/* ---------- filter bar (relationship stages / eligibility) ---------- */
#salesScreen .crm-filterbar{ padding:22px 0 0; }
#salesScreen .crm-stages{ display:flex; gap:24px; flex-wrap:nowrap; overflow-x:auto; border-bottom:1px solid var(--rule-strong); scrollbar-width:thin; }
#salesScreen .crm-stages > .crm-stage{ min-height:44px; background:transparent; border:none; border-bottom:2px solid transparent; border-radius:0; padding:2px 1px 10px; margin-bottom:-1px; white-space:nowrap; cursor:pointer; font-family:var(--font-sans); font-size:13px; font-weight:500; color:var(--text-muted); box-shadow:none; transition:color .15s, border-color .15s; }
#salesScreen .crm-stage:hover{ color:var(--text-head); }
#salesScreen .crm-stage.active{ color:var(--text-head); font-weight:600; border-bottom-color:var(--gold); }
#salesScreen .crm-stage:focus-visible{ outline:2px solid var(--gold); outline-offset:-3px; }
#salesScreen .crm-stage b{ font-variant-numeric:tabular-nums; font-weight:700; color:inherit; margin-left:5px; opacity:.65; }
#salesScreen .crm-stage.active b{ opacity:1; }

/* ---------- data tables (Clients + Properties) ---------- */
#salesScreen #crmTableWrap{ margin-top:8px; overflow-x:auto; }
#salesScreen .crm-table{ width:100%; margin:0; background:transparent; border:none; border-radius:0; box-shadow:none; border-collapse:collapse; }
#salesScreen .crm-table thead th{ background:transparent; border-bottom:1px solid var(--rule-strong); font-family:var(--font-sans); font-size:10px; letter-spacing:.09em; color:var(--text-faint); font-weight:600; padding:12px 14px; text-transform:uppercase; text-align:left; white-space:nowrap; }
#salesScreen .crm-th-src{ display:inline-block; margin-left:6px; font-size:8.5px; letter-spacing:.06em; color:var(--gold-dark); background:var(--gold-faint); border-radius:999px; padding:1px 6px; }
#salesScreen .crm-sortable{ cursor:pointer; user-select:none; }
#salesScreen .crm-sortable:hover{ color:var(--text-body); }
#salesScreen .crm-sort-ind{ opacity:.4; font-size:9px; }
#salesScreen .crm-sort-ind.on{ opacity:1; color:var(--gold-dark); }
#salesScreen .crm-table tbody td{ border-bottom:1px solid var(--rule); padding:14px; font-size:13px; color:var(--text-body); vertical-align:middle; }
#salesScreen .crm-row{ cursor:pointer; transition:background .14s; }
#salesScreen .crm-row:hover td{ background:var(--hover); }
#salesScreen .crm-row:hover td:first-child{ box-shadow:inset 3px 0 0 var(--gold); }
#salesScreen .crm-empty{ padding:44px 14px !important; text-align:center; color:var(--text-faint); font-size:13.5px; }

/* avatar + name + contact */
#salesScreen .crm-col-av{ width:44px; padding-right:0 !important; }
#salesScreen .crm-avatar{ display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:50%; background:var(--surface-2); border:1px solid var(--hairline); color:var(--text-muted); font-size:10.5px; font-weight:700; }
#salesScreen .crm-avatar.crm-av-gold{ color:var(--gold-dark); background:var(--gold-faint); border-color:var(--gold-pill-border); }
#salesScreen .crm-avatar.crm-av-navy{ color:var(--navy-badge-text); background:color-mix(in srgb, var(--sidebar-bg) 12%, transparent); border-color:var(--navy-badge-border); }
#salesScreen .crm-avatar.crm-av-sage{ color:var(--green); background:var(--green-bg); border-color:color-mix(in srgb, var(--green) 35%, transparent); }
#salesScreen .crm-avatar.crm-av-slate{ color:var(--info); background:color-mix(in srgb, var(--info) 12%, transparent); border-color:color-mix(in srgb, var(--info) 35%, transparent); }
#salesScreen .crm-prop-ico{ display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:9px; background:var(--surface-2); border:1px solid var(--hairline); color:var(--text-muted); }
#salesScreen .crm-name{ font-size:14px; font-weight:600; color:var(--text-strong); line-height:1.3; }
#salesScreen .crm-contact{ display:flex; align-items:center; gap:7px; margin-top:3px; font-size:11.5px; color:var(--text-faint); }
#salesScreen .crm-contact-em{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:24ch; }
#salesScreen .crm-contact-dot{ opacity:.5; }
#salesScreen .crm-contact-empty{ font-style:italic; }
#salesScreen .crm-col-agent,
#salesScreen .crm-col-pagent,
#salesScreen .crm-col-pclient{ color:var(--text-body); font-size:12.5px; }
#salesScreen .crm-plink{ color:var(--text-body); font-weight:500; }
#salesScreen .crm-fup{ font-size:12.5px; font-weight:500; color:var(--text-body); }
#salesScreen .crm-fup.overdue{ color:var(--red); font-weight:600; }
#salesScreen .crm-dash,
#salesScreen .crm-ag-dash{ color:var(--text-faint); }
#salesScreen .crm-ago{ color:var(--text-faint); font-size:12px; }
#salesScreen .crm-propcount{ font-weight:600; color:var(--text-strong); }
#salesScreen .crm-props-label{ font-size:11.5px; color:var(--text-faint); margin-left:5px; }

/* grouped-by-agent heads */
#salesScreen .crm-agent-head td{ font-size:10px; letter-spacing:.09em; text-transform:uppercase; color:var(--text-faint); font-weight:600; padding:20px 14px 8px; border-bottom:1px solid var(--rule-strong); }
#salesScreen .crm-tab-count{ display:inline-flex; align-items:center; justify-content:center; min-width:18px; height:18px; padding:0 6px; font-size:10.5px; font-weight:600; color:var(--text-muted); background:var(--surface-2); border:1px solid var(--hairline); border-radius:999px; }

/* ---------- chips + tags ---------- */
#salesScreen .crm-chip{ display:inline-flex; align-items:center; gap:5px; font-family:var(--font-sans); font-size:10px; font-weight:600; letter-spacing:.02em; padding:3px 9px; border-radius:999px; border:1px solid transparent; white-space:nowrap; line-height:1.5; }
#salesScreen .crm-tag{ display:inline-flex; align-items:center; font-size:8.5px; font-weight:700; letter-spacing:.06em; color:var(--text-faint); border:1px solid var(--hairline); background:var(--surface-2); border-radius:5px; padding:1px 5px; margin-left:4px; text-transform:uppercase; vertical-align:middle; }
#salesScreen .crm-tag-warn{ color:var(--amber); border-color:color-mix(in srgb, var(--amber) 40%, transparent); background:var(--amber-bg); }
#salesScreen .crm-tag-navy{ color:var(--navy-badge-text); border-color:var(--navy-badge-border); background:transparent; margin:0; }

/* relationship stage chips (Clients view) */
#salesScreen .crm-rel-lead{ color:var(--text-muted); background:var(--surface-2); border-color:var(--hairline); }
#salesScreen .crm-rel-contacted{ color:var(--info); background:color-mix(in srgb, var(--info) 13%, transparent); }
#salesScreen .crm-rel-intake{ color:var(--amber); background:var(--amber-bg); }
#salesScreen .crm-rel-client{ color:var(--gold-dark); background:var(--gold-faint); border-color:var(--gold-pill-border); }
#salesScreen .crm-rel-signed{ color:var(--green); background:var(--green-bg); font-weight:700; }
#salesScreen .crm-rel-dead{ color:var(--text-faint); background:var(--rule); }

/* agreement funnel chips */
#salesScreen .crm-ag-chip.crm-ag-signed,
#salesScreen .crm-ag-signed{ color:var(--green); background:var(--green-bg); font-weight:700; }
#salesScreen .crm-ag-chip.crm-ag-viewed,
#salesScreen .crm-ag-viewed{ color:var(--info); background:color-mix(in srgb, var(--info) 13%, transparent); }
#salesScreen .crm-ag-chip.crm-ag-sent,
#salesScreen .crm-ag-sent{ color:var(--gold-dark); background:var(--gold-faint); border-color:var(--gold-pill-border); }
#salesScreen .crm-ag-chip.crm-ag-declined,
#salesScreen .crm-ag-declined{ color:var(--red); background:var(--red-bg); font-weight:700; }

/* eligibility chips (Property attribute) */
#salesScreen .crm-elig-ok{ color:var(--green); background:var(--green-bg); font-weight:700; }
#salesScreen .crm-elig-no{ color:var(--red); background:var(--red-bg); font-weight:700; }
#salesScreen .crm-elig-und{ color:var(--text-muted); background:var(--surface-2); border-color:var(--hairline); }

/* generic status chips */
#salesScreen .crm-chip-ok{ color:var(--green); background:var(--green-bg); }
#salesScreen .crm-chip-warn{ color:var(--amber); background:var(--amber-bg); }
#salesScreen .crm-chip-muted{ color:var(--text-faint); background:var(--surface-2); border-color:var(--hairline); }

/* 9-stage property pipeline chip (used on property cards + minis) */
#salesScreen .crm-stage-chip{ font-size:9.5px; }
#salesScreen .crm-stage-chip.sales-stage-lead{ background:var(--surface-2); color:var(--text-muted); border-color:var(--hairline); }
#salesScreen .crm-stage-chip.sales-stage-client{ background:var(--gold-faint); color:var(--gold-dark); }
#salesScreen .crm-stage-chip.sales-stage-signed{ background:color-mix(in srgb, var(--info) 13%, transparent); color:var(--info); }
#salesScreen .crm-stage-chip.sales-stage-review{ background:var(--amber-bg); color:var(--amber); }
#salesScreen .crm-stage-chip.sales-stage-ineligible{ background:var(--red-bg); color:var(--red); }
#salesScreen .crm-stage-chip.sales-stage-eligible{ background:var(--green-bg); color:var(--green); }
#salesScreen .crm-stage-chip.sales-stage-maprev{ background:color-mix(in srgb, var(--info) 13%, transparent); color:var(--info); }
#salesScreen .crm-stage-chip.sales-stage-mapok{ background:var(--green-bg); color:var(--green); font-weight:700; }
#salesScreen .crm-stage-chip.sales-stage-maprej{ background:var(--red-bg); color:var(--red); font-weight:700; }
#salesScreen .crm-stage-chip.sales-stage-dead{ background:var(--rule); color:var(--text-faint); }

/* live Monday status pills (Project status / tracker) */
#salesScreen .crm-mon-pill{ display:inline-flex; align-items:center; gap:6px; font-family:var(--font-sans); font-size:11px; font-weight:600; letter-spacing:.01em; padding:4px 10px; border-radius:8px; border:1px solid transparent; white-space:nowrap; }
#salesScreen .crm-mon-pill::before{ content:""; width:6px; height:6px; border-radius:50%; background:currentColor; flex-shrink:0; opacity:.9; }
#salesScreen .crm-mon-green{ color:var(--green); background:var(--green-bg); }
#salesScreen .crm-mon-amber{ color:var(--amber); background:var(--amber-bg); }
#salesScreen .crm-mon-red{ color:var(--red); background:var(--red-bg); }
#salesScreen .crm-mon-info{ color:var(--info); background:color-mix(in srgb, var(--info) 12%, transparent); }
#salesScreen .crm-mon-gold{ color:var(--gold-dark); background:var(--gold-faint); }
#salesScreen .crm-mon-neutral{ color:var(--text-body); background:var(--surface-2); border-color:var(--hairline); }
#salesScreen .crm-mon-pill.is-muted{ color:var(--text-faint); background:transparent; border-color:var(--hairline); font-weight:500; }
#salesScreen .crm-mon-pill.is-muted::before{ display:none; }
#salesScreen .crm-mon-pill.is-loading{ color:var(--text-faint); background:var(--surface-2); border-color:var(--hairline); font-weight:500; }
#salesScreen .crm-mon-pill.is-loading::before{ animation:crm-pulse 1.1s ease-in-out infinite; }
@keyframes crm-pulse{ 0%,100%{ opacity:.25; } 50%{ opacity:.9; } }
#salesScreen .crm-col-pstatus .crm-mon-pill,
#salesScreen .crm-col-ptracker .crm-mon-pill{ max-width:100%; }

/* ---------- CLIENT DETAIL ---------- */
#salesScreen .crm-detail{ max-width:1120px; margin:0 auto; }
#salesScreen .crm-back{ display:inline-flex; align-items:center; gap:5px; font-size:12.5px; font-weight:600; color:var(--text-muted); background:none; border:none; cursor:pointer; padding:4px 0; margin-bottom:18px; transition:color .15s; }
#salesScreen .crm-back:hover{ color:var(--gold-dark); }

#salesScreen .crm-dhead{ display:flex; justify-content:space-between; align-items:flex-start; gap:28px; flex-wrap:wrap; padding-bottom:24px; border-bottom:1px solid var(--rule-strong); }
#salesScreen .crm-dhead-main{ display:flex; gap:16px; min-width:0; }
#salesScreen .crm-davatar{ width:56px; height:56px; border-radius:14px; display:flex; align-items:center; justify-content:center; font-family:var(--font-serif); font-weight:700; font-size:18px; flex-shrink:0; background:var(--surface-2); border:1px solid var(--hairline); color:var(--text-muted); }
#salesScreen .crm-davatar.crm-av-gold{ color:var(--gold-dark); background:var(--gold-faint); border-color:var(--gold-pill-border); }
#salesScreen .crm-davatar.crm-av-navy{ color:#e8d29a; background:linear-gradient(150deg,#3d4560,#2b3040); border:none; }
#salesScreen .crm-davatar.crm-av-sage{ color:var(--green); background:var(--green-bg); border-color:color-mix(in srgb, var(--green) 35%, transparent); }
#salesScreen .crm-davatar.crm-av-slate{ color:var(--info); background:color-mix(in srgb, var(--info) 12%, transparent); border-color:color-mix(in srgb, var(--info) 35%, transparent); }
#salesScreen .crm-dident{ min-width:0; }
#salesScreen .crm-dname{ font-family:var(--font-serif); font-weight:600; font-size:26px; line-height:1.05; letter-spacing:-0.01em; color:var(--text-head); margin:0; }
#salesScreen .crm-dcontact{ display:flex; flex-wrap:wrap; gap:8px 16px; margin-top:9px; }
#salesScreen .crm-dc-item{ display:inline-flex; align-items:center; gap:6px; font-size:12.5px; color:var(--text-muted); text-decoration:none; transition:color .15s; }
#salesScreen .crm-dc-item:hover{ color:var(--gold-dark); }
#salesScreen .crm-dmeta{ display:flex; flex-wrap:wrap; align-items:center; gap:8px 14px; margin-top:13px; }
#salesScreen .crm-dmeta-ag{ font-size:11.5px; color:var(--text-faint); display:inline-flex; align-items:center; gap:6px; }
#salesScreen .crm-dagent{ font-size:11.5px; color:var(--text-muted); padding-left:14px; border-left:1px solid var(--rule); }
#salesScreen .crm-dsync{ font-size:11px; font-weight:600; display:inline-flex; align-items:center; gap:5px; }
#salesScreen .crm-dsync.ok{ color:var(--green); }
#salesScreen .crm-dsync.pending{ color:var(--text-faint); }

/* next-action widget */
#salesScreen .crm-next{ flex:0 0 300px; max-width:340px; border:1px solid var(--hairline); background:var(--surface-2); border-radius:12px; padding:16px 18px; }
#salesScreen .crm-next.is-overdue{ border-color:color-mix(in srgb, var(--red) 40%, transparent); background:var(--red-bg); }
#salesScreen .crm-next-eyebrow{ font-size:11px; font-weight:700; letter-spacing:.04em; color:var(--gold-dark); }
#salesScreen .crm-next.is-overdue .crm-next-eyebrow{ color:var(--red); }
#salesScreen .crm-next-when{ font-family:var(--font-serif); font-size:17px; font-weight:600; color:var(--text-head); margin-top:5px; }
#salesScreen .crm-next-note{ font-size:12.5px; color:var(--text-muted); margin-top:5px; line-height:1.45; }
#salesScreen .crm-next-actions{ display:flex; gap:8px; margin-top:12px; flex-wrap:wrap; }
#salesScreen .crm-next-form{ display:flex; gap:8px; align-items:center; margin-top:10px; flex-wrap:wrap; }
#salesScreen .crm-next-form input[type=date]{ font-family:var(--font-sans); font-size:12.5px; padding:7px 10px; border:1px solid var(--border-btn); border-radius:8px; background:var(--surface); color:var(--text-strong); }
#salesScreen .crm-next-err{ font-size:11.5px; color:var(--red); }

/* quick actions */
#salesScreen .crm-dactions{ display:flex; flex-wrap:wrap; gap:9px; margin:22px 0 4px; }
#salesScreen .crm-danger-btn{ color:var(--red); border-color:color-mix(in srgb, var(--red) 40%, transparent); }
#salesScreen .crm-danger-btn:hover{ border-color:var(--red); color:var(--red); background:var(--red-bg); }

/* tabs */
#salesScreen .crm-tabs{ display:flex; gap:26px; margin:26px 0 0; border-bottom:1px solid var(--rule-strong); }
#salesScreen .crm-tab{ display:inline-flex; align-items:center; gap:8px; background:none; border:none; border-bottom:2px solid transparent; border-radius:0; margin-bottom:-1px; padding:0 0 13px; font-family:var(--font-sans); font-size:13.5px; font-weight:500; color:var(--text-muted); cursor:pointer; transition:color .15s; }
#salesScreen .crm-tab:hover{ color:var(--text-head); }
#salesScreen .crm-tab.active{ color:var(--text-head); font-weight:600; border-bottom-color:var(--gold); }
#salesScreen .crm-panel{ padding:26px 0 0; }
#salesScreen .crm-panel.is-hidden,
#salesScreen .is-hidden{ display:none !important; }

/* cards + grids */
#salesScreen .crm-grid-2{ display:grid; grid-template-columns:1fr 1fr; gap:20px; align-items:start; }
#salesScreen .crm-grid-activity{ display:grid; grid-template-columns:1.1fr 1fr; gap:20px; align-items:start; }
#salesScreen .crm-card{ background:var(--surface); border:1px solid var(--hairline); border-radius:14px; padding:20px 22px; margin-bottom:20px; }
#salesScreen .crm-card:last-child{ margin-bottom:0; }
#salesScreen .crm-card-title{ font-family:var(--font-serif); font-weight:600; font-size:16px; color:var(--text-head); margin:0 0 14px; display:flex; align-items:center; gap:9px; }
#salesScreen .crm-card-title-row{ display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:14px; }
#salesScreen .crm-card-title-row .crm-card-title{ margin:0; }
#salesScreen .crm-link-btn{ font-size:11px; font-weight:600; letter-spacing:.03em; color:var(--gold-dark); background:none; border:none; cursor:pointer; padding:0; }
#salesScreen .crm-link-btn:hover{ opacity:.7; }
#salesScreen .crm-kv{ display:flex; flex-direction:column; }
#salesScreen .crm-kv-row,
#salesScreen .sales-kv-row{ display:flex; justify-content:space-between; align-items:baseline; gap:16px; padding:8px 0; border-top:1px solid var(--rule); font-size:13px; }
#salesScreen .crm-kv > .sales-kv-row:first-child,
#salesScreen .crm-kv-row:first-child{ border-top:none; }
#salesScreen .sales-kv-row > span{ color:var(--text-faint); font-size:11.5px; letter-spacing:.02em; }
#salesScreen .sales-kv-row > strong{ color:var(--text-strong); font-weight:600; text-align:right; }
#salesScreen .crm-notes{ font-size:13px; color:var(--text-body); line-height:1.6; margin:0; white-space:pre-wrap; }
#salesScreen .crm-hint{ font-size:12.5px; color:var(--text-faint); line-height:1.5; margin:0; }
#salesScreen .crm-hint-warn{ color:var(--red); margin-top:8px; }
#salesScreen .crm-file-row{ display:flex; justify-content:space-between; align-items:center; gap:12px; padding:9px 0; border-top:1px solid var(--rule); font-size:12.5px; color:var(--text-body); }
#salesScreen .crm-composer-actions{ display:flex; gap:8px; flex-wrap:wrap; }

/* agreement tracker (overview) */
#salesScreen .crm-agtrk{ display:flex; gap:8px; }
#salesScreen .crm-agtrk-step{ flex:1; display:flex; flex-direction:column; gap:4px; padding:11px 12px; border-radius:10px; background:var(--surface-2); border:1px solid var(--hairline); }
#salesScreen .crm-agtrk-step.is-on{ background:var(--green-bg); border-color:color-mix(in srgb, var(--green) 30%, transparent); }
#salesScreen .crm-agtrk-dot{ width:8px; height:8px; border-radius:50%; background:var(--rule-strong); }
#salesScreen .crm-agtrk-step.is-on .crm-agtrk-dot{ background:var(--green); }
#salesScreen .crm-agtrk-label{ font-size:12px; font-weight:600; color:var(--text-head); }
#salesScreen .crm-agtrk-when{ font-size:11px; color:var(--text-faint); }

/* activity timeline + composer */
#salesScreen .crm-timeline{ display:flex; flex-direction:column; }
#salesScreen .crm-act{ display:flex; gap:12px; padding:12px 0; border-top:1px solid var(--rule); }
#salesScreen .crm-act:first-child{ border-top:none; padding-top:0; }
#salesScreen .crm-act-icon{ flex-shrink:0; width:28px; height:28px; display:flex; align-items:center; justify-content:center; border-radius:8px; background:var(--surface-2); border:1px solid var(--hairline); font-size:13px; }
#salesScreen .crm-act-text{ font-size:13px; color:var(--text-strong); line-height:1.45; }
#salesScreen .crm-act-meta{ font-size:11px; color:var(--text-faint); margin-top:3px; }
#salesScreen .crm-composer-card{ padding:18px 20px; }
#salesScreen .crm-composer-tabs{ display:flex; gap:6px; margin-bottom:12px; flex-wrap:wrap; }
#salesScreen .crm-ctab{ font-size:12px; font-weight:500; color:var(--text-muted); background:var(--surface-2); border:1px solid var(--hairline); border-radius:8px; padding:6px 12px; cursor:pointer; transition:all .14s; }
#salesScreen .crm-ctab:hover{ color:var(--text-head); }
#salesScreen .crm-ctab.active{ color:var(--text-head); background:var(--surface); border-color:var(--gold); font-weight:600; }
#salesScreen .crm-composer-fup{ display:flex; align-items:center; gap:9px; flex-wrap:wrap; margin:10px 0; }
#salesScreen .crm-composer-fup label{ font-size:11.5px; color:var(--text-faint); font-weight:600; }
#salesScreen .installer-textarea{ width:100%; min-height:74px; box-sizing:border-box; font-family:var(--font-sans); font-size:13px; color:var(--text-strong); background:var(--surface-2); border:1px solid var(--border-btn); border-radius:10px; padding:11px 13px; resize:vertical; }
#salesScreen .installer-textarea:focus{ outline:none; border-color:var(--gold); box-shadow:0 0 0 3px var(--gold-faint); }
#salesScreen .installer-textarea::placeholder{ color:var(--text-faint); }
#salesScreen .sales-filter{ font-family:var(--font-sans); font-size:12.5px; color:var(--text-strong); background:var(--surface); border:1px solid var(--border-btn); border-radius:8px; padding:7px 10px; }
#salesScreen .installer-error{ color:var(--red); font-size:12.5px; }

/* property cards */
#salesScreen .crm-prop-card{ border:1px solid var(--hairline); background:var(--surface); border-radius:14px; padding:18px 20px; margin-bottom:16px; transition:box-shadow .2s, border-color .2s; }
#salesScreen .crm-prop-card.is-flash{ border-color:var(--gold); box-shadow:0 0 0 3px var(--gold-faint); }
#salesScreen .crm-prop-head{ display:flex; justify-content:space-between; align-items:flex-start; gap:16px; flex-wrap:wrap; }
#salesScreen .crm-prop-addr{ font-family:var(--font-serif); font-size:16px; font-weight:600; color:var(--text-head); }
#salesScreen .crm-prop-sub{ font-size:12px; color:var(--text-muted); margin-top:4px; }
#salesScreen .crm-prop-chips{ display:flex; flex-wrap:wrap; gap:6px; }
#salesScreen .crm-prop-status{ display:flex; flex-wrap:wrap; gap:12px 28px; margin:16px 0; padding:14px 0; border-top:1px solid var(--rule); border-bottom:1px solid var(--rule); }
#salesScreen .crm-prop-stat{ display:flex; flex-direction:column; gap:6px; min-width:0; }
#salesScreen .crm-prop-k{ font-size:10px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--text-faint); }
#salesScreen .crm-prop-hint{ font-size:11px; color:var(--text-faint); }
#salesScreen .crm-prop-monday-v{ display:flex; flex-wrap:wrap; gap:6px; }
#salesScreen .crm-prop-actions{ display:flex; flex-wrap:wrap; gap:8px; }
#salesScreen .crm-prop-files{ margin-top:12px; padding-top:12px; border-top:1px solid var(--rule); display:flex; flex-direction:column; gap:6px; }

/* property mini (overview) */
#salesScreen .crm-prop-mini{ display:flex; justify-content:space-between; align-items:center; gap:12px; width:100%; text-align:left; padding:11px 0; border-top:1px solid var(--rule); background:none; border-left:none; border-right:none; border-bottom:none; cursor:pointer; transition:padding .14s; }
#salesScreen .crm-prop-mini:first-child{ border-top:none; }
#salesScreen .crm-prop-mini:hover{ padding-left:6px; }
#salesScreen .crm-prop-mini-addr{ font-size:13px; font-weight:600; color:var(--text-strong); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#salesScreen .crm-prop-mini-chips{ display:flex; gap:6px; flex-shrink:0; }

/* agreements list */
#salesScreen .crm-agreements{ display:flex; flex-direction:column; }
#salesScreen .crm-agree{ display:flex; justify-content:space-between; align-items:center; gap:16px; padding:13px 0; border-top:1px solid var(--rule); }
#salesScreen .crm-agree:first-child{ border-top:none; }
#salesScreen .crm-agree-main strong{ font-size:13.5px; color:var(--text-strong); font-weight:600; }
#salesScreen .crm-agree-sub{ display:block; font-size:11.5px; color:var(--text-faint); margin-top:3px; }
#salesScreen .crm-agree-side{ display:flex; align-items:center; gap:8px; flex-shrink:0; flex-wrap:wrap; justify-content:flex-end; }

/* firms view */
#salesScreen .crm-profile-header{ display:flex; justify-content:space-between; align-items:flex-end; gap:20px; flex-wrap:wrap; padding-bottom:22px; border-bottom:1px solid var(--rule-strong); margin-bottom:8px; }
#salesScreen .crm-profile-name{ font-family:var(--font-serif); font-weight:600; font-size:28px; color:var(--text-head); margin:0; }
#salesScreen .crm-profile-sub{ font-size:13.5px; color:var(--text-muted); margin-top:8px; }
#salesScreen .crm-firms-table{ width:100%; border-collapse:collapse; margin-top:14px; }
#salesScreen .crm-firms-table th{ font-size:10px; letter-spacing:.09em; text-transform:uppercase; color:var(--text-faint); font-weight:600; padding:12px 14px; border-bottom:1px solid var(--rule-strong); text-align:left; }
#salesScreen .crm-firms-table td{ padding:14px; border-bottom:1px solid var(--rule); font-size:13px; color:var(--text-body); }
#salesScreen .crm-firm-row:hover td{ background:var(--hover); }
#salesScreen .crm-firm-row:hover td:first-child{ box-shadow:inset 3px 0 0 var(--gold); }
#salesScreen .crm-prop-mini + .crm-prop-mini{ margin-top:0; }

/* ---------- CALENDAR (scoped token overrides; shared LhCalendar) ---------- */
#salesScreen .sales-toolbar{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; max-width:1120px; margin:0 auto 20px; }
#salesScreen .sales-toolbar h2{ font-family:var(--font-serif); font-weight:600; font-size:22px; color:var(--text-head); margin:0; }
#salesScreen .cal-sales{ max-width:1120px; margin:0 auto; }
#salesScreen .cal-head{ display:flex; align-items:center; gap:12px; margin-bottom:14px; flex-wrap:wrap; }
#salesScreen .cal-title{ font-family:var(--font-serif); font-size:18px; font-weight:600; color:var(--text-head); }
#salesScreen .cal-nav,
#salesScreen .cal-view-btn,
#salesScreen .cal-today-btn{ font-size:12.5px; color:var(--text-head); background:var(--surface); border:1px solid var(--border-btn); border-radius:8px; padding:7px 12px; cursor:pointer; }
#salesScreen .cal-view-btn.active{ background:var(--sidebar-bg); color:#fff; border-color:var(--sidebar-bg); }
[data-theme="dark"] #salesScreen .cal-view-btn.active{ background:var(--gold); color:#1f2533; border-color:var(--gold); }
#salesScreen .cal-grid{ border:1px solid var(--hairline); border-radius:12px; overflow:hidden; background:var(--surface); }
#salesScreen .cal-dow{ background:var(--surface-2); color:var(--text-faint); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; font-weight:600; padding:9px; border-bottom:1px solid var(--hairline); }
#salesScreen .cal-cell{ background:var(--surface); border-top:1px solid var(--rule); border-left:1px solid var(--rule); min-height:96px; padding:6px; }
#salesScreen .cal-cell.empty{ background:var(--surface-2); }
#salesScreen .cal-cell.today{ background:var(--gold-faint); }
#salesScreen .cal-date{ font-size:12px; color:var(--text-muted); font-weight:600; }
#salesScreen .cal-ev{ display:block; width:100%; text-align:left; font-size:11px; padding:4px 7px; border-radius:6px; margin-top:4px; border:none; cursor:pointer; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#salesScreen .cal-ev-sales{ background:color-mix(in srgb, var(--info) 15%, transparent); color:var(--info); }
#salesScreen .cal-ev-overdue{ background:var(--red-bg); color:var(--red); font-weight:600; }
#salesScreen .cal-day-list,
#salesScreen .cal-week,
#salesScreen .cal-col{ background:var(--surface); }
#salesScreen .cal-day-empty,
#salesScreen .cal-day-list-empty{ color:var(--text-faint); font-size:13px; padding:16px; }

/* ---------- ANALYTICS ---------- */
#salesScreen .an-page{ max-width:1200px; margin:0 auto; }
#salesScreen .an-head{ display:flex; align-items:flex-start; gap:16px; margin-bottom:26px; }
#salesScreen .an-head .crm-back{ margin:0; }
#salesScreen .an-head-titles{ min-width:0; }
#salesScreen .an-title{ font-family:var(--font-serif); font-weight:600; font-size:32px; line-height:1.03; color:var(--text-head); margin:2px 0 0; }
#salesScreen .an-sub{ font-size:13.5px; color:var(--text-muted); margin:8px 0 0; }

#salesScreen .an-panel{ background:var(--surface); border:1px solid var(--hairline); border-radius:16px; padding:22px 24px; margin-bottom:20px; }
#salesScreen .an-panel-head{ display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; margin-bottom:16px; }
#salesScreen .an-panel-title{ font-family:var(--font-serif); font-weight:600; font-size:17px; color:var(--text-head); margin:0; }
#salesScreen .an-panel-note{ font-size:12px; color:var(--text-faint); }

/* funnel */
#salesScreen .an-funnel-stage{ margin-bottom:14px; }
#salesScreen .an-funnel-stage:last-child{ margin-bottom:0; }
#salesScreen .an-funnel-meta{ display:flex; justify-content:space-between; align-items:baseline; gap:12px; margin-bottom:6px; }
#salesScreen .an-funnel-label{ font-size:13px; font-weight:600; color:var(--text-head); }
#salesScreen .an-funnel-count{ font-family:var(--font-serif); font-size:18px; font-weight:700; color:var(--text-head); }
#salesScreen .an-funnel-conv{ font-family:var(--font-sans); font-size:11.5px; font-weight:500; color:var(--text-faint); margin-left:8px; }
#salesScreen .an-funnel-track{ height:12px; background:var(--surface-2); border-radius:999px; overflow:hidden; }
#salesScreen .an-funnel-bar{ height:100%; border-radius:999px; transition:width .5s cubic-bezier(.16,1,.3,1); }
#salesScreen .an-funnel-bar.is-sent{ background:var(--gold); }
#salesScreen .an-funnel-bar.is-viewed{ background:var(--info); }
#salesScreen .an-funnel-bar.is-signed{ background:var(--green); }
#salesScreen .an-funnel-foot{ font-size:12px; color:var(--text-faint); margin-top:14px; padding-top:12px; border-top:1px solid var(--rule); }

/* KPI cards */
#salesScreen .an-kpis{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:20px; }
#salesScreen .an-kpi{ background:var(--surface); border:1px solid var(--hairline); border-radius:14px; padding:18px 20px; }
#salesScreen .an-kpi.is-good{ border-color:color-mix(in srgb, var(--green) 35%, transparent); }
#salesScreen .an-kpi.is-warn{ border-color:color-mix(in srgb, var(--amber) 40%, transparent); }
#salesScreen .an-kpi-label{ font-size:11px; font-weight:600; letter-spacing:.05em; text-transform:uppercase; color:var(--text-faint); }
#salesScreen .an-kpi-value{ font-family:var(--font-serif); font-weight:700; font-size:32px; line-height:1; color:var(--text-head); margin:11px 0 7px; }
#salesScreen .an-kpi.is-good .an-kpi-value{ color:var(--green); }
#salesScreen .an-kpi-note{ font-size:11.5px; color:var(--text-muted); }

/* leaderboard + compare grid */
#salesScreen .an-grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:20px; align-items:start; }
#salesScreen .an-table-wrap{ overflow-x:auto; }
#salesScreen .an-lb{ width:100%; }
#salesScreen .an-lb th{ font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--text-faint); font-weight:600; padding:0 12px 10px; border-bottom:1px solid var(--rule-strong); text-align:right; white-space:nowrap; }
#salesScreen .an-lb th:first-child{ text-align:left; }
#salesScreen .an-lb td{ padding:11px 12px; border-bottom:1px solid var(--rule); font-size:12.5px; color:var(--text-body); text-align:right; white-space:nowrap; }
#salesScreen .an-lb-name{ text-align:left !important; font-weight:600; color:var(--text-strong); }
#salesScreen .an-lb-strong{ color:var(--text-head); font-weight:700; }

/* compare bar chart (horizontal → names read in full) */
#salesScreen .an-metric-seg{ display:inline-flex; background:var(--surface-2); border:1px solid var(--hairline); border-radius:9px; padding:3px; gap:2px; flex-wrap:wrap; }
#salesScreen .an-metric-btn{ font-size:11.5px; font-weight:500; color:var(--text-muted); background:transparent; border:none; border-radius:6px; padding:6px 11px; cursor:pointer; }
#salesScreen .an-metric-btn:hover{ color:var(--text-head); }
#salesScreen .an-metric-btn.active{ color:var(--text-head); background:var(--surface); font-weight:600; box-shadow:0 1px 2px rgba(0,0,0,.08); }
#salesScreen .an-bars{ display:flex; flex-direction:column; gap:11px; }
#salesScreen .an-bar-row{ display:grid; grid-template-columns:minmax(90px,140px) 1fr auto; align-items:center; gap:12px; }
#salesScreen .an-bar-name{ font-size:12.5px; color:var(--text-body); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#salesScreen .an-bar-track{ height:9px; background:var(--surface-2); border-radius:999px; overflow:hidden; }
#salesScreen .an-bar-fill{ height:100%; background:var(--gold); border-radius:999px; transition:width .5s cubic-bezier(.16,1,.3,1); }
#salesScreen .an-bar-val{ font-family:var(--font-serif); font-size:13px; font-weight:700; color:var(--text-head); min-width:34px; text-align:right; }

/* slowest-to-sign drill */
#salesScreen .an-drill{ border:1px solid var(--hairline); border-radius:12px; margin-bottom:10px; background:var(--surface-2); overflow:hidden; }
#salesScreen .an-drill summary{ cursor:pointer; padding:13px 16px; font-size:13px; font-weight:600; color:var(--text-head); list-style:none; display:flex; justify-content:space-between; gap:12px; align-items:center; }
#salesScreen .an-drill summary::-webkit-details-marker{ display:none; }
#salesScreen .an-drill-avg{ font-size:11.5px; font-weight:500; color:var(--text-faint); }
#salesScreen .an-drill-body{ padding:4px 16px 12px; }
#salesScreen .an-drill-row{ display:flex; justify-content:space-between; gap:12px; padding:7px 0; border-top:1px solid var(--rule); font-size:12.5px; }
#salesScreen .an-drill-client{ color:var(--text-body); }
#salesScreen .an-drill-time{ color:var(--text-head); font-weight:600; }

/* intake: highlight a missing required field */
#salesScreen input.ai-missing,
#salesScreen select.ai-missing,
#salesScreen textarea.ai-missing{ border-color:var(--red) !important; box-shadow:0 0 0 3px var(--red-bg); }

/* ---------- responsive ---------- */
@media (max-width:980px){
  #salesScreen .crm-grid-2,
  #salesScreen .crm-grid-activity,
  #salesScreen .an-grid{ grid-template-columns:1fr; }
  #salesScreen .an-kpis{ grid-template-columns:repeat(2,1fr); }
  #salesScreen .crm-next{ flex-basis:100%; max-width:none; }
}
@media (max-width:760px){
  #salesScreen #salesBody{ padding:26px 18px 60px; }
  #salesScreen .crm-title{ font-size:27px; }
  #salesScreen .crm-head-actions{ width:100%; justify-content:flex-start; }
  #salesScreen .an-kpis{ grid-template-columns:1fr 1fr; }
  #salesScreen .crm-agtrk{ flex-direction:column; }
  #salesScreen .crm-col-agent,
  #salesScreen .crm-col-pagent{ display:none; }
}
