/* ─── DealerDMS — Portal views (Sales/CRM, Website manager, AI Conversations) ──
   Shared styles for sales.js, website.js, conversations.js. Reads ONLY the app
   theme tokens (--surface, --primary, --border, --text …) so every theme applies
   automatically. Reuses .card/.card-h/.form-grid/.fld/.btn/table.grid from
   admin.css + stock.css; adds portal-scoped classes under `.portal`. */

.portal .prt-loading{display:flex;align-items:center;gap:10px;color:var(--text-muted);padding:40px 4px;font-weight:600}

/* header row (shared with stock's .stk-head look) */
.prt-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:18px;flex-wrap:wrap}
.prt-head .page-title{margin-bottom:6px}
.prt-head .page-sub{margin-bottom:0}
.prt-head-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}

.prt-empty{background:var(--surface);border:1px dashed var(--border);border-radius:var(--radius);padding:48px 30px;text-align:center;color:var(--text-muted)}
.prt-empty-ico{font-size:38px;margin-bottom:12px;opacity:.75}
.prt-empty-title{font-size:17px;font-weight:800;color:var(--text);margin-bottom:5px}
.prt-empty-desc{font-size:13.5px}

.prt-toolbar{display:flex;gap:12px;align-items:center;margin-bottom:16px;flex-wrap:wrap}
.prt-search{position:relative;flex:1;min-width:220px}
.prt-search-ico{position:absolute;left:12px;top:50%;transform:translateY(-50%);opacity:.6;font-size:14px;pointer-events:none}
.prt-search input{width:100%;padding:10px 12px 10px 34px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--text);font-size:14px}
.prt-search input:focus{outline:none;border-color:var(--primary)}

/* generic table reuse */
.prt-tablewrap{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);overflow-x:auto}
.prt-tablewrap table.grid{width:100%}
.prt-tablewrap table.grid tbody tr{cursor:pointer;transition:background .1s}
.prt-tablewrap table.grid tbody tr:hover{background:var(--surface-hover)}
.prt-pager{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px;flex-wrap:wrap}
.prt-pager-info{color:var(--text-muted);font-size:13px}
.prt-pager-btns{display:flex;gap:8px}
.prt-pager-btns .btn[disabled]{opacity:.45;cursor:not-allowed}

.prt-chip{display:inline-block;padding:3px 10px;border-radius:20px;font-size:11px;font-weight:700;background:var(--surface-2);color:var(--text);white-space:nowrap}
.prt-chip-good{background:color-mix(in srgb,var(--good) 16%,transparent);color:var(--good)}
.prt-chip-warn{background:color-mix(in srgb,var(--warn) 20%,transparent);color:var(--warn)}
.prt-chip-muted{background:var(--surface-2);color:var(--text-muted)}
.prt-chip-primary{background:color-mix(in srgb,var(--primary) 15%,transparent);color:var(--primary-d,var(--primary))}

/* ═══ KANBAN PIPELINE BOARD ═══════════════════════════════════════════════ */
.prt-board{display:flex;gap:14px;overflow-x:auto;padding-bottom:8px;align-items:flex-start}
.prt-col{flex:0 0 288px;max-width:288px;background:var(--surface-3);border:1px solid var(--border);border-radius:var(--radius);display:flex;flex-direction:column;max-height:calc(100vh - 240px)}
.prt-col-h{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 14px;border-bottom:1px solid var(--border);position:sticky;top:0;background:var(--surface-3);border-radius:var(--radius) var(--radius) 0 0}
.prt-col-name{font-size:13px;font-weight:800;color:var(--text);letter-spacing:.01em}
.prt-col-count{font-size:11px;font-weight:800;padding:2px 8px;border-radius:20px;background:var(--surface-2);color:var(--text-muted)}
.prt-col-body{padding:10px;display:flex;flex-direction:column;gap:10px;overflow-y:auto}
.prt-col-empty{color:var(--text-muted);font-size:12px;text-align:center;padding:14px 6px;opacity:.7}

.prt-ecard{background:var(--surface);border:1px solid var(--border);border-radius:10px;box-shadow:var(--shadow);padding:11px 12px;cursor:pointer;transition:.12s;display:flex;flex-direction:column;gap:6px}
.prt-ecard:hover{border-color:var(--primary);transform:translateY(-1px)}
.prt-ecard-name{font-weight:800;color:var(--text);font-size:14px}
.prt-ecard-veh{font-size:12.5px;color:var(--text-muted)}
.prt-ecard-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:2px;flex-wrap:wrap}
.prt-ecard-budget{font-weight:800;color:var(--primary-d,var(--primary));font-size:13px;font-variant-numeric:tabular-nums}
.prt-ecard-next{font-size:11px;color:var(--text-muted)}
.prt-ecard-next.overdue{color:var(--danger);font-weight:700}

/* ═══ DETAIL LAYOUTS ══════════════════════════════════════════════════════ */
.prt-detail-grid{display:grid;grid-template-columns:1fr 340px;gap:16px;align-items:start}
.prt-detail-main{min-width:0}
.prt-detail-side{display:flex;flex-direction:column;gap:16px}
.prt-spec{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border-bottom:1px solid var(--border);font-size:13px}
.prt-spec:last-child{border-bottom:none}
.prt-spec-k{color:var(--text-muted);font-weight:600}
.prt-spec-v{color:var(--text);font-weight:700;text-align:right}

/* timeline */
.prt-timeline{display:flex;flex-direction:column;gap:0}
.prt-tl{display:flex;gap:10px;padding:10px 0;border-bottom:1px solid var(--border)}
.prt-tl:last-child{border-bottom:none}
.prt-tl-dot{flex:0 0 auto;width:9px;height:9px;border-radius:50%;background:var(--primary);margin-top:5px}
.prt-tl-body{min-width:0;flex:1}
.prt-tl-subject{font-weight:700;color:var(--text);font-size:13.5px}
.prt-tl-text{color:var(--text-muted);font-size:13px;margin-top:2px;white-space:pre-wrap}
.prt-tl-meta{color:var(--text-muted);font-size:11px;margin-top:3px;text-transform:uppercase;letter-spacing:.03em}

.prt-task{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px solid var(--border)}
.prt-task:last-child{border-bottom:none}
.prt-task-title{font-weight:700;color:var(--text);font-size:13.5px}
.prt-task-due{font-size:11px;color:var(--text-muted)}
.prt-task-due.overdue{color:var(--danger);font-weight:700}

/* small inline forms inside cards */
.prt-inline-form{display:flex;flex-direction:column;gap:10px}
.prt-inline-form label{display:flex;flex-direction:column;gap:5px;font-size:12px;font-weight:600;color:var(--text-muted)}
.prt-inline-form input,.prt-inline-form select,.prt-inline-form textarea{padding:9px 11px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--text);font-size:14px;font-family:inherit;width:100%}
.prt-inline-form input:focus,.prt-inline-form select:focus,.prt-inline-form textarea:focus{outline:none;border-color:var(--primary)}
.prt-inline-form textarea{resize:vertical;min-height:70px}
.prt-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}

/* picker (customer/vehicle search results) */
.prt-picker-results{border:1px solid var(--border);border-radius:8px;max-height:220px;overflow-y:auto;background:var(--surface);margin-top:6px}
.prt-picker-item{padding:9px 11px;border-bottom:1px solid var(--border);cursor:pointer;font-size:13.5px}
.prt-picker-item:last-child{border-bottom:none}
.prt-picker-item:hover{background:var(--surface-hover)}
.prt-picker-item.selected{background:color-mix(in srgb,var(--primary) 12%,transparent)}
.prt-picked{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:8px;background:var(--surface-2);border:1px solid var(--border);font-size:13px;font-weight:600;color:var(--text)}
.prt-picked button{background:none;border:none;color:var(--danger);cursor:pointer;font-weight:800;padding:0;font-size:14px}

/* ═══ WEBSITE MANAGER ═════════════════════════════════════════════════════ */
.prt-site-url{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:13.5px;color:var(--text-muted)}
.prt-site-url code{background:var(--surface-2);padding:3px 8px;border-radius:6px;font-size:12.5px;color:var(--text)}
.prt-iframe{width:100%;height:520px;border:1px solid var(--border);border-radius:var(--radius);background:#fff}
.prt-iframe-sm{height:420px}
.prt-editor-grid{display:grid;grid-template-columns:1fr;gap:14px}
.prt-code{width:100%;min-height:220px;font-family:"Cascadia Code","Consolas",monospace;font-size:12.5px;line-height:1.5;padding:11px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--text);resize:vertical}
.prt-code:focus{outline:none;border-color:var(--primary)}
.prt-code-label{font-size:11px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--text-muted);margin-bottom:5px;display:block}
.prt-ai-explain{margin-top:12px;padding:11px 13px;border-radius:8px;background:color-mix(in srgb,var(--primary) 8%,var(--surface));border:1px solid color-mix(in srgb,var(--primary) 25%,var(--border));font-size:13.5px;color:var(--text)}

/* ═══ CONVERSATION TRANSCRIPT ═════════════════════════════════════════════ */
.prt-chat{display:flex;flex-direction:column;gap:12px;padding:4px}
.prt-msg{max-width:78%;padding:10px 13px;border-radius:14px;font-size:14px;line-height:1.5;white-space:pre-wrap;word-break:break-word}
.prt-msg-user{align-self:flex-end;background:var(--primary);color:var(--on-primary);border-bottom-right-radius:4px}
.prt-msg-assistant{align-self:flex-start;background:var(--surface-2);color:var(--text);border:1px solid var(--border);border-bottom-left-radius:4px}
.prt-msg-tool{align-self:center;background:transparent;color:var(--text-muted);font-size:12px;font-style:italic;max-width:90%}
.prt-msg-meta{font-size:10.5px;opacity:.7;margin-top:4px}

.prt-summary{padding:12px 14px;border-radius:10px;background:color-mix(in srgb,var(--accent) 10%,var(--surface));border:1px solid color-mix(in srgb,var(--accent) 30%,var(--border));font-size:14px;line-height:1.55;color:var(--text);white-space:pre-wrap}

.prt-ai-btn{background:linear-gradient(135deg,var(--primary),var(--accent));color:var(--on-primary);border:none;font-weight:700}
.prt-ai-btn:hover{filter:brightness(1.05)}
.prt-ai-btn[disabled]{opacity:.7;cursor:progress}

@media (max-width:860px){
  .prt-detail-grid{grid-template-columns:1fr}
  .prt-detail-side{order:-1}
}

/* ═══ UNIFIED CRM (crm.js) ════════════════════════════════════════════════ */
/* Segmented control (People / Deals / Pipeline) — enterprise pill switcher */
.crm-seg{display:inline-flex;gap:2px;padding:3px;margin:4px 0 18px;background:var(--surface-2);border:1px solid var(--border);border-radius:10px}
.crm-seg-btn{background:transparent;border:none;padding:8px 18px;font-size:13.5px;font-weight:700;color:var(--text-muted);cursor:pointer;border-radius:8px;transition:.12s}
.crm-seg-btn:hover{color:var(--text)}
.crm-seg-btn.active{background:var(--surface);color:var(--primary);box-shadow:var(--shadow)}

/* Filter selects in the toolbar (mirror .prt-search input sizing) */
.crm-select{padding:10px 12px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--text);font-size:14px;font-weight:600}
.crm-select:focus{outline:none;border-color:var(--primary)}

/* Data table — sortable headers, checkbox column, numeric column */
.crm-table{width:100%}
/* Sticky header so column labels stay visible while scrolling a long list.
   The wrap caps height and scrolls internally at scale. */
.prt-tablewrap{max-height:calc(100vh - 320px);overflow-y:auto}
.crm-table thead th{white-space:nowrap;user-select:none;position:sticky;top:0;z-index:2;background:var(--surface-3,var(--surface));box-shadow:0 1px 0 var(--border)}
.crm-th-sort{cursor:pointer}
.crm-th-sort:hover{color:var(--primary)}
.crm-th-on{color:var(--primary)}
.crm-th-arrow{font-size:10px;opacity:.9}
.crm-th-check,.crm-td-check{width:34px;text-align:center;padding-left:6px;padding-right:6px}
.crm-num{text-align:right;font-variant-numeric:tabular-nums}
.crm-table tbody tr.crm-row-sel{background:color-mix(in srgb,var(--primary) 8%,transparent)}
.crm-table tbody tr.crm-row-sel:hover{background:color-mix(in srgb,var(--primary) 12%,transparent)}
.crm-row-check,.crm-th-check input{width:16px;height:16px;cursor:pointer}
.crm-count-pill{display:inline-block;min-width:22px;padding:2px 7px;border-radius:20px;font-size:11px;font-weight:800;background:color-mix(in srgb,var(--primary) 15%,transparent);color:var(--primary-d,var(--primary))}
.crm-cbadges{display:inline-flex;gap:5px}
.crm-cbadge{font-size:12px;opacity:.85;cursor:help}
.crm-next-over{color:var(--danger);font-weight:700}

/* Bulk-action bar (appears when ≥1 row selected) */
.crm-bulk{margin-bottom:14px;padding:10px 14px;border-radius:10px;background:color-mix(in srgb,var(--primary) 10%,var(--surface));border:1px solid color-mix(in srgb,var(--primary) 30%,var(--border))}
.crm-bulk-top{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.crm-bulk-count{font-weight:800;color:var(--text);font-size:13.5px}
.crm-bulk-actions{display:flex;gap:8px;flex-wrap:wrap}
.crm-bulk-all{margin-top:8px;padding-top:8px;border-top:1px dashed color-mix(in srgb,var(--primary) 25%,var(--border));font-size:13px;color:var(--text-muted)}
.crm-linkbtn{background:none;border:none;padding:0;margin-left:6px;color:var(--primary);font-weight:700;cursor:pointer;font-size:13px;text-decoration:underline}
.crm-btn-danger{color:var(--danger);border-color:color-mix(in srgb,var(--danger) 40%,var(--border))}
.crm-btn-danger:hover{background:color-mix(in srgb,var(--danger) 10%,transparent)}

/* Pager page-jump */
.prt-pager-jump{font-size:13px;color:var(--text-muted);display:inline-flex;align-items:center;gap:6px}
.prt-pager-page{width:56px;padding:5px 7px;border:1px solid var(--border);border-radius:6px;background:var(--surface);color:var(--text);font:inherit;font-size:13px;text-align:center}
.prt-pager-page:focus{outline:none;border-color:var(--primary)}

/* Board note (demoted pipeline) */
.crm-board-note{color:var(--text-muted);font-size:13px;margin:0 0 12px}

/* Clickable data-table rows (campaigns list etc.) — cursor only; rows stay
   real table rows (the flex .crm-enqrow is ONLY for the contact-detail list). */
.crm-row-click{cursor:pointer}

/* Contact detail — enquiry rows + consent checkboxes */
.crm-enqrow{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px solid var(--border);cursor:pointer}
.crm-enqrow:last-child{border-bottom:none}
.crm-enqrow:hover{background:var(--surface-hover)}
.crm-enqrow-title{font-weight:700;color:var(--text);font-size:13.5px}
.crm-enqrow-meta{font-size:12px;color:var(--text-muted);margin-top:2px}
.crm-enqrow-arrow{color:var(--text-muted);font-weight:800}
.crm-chk{flex-direction:row!important;align-items:center;gap:8px;font-weight:700;color:var(--text)!important;text-transform:none!important}
.crm-chk input{width:16px;height:16px}
.crm-chk-inline{display:inline-flex;align-items:center;gap:6px;font-weight:600;text-transform:none;font-size:13px;color:var(--text)}
.crm-chk-inline input{width:auto}

/* Modal (bulk consent + compose) */
.crm-modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.42);display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}
.crm-modal{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-lg,0 12px 40px rgba(0,0,0,.28));width:100%;max-width:460px;padding:20px 22px}
.crm-modal-h{font-size:17px;font-weight:800;color:var(--text);margin-bottom:12px}
.crm-modal-foot{display:flex;justify-content:flex-end;gap:8px;margin-top:16px}
.crm-consent-grid{display:flex;flex-direction:column;gap:8px}
.crm-consent-row{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13.5px;font-weight:600;color:var(--text)}
.crm-consent-row select{padding:7px 10px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--text);font-size:13px}
.crm-consent-warn{margin:0 0 12px;padding:8px 12px;border-radius:8px;font-size:13px;background:color-mix(in srgb,var(--danger) 10%,transparent);color:var(--danger);border:1px solid color-mix(in srgb,var(--danger) 30%,var(--border))}

/* ═══ PIPELINE — stage tabs + per-row stage mover (replaces the kanban) ═══════ */
.crm-pipe-tabs{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:16px;border-bottom:1px solid var(--border);padding-bottom:2px}
.crm-pipe-tab{display:inline-flex;align-items:center;gap:8px;background:transparent;border:none;border-bottom:2px solid transparent;padding:9px 14px;font-size:13.5px;font-weight:700;color:var(--text-muted);cursor:pointer;border-radius:6px 6px 0 0;white-space:nowrap}
.crm-pipe-tab:hover{color:var(--text);background:var(--surface-hover)}
.crm-pipe-tab.is-active{color:var(--primary);border-bottom-color:var(--primary)}
.crm-pipe-tab-count{min-width:20px;padding:1px 7px;border-radius:20px;font-size:11px;font-weight:800;background:var(--surface-2);color:var(--text-muted)}
.crm-pipe-tab.is-active .crm-pipe-tab-count{background:color-mix(in srgb,var(--primary) 16%,transparent);color:var(--primary)}
.crm-pipe-move-h{text-align:right}
.crm-pipe-move-cell{text-align:right}
.crm-pipe-move{padding:6px 9px;border:1px solid var(--border);border-radius:7px;background:var(--surface);color:var(--text);font:inherit;font-size:13px;cursor:pointer;max-width:190px}
.crm-pipe-move:hover{border-color:var(--primary)}
.crm-pipe-move:focus{outline:none;border-color:var(--primary)}

/* ═══ CRM style fixes (audit findings) ═══════════════════════════════════════
   Root cause: the CRM reuses admin/stock class names that were scoped to other
   containers, so headings/labels rendered unstyled. Re-declare them for the
   portal context. */
/* #1 — card headings were only styled under #admin-body; the CRM renders in
   #view, so every "Enquiries (2)" / "Activity timeline" / "Details" heading fell
   back to plain text. This restores the hierarchy across all CRM detail/form cards. */
.portal .card-h{font-size:16px;font-weight:700;margin-bottom:14px;color:var(--text);display:flex;align-items:center;justify-content:space-between;gap:10px}
/* #7 — the .card:hover lift is for clickable stat cards; neutralize it for the
   stacked static content/detail/form cards so the detail view doesn't jitter. */
.portal .prt-detail-grid .card:hover,.portal .card.crm-static:hover{transform:none;box-shadow:var(--shadow)}
/* #12 — reserve width for the sort arrow so the header label doesn't shift on sort. */
.crm-th-arrow{display:inline-block;min-width:12px;text-align:center}
/* #10 — consent badges get a danger tint so a restriction reads as a warning,
   not a benign icon. */
.crm-cbadge{color:var(--danger);opacity:.9}
/* #4 — responsive: below 640px the wide data tables stack low-priority columns
   away and stop the name column from wrapping to 2 lines. */
@media(max-width:640px){
  .crm-table th:nth-child(3),.crm-table td:nth-child(3), /* Company */
  .crm-table th:nth-child(8),.crm-table td:nth-child(8){display:none} /* Consent */
  .crm-table td b{white-space:nowrap}
  .prt-tablewrap{position:relative}
}

/* ── Trade-in / part-exchange staff detail modal ─────────────────────────── */
.ti-modal{max-width:820px}
.ti-detail-body{display:grid;grid-template-columns:1.1fr 1fr;gap:20px}
@media (max-width:720px){ .ti-detail-body{grid-template-columns:1fr} }
.ti-photos{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;align-content:start;max-height:360px;overflow-y:auto}
.ti-photo{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:8px;border:1px solid var(--border);background:var(--surface-2,#f1f5f9)}
.ti-fields{display:flex;flex-direction:column;gap:10px}
.ti-fields label{display:flex;flex-direction:column;gap:4px;font-size:12.5px;font-weight:600;color:var(--text-muted,#64748b)}
.ti-fields input{border:1px solid var(--border);border-radius:8px;padding:8px 10px;font-size:14px;color:var(--text);background:var(--surface)}
.ti-fields input:disabled{opacity:.6;background:var(--surface-2,#f1f5f9)}
.ti-row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ti-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.ti-converted{margin-top:8px;padding:10px 12px;border-radius:8px;background:color-mix(in srgb,var(--good) 16%,transparent);color:var(--good);font-size:13.5px;font-weight:600}
.ti-converted a{color:inherit;text-decoration:underline}
.prt-chip-ok{background:color-mix(in srgb,var(--good) 16%,transparent);color:var(--good)}

/* ── Contact detail: tabbed sections ─────────────────────────────────────── */
.ct-tabs{margin:4px 0 14px}
.ct-tab-n{display:inline-block;min-width:18px;padding:0 5px;margin-left:5px;border-radius:9px;background:var(--surface-2,#e2e8f0);color:var(--text-muted,#475569);font-size:11px;font-weight:800;line-height:17px;text-align:center}
.crm-seg-btn.active .ct-tab-n{background:var(--primary,#1d4ed8);color:var(--on-primary,#fff)}
.card-h-row{display:flex;align-items:center;justify-content:space-between;gap:10px}
.ct-search{margin:10px 0 12px}
.ct-ti-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}

/* ── Work queues ─────────────────────────────────────────────────────────── */
/* (wq-toolbar retired — work-queue heads use the shared .prt-head component) */
.wq-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
.wq-card{display:flex;flex-direction:column;gap:8px;text-align:left;padding:16px;background:var(--surface);border:1px solid var(--border);border-radius:12px;cursor:pointer;transition:.12s;font:inherit;color:var(--text)}
.wq-card:hover{border-color:var(--primary);box-shadow:0 4px 14px rgba(0,0,0,.08);transform:translateY(-1px)}
.wq-card-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.wq-card-name{font-weight:800;font-size:15px}
.wq-card-desc{font-size:12.5px;color:var(--text-muted,#64748b);min-height:16px}
.wq-card-stats{display:flex;gap:14px;font-size:12.5px;color:var(--text-muted,#64748b)}
.wq-stat b{color:var(--text);font-size:14px}
.wq-overdue,.wq-stat.wq-overdue b{color:var(--danger,#dc2626)}
.wq-row-overdue td:first-child{box-shadow:inset 3px 0 0 var(--danger,#dc2626)}
.wq-task-title{font-weight:700}
.wq-task-desc{font-size:12.5px;color:var(--text-muted,#64748b);margin-top:2px;max-width:480px}
.wq-task-outcome{font-size:12.5px;color:var(--good);margin-top:4px}
.wq-chip-high{background:color-mix(in srgb,var(--danger) 14%,transparent);color:var(--danger)}
.wq-rel{color:var(--primary);text-decoration:none;font-weight:600}
.wq-rel:hover{text-decoration:underline}
.qm-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid var(--border)}
.qm-row:last-child{border-bottom:none}

/* ── Contact PX tab: listing cards (stock-look) ──────────────────────────── */
.ct-px-list{display:flex;flex-direction:column;gap:14px}
.ct-px-card{display:flex;gap:18px;padding:16px;align-items:stretch}
.ct-px-media{flex:0 0 260px;cursor:pointer}
.ct-px-img{width:260px;height:180px;object-fit:cover;border-radius:10px;border:1px solid var(--border);background:var(--surface-2,#f1f5f9);display:block}
.ct-px-img-ph{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;font-size:34px;color:var(--text-muted,#94a3b8)}
.ct-px-img-ph span{font-size:12.5px;font-weight:600}
.ct-px-body{flex:1;display:flex;flex-direction:column;gap:8px;min-width:0}
.ct-px-title-row{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.ct-px-title{font-size:18px;font-weight:800;color:var(--text);cursor:pointer}
.ct-px-title:hover{color:var(--primary,#1d4ed8)}
.ct-px-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:13px;color:var(--text-muted,#64748b)}
.ct-px-specs{margin:2px 0 4px}
@media (max-width:760px){ .ct-px-card{flex-direction:column} .ct-px-media,.ct-px-img{flex-basis:auto;width:100%;height:200px} }

/* ── Deals workspace ─────────────────────────────────────────────────────── */
.dw-total{margin-left:auto;font-size:13.5px;color:var(--text-muted,#64748b);white-space:nowrap}
.dw-total b{color:var(--text);font-size:15px}
.dw-fin-hero{display:flex;flex-direction:column;gap:2px;padding:16px 18px;border:1px solid var(--border);border-radius:12px;background:var(--surface-2,#f8fafc)}
.dw-fin-hero span{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--text-muted,#64748b)}
.dw-fin-hero b{font-size:28px;font-weight:800;color:var(--primary,#1d4ed8)}
.dw-fin-hero small{font-size:12.5px;color:var(--text-muted,#64748b)}
.dl-row{cursor:pointer}
.dl-row:hover td{background:var(--surface-2,#f8fafc)}
.dw-sum-meta{display:flex;gap:16px;flex-wrap:wrap;font-size:13px;color:var(--text-muted,#64748b);margin-top:4px}
.dw-gross{margin-top:10px;padding:9px 14px;border-radius:8px;background:color-mix(in srgb,var(--warn) 12%,transparent);color:var(--text);font-size:13px;border:1px solid color-mix(in srgb,var(--warn) 40%,transparent)}

/* ── Appointments (test drives) — staff must not miss them ──────────────── */
.crm-appt{font-weight:700;color:var(--primary-d,var(--primary));white-space:nowrap}
.crm-appt-past{color:var(--danger)}
.crm-appt-banner{display:flex;align-items:center;gap:14px;padding:14px 18px;border-left:4px solid var(--primary);margin-bottom:14px}
.crm-appt-banner-past{border-left-color:var(--danger)}
.crm-appt-ico{font-size:26px}

/* ── After Sales: capacity scheduler + workshop board ─────────────────────── */
.as-req-strip .as-req-scroll{display:flex;gap:10px;overflow-x:auto;padding:4px 0}
.as-req-card{flex:0 0 240px;display:flex;flex-direction:column;gap:3px;border:1px solid var(--border);border-radius:10px;padding:10px 12px;font-size:12.5px;background:var(--surface)}
.as-req-card .btn{margin-top:6px;align-self:flex-start}
.as-cal-toolbar{display:flex;align-items:center;gap:14px;margin:12px 0 8px;flex-wrap:wrap}
.as-cal{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;align-items:start}
.as-cal-day{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:8px;min-height:120px;display:flex;flex-direction:column;gap:6px}
.as-cal-today{border-color:var(--primary,#1d4ed8);box-shadow:0 0 0 1px var(--primary,#1d4ed8)}
.as-cal-head{display:flex;justify-content:space-between;font-size:12px}
.as-cap{height:5px;border-radius:3px;background:var(--surface-2,#eef2f7);overflow:hidden}
.as-cap-fill{height:100%;border-radius:3px}
.as-cap-green{background:#22c55e}.as-cap-amber{background:#f59e0b}.as-cap-red{background:#ef4444}
.as-cal-jobs{display:flex;flex-direction:column;gap:5px;overflow-y:auto;max-height:400px}
.as-job{border-radius:8px;padding:6px 8px;font-size:11.5px;line-height:1.35;cursor:pointer;border-left:3px solid transparent;background:var(--surface-2,#f8fafc)}
.as-job:hover{filter:brightness(0.97)}
.as-job-booked{border-left-color:#60a5fa}
.as-job-active{border-left-color:#f59e0b}
.as-job-ready{border-left-color:#22c55e}
.as-job-done{border-left-color:#cbd5e1;opacity:.65}
.as-job-time{font-weight:700;margin-right:4px}
.as-job-h{color:var(--text-muted,#64748b)}
.as-job-veh{display:block;color:var(--text-muted,#64748b);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.as-job-pend{display:inline-block;margin-top:2px;font-size:10px;font-weight:700;color:#92400e;background:#fef3c7;border-radius:999px;padding:1px 7px}
.as-cal-empty{color:var(--text-muted,#94a3b8);font-size:12px;text-align:center;padding:8px 0}
.as-board{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;align-items:start}
.as-board-col{background:var(--surface-2,#f1f5f9);border-radius:12px;padding:10px}
.as-board-head{font-size:12.5px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--text-muted,#475569);margin-bottom:8px;display:flex;align-items:center;gap:6px}
.as-card{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:10px 12px;margin-bottom:8px;cursor:pointer;font-size:12.5px}
.as-card:hover{box-shadow:var(--shadow,0 2px 8px rgba(15,23,42,.08))}
.as-card-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:3px}
.as-card-veh{font-weight:600}
.as-card-meta{display:flex;justify-content:space-between;color:var(--text-muted,#64748b);margin-top:2px}
.as-card-pend{margin-top:5px;font-size:11px;font-weight:700;color:#92400e}
.as-card-total{margin-top:4px;font-weight:800}
@media (max-width:1100px){ .as-cal{grid-template-columns:repeat(4,1fr)} .as-board{grid-template-columns:repeat(2,1fr)} }
.as-cal-more{font-size:11px;font-weight:700;color:#92400e;background:#fef3c7;border-radius:7px;padding:4px 8px;text-align:center;margin-top:4px}