/* Scoped to the intended dealer's explicitly enabled workflow. Business pages retain their system. */
body.dealer-workflow{font-family:var(--sans)}
.dealer-workflow h1,.dealer-workflow h2,.dealer-workflow h3{font-family:inherit!important;font-style:normal;font-weight:700;letter-spacing:0}.dealer-workflow h1{letter-spacing:-.025em}
.dealer-workflow h1{font-size:30px!important;line-height:1.2}.dealer-workflow h2{font-size:22px!important}.dealer-workflow #view{padding-top:20px}.dealer-workflow .dw-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.dealer-workflow .dw-heading h1,.dealer-workflow .dw-heading h2{margin:0}.dealer-workflow .dw-heading p{margin:6px 0 0}.dw-toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:14px}.dw-toolbar input[type=search]{max-width:350px;min-width:160px;flex:1}.dw-arrivals{display:flex;gap:16px;align-items:center;flex-wrap:wrap;padding:12px;border:1px solid var(--hairline);background:var(--surface-2);font-size:13px;margin-bottom:16px}.dw-arrivals a{margin-left:auto}.dw-list{background:var(--surface);border-top:1px solid var(--hairline)}.dw-customer{border-bottom:1px solid var(--hairline)}.dw-row{display:grid;grid-template-columns:110px minmax(160px,1fr) minmax(150px,1.25fr) auto;align-items:center;gap:14px;padding:10px 12px;min-height:78px}.dw-row>div{min-width:0}.dw-row small{display:block;font-size:13px;color:var(--ink-3);margin-top:4px}.dw-row a{font-weight:600;color:var(--ink)}.dw-pending{padding:10px 0}.dw-pending summary{cursor:pointer;font-size:13px;min-height:44px;display:flex;align-items:center}.dw-editor{background:var(--surface-2);padding:16px;animation:dw-in 200ms cubic-bezier(.16,1,.3,1)}.dw-editor-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.dw-editor-head h2{margin:0}.dw-context{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.dw-context p{margin:4px 0}.dw-field{display:grid;gap:5px;margin-bottom:12px;font-size:13px}.dw-field input,.dw-field textarea,.dw-field select{width:100%;font-size:13px}.dw-pair{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px}.dw-pair h3{font-size:15px;margin:10px 0;padding-bottom:8px;border-bottom:1px solid var(--hairline)}.dw-pair textarea{min-height:78px;resize:vertical}.dw-booking{display:grid;grid-template-columns:1fr 1fr;gap:10px}.dw-form footer{display:flex;align-items:center;justify-content:flex-end;gap:10px;border-top:1px solid var(--hairline);padding-top:12px;margin-top:12px}.dw-form footer>span{margin-right:auto;font-size:12px}.dw-history,.dw-provenance{border-top:1px solid var(--hairline);padding:8px 0}.dw-history summary,.dw-provenance summary{min-height:44px;cursor:pointer;font-size:13px;display:flex;align-items:center}.dw-history ol{padding:0;list-style:none}.dw-history li{display:grid;grid-template-columns:120px minmax(0,1fr);gap:14px;font-size:13px;padding:8px 0;border-top:1px solid var(--hairline)}.dw-provenance pre{white-space:pre-wrap;overflow-wrap:anywhere;font:13px/1.5 inherit}.dw-sheet{position:fixed;inset:0 0 0 auto;margin:0;width:min(660px,100%);max-width:100%;height:100dvh;max-height:100dvh;border:0;border-radius:0;background:var(--surface);color:var(--ink);padding:0;overflow:auto}.dw-sheet::backdrop{background:var(--scrim)}.dw-sheet .dw-pair{grid-template-columns:1fr}.dw-sheet .dw-editor{min-height:100%;background:var(--surface);padding:20px}.dw-sheet footer{position:sticky;bottom:0;background:var(--surface);padding:12px 0}.dw-calendar-event,.dw-person{background:var(--surface);padding:16px;border-bottom:1px solid var(--hairline)}.dw-calendar-event .btn{margin-right:8px}.dw-calendar-event p{margin:8px 0}.dw-person{display:flex;align-items:center;justify-content:space-between;gap:12px}.dealer-workflow [hidden]{display:none!important}.dealer-workflow .titles{padding:0}.dealer-workflow .section-title{font-size:20px}.dealer-workflow .dw-form details>summary{font-size:13px;min-height:44px;display:flex;align-items:center;cursor:pointer}.dealer-workflow .dw-editor:focus{outline:2px solid var(--focus)}
@keyframes dw-in{from{opacity:.75;transform:translateY(4px)}to{opacity:1;transform:none}}
@media(max-width:700px){.dw-row{grid-template-columns:minmax(0,1fr) 136px;gap:8px 12px;padding:12px}.dw-row>div:nth-child(2){grid-column:1;grid-row:2}.dw-row>div:nth-child(3){grid-column:1/-1;grid-row:3}.dw-row>.btn{grid-column:2;grid-row:1/3}.dw-pair{grid-template-columns:1fr}.dw-field input,.dw-field select,.dw-field textarea{font-size:16px}.dw-form footer{flex-wrap:wrap}.dw-form footer>span{width:100%;margin-bottom:4px}.dw-form footer>.primary{flex:1}.dw-history li{grid-template-columns:90px minmax(0,1fr)}.dw-sheet{left:0;right:auto;width:100%;max-width:100%}.dw-sheet .dw-editor{padding:16px 12px}.dw-sheet footer{padding-bottom:max(12px,env(safe-area-inset-bottom))}.dw-booking{grid-template-columns:1fr}.dealer-workflow .dw-context{align-items:flex-start}.dw-context strong{font-size:17px}.dw-person{display:block}.dw-arrivals{gap:8px}.dealer-workflow .dw-heading h1{font-size:24px!important}}
@media(prefers-reduced-motion:reduce){.dw-editor{animation:none}.dealer-workflow *{transition:none!important;scroll-behavior:auto!important}.dealer-workflow :active{transform:none!important}}

.dw-measure{border-bottom:1px solid var(--hairline);padding:8px 0}.dw-measure summary,.dealer-workflow details.report>summary{min-height:44px;cursor:pointer;display:flex;align-items:center}.dw-measure p{max-width:80ch}

.dealer-workflow :is(.dw-history,.dw-provenance,.dw-pending,.dw-measure,.dw-form details,details.report)>summary::before{content:"";display:inline-block;flex:none;width:6px;height:6px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;margin-right:12px;transform:rotate(-45deg);transition:transform 150ms ease-out}.dealer-workflow :is(.dw-history,.dw-provenance,.dw-pending,.dw-measure,.dw-form details,details.report)[open]>summary::before{transform:rotate(45deg)}.dw-toolbar button[aria-pressed=true]{background:var(--primary);border-color:var(--primary);color:var(--on-primary)}

.appbar>.dealer-context-select{max-width:190px;width:190px;min-width:0;flex:0 1 190px;min-height:34px;background-color:var(--frame);color:var(--frame-ink);border:1px solid var(--frame-line);border-radius:var(--r-nav);font-size:13px;font-weight:600}.more-list .dealer-context-select{width:100%}@media(max-width:700px){.appbar>.dealer-context-select{display:none}}

/* 27 October: shared finishing for the dealership workspace.
   Native disclosures, routes, form controls and workflow semantics remain intact. */
.dealer-workflow { accent-color: var(--primary); }
.dealer-workflow ::selection { background: var(--primary); color: var(--on-primary); }
.dealer-workflow :is(input, textarea) { caret-color: var(--ink); }
.dealer-workflow :is(.side-nav, .table-wrap, .sheet, dialog) { scrollbar-width: thin; }
.dealer-workflow h1 { font-size: 30px !important; line-height: 1.2; font-weight: 700; }
.dealer-workflow h2 { line-height: 1.27; }
.dealer-workflow #view { padding-top: 28px; }
.dealer-workflow .dw-heading { margin-bottom: 20px; align-items: center; }
.dealer-workflow .dw-heading p { margin-top: 8px; }
.dealer-workflow .sub { color: var(--ink-2); line-height: 1.5; }
.dealer-workflow :is(.btn, input, select, textarea) { border-radius: var(--r-ctl); }
.dealer-workflow :is(input:not([type=checkbox]):not([type=radio]), select, textarea) {
  border: 1px solid var(--ctrl); background-color: var(--panel); color: var(--ink);
  padding: 9px 11px; font-size: 13px; line-height: 18px; min-width: 0;
  transition: border-color .14s var(--ease-out), box-shadow .14s var(--ease-out);
}
.dealer-workflow :is(input, textarea)::placeholder { color: var(--ink-3); opacity: 1; }
.dealer-workflow :is(input, select, textarea):focus-visible { outline: none; border-color: var(--focus); box-shadow: 0 0 0 3px var(--ring); }
.dealer-workflow .appbar select.department-select, .dealer-workflow .appbar select.dealer-context-select { min-height: 34px; padding: 0 28px 0 9px; background-color: var(--frame); color: var(--frame-ink); border-color: var(--frame-line); border-radius: var(--r-nav); font-size: 13px; }
.dealer-workflow .search input[type=search] { padding-left: 38px; }
.dealer-workflow .appbar .search input[type=search] { padding-block: 0; border-color: var(--frame-line); background-color: var(--frame-field); color: var(--frame-ink); border-radius: var(--r-nav); }
.dealer-workflow .section-tabs { margin-bottom: 20px; }

/* One drawn chevron for expandable groups. The native summary stays keyboard operable. */
.dealer-workflow summary { list-style: none; }
.dealer-workflow summary::-webkit-details-marker { display: none; }
.dealer-workflow summary::marker { content: ''; }
.dealer-workflow :is(.dw-history,.dw-provenance,.dw-pending,.dw-measure,.dw-form details,details.report,.handoff-steps,.handoff-history,.past-enquiry,.dw-page>details) > summary {
  display: flex; align-items: center; gap: 12px; min-height: 40px; padding: 10px 8px 10px 12px;
  font-size: 16px; font-weight: 700; cursor: pointer; border-radius: 0; background: var(--tile);
}
.dealer-workflow :is(.dw-history,.dw-provenance,.dw-pending,.dw-measure,.dw-form details,details.report,.handoff-steps,.handoff-history,.past-enquiry,.dw-page>details) > summary::before { content: none; }
.dealer-workflow :is(.side-nav details,.dw-history,.dw-provenance,.dw-pending,.dw-measure,.dw-form details,details.report,.handoff-steps,.handoff-history,.past-enquiry,.dw-page>details) > summary::after {
  content: ''; width: 7px; height: 7px; flex: 0 0 7px; margin: 0 3px 0 auto;
  border-right: 1.7px solid currentColor; border-bottom: 1.7px solid currentColor;
  transform: rotate(-45deg); transition: transform 160ms var(--ease-out); opacity: .8;
}
.dealer-workflow :is(.side-nav details,.dw-history,.dw-provenance,.dw-pending,.dw-measure,.dw-form details,details.report,.handoff-steps,.handoff-history,.past-enquiry,.dw-page>details)[open] > summary::after { transform: rotate(45deg); }
.dealer-workflow :is(.dw-history,.dw-provenance,.dw-pending,.dw-measure,.dw-form details,details.report,.handoff-steps,.handoff-history,.past-enquiry) > summary:hover { background: var(--tile); }
.dealer-workflow .side-nav summary { display: flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 600; min-height: 36px; padding: 8px 10px; }
.dealer-workflow .side-nav summary span { min-width: 0; }
.dealer-workflow .side-nav summary::after { width: 6px; height: 6px; flex-basis: 6px; margin-right: 1px; }
.dealer-workflow .side-nav details { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--panel-line); }
.dealer-workflow .side-nav details a { margin-top: 2px; padding-left: 22px; font-size: 14px; }
.dealer-workflow .side-nav :is(a,summary) { transition: background-color 140ms var(--ease-out), color 140ms var(--ease-out); }
.dealer-workflow:not(.out) main#view, .dealer-workflow .side-nav, .dealer-workflow .sheet { transition: none; }
.dealer-workflow.rail-min .side-nav summary { display: none; }
.dealer-workflow.rail-min .side-nav details a { padding-left: 13px; }

/* Today: coherent sections, compact rows and an intentional empty state. */
.dw-toolbar { gap: 8px; margin-bottom: 20px; }
.dw-toolbar input[type=search] { margin-left: 8px; max-width: 380px; }
.dw-toolbar > .sub { margin-left: auto; font-variant-numeric: tabular-nums; font-size: 13px; }
.dw-toolbar button[aria-pressed=true] { background: var(--primary); border-color: var(--primary); color: var(--on-primary); }
.dw-arrivals { padding: 10px 12px; border: 1px solid var(--panel-line); border-radius: var(--r-card); background: var(--tile); margin-bottom: 12px; line-height: 1.6; }
.dw-arrivals > strong { font-size: 14px; }
.dw-arrivals a { font-weight: 600; white-space: nowrap; text-underline-offset: 4px; }
.dw-arrivals:has(.btn) .btn { margin-left: auto; }
.dw-arrivals[role=status] { background: var(--need-bg); border-color: var(--soon-line); color: var(--need-ink); }
.dw-arrivals[role=status] a { color: inherit; }
.dw-pending { padding: 0; margin: 16px 0; border: 1px solid var(--panel-line); border-radius: var(--r-card); background: var(--panel); overflow: clip; }
.dw-count { display: inline-flex; justify-content: center; align-items: center; min-width: 22px; height: 22px; padding: 0 6px; background: var(--tile); color: var(--ink-2); border: 1px solid var(--panel-line); border-radius: var(--r-ctl); font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums; }
.dw-pending[open] > summary { border-bottom: 1px solid var(--panel-line); border-radius: 0; }
.dw-pending[open]:not(:has(.dw-row)) > summary { border-bottom: 0; }
.dw-list { border: 1px solid var(--panel-line); border-radius: var(--r-card); overflow: clip; margin: 8px 0 20px; }
.dw-customer:nth-child(odd) { background-color: var(--panel); }
.dw-customer:nth-child(even) { background-color: var(--stripe); }
.dw-list > .empty { padding: 32px 24px; margin: 0; color: var(--ink-2); font-size: 15px; }
.dw-customer:last-child { border-bottom: 0; }
.dw-row { min-height: 0; padding: 8px 10px; gap: 12px; }
.dw-row:hover { background: var(--tile); }
.dw-row a { text-decoration: none; }
.dw-row a:hover { text-decoration: underline; text-underline-offset: 4px; }
.dw-row small { margin-top: 1px; font-size: 12px; color: var(--ink-2); line-height: 1.5; }
.dw-row .btn { align-self: center; }
.dw-pending .dw-row { border-top: 1px solid var(--panel-line); }
.dw-pending > summary + .dw-customer .dw-row { border-top: 0; }

/* Shared content: filters, data tables, reports, settings and handovers. */
.dealer-workflow .filters { gap: 12px; padding: 12px; border: 1px solid var(--panel-line); border-radius: var(--r-card); background: var(--tile); margin-bottom: 20px; }
.dealer-workflow .filters label { color: var(--ink-2); }
.dealer-workflow .table-wrap { border: 1px solid var(--panel-line); border-radius: var(--r-card); background: var(--panel); }
.dealer-workflow .table th { background: var(--tile); font-weight: 700; color: var(--ink); padding-top: 8px; padding-bottom: 8px; }
.dealer-workflow .table td { vertical-align: middle; }
.dealer-workflow .table :is(td,th) { font-variant-numeric: tabular-nums; }
.dealer-workflow .empty-state { max-width: none; padding: 32px 24px; border: 1px solid var(--panel-line); border-radius: var(--r-card); background: var(--panel); }
.dealer-workflow .empty-state h3 { font-size: 18px; font-weight: 700; }
.dealer-workflow .tiles { overflow: clip; margin-bottom: 20px; }
.dealer-workflow .tile { padding: 20px; min-width: 0; }
.dealer-workflow .tile b { font-size: 26px; line-height: 1.35; font-weight: 700; letter-spacing: -.025em; }
.dealer-workflow .tile .sub { margin-top: 8px; }
.dealer-workflow details.report { margin-top: 16px; }
.dealer-workflow .dw-measure { padding: 0; background: var(--panel); border-bottom: 1px solid var(--panel-line); }
.dealer-workflow .dw-measure p { padding: 0 16px 12px; margin: 0; }
.dealer-workflow :is(.dw-person,.dw-calendar-event) { padding: 20px; border-radius: var(--r-card); margin-bottom: 12px; border: 1px solid var(--panel-line); }
.dealer-workflow .dw-person p { margin: 6px 0 0; }
.dealer-workflow .handoff-row { padding-top: 20px; border-color: var(--panel-line); }
.dealer-workflow .settings .card { padding: 24px; }
.dealer-workflow .card-title { line-height: 1.4; }

/* Recording an outcome and customer detail keep the same fields and actions. */
.dw-editor { padding: 20px; background: var(--panel); }
.dw-editor-head { margin-bottom: 20px; gap: 12px; }
.dw-context { padding-bottom: 16px; margin-bottom: 20px; border-bottom: 1px solid var(--panel-line); }
.dw-context strong { font-size: 18px; font-weight: 700; }
.dw-field { gap: 4px; margin-bottom: 14px; font-size: 12px; color: var(--ink-2); }
.dw-field > span { font-weight: 600; }
.dw-pair { gap: 24px; margin: 20px 0; }
.dealer-workflow .dw-pair h3 { font-size: 16px; letter-spacing: 0; margin: 0 0 14px; padding-bottom: 10px; }
.dw-form footer { padding-top: 20px; margin-top: 20px; }
.dw-history, .dw-provenance { padding: 4px 0; border-color: var(--panel-line); }
.dw-history li { padding: 12px 16px; }
.dw-history time { color: var(--ink-3); font-variant-numeric: tabular-nums; }
.dw-provenance > p { padding-inline: 16px; }
.dw-customer-card { padding: 20px; }
.dw-customer-card > p { padding: 12px; border: 1px solid var(--line-soft); border-radius: var(--r-ctl); background: var(--tile); }
.dealer-workflow .sheet .panel:has(.dw-customer-card) { display: flex; width: 100%; border-left: 0; flex-direction: column; }
.dealer-workflow .sheet:has(.dw-customer-card) { background: transparent; }
.dealer-workflow .sheet:has(.dw-customer-card) .scrim { display: block; }
.dealer-workflow .sheet .panel:has(.dw-customer-card) .head { flex: none; min-height: 64px; }
.dealer-workflow .sheet .body:has(> .dw-customer-card) { display: block; flex: 1; min-height: 0; overflow-y: auto; padding: 0; }
.dw-sheet .dw-editor { padding: 28px; }
.dw-sheet .dw-form footer { gap: 12px; }

@media (max-width: 1000px) {
  .dealer-workflow .filters { padding: 12px; }
  .dealer-workflow .dw-toolbar > .sub { margin-left: 0; }
}
@media (max-width: 700px) {
  .dealer-workflow #view { padding-top: 20px; }
  .dealer-workflow h1, .dealer-workflow .dw-heading h1 { font-size: 26px !important; }
  .dealer-workflow .dw-heading { margin-bottom: 20px; align-items: flex-start; }
  .dealer-workflow :is(input:not([type=checkbox]):not([type=radio]),select,textarea) { font-size: 16px; }
  .dw-toolbar input[type=search] { order: 3; flex-basis: 100%; max-width: none; margin: 4px 0 0; }
  .dw-toolbar > .sub { margin-left: auto !important; }
  .dw-row { padding: 16px; gap: 12px; grid-template-columns: minmax(0,1fr) 128px; }
  .dw-arrivals { padding: 12px 16px; gap: 8px 12px; }
  .dw-list > .empty { padding: 24px 16px; }
  .dw-editor, .dw-sheet .dw-editor, .dw-customer-card { padding: 16px; }
  .dw-pair { gap: 12px; }
  .dw-context { flex-wrap: wrap; }
  .dw-person .btn { margin-top: 16px; }
  .dealer-workflow .tile { padding: 16px; }
  .dealer-workflow .settings .card { padding: 16px; }
  .dealer-workflow .filters > * { min-width: 0; max-width: 100%; }
  .dealer-workflow .section-tabs { margin-bottom: 20px; padding-bottom: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .dealer-workflow summary::after { transition: none; }
}

/* 28 October: Today leads with the customers. One compact header line, an optional strip for
   bookings and flags, and per-row icons that open Record action as a pop-up over the page. */
.dealer-workflow .dw-today { padding-top: 0; }
.dw-topbar { display: flex; align-items: center; gap: 10px 12px; flex-wrap: wrap; margin-bottom: 10px; }
.dealer-workflow .dw-topbar h1 { font-size: 22px !important; line-height: 1.25; margin: 0; }
.dw-topbar > .sub { font-size: 12px; font-variant-numeric: tabular-nums; }
.dw-late-count { color: var(--late); font-weight: 600; }
/* Mine / Team: Daybook's view switch (grey track, 3px inset, the chosen one solid navy). */
.dw-scope { display: inline-flex; gap: 0; margin-left: 4px; padding: 3px; background: var(--frame-hover); border-radius: var(--r-track); }
.dw-scope button[aria-pressed] { min-height: 30px; padding: 5px 9px; border: 0; border-radius: var(--r-nav); background: transparent; color: var(--frame-muted); font: 600 13px/20px var(--sans); box-shadow: none; }
.dw-scope button[aria-pressed]:hover { background: var(--frame); color: var(--frame-ink); box-shadow: none; }
.dw-scope button[aria-pressed=true], .dw-scope button[aria-pressed=true]:hover { background: var(--primary); color: var(--on-primary); }
.dealer-workflow .dw-topbar input[type=search] { flex: 1 1 220px; max-width: 360px; min-height: 34px; padding-block: 6px; }
.dw-total { margin-left: auto; }

.dw-strip { display: flex; align-items: center; gap: 6px 16px; flex-wrap: wrap; font-size: 12px; color: var(--ink-2); margin-bottom: 10px; }
.dw-strip strong { color: var(--ink); }
/* Flags: Daybook's "waiting" chip (amber tint, its edge, 12px/600, 4px corners). */
.dw-flag { display: inline-flex; align-items: center; min-height: 0; padding: 2px 8px; border: 1px solid var(--soon-line); border-radius: var(--r-ctl); background: var(--need-chip); color: var(--need-ink); font: 600 12px/1.4 var(--sans); text-decoration: none; cursor: pointer; }
.dw-flag:hover { border-color: var(--need-ink); }
.dealer-workflow .dw-strip .dw-alerts > summary { min-height: 0; padding: 2px 8px; font-size: 12px; font-weight: 600; border: 1px solid var(--panel-line); border-radius: var(--r-ctl); background: var(--tile); gap: 8px; }
.dw-alerts[open] { flex-basis: 100%; }
.dw-alerts p { margin: 6px 10px; }
.dw-today .dw-list { margin-top: 0; }
.dw-today .dw-row { min-height: 72px; padding: 12px 16px; }

.dw-actions { display: grid; gap: 4px; justify-items: end; }
.dw-log, .dw-contact { display: flex; gap: 4px; }
/* Row buttons: Daybook's small plain button (white, a grey edge, 4px corners); hover is its plain-button hover. */
.dw-icon { display: inline-grid; place-items: center; width: 40px; height: 40px; padding: 0; border: 1px solid var(--panel-line); border-radius: var(--r-ctl); background: var(--panel); color: var(--ink-2); cursor: pointer; }
.dw-icon:hover { background: var(--tile); border-color: var(--line-strong); color: var(--ink); box-shadow: var(--lift); }
:is(.dw-icon, .dw-call, .dw-chip, .cp-tab, .cp-chip, .dw-pick, .dw-month-num) { transition: background-color .14s var(--ease-out), color .14s var(--ease-out), border-color .14s var(--ease-out), box-shadow .14s var(--ease-out), transform .34s var(--ease); -webkit-tap-highlight-color: transparent; }
:is(.dw-icon, .dw-call, .dw-chip, .cp-tab, .cp-chip, .dw-scope button):not([disabled]):active { transform: scale(.97); box-shadow: inset 0 0 0 999px var(--press); transition-duration: .05s; }
.dw-icon:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.dw-icon .ico { width: 19px; height: 19px; }
.dw-actions.late .dw-icon { background: var(--panel); border-color: var(--warn-edge); color: var(--late); }
.dw-actions.late .dw-icon:hover { background: var(--warn-tint); border-color: var(--late); color: var(--late); }
.dw-soon { display: inline-flex; align-items: center; gap: 5px; height: 26px; padding: 0 8px; border: 1px dashed var(--line-strong); border-radius: var(--r-ctl); background: transparent; color: var(--ink-3); font: 600 12px/1 var(--sans); cursor: not-allowed; }
.dw-soon .ico { width: 14px; height: 14px; }

/* Record action is a centred pop-up on wider screens, full screen on a phone. */
.dw-sheet.dw-modal { inset: 0; margin: auto; width: min(820px, calc(100% - 48px)); height: fit-content; max-height: calc(100dvh - 48px); border: 1px solid var(--panel-line); border-radius: var(--r-dialog); box-shadow: var(--dlg-shadow); }
.dw-sheet.dw-modal .dw-editor { min-height: 0; }
.dw-sheet.dw-modal .dw-pair { grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
.dw-sheet.dw-modal .dw-editor-head { position: sticky; top: -28px; z-index: 1; margin: -28px -28px 16px; padding: 20px 28px 12px; background: var(--tile); border-bottom: 1px solid var(--panel-line); }

@media (max-width: 700px) {
  .dw-topbar { gap: 8px; }
  .dealer-workflow .dw-topbar input[type=search] { order: 3; flex-basis: 100%; max-width: none; }
  .dw-today .dw-row { grid-template-columns: minmax(0,1fr) auto; }
  .dw-row > .dw-actions { grid-column: 2; grid-row: 1/3; }
  .dw-icon { width: 44px; height: 44px; }
  .dw-log { display: grid; grid-template-columns: repeat(2, 44px); }
  .dw-contact { display: none; }
  .dw-sheet.dw-modal { width: 100%; max-width: 100%; height: 100dvh; max-height: 100dvh; border-radius: 0; }
  .dw-sheet.dw-modal .dw-pair { grid-template-columns: 1fr; }
  .dw-sheet.dw-modal .dw-editor-head { top: -16px; margin: -16px -16px 12px; padding: 14px 16px 10px; }
}

/* 28 October (later): Today as three boxes, Overdue, To do today and Completed today, under a daily score. */
.dw-score { margin-left: auto; display: grid; grid-template-columns: auto 120px; grid-template-rows: auto auto; align-items: center; gap: 2px 10px; padding: 4px 12px; border: 1px solid var(--panel-line); border-radius: var(--r-ctl); background: var(--tile); cursor: help; }
.dw-score-num { font-size: 12px; color: var(--ink-2); font-variant-numeric: tabular-nums; white-space: nowrap; }
.dw-score-num b { font-size: 15px; font-weight: 700; line-height: 1; color: var(--ink); margin-right: 2px; }
.dw-bar { display: block; height: 8px; border-radius: 2px; background: var(--line-soft); overflow: hidden; }
.dw-bar i { display: block; height: 100%; background: var(--primary); border-radius: inherit; transition: width 300ms var(--ease-out); }
.dw-score small { grid-column: 1 / -1; font-size: 11px; color: var(--ink-2); white-space: nowrap; }
.dw-score.hit .dw-bar i { background: var(--ink); }
.dw-box { margin: 0 0 16px; }
.dw-box-head { display: flex; align-items: center; gap: 10px; margin: 0 0 6px; }
.dealer-workflow .dw-box-head h2 { font-size: 16px !important; font-weight: 700; margin: 0; }
.dw-box-head > .sub { margin-left: auto; font-size: 12px; font-weight: 600; }
.dw-today .dw-box .dw-list { margin: 0; }
.dw-overdue .dw-box-head .dw-count { background: var(--warn-tint); border-color: var(--warn-edge); color: var(--late); }
.dw-overdue .dw-list { border-color: var(--warn-edge); }
.dw-completed .dw-list { background: var(--panel); }
.dw-done { display: grid; grid-template-columns: 110px minmax(140px,1fr) minmax(150px,2fr) 44px; align-items: center; gap: 12px; padding: 8px 10px; border-bottom: 1px solid var(--panel-line); font-size: 14px; }
.dw-done:nth-child(even) { background: var(--stripe); }
.dw-done:last-child { border-bottom: 0; }
.dw-done time { color: var(--ink-2); font-size: 12px; font-variant-numeric: tabular-nums; }
.dw-done a { font-weight: 600; color: var(--ink); text-decoration: none; }
.dw-done a:hover { text-decoration: underline; text-underline-offset: 4px; }
.dw-done small { display: block; font-size: 12px; color: var(--ink-2); }
.dw-done-text { color: var(--ink-2); min-width: 0; overflow-wrap: anywhere; }
.dw-pts { justify-self: end; min-width: 36px; padding: 2px 8px; border: 1px solid var(--primary); border-radius: 2px; background: var(--primary); color: var(--on-primary); font-weight: 700; font-size: 12px; text-align: center; font-variant-numeric: tabular-nums; }
.dw-pts.zero { background: var(--tile); border-color: var(--panel-line); color: var(--ink-2); }
@media (max-width: 700px) {
  .dw-score { margin-left: 0; order: 2; grid-template-columns: auto 1fr; flex: 1 1 100%; }
  .dw-done { grid-template-columns: minmax(0,1fr) auto; gap: 4px 12px; padding: 12px 16px; }
  .dw-done time { grid-column: 1; grid-row: 1; }
  .dw-done > div:nth-of-type(1) { grid-column: 1; grid-row: 2; }
  .dw-done-text { grid-column: 1 / -1; grid-row: 3; }
  .dw-pts { grid-column: 2; grid-row: 1 / 3; }
}
/* Customer card, 29 Oct call: full screen, vehicle at the top, the enquiry's facts, a small hand-off line, history under it. */
.dw-full-card{max-width:1100px;margin:0 auto;padding:4px 4px 24px}
.dw-car{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;border:1px solid var(--panel-line);border-radius:var(--r-card);background:var(--panel);margin-bottom:14px}
.dw-car small{display:block;font-size:12px;font-weight:600;color:var(--ink-2)}.dw-car strong{display:block;font-size:14px}
.dw-full-card .dw-heading{margin-bottom:12px}
.dw-stages{display:flex;flex-wrap:wrap;gap:6px;list-style:none;padding:0;margin:0 0 12px}
.dw-stages li{font-size:12px;font-weight:600;padding:4px 10px;border-radius:var(--r-ctl);background:var(--tile);color:var(--ink-2);border:1px solid var(--panel-line)}
.dw-stages li.on{background:var(--primary);color:var(--on-primary);border-color:var(--primary)}
.dw-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:12px}
.dw-fact{padding:12px;border:1px solid var(--panel-line);border-radius:var(--r-card);background:var(--panel)}
.dw-fact small,.dw-next small{display:block;font-size:12px;font-weight:600;color:var(--ink-2);margin-bottom:2px}.dw-fact strong{font-size:14px}
.dw-next{margin:0 0 6px;padding:12px;border:1px solid var(--soon-line);border-radius:var(--r-card);background:var(--soon-bg)}
.dw-small-actions{font-size:13px;color:var(--ink-2);margin:6px 0 10px;padding:12px;border:1px solid var(--panel-line);border-radius:var(--r-card);background:var(--tile)}
.dw-small-actions .linkish{background:none;border:0;padding:0;min-height:0;font:inherit;color:var(--ink);text-decoration:underline;cursor:pointer}
.dw-gap{display:block;font-size:12px;color:var(--ink-3);margin-top:2px}
@media(max-width:700px){.dw-facts{grid-template-columns:repeat(2,minmax(0,1fr))}}
.dw-phone{margin:0;font-size:14px;font-weight:600}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* Customers list, 29 Oct call: totals across the top, tighter rows. */
.dw-totals{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:0 0 12px}
.dw-totals>div{padding:8px 12px;border:1px solid var(--panel-line);border-radius:var(--r-card);background:var(--panel)}
.dw-totals strong{display:block;font-size:20px;font-weight:700;line-height:1.2}.dw-totals small{font-size:12px;color:var(--ink-2)}
.dealer-workflow .people-table.dw-compact td,.dealer-workflow .people-table.dw-compact th{padding-top:6px;padding-bottom:6px;font-size:13px}
.dealer-workflow .people-table.dw-compact tr{height:auto}
@media(max-width:700px){.dw-totals{grid-template-columns:repeat(3,minmax(0,1fr))}}
.dw-menu-label{font-size:12px;font-weight:600;color:var(--ink-2);padding:8px 10px 2px}
.menu a.dw-admin-item{display:flex;width:100%;box-sizing:border-box;align-items:center;gap:10px;min-height:36px;padding:0 10px;border-radius:var(--r-nav);font-size:14px;color:inherit;text-decoration:none}.menu a.dw-admin-item:hover{background:var(--surface-2)}

/* Calendar, 29 Oct call */
.dw-daynav{display:flex;gap:6px;align-items:center}.dw-daynav input{width:auto}
.dw-cal-day{background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--r-card);overflow:hidden;margin-bottom:12px}
.dw-cal-event{display:grid;grid-template-columns:88px minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 14px;border-bottom:1px solid var(--hairline);border-left:4px solid var(--hairline)}
.dw-cal-event:last-child{border-bottom:0}
.dw-cal-time strong{display:block;font-size:15px}.dw-cal-time small{color:var(--ink-3);font-size:12px}
.dw-cal-body p{margin:2px 0 0;font-size:13px;color:var(--ink-3)}
.dw-cal-actions{display:flex;gap:6px}
.dw-k-test_drive{border-left-color:#2F6FB3}.dw-k-delivery{border-left-color:#2E7D4F}.dw-k-closing{border-left-color:#B5651D}.dw-k-visit{border-left-color:#6B5BA8}.dw-k-busy{border-left-color:var(--ink-3)}
@media(max-width:700px){.dw-cal-event{grid-template-columns:64px minmax(0,1fr)}.dw-cal-actions{grid-column:1/-1}}

/* Team board, 29 Oct call */
.dw-inline{display:flex;align-items:center;gap:6px;margin:0}.dw-inline span{font-size:13px;color:var(--ink-3)}.dw-inline select{width:auto;min-width:150px}
.dw-board{display:grid;grid-template-columns:repeat(5,minmax(200px,1fr));gap:10px;overflow-x:auto;padding-bottom:8px;margin-bottom:10px}
.dw-col{background:var(--tile);border:1px solid var(--panel-line);border-radius:var(--r-card);padding:8px;min-height:120px}
.dw-col>header{display:flex;align-items:center;justify-content:space-between;padding:2px 4px 8px}.dw-col h2{font-size:14px!important;margin:0}
.dw-card{display:block;background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--r-card);padding:8px 10px;margin-bottom:6px;color:var(--ink);text-decoration:none}
.dw-card:hover{border-color:var(--line-strong);box-shadow:var(--lift)}.dw-card strong{display:block;font-size:14px}.dw-card span{display:block;font-size:13px;margin-top:2px}.dw-card small{display:block;font-size:12px;color:var(--ink-3)}
.dw-col .empty{font-size:13px;color:var(--ink-3);padding:4px}
/* Reports, 29 Oct call: definitions behind an "i", smaller text, columns, no dead space. */
.info{position:relative;display:inline-flex;vertical-align:middle;margin-left:6px}
.info-btn{width:20px;height:20px;min-height:0!important;padding:0;border-radius:var(--r-ctl)!important;border:1px solid var(--ctrl);background:var(--panel);color:var(--ink-2);font:700 12px/1 var(--sans);cursor:pointer}
.info-btn:hover,.info-btn[aria-expanded=true]{background:var(--primary);color:var(--on-primary);border-color:var(--primary)}
.info-btn::before{content:"";position:absolute;inset:-12px}
.info-tip{position:absolute;z-index:30;top:26px;left:-8px;width:min(280px,70vw);padding:8px 10px;border-radius:var(--r-pop);background:var(--ink);color:var(--bg);font:400 13px/1.45 var(--sans);text-transform:none;letter-spacing:0;box-shadow:var(--pop-shadow);white-space:normal}
.dealer-workflow .dw-report .section-title{font-size:16px!important;margin:16px 0 6px}
.dealer-workflow .dw-report .tiles,.dealer-workflow #view .tiles{margin-bottom:10px}
.dealer-workflow #view .tile{padding:10px 12px}.dealer-workflow #view .tile b{font-size:22px;line-height:1.2}
.dealer-workflow .dw-report .table td,.dealer-workflow .dw-report .table th{padding-top:5px;padding-bottom:5px;font-size:13px}
.dw-report-links{margin:0 0 8px;font-size:13px}
@media(min-width:1100px){.dealer-workflow .dw-report .report-cols{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Record action, layout A (29 Oct mock-ups, Jordan's pick): the next step first in an amber band, then what happened. */
.dw-sheet.dw-ra-modal { width: min(780px, calc(100% - 48px)); }
.dw-sheet.dw-ra-modal .dw-editor.dw-ra-editor { padding: 0; }
.dw-ra > * { margin: 0; }
.dw-ra-head { position: sticky; top: 0; z-index: 2; display: flex; align-items: center; gap: 14px; padding: 14px 24px; background: var(--tile); border-bottom: 1px solid var(--panel-line); }
.dw-ra-who { flex: 1; min-width: 0; }
.dealer-workflow .dw-ra-who h2 { margin: 0; font-size: 18px !important; }
.dw-ra-who .sub { margin: 2px 0 0; font-size: 12px; color: var(--ink-2); }
.dw-ra-car { display: flex; align-items: center; gap: 10px; padding: 4px 4px 4px 12px; border: 1px solid var(--panel-line); border-radius: var(--r-ctl); background: var(--panel); font-size: 13px; font-weight: 600; }
.dealer-workflow .dw-ra-car .btn { padding: 5px 11px; font-size: 12px; }
.dealer-workflow .dw-ra-close { width: 34px; height: 34px; padding: 0; display: inline-flex; align-items: center; justify-content: center; }
.dw-ra-close .ico { width: 16px; height: 16px; }
.dw-link { border: 0; background: none; padding: 0; font: inherit; color: inherit; text-decoration: underline; text-underline-offset: 2px; cursor: pointer; min-height: 0 !important; }
.dw-ra-enquiry, .dw-ra-car-pick, .dw-ra-at { padding: 14px 24px 0; }
.dw-ra-car-pick .sub { margin: 0; font-size: 12px; }
.dw-ra-label { margin: 0 0 8px; font-size: 16px; font-weight: 700; letter-spacing: 0; text-transform: none; color: var(--ink); }
.dw-ra-next { padding: 18px 24px 6px; background: var(--need-bg); border-bottom: 1px solid var(--soon-line); }
.dw-ra-happened { padding: 18px 24px 4px; }
.dw-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.dealer-workflow .dw-chip { min-height: 0; padding: 9px 14px; border: 1px solid var(--panel-line); border-radius: var(--r-ctl); background: var(--panel); color: var(--ink-2); font: 600 13px/18px var(--sans); cursor: pointer; transition: background 120ms var(--ease-out), border-color 120ms var(--ease-out); }
.dealer-workflow .dw-chip:hover { background: var(--tile); border-color: var(--line-strong); color: var(--ink); }
.dealer-workflow .dw-chip[aria-pressed=true] { background: var(--primary); border-color: var(--primary); color: var(--on-primary); }
.dealer-workflow .dw-chip:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.dw-ra-next .dw-chips { margin-bottom: 14px; }
.dw-ra-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 12px; }
.dw-ra-row { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.dw-ra-outcomes { display: flex; gap: 8px; }
.dw-ra-divider { width: 1px; background: var(--panel-line); margin: 0 4px; }
.dw-ra-happened textarea { min-height: 70px; resize: vertical; }
.dw-ra .dw-provenance { margin: 0 24px; }
.dw-ra > .err { padding: 0 24px; }
.dealer-workflow .dw-ra > footer { position: sticky; bottom: 0; margin: 0; padding: 10px 24px; background: var(--tile); border-top: 1px solid var(--line-strong); }
.dw-ra > footer > .sub { font-size: 12px !important; color: var(--ink-2); }
@media (max-width: 700px) {
  .dw-sheet.dw-ra-modal { width: 100%; }
  .dw-ra-head { flex-wrap: wrap; padding: 12px 16px; }
  .dw-ra-car { order: 3; flex-basis: 100%; justify-content: space-between; }
  .dw-ra-next, .dw-ra-happened { padding-inline: 16px; }
  .dw-ra-enquiry, .dw-ra-car-pick, .dw-ra-at { padding-inline: 16px; }
  .dw-ra .dw-provenance { margin: 0 16px; }
  .dw-ra-grid { grid-template-columns: 1fr; }
  .dealer-workflow .dw-ra > footer { padding: 12px 16px max(12px, env(safe-area-inset-bottom)); }
}

/* 30 Oct (Jordan): Today rows at half the height. One line per piece of work: what and when, who and the car,
   the last thing said, then the four record icons and the two coming-soon ones in a single row. Long text
   is cut with an ellipsis and shown in full on the customer card. */
.dw-today .dw-box { margin-bottom: 12px; }
.dw-today .dw-box-head { margin-bottom: 4px; }
.dw-today .dw-row { grid-template-columns: 168px minmax(180px, 1fr) minmax(160px, 1.5fr) auto; gap: 12px; min-height: 0; padding: 4px 8px 4px 12px; font-size: 14px; line-height: 20px; }
.dw-today .dw-row > div { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dw-today .dw-row small { display: inline; margin: 0 0 0 6px; font-size: 12px; }
.dw-today .dw-row > div:nth-child(3) { color: var(--ink-2); }
.dw-today .dw-actions { display: flex; align-items: center; gap: 4px; }
.dw-today .dw-icon { width: 30px; height: 30px; }
.dw-today .dw-icon .ico { width: 16px; height: 16px; }
.dw-today .dw-soon { width: 30px; height: 30px; padding: 0; justify-content: center; font-size: 0; gap: 0; }
.dw-today .dw-done { gap: 12px; padding: 5px 12px; font-size: 14px; line-height: 20px; }
.dw-today .dw-done small { display: inline; margin-left: 6px; }
.dw-today .dw-done > * { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dw-today .dw-list > .empty { padding: 10px 12px; font-size: 14px; }
.dw-today .dw-pending .dw-row { border-top: 1px solid var(--panel-line); }
@media (max-width: 700px) {
  .dw-today .dw-row { grid-template-columns: minmax(0, 1fr) auto; gap: 0 8px; padding: 6px 8px 6px 12px; }
  .dw-today .dw-row > div:nth-child(1) { grid-column: 1; grid-row: 2; font-size: 12px; }
  .dw-today .dw-row > div:nth-child(2) { grid-column: 1; grid-row: 1; }
  .dw-today .dw-row > div:nth-child(3) { grid-column: 1 / -1; grid-row: 3; font-size: 13px; }
  .dw-today .dw-row > .dw-actions { grid-column: 2; grid-row: 1 / 3; }
  .dw-today .dw-log { display: flex; }
  .dw-today .dw-icon { width: 44px; height: 44px; }
}

/* 30 Oct: Record action reads top to bottom as it happens. What happened and what came of it, then the
   required next step in the amber band, then where the lead came from as tidy label and value pairs. */
.dw-ra-happened { padding: 18px 24px 8px; }
.dw-ra-next { padding: 16px 24px 4px; border-top: 1px solid var(--soon-line); border-bottom: 1px solid var(--soon-line); }
.dw-ra-next .dw-chips { margin-bottom: 12px; }
.dw-ra-req { margin-left: 6px; padding: 1px 6px; border: 1px solid var(--soon-line); border-radius: var(--r-ctl); background: var(--need-chip); color: var(--need-ink); font-size: 11px; font-weight: 600; letter-spacing: 0; }
.dw-ra-next.dw-ra-missing { box-shadow: inset 4px 0 0 var(--late); }
.dw-ra-next.dw-ra-missing .dw-ra-req { background: var(--warn-tint); border-color: var(--late); color: var(--late); }
.dw-ra .dw-provenance { margin: 12px 24px 0; border: 1px solid var(--panel-line); border-radius: var(--r-ctl); }
.dw-facts { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 4px 16px; margin: 4px 16px 12px; font-size: 13px; }
.dw-facts dt { color: var(--ink-2); font-weight: 600; }
.dw-facts dd { margin: 0; color: var(--ink); overflow-wrap: anywhere; }
.dw-source { margin: 0 16px 12px; padding-top: 10px; border-top: 1px solid var(--panel-line); }
.dw-source .dw-facts { margin: 4px 0 0; }
.dw-source-head { margin: 0; font-size: 13px; color: var(--ink-2); }
.dw-source-head strong { color: var(--ink); margin-right: 6px; }
.dw-ra-car-pick { margin: 12px 24px 0; padding: 12px; border: 1px solid var(--panel-line); border-radius: var(--r-card); background: var(--tile); }
.dw-ra-car-pick .dw-field { margin-bottom: 6px; }
@media (max-width: 700px) {
  .dw-ra-next, .dw-ra-happened { padding-inline: 16px; }
  .dw-ra .dw-provenance, .dw-ra-car-pick { margin-inline: 16px; }
}

/* 30 Oct: the calendar as a picture of the day or week. A gutter of hours, a column per person, bay or day, and each
   booking a coloured block sized to its length. The kind colours: test drive blue, visit green, closing purple,
   delivery amber, meeting grey; another salesperson's booking is "Busy" and hatched. */
:root { --k-test_drive: #2F6FB3; --k-visit: #2E8A57; --k-closing: #7A4FB5; --k-delivery: #C27A0E; --k-meeting: #6B6256; --k-busy: #8D8577; }
/* Day / Week / Month: Daybook's view switch. */
.dw-seg { display: inline-flex; padding: 3px; gap: 0; border-radius: var(--r-track); background: var(--frame-hover); }
.dealer-workflow .dw-seg .btn { min-height: 30px; padding: 5px 9px; border: 0; border-radius: var(--r-nav); background: transparent; color: var(--frame-muted); font: 600 13px/20px var(--sans); box-shadow: none; }
.dealer-workflow .dw-seg .btn:hover { background: var(--frame); color: var(--frame-ink); box-shadow: none; }
.dealer-workflow .dw-seg .btn[aria-pressed=true], .dealer-workflow .dw-seg .btn[aria-pressed=true]:hover { background: var(--primary); color: var(--on-primary); }
.dw-calendar-page .dw-topbar > .btn.primary { margin-left: auto; }
.dw-cal-hint { margin: 0 0 8px; font-size: 13px; }
.dw-cal-wrap { max-height: calc(100dvh - 230px); min-height: 360px; overflow: auto; border: 1px solid var(--panel-line); border-radius: var(--r-card); background: var(--panel); margin-bottom: 16px; }
.dw-cal { display: grid; grid-template-columns: 58px repeat(var(--cols), minmax(150px, 1fr)); grid-template-rows: auto auto; min-width: min-content; }
.dw-cal-v-week { grid-template-columns: 58px repeat(var(--cols), minmax(120px, 1fr)); }
.dw-cal-corner, .dw-cal-colhead { position: sticky; top: 0; z-index: 3; background: var(--tile); border-bottom: 1px solid var(--line-strong); }
.dw-cal-corner { left: 0; z-index: 4; }
.dw-cal-colhead { padding: 8px 10px; border-left: 1px solid var(--panel-line); min-width: 0; }
.dw-cal-colhead strong { display: block; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dw-cal-colhead small { display: block; font-size: 12px; color: var(--ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dw-cal-colhead.is-today strong { color: var(--late); }
.dw-cal-gutter { position: sticky; left: 0; z-index: 2; background: var(--panel); }
.dw-cal-gutter span { position: absolute; right: 8px; transform: translateY(-50%); font-size: 11px; color: var(--ink-2); white-space: nowrap; font-variant-numeric: tabular-nums; }
.dw-cal-gutter span:first-child { transform: none; }
.dw-cal-col { position: relative; border-left: 1px solid var(--panel-line); cursor: cell;
  background-image: repeating-linear-gradient(to bottom, var(--panel-line) 0 1px, transparent 1px 28px), repeating-linear-gradient(to bottom, transparent 0 28px, var(--tile) 28px 56px); }
.dw-cal-col:hover { background-color: color-mix(in srgb, var(--tile) 40%, transparent); }
.dw-cal-col.is-today { background-color: color-mix(in srgb, var(--need-bg) 60%, transparent); }
.dw-cal-now { position: absolute; left: 0; right: 0; z-index: 2; height: 2px; background: var(--late); pointer-events: none; }
.dw-cal-now::before { content: ""; position: absolute; left: -5px; top: -4px; width: 10px; height: 10px; border-radius: 50%; background: var(--late); }
.dw-ev { --k: var(--k-meeting); position: absolute; z-index: 1; display: flex; flex-direction: column; align-items: stretch; gap: 0; min-height: 18px; overflow: hidden; padding: 2px 6px 2px 8px; border: 0; border-left: 3px solid var(--k); border-radius: var(--r-ctl); background: color-mix(in srgb, var(--k) 16%, var(--panel)); color: var(--ink); text-align: left; font: 500 12px/16px var(--sans); cursor: pointer; }
.dw-ev strong { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dw-ev span { color: var(--ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dw-ev:hover { background: color-mix(in srgb, var(--k) 26%, var(--panel)); z-index: 2; }
.dw-ev:focus-visible { outline: 2px solid var(--focus); outline-offset: 1px; z-index: 2; }
.dw-ev.with { background: transparent; border: 1px dashed var(--k); border-left: 3px solid var(--k); }
.dw-ev-test_drive { --k: var(--k-test_drive); } .dw-ev-visit { --k: var(--k-visit); } .dw-ev-closing { --k: var(--k-closing); } .dw-ev-delivery { --k: var(--k-delivery); } .dw-ev-meeting { --k: var(--k-meeting); }
.dw-ev-busy { --k: var(--k-busy); background: repeating-linear-gradient(135deg, var(--tile) 0 6px, var(--panel) 6px 12px); }
.dw-cal-day h2 { margin: 0; padding: 12px 14px; font-size: 15px !important; border-bottom: 1px solid var(--hairline); }
.dw-cal-event.dw-k-test_drive { border-left-color: var(--k-test_drive); } .dw-cal-event.dw-k-visit { border-left-color: var(--k-visit); } .dw-cal-event.dw-k-closing { border-left-color: var(--k-closing); } .dw-cal-event.dw-k-delivery { border-left-color: var(--k-delivery); } .dw-cal-event.dw-k-other { border-left-color: var(--k-meeting); } .dw-cal-event.dw-k-busy { border-left-color: var(--k-busy); }
.dealer-workflow .dw-cal-actions .btn { min-height: 34px; }
/* One booking's details. */
.dw-sheet.dw-ev-modal { width: min(460px, calc(100% - 32px)); padding: 0; }
.dw-ev-card { --k: var(--k-meeting); border-top: 4px solid var(--k); }
.dw-ev-card .dw-facts { margin: 14px 24px; font-size: 14px; gap: 6px 18px; }
.dw-ev-actions { display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; padding: 10px 24px; background: var(--tile); border-top: 1px solid var(--line-strong); }
/* New booking: customer search and the invite list. */
.dw-book-who input[type=search] { width: 100%; }
.dw-pick-list { display: grid; gap: 2px; margin-top: 6px; }
.dw-pick { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 8px 10px; border: 0; border-radius: var(--r-nav); background: transparent; color: var(--ink); text-align: left; cursor: pointer; font: inherit; }
.dw-pick:hover, .dw-pick:focus-visible { background: var(--tile); }
.dw-pick small, .dw-pick-chosen small { color: var(--ink-3); font-size: 12px; }
.dw-pick-chosen { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 8px 8px 8px 12px; border: 1px solid var(--panel-line); border-radius: var(--r-ctl); }
.dw-pick-chosen small { display: block; }
.dw-invite-note { margin: -4px 0 8px; font-size: 13px; }
.dw-invites { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 6px; padding-bottom: 12px; }
.dw-invite { display: flex; align-items: center; gap: 10px; padding: 6px 10px; border: 1px solid var(--panel-line); border-radius: var(--r-ctl); cursor: pointer; font-size: 14px; }
.dw-invite:has(input:checked) { border-color: var(--primary); background: var(--tile); }
.dealer-workflow .dw-invite input { min-height: 0; width: 18px; height: 18px; accent-color: var(--primary); }
.dw-invite small { display: block; font-size: 12px; color: var(--ink-3); }
@media (max-width: 700px) {
  .dw-calendar-page .dw-topbar > .btn.primary { margin-left: 0; }
  .dw-cal { grid-template-columns: 46px repeat(var(--cols), minmax(132px, 1fr)); }
  .dw-cal-v-week { grid-template-columns: 46px repeat(var(--cols), minmax(104px, 1fr)); }
  .dw-cal-wrap { max-height: calc(100dvh - 300px); }
}


.dw-ra-invite { padding-bottom: 6px; }
.dw-ra-invite .dw-invites { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }
.dw-ra > .err { margin: 10px 24px 0; padding: 8px 12px; border-radius: var(--r-ctl); }
.dw-cal-col { background-image: repeating-linear-gradient(to bottom, var(--panel-line) 0 1px, transparent 1px 28px), repeating-linear-gradient(to bottom, transparent 0 28px, color-mix(in srgb, var(--tile) 55%, transparent) 28px 56px); }

/* 31 Oct call, item 1 ("back in two lines again"): on anything wider than a phone the Today header, its strip
   and every row hold ONE line whatever the names, counts or chips. The search box and the score bar give up
   width first, a long piece of text is cut with an ellipsis (shown in full on hover or on the customer card),
   and nothing wraps. A phone keeps its own stacked layout. */
@media (min-width: 701px) {
  .dw-today .dw-topbar { flex-wrap: nowrap; min-width: 0; }
  .dw-today .dw-topbar > * { flex-shrink: 0; }
  .dw-today .dw-topbar > .sub { flex-shrink: 1; min-width: 0; display: flex; white-space: nowrap; }
  .dw-today .dw-topbar > .sub > .dw-date { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
  .dw-today .dw-topbar > .sub > .dw-late-count { flex: none; white-space: pre; }
  .dealer-workflow .dw-today .dw-topbar input[type=search] { flex: 1 20 160px; min-width: 96px; }
  .dw-today .dw-topbar .dw-score { flex-shrink: 1; min-width: 0; grid-template-columns: auto minmax(32px, 120px); }
  .dw-today .dw-topbar .dw-score small { overflow: hidden; text-overflow: ellipsis; }
  .dw-today .dw-strip { flex-wrap: nowrap; min-width: 0; white-space: nowrap; }
  .dw-today .dw-strip > * { flex-shrink: 0; }
  .dw-today .dw-strip > span { flex-shrink: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
  .dw-today .dw-strip:has(.dw-alerts[open]) { flex-wrap: wrap; white-space: normal; }
  .dw-today .dw-row { grid-template-columns: minmax(150px, 224px) minmax(0, 1fr) minmax(0, 1.5fr) auto; }
  .dw-today .dw-row > .dw-when { display: flex; align-items: baseline; gap: 6px; }
  .dw-today .dw-row > .dw-when > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
  .dw-today .dw-row > .dw-when > small { flex: none; margin: 0; font-variant-numeric: tabular-nums; }
  .dw-today .dw-done { grid-template-columns: minmax(80px, 110px) minmax(0, 1fr) minmax(0, 2fr) 44px; }
}

/* 31 Oct call, item 2: Record action's times. When it happened sits on the What happened heading line; the next
   step's When is a day (one tap, or any date) and a quarter-hour time, read back in words beside the heading. */
.dw-ra-labelrow { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.dw-ra-say { font-size: 13px; font-weight: 600; color: var(--ink); text-transform: none; letter-spacing: 0; font-variant-numeric: tabular-nums; white-space: nowrap; }
.dw-ra-label .dw-ra-say { margin-left: 8px; }
.dw-ra-say .dw-link { font-weight: 500; color: var(--ink-2); }
.dw-ra-when { grid-column: 1 / -1; margin-bottom: 12px; }
.dw-ra-when-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.dealer-workflow .dw-ra-when-row input[type=date] { width: auto; min-width: 150px; }
.dealer-workflow .dw-ra-when-row select { width: auto; min-width: 120px; font-variant-numeric: tabular-nums; }
/* Item 1 again, inside the pop-up: a long customer name or car stays on one line, cut with an ellipsis. */
.dealer-workflow .dw-ra-who h2 { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dw-ra-who .sub { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dw-ra-car { min-width: 0; max-width: 55%; }
.dw-ra-car > span { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dw-ra-car > .btn { flex: none; }

/* 31 Oct call, item 3: the vehicle picker, WriteUp's way. New: the model's picture, then the variant, then the car.
   Used: the brand, then the car. A typed stock number or rego finds the car straight away. */
.cp { display: grid; gap: 10px; margin: 8px 0 4px; }
.cp-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cp-tabs { display: inline-flex; gap: 4px; }
.dealer-workflow .cp-tab, .dealer-workflow .cp-chip { display: inline-flex; align-items: center; gap: 6px; min-height: var(--ctl-h); padding: 0 12px; border: 1px solid var(--panel-line); border-radius: var(--r-ctl); background: var(--panel); color: var(--ink-2); font: 500 14px/1 var(--sans); cursor: pointer; }
.dealer-workflow .cp-tab[aria-pressed=true], .dealer-workflow .cp-chip[aria-pressed=true] { background: var(--primary); border-color: var(--primary); color: var(--on-primary); }
.dealer-workflow .cp-tab:disabled { opacity: .45; cursor: default; }
.cp-n { font-size: 12px; font-variant-numeric: tabular-nums; opacity: .7; }
.dealer-workflow .cp-search { flex: 1 1 200px; min-height: var(--ctl-h); }
.cp-step { margin: 0; font-size: 12px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--ink-2); }
.cp-models { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 8px; }
.cp-model { display: grid; justify-items: center; gap: 2px; padding: 8px 8px 10px; border: 1px solid var(--panel-line); border-radius: var(--r-card); background: var(--panel); color: var(--ink); font: inherit; cursor: pointer; text-align: center; }
.cp-model:hover { border-color: var(--line-strong); box-shadow: var(--lift); }
.cp-model:focus-visible, .cp-car:focus-visible, .cp-chip:focus-visible, .cp-tab:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.cp-model img { width: 100%; height: auto; aspect-ratio: 2 / 1; object-fit: contain; }
.cp-nophoto { display: grid; place-items: center; width: 100%; aspect-ratio: 2 / 1; border-radius: var(--r-ctl); background: var(--tile); color: var(--ink-3); font-size: 13px; }
.cp-model strong { font-size: 14px; }
.cp-model small { font-size: 12px; color: var(--ink-2); }
.cp-head { display: flex; align-items: center; gap: 10px; }
.cp-back { border: 0; background: none; padding: 0; font: inherit; font-size: 13px; color: var(--ink-2); cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.cp-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.cp-cars { display: grid; border: 1px solid var(--panel-line); border-radius: var(--r-ctl); overflow: hidden; }
.cp-cars:empty { display: none; }
.cp-car { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 10px 12px; border: 0; border-bottom: 1px solid var(--panel-line); background: var(--surface); color: var(--ink); font: inherit; text-align: left; cursor: pointer; }
.cp-car:last-child { border-bottom: 0; }
.cp-car:hover { background: var(--tile); }
.cp-car strong { font-weight: 600; font-size: 14px; }
.cp-car span { font-size: 12px; color: var(--ink-2); white-space: nowrap; }
.dw-ra-pick-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.dw-ra-pick-head .dw-link { font-size: 13px; color: var(--ink-2); }
.dw-car-editor { padding: 0 !important; }
.dw-car-editor > .cp, .dw-car-describe { padding: 0 24px; }
.dealer-workflow dialog form.dw-car-describe { display: flex; flex-direction: row; align-items: end; gap: 8px; max-height: none; padding-bottom: 20px; border-top: 1px solid var(--panel-line); padding-top: 14px; margin-top: 8px; }
.dw-car-describe .dw-field { flex: 1; margin: 0; }
@media (max-width: 700px) { .dw-car-editor > .cp, .dealer-workflow dialog form.dw-car-describe { padding-inline: 16px; } .dealer-workflow dialog form.dw-car-describe { flex-direction: column; align-items: stretch; } .cp-car { display: grid; gap: 2px; } .cp-car span { white-space: normal; } }

/* 31 Oct call, item 5: the calendar. One bar of controls above the grid; the grid takes the rest of the window (its
   height is set by the page) and the hour height follows the zoom (--hour). Month is a grid of days. */
.dw-cal-bar { gap: 8px 10px; margin-bottom: 8px; }
.dw-calendar-page .dw-cal-bar > .btn.primary { margin-left: auto; }
.dw-cal-wrap { max-height: none; margin-bottom: 8px; }
.dw-cal-hint { margin: 0 0 16px; }
.dealer-workflow .dw-zoom .btn { min-width: 34px; padding: 9px 10px; }
.dw-cal-col { background-image: repeating-linear-gradient(to bottom, var(--panel-line) 0 1px, transparent 1px calc(var(--hour, 56px) / 2)), repeating-linear-gradient(to bottom, transparent 0 calc(var(--hour, 56px) / 2), var(--tile) calc(var(--hour, 56px) / 2) var(--hour, 56px)); }
/* The red line is the time now: one dot at the start of today, and the time in the hour column. */
.dw-cal-col.is-today ~ .dw-cal-col.is-today .dw-cal-now::before { display: none; }
.dw-cal-gutter .dw-cal-nowtag { position: absolute; right: 2px; z-index: 3; transform: translateY(-50%); padding: 1px 5px; border-radius: var(--r-ctl); background: var(--late); color: var(--bg); font: 700 10px/14px var(--sans); white-space: nowrap; font-variant-numeric: tabular-nums; }
.dw-cal { grid-template-columns: 66px repeat(var(--cols), minmax(150px, 1fr)); }
.dw-cal-v-week { grid-template-columns: 66px repeat(var(--cols), minmax(120px, 1fr)); }
/* Zoomed out: a short booking keeps its time and kind on one line. */
.dw-ev.short { flex-direction: row; gap: 6px; padding-block: 0; line-height: 14px; font-size: 11px; }
.dw-ev.short span { flex: 1; min-width: 0; }
.dw-cal-tight .dw-cal-gutter span { font-size: 10px; }
/* Month */
.dw-cal-wrap-month { overflow: auto; }
.dw-month { display: grid; grid-template-columns: repeat(7, minmax(110px, 1fr)); grid-template-rows: auto; grid-auto-rows: minmax(96px, 1fr); min-height: 100%; }
.dw-month-head { position: sticky; top: 0; z-index: 1; padding: 6px 8px; background: var(--tile); border-bottom: 1px solid var(--line-strong); font-size: 12px; font-weight: 700; color: var(--ink); }
.dw-month-day { display: flex; flex-direction: column; gap: 2px; min-width: 0; min-height: 0; overflow: hidden; padding: 4px 6px 6px; border-left: 1px solid var(--panel-line); border-bottom: 1px solid var(--panel-line); cursor: pointer; }
.dw-month-day:nth-child(7n+1) { border-left: 0; }
.dw-month-day.out { background: var(--tile); }
.dw-month-day.out .dw-month-num { color: var(--ink-3); }
.dw-month-day.is-today { background-color: color-mix(in srgb, var(--need-bg) 60%, transparent); }
.dw-month-num { align-self: flex-start; min-width: 26px; height: 26px; padding: 0 6px; border: 0; border-radius: var(--r-ctl); background: none; color: var(--ink); font: 600 13px/26px var(--sans); cursor: pointer; }
.dw-month-day.is-today .dw-month-num { background: var(--late); color: var(--bg); }
.dw-month-num:hover { background: var(--tile); }
.dw-month-ev { --k: var(--k-meeting); display: block; width: 100%; padding: 1px 6px; border: 0; border-left: 3px solid var(--k); border-radius: 4px; background: color-mix(in srgb, var(--k) 16%, var(--panel)); color: var(--ink); font: 500 11px/16px var(--sans); text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; }
.dw-month-ev.with { background: transparent; border: 1px dashed var(--k); border-left: 3px solid var(--k); }
/* Daybook's deliveries (31 Oct call, item 13; lib/daybook.js): Daybook keeps them, so they are hatched and outlined, never
   solid like ours, and open read only. "Dates differ" sits on both when the two products have the car on different days. */
.dw-ev-daybook { --k: var(--k-delivery); background: repeating-linear-gradient(135deg, color-mix(in srgb, var(--k) 16%, var(--panel)) 0 6px, var(--panel) 6px 12px); border: 1px dashed var(--k); border-left: 3px solid var(--k); }
.dw-ev-daybook.delivered { opacity: .75; }
.dw-ev-flag { display: inline-block; align-self: flex-start; padding: 0 6px; border-radius: 2px; background: var(--late); color: var(--bg); font: 600 10px/15px var(--sans); font-style: normal; white-space: nowrap; }
.dw-ev.differs, .dw-month-ev.differs { box-shadow: inset 0 0 0 1px var(--late); }
.dw-month-ev.dw-ev-daybook > span, .dw-month-ev .dw-ev-flag { margin-left: 4px; }
.dw-cal-colhead .dw-cal-untimed { margin-top: 4px; }
.dw-cal-event.dw-k-daybook { border-left: 4px dashed var(--k-delivery); }
.dw-ev-card.dw-ev-daybook { background: none; border: 0; border-top: 4px dashed var(--k); }
.dw-month-more { align-self: flex-start; border: 0; background: none; padding: 0 2px; color: var(--ink-2); font: 600 11px/16px var(--sans); cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
@media (max-width: 700px) {
  .dw-calendar-page .dw-cal-bar > .btn.primary { margin-left: 0; }
  .dw-cal { grid-template-columns: 54px repeat(var(--cols), minmax(132px, 1fr)); }
  .dw-cal-v-week { grid-template-columns: 54px repeat(var(--cols), minmax(104px, 1fr)); }
  .dw-month { grid-template-columns: repeat(7, minmax(44px, 1fr)); grid-auto-rows: minmax(64px, 1fr); }
  /* 31 Oct, item 48: bookings stack as short readable lines, never bars; the cell clips, it never grows past the grid. */
  .dw-month-ev { font-size: 10px; line-height: 14px; padding: 0 3px; }
  .dw-month-ev .dw-ev-flag { display: none; }
}
/* The bar takes the page's top line on a desktop: the Today / Calendar tabs repeat the side menu there, so they give
   their row to the grid. A phone keeps them (it has no side menu). */
@media (min-width: 701px) {
  #view:has(> .dw-calendar-page) > .section-tabs { display: none; }
  .dealer-workflow .dw-cal-bar .dw-daynav input[type=date] { width: 132px; padding-inline: 8px; }
  .dealer-workflow .dw-cal-bar .dw-daynav .btn { padding-inline: 10px; }
  .dealer-workflow .dw-cal-bar h1 { font-size: 22px !important; }
}
.dw-cal-datewrap { position: relative; display: inline-flex; }
.dealer-workflow .dw-cal-datewrap .dw-cal-date { position: absolute; inset: 0; width: 100% !important; min-height: 0 !important; padding: 0 !important; opacity: 0; pointer-events: none; }
.dealer-workflow .dw-cal-datebtn { min-width: 36px; padding: 0 8px; display: inline-flex; align-items: center; justify-content: center; }
.dw-cal-datebtn .ico { width: 16px; height: 16px; }
/* Appointments only (31 Oct call, item 6): nothing in the top bar but the account; hidden items stay hidden. */
body.appointments-only #search, body.appointments-only #walkin-btn, body.appointments-only .department-select { display: none !important; }

/* 31 Oct answers to the 27 Oct review (council-notes/2026-10-31-customers-role-scope-and-lost-confirm.md). */
/* Item 6: Call and Text on the row and the card, one tap; shown on a phone, where they matter most. */
.dw-call { display: inline-flex; align-items: center; gap: 5px; height: 30px; padding: 5px 11px; border: 1px solid var(--panel-line); border-radius: var(--r-ctl); background: var(--panel); color: var(--ink-2); font: 600 12px/1 var(--sans); text-decoration: none; cursor: pointer; }
.dw-call:hover { background: var(--tile); border-color: var(--line-strong); color: var(--ink); text-decoration: none; box-shadow: var(--lift); }
.dw-call .ico { width: 14px; height: 14px; }
.dw-call.muted { color: var(--ink-3); border-style: dashed; cursor: default; }
.dw-call.muted:hover { background: transparent; color: var(--ink-3); border-color: var(--panel-line); box-shadow: none; }
.dw-actions.late .dw-call { border-color: var(--warn-edge); color: var(--late); }
.dw-actions.late .dw-call:hover { background: var(--warn-tint); border-color: var(--late); color: var(--late); }
.dw-card-contact { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.dw-card-contact .dw-phone { margin: 0; }
.dw-card-contact .dw-contact { display: flex; }
.dw-ra .dw-field.dw-optional > span::after { content: " (optional)"; color: var(--ink-3); font-weight: 400; }
/* Item 3: a proposed Lost on the row and the card; the manager's box to decide it. */
.dw-tag { display: inline-block; margin: 4px 0 0; padding: 2px 8px; border-radius: var(--r-ctl); font-size: 12px; font-weight: 600; line-height: 1.4; }
.dw-tag-lost { background: var(--warn-tint); color: var(--late); border: 1px solid var(--warn-edge); }
.dw-lost .dw-box-head .dw-count { background: var(--warn-tint); border-color: var(--warn-edge); color: var(--late); }
.dw-lost .dw-list { border-color: var(--warn-edge); }
.dw-decide { display: flex; gap: 6px; justify-content: flex-end; flex-wrap: wrap; }
.dw-lost-note { border-left: 3px solid var(--late); }
/* Item 1: what the page opened on, in one line under the bar. */
.dw-opens { margin: -4px 0 10px; }
@media (max-width: 700px) {
  .dw-today .dw-contact, .dw-worth .dw-contact { display: flex; gap: 6px; }
  .dw-today .dw-row > .dw-actions { display: grid; gap: 6px; justify-items: end; }
  .dw-call { height: 44px; padding: 0 11px; }
  .dw-lost-row { grid-template-columns: minmax(0,1fr); }
  .dw-lost-row > .dw-decide { grid-column: 1; justify-content: flex-start; }
  /* On a phone the number and the car wrap under the name rather than being cut (the one-line rule is for wider screens). */
  .dw-today .dw-row > div:nth-child(2) { white-space: normal; }
  .dw-today .dw-row > div:nth-child(2) small { display: block; margin: 2px 0 0; }
}
/* 5 Nov (Jordan, phone walk: Today rows squeezed beside the buttons). On a phone each row reads top to bottom
   at full width: who and the car, when it is due, what to do, then one line of buttons, Call and Text first
   and the four record icons after them. */
@media (max-width: 700px) {
  .dw-today .dw-row { grid-template-columns: minmax(0, 1fr); gap: 2px; padding: 10px 12px; }
  .dw-today .dw-row > div:nth-child(2) { grid-column: 1; grid-row: 1; }
  .dw-today .dw-row > div:nth-child(1) { grid-column: 1; grid-row: 2; }
  .dw-today .dw-row > div:nth-child(3) { grid-column: 1; grid-row: 3; }
  .dw-today .dw-row > :nth-child(4) { grid-column: 1; grid-row: 4; margin-top: 6px; }
  .dw-today .dw-row > .dw-actions { display: flex; gap: 6px; justify-content: space-between; }
  .dw-today .dw-actions > .dw-contact { order: -1; flex: 1 1 auto; min-width: 0; }
  .dw-today .dw-contact > .dw-call { flex: 1 1 0; min-width: 0; justify-content: center; }
  .dw-today .dw-log { flex: none; gap: 4px; }
}
/* The narrowest phones keep the words Call and Text and drop their small icons, so the line still fits. */
@media (max-width: 380px) {
  .dw-today .dw-contact > .dw-call { padding: 0 8px; }
  .dw-today .dw-contact > .dw-call .ico { display: none; }
}
/* 5 Nov (Jordan, phone walk: the customer card's boxes sat 4px from the screen edge while the facts were indented
   16px). On a phone every block on the card lines up 16px in, the same gutter as the pages behind it. */
@media (max-width: 700px) {
  .dw-customer-card.dw-full-card { padding-left: 16px; padding-right: 16px; }
  .dw-full-card .dw-facts { margin-left: 0; margin-right: 0; }
}
/* 5 Nov (Jordan, phone walk: the calendar's red "Now 2:34 pm" ran off the left of the 54px time column, and off the
   66px one on a computer too). The tag shows the time alone (dealer-work.js), the red line across the day saying it
   is now. On a phone it starts at the left of the time column and the red dot starts at the edge of the day, so
   "12:45 pm" is never cut or covered either. */
@media (max-width: 700px) {
  .dw-cal-gutter .dw-cal-nowtag { left: 2px; right: auto; padding: 1px 4px; }
  .dw-cal-now::before { left: 0; }
}

/* Item 46: the picked model's picture stays at the top of every later step. Item 49: the bays card in Settings. */
.cp-picked { display: grid; grid-template-columns: 120px minmax(0, 1fr); align-items: center; gap: 12px; margin: 6px 0 2px; }
.cp-picked img { width: 100%; height: auto; aspect-ratio: 2 / 1; object-fit: contain; }
.cp-picked strong { display: block; font-size: 16px; }
.cp-picked small { color: var(--ink-2); font-size: 12px; }
.cp-variants { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); }
.dw-bay-add { display: flex; gap: 8px; align-items: center; margin-top: 10px; }
.dw-bay-add input { flex: 1; min-width: 0; }
.settings-card .dw-decide { gap: 6px; }

/* 2 Nov 2026 walk, items 8 to 11: the Record action pop-up fits one screen; owner said as Owner; one source line with an
   "i" for the rest; the calendar's hint and list share the grid's left edge. Colours stay on the shared tokens. */
.dw-ra-happened { padding: 12px 24px 2px; }
.dw-ra-happened textarea { min-height: 52px; }
.dw-ra-row { margin-bottom: 10px; }
.dw-ra-next { padding: 12px 24px 2px; }
.dw-ra-next .dw-chips { margin-bottom: 10px; }
.dw-ra-label { margin-bottom: 6px; font-size: 15px; }
.dw-ra-when { margin-bottom: 8px; }
.dealer-workflow .dw-ra .dw-chip { padding: 7px 12px; }
.dw-ra-invite { padding-bottom: 2px; }
.dw-ra-who .sub { display: flex; flex-wrap: wrap; align-items: center; gap: 0 4px; white-space: normal; }
.dw-ra-owner { font-weight: 600; color: var(--ink); }
.dealer-workflow .dw-ra-ownerpick { width: auto; min-height: 28px; padding: 2px 8px; font-size: 12px; }
.dw-ra .dw-provenance.dw-prov-line { margin: 8px 24px 0; padding: 0; border: 0; }
.dw-prov-summary { display: flex; align-items: center; gap: 6px; margin: 0; font-size: 13px; color: var(--ink-2); min-height: 32px; }
.dw-prov-summary > span:not(.dw-prov-label) { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.dw-prov-label { font-weight: 600; color: var(--ink); }
.dw-info { flex: none; width: 24px; height: 24px; padding: 0; border: 1px solid var(--ctrl); border-radius: 50%; background: var(--panel); color: var(--ink-2); font: italic 700 13px/1 Georgia, serif; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.dw-info[aria-expanded="true"], .dw-info:hover { background: var(--primary); color: var(--on-primary); border-color: var(--primary); }
.dw-prov-more { margin-top: 6px; border: 1px solid var(--panel-line); border-radius: var(--r-ctl); padding-top: 8px; }
.dw-prov-more > .sub { padding-inline: 16px; margin: 0 0 10px; font-size: 12px; }
@media (max-width: 700px) { .dw-ra .dw-provenance.dw-prov-line { margin-inline: 16px; } .dw-ra-happened, .dw-ra-next { padding-inline: 16px; } }
.dw-cal-hint, .dw-calendar-page > .sub:last-child { padding-inline: 14px; }
.dw-cal-day .empty { margin: 0; padding: 12px 14px; font-size: 13px; color: var(--ink-3); }

/* 5 Nov (Jordan, phone walk, round 2). Today: "Today", the date and what is overdue on the top line; Mine | Team with
   Calendar beside it on the next. On a computer the header stays one row with Calendar at its end. */
.dw-views { display: contents; }
.dw-topbar > .dw-views > .dw-cal-btn { order: 1; }
.dealer-workflow .dw-cal-btn { display: inline-flex; align-items: center; gap: 6px; }
.dw-cal-btn .ico { width: 16px; height: 16px; }
@media (max-width: 700px) {
  .dw-today .dw-views { display: flex; flex-basis: 100%; align-items: center; gap: 8px; }
  .dw-today .dw-views > .dw-scope { margin-left: 0; }
  .dealer-workflow .dw-today .dw-cal-btn { min-height: 36px; padding: 0 12px; }
}
/* Each Today box folds from its heading: the arrow before the title points down when open, right when shut. */
.dealer-workflow .dw-today details.dw-box > summary.dw-box-head { display: flex; align-items: center; gap: 10px; min-height: 36px; margin: 0 0 4px; padding: 0; background: none; font-size: inherit; cursor: pointer; list-style: none; }
.dealer-workflow .dw-today details.dw-box > summary.dw-box-head::-webkit-details-marker { display: none; }
.dealer-workflow .dw-today details.dw-box > summary.dw-box-head::after { order: -1; margin: 0 2px 0 4px; }
.dealer-workflow .dw-today details.dw-box > summary.dw-box-head:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.dealer-workflow .dw-today details.dw-box:not([open]) { margin-bottom: 4px; }
/* Call and Text are greyed until calling and texting run through Customers (dealer-work.js CALL_TEXT_ON). */
.dw-contact.dw-contact-off .dw-call.muted, .dw-actions.late .dw-contact.dw-contact-off .dw-call.muted, .dw-actions.late .dw-contact.dw-contact-off .dw-call.muted:hover, .dw-contact.dw-contact-off .dw-call.muted:hover { background: var(--disabled-bg); border: 1px solid var(--panel-line); color: var(--line-strong); cursor: not-allowed; box-shadow: none; }

/* Record action: everything lines up on the left. On a phone the outcome (Spoke, No answer, Voicemail) starts its own line
   under Called, with no divider; the car sits on its own line under the name; the From line has no extra indent. */
.dw-ra .dw-prov-line .dw-prov-summary { padding-left: 0; }
@media (max-width: 700px) {
  .dw-ra-outcomes { flex-basis: 100%; }
  .dw-ra-outcomes > .dw-ra-divider { display: none; }
  .dw-ra-head .dw-ra-car { max-width: none; }
}
/* The next step is Silver Ledger's silver-blue (the switch track), not the beige "needs attention" colour; the same on the
   customer card, where it is bolder so the action stands out. */
.dw-ra-next { background: var(--frame-hover); border-top-color: var(--frame-line); border-bottom-color: var(--frame-line); }
.dw-ra-req { background: var(--panel); border-color: var(--frame-line); color: var(--frame-muted); }
.dw-next { background: var(--frame-hover); border-color: var(--frame-line); }
.dw-next > span { font-size: 15px; font-weight: 700; color: var(--ink); }

/* Customer card: the number, Call and Text and the owner line at the top with the name; the car a small line under them. */
.dw-heading .dw-small-actions { margin: 6px 0 0; padding: 0; border: 0; background: none; }
.dw-full-card .dw-car { padding: 6px 6px 6px 12px; margin-bottom: 12px; }
.dw-full-card .dw-car > div { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 8px; min-width: 0; }
.dw-full-card .dw-car small { display: inline; }
.dw-full-card .dw-car strong { display: inline; font-size: 14px; }
.dealer-workflow .dw-car-edit { flex: none; width: 36px; height: 36px; min-height: 36px; padding: 0; display: inline-flex; align-items: center; justify-content: center; }
.dw-car-edit .ico { width: 16px; height: 16px; }

/* 5 Nov (Jordan picked B and D from the badge options). B, the ledger tag: the small flags ("Feeds need checking",
   "n need a department") are square outlined tags in small capitals, and every count is a solid square block, navy,
   or red where it is overdue or a Lost? to decide. D: on an overdue row only the due line is red; its buttons look
   like every other button. */
.dw-flag { padding: 3px 7px; border: 1px solid var(--ink); border-radius: 2px; background: transparent; color: var(--ink); font: 700 11px/14px var(--sans); letter-spacing: .08em; text-transform: uppercase; text-decoration: none; }
.dw-flag:hover { background: var(--ink); border-color: var(--ink); color: var(--panel); }
.dw-count { min-width: 26px; height: 20px; padding: 0 6px; border: 0; border-radius: 2px; background: var(--primary); color: var(--on-primary); font: 700 12px/1 var(--sans); font-variant-numeric: tabular-nums; }
.dw-overdue .dw-box-head .dw-count, .dw-lost .dw-box-head .dw-count { background: var(--late); border: 0; color: var(--panel); }
.dw-actions.late .dw-icon, .dw-actions.late .dw-call { border-color: var(--panel-line); color: var(--ink-2); }
.dw-actions.late .dw-icon:hover, .dw-actions.late .dw-call:hover { background: var(--tile); border-color: var(--line-strong); color: var(--ink); }

/* Phone audit 6 Nov 2026, P1-5 to P1-7: tap targets on a phone. Nothing moves and nothing looks different: each control
   gets an unseen area that takes the tap, 44px tall (the canon), as .info-btn has had since 29 Oct. The area is 44px tall and
   centred on the control, whatever the control's own height.
   Today's customer names were 17px tall. Their cell cuts long names off with an ellipsis, which would cut the unseen area
   off too, so on a phone it clips sideways only (overflow-x: clip; a browser too old for it keeps the old hidden). The
   area reaches down over the row's own words, not up towards the row above. Completed today's names sit between their
   time and their note, so theirs is centred.
   Mine and Team were 30px, the flags ("8 need a department") 22px, the Record action choices 34px. Where the choices
   wrap onto a second line the two lines were 8px apart, so their 44px areas overlapped and the upper line got 41 to 42px.
   Mark, 11 Nov 2026: 4px more between the lines on a phone (12px), so every choice gets its full 44. That is two
   places: a group of choices that wraps (.dw-chips), and the outcome line (Spoke, No answer, Voicemail) that sits under
   Called on a phone (.dw-ra-row). Side by side they stay 8px apart, and the choices themselves are the size they were.
   The Calendar's New booking form is a .dw-ra too: its Type choices wrap on a phone, carry the same 44px areas and had
   the same 42px overlap, so it gets the same 12px on purpose. */
@media (max-width: 700px) {
  .dw-today .dw-row > div:nth-child(2), .dw-today .dw-done > div:nth-of-type(1) { overflow-x: clip; overflow-y: visible; }
  .dw-today .dw-row a[data-nav], .dw-today .dw-done a[data-nav] { position: relative; }
  .dw-today .dw-row a[data-nav]::after { content: ""; position: absolute; left: 0; right: 0; top: -6px; height: 44px; }
  .dw-today .dw-done a[data-nav]::after { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 44px; transform: translateY(-50%); }
  .dw-scope button[aria-pressed], .dw-flag, .dealer-workflow .dw-ra .dw-chip { position: relative; }
  .dw-scope button[aria-pressed]::after, .dw-flag::after, .dealer-workflow .dw-ra .dw-chip::after { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 44px; transform: translateY(-50%); }
  .dealer-workflow .dw-ra .dw-chips, .dealer-workflow .dw-ra .dw-ra-row { row-gap: 12px; }
}
