/* Quality-of-life pack (pipeline item #52). Tokens only: every colour, size and space here is a
   --ds- token from design-system.css (docs/design-system.md rules 1 and 6). This sheet restyles no
   shared screen; it only styles the pieces the pack adds. Loaded just before design-system.css. */

/* I14: the Undo toast with its countdown */
.qol-undo-stack{position:fixed;z-index:10060;left:50%;bottom:var(--ds-space-5);transform:translateX(-50%);display:grid;gap:var(--ds-space-2);width:min(520px,calc(100vw - var(--ds-space-5)))}
.qol-undo-toast{display:flex;align-items:center;gap:var(--ds-space-3);padding:var(--ds-space-2) var(--ds-space-3);border-radius:var(--ds-radius);background:var(--ds-ink);color:var(--ds-white);box-shadow:var(--ds-shadow);font:600 var(--ds-text-sm) var(--ds-font-body)}
.qol-undo-toast span:first-child{flex:1}
.qol-undo-count{min-width:3ch;color:var(--ds-nav-text);font-variant-numeric:tabular-nums}

/* I4: the shortcut help list */
.qol-shortcut-list{display:grid;gap:var(--ds-space-2);margin:0}
.qol-shortcut-list div{display:grid;grid-template-columns:96px 1fr;gap:var(--ds-space-3);align-items:center}
.qol-shortcut-list dd{margin:0;color:var(--ds-ink)}
.qol-shortcut-list kbd{display:inline-block;min-width:2.2em;padding:2px var(--ds-space-2);border:1px solid var(--ds-line-strong);border-bottom-width:2px;border-radius:var(--ds-radius-sm);background:var(--ds-surface);color:var(--ds-ink);font:700 var(--ds-text-sm) var(--ds-font-body);text-align:center}

/* I1: keyboard focus inside the search results */
.global-search-results [data-search-type].qol-search-active{outline:0;box-shadow:var(--ds-focus);background:var(--ds-primary-soft)}

/* I2: the duplicate customer notice */
.qol-duplicate-note{display:grid;gap:var(--ds-space-2);margin:var(--ds-space-2) 0;padding:var(--ds-space-3);border:1px solid var(--ds-warning-line);border-radius:var(--ds-radius-sm);background:var(--ds-warning-wash);color:var(--ds-warning-ink)}
.qol-duplicate-note strong{color:var(--ds-warning-strong)}
.qol-duplicate-note ul{display:grid;gap:var(--ds-space-2);margin:0;padding:0;list-style:none}
.qol-duplicate-note li{display:flex;flex-wrap:wrap;align-items:center;gap:var(--ds-space-2);justify-content:space-between}
.qol-duplicate-note .qol-duplicate-actions{display:flex;flex-wrap:wrap;gap:var(--ds-space-2)}

/* I3: Book again next to a past booking */
.qol-book-again-row{display:flex;justify-content:flex-end;margin-top:calc(var(--ds-space-1) * -1)}

/* I5 and I7: the diary */
.qol-move-summary{display:grid;gap:var(--ds-space-2);margin:0}
.qol-move-summary div{display:grid;grid-template-columns:120px 1fr;gap:var(--ds-space-3)}
.qol-move-summary dt{color:var(--ds-text-muted);font-weight:700}
.qol-move-summary dd{margin:0;color:var(--ds-ink)}
.calendar-job.qol-clash{border-color:var(--ds-warning);background:var(--ds-warning-wash);box-shadow:inset 4px 0 0 var(--ds-warning)}
.qol-clash-label{display:block;margin-top:var(--ds-space-1);color:var(--ds-warning-strong);font:700 var(--ds-text-xs) var(--ds-font-body);white-space:normal}

/* I9: touch targets on the technician and VHC screens; --ds-touch becomes 56px in glove mode */
#technician-view button,#technician-view select,#technician-view input:not([type="checkbox"]):not([type="radio"]),#technician-view textarea,
#job-guide-dialog button,#job-guide-dialog select,#job-guide-dialog input:not([type="checkbox"]):not([type="radio"]),#job-guide-dialog textarea{min-height:var(--ds-touch)}
#technician-view input[type="checkbox"],#technician-view input[type="radio"],#job-guide-dialog input[type="checkbox"],#job-guide-dialog input[type="radio"]{min-width:calc(var(--ds-touch) / 2);min-height:calc(var(--ds-touch) / 2)}
.qol-glove-toggle{display:none}
body[data-qol-view="technician"] .qol-glove-toggle,body[data-qol-view="workshop"] .qol-glove-toggle,body[data-qol-view="booking-record"] .qol-glove-toggle{display:inline-flex}
.qol-glove-toggle[aria-pressed="true"]{border-color:var(--ds-ink);background:var(--ds-ink);color:var(--ds-white)}
:root[data-bms-contrast="high"] #technician-view,:root[data-bms-contrast="high"] #job-guide-dialog{color:var(--ds-ink-strong)}
:root[data-bms-contrast="high"] #technician-view button,:root[data-bms-contrast="high"] #job-guide-dialog button{border-width:2px;font-weight:800}

/* I10: the unsent-changes count stays readable on narrow screens */
@media (max-width:760px){
 #bms-sync-indicator[data-state="pending"] span:last-child,#bms-sync-indicator[data-state="offline"] span:last-child,#bms-sync-indicator[data-state="degraded"] span:last-child{font-size:var(--ds-text-xs)}
 #bms-sync-indicator[data-state="pending"] span:last-child:after,#bms-sync-indicator[data-state="offline"] span:last-child:after,#bms-sync-indicator[data-state="degraded"] span:last-child:after{content:none}
}
@media (max-width:1180px){
 body[data-qol-view="technician"] #bms-sync-indicator{display:inline-flex;min-height:var(--ds-touch)}
}

/* I11: courtesy car out against back */
.qol-courtesy-returns{display:grid;gap:var(--ds-space-3)}
.qol-courtesy-compare{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--ds-space-3)}
.qol-courtesy-compare section{display:grid;gap:var(--ds-space-2);padding:var(--ds-space-3);border:1px solid var(--ds-line);border-radius:var(--ds-radius-sm);background:var(--ds-surface)}
.qol-courtesy-compare h4{margin:0;color:var(--ds-ink);font:800 var(--ds-text-sm) var(--ds-font-heading)}
.qol-courtesy-photos{display:flex;flex-wrap:wrap;gap:var(--ds-space-2)}
.qol-courtesy-photos img{width:96px;height:72px;object-fit:cover;border-radius:var(--ds-radius-sm);border:1px solid var(--ds-line)}
.qol-courtesy-summary{color:var(--ds-ink-soft);font-weight:700}
@media (max-width:760px){.qol-courtesy-compare{grid-template-columns:1fr}}

/* I12 and I13: the finance strip */
.qol-finance-strip{display:grid;gap:var(--ds-space-4);margin-bottom:var(--ds-space-4)}
.qol-sage-counter{display:flex;flex-wrap:wrap;align-items:center;gap:var(--ds-space-3);text-align:left;cursor:pointer}
.qol-sage-counter strong{font:800 var(--ds-text-lg) var(--ds-font-heading);color:var(--ds-ink)}
.qol-overdue-days{font-variant-numeric:tabular-nums;font-weight:800;color:var(--ds-danger-strong)}
.qol-overdue-note{color:var(--ds-text-muted);font-size:var(--ds-text-xs)}

/* I15: What's new */
.qol-whats-new-list{display:grid;gap:var(--ds-space-2);margin:0;padding-left:var(--ds-space-4);color:var(--ds-ink)}
/* #63: the version and date line, the line for staff, the history of every update, and the side-menu link */
.qol-whats-new-version{margin:var(--ds-space-1) 0 0;color:var(--ds-text-muted);font-size:var(--ds-text-sm)}
.qol-whats-new-staff{margin:var(--ds-space-3) 0 0;color:var(--ds-ink-soft);font-size:var(--ds-text-sm);font-weight:700}
.qol-whats-new-history{display:grid;gap:var(--ds-space-4);max-height:60vh;margin:0;padding:0;overflow-y:auto;list-style:none}
.qol-whats-new-history>li{display:grid;gap:var(--ds-space-1);padding-bottom:var(--ds-space-4);border-bottom:1px solid var(--ds-line)}
.qol-whats-new-history>li:last-child{padding-bottom:0;border-bottom:0}
.qol-whats-new-history h3{margin:0;color:var(--ds-ink);font-size:var(--ds-text-md)}
/* Two classes: this sheet loads before design-system.css, whose .ds-btn-link would otherwise win. */
.ds-btn.qol-whats-new-history-link{min-height:var(--ds-touch);padding:0;justify-content:flex-start;color:var(--ds-nav-heading);font-size:var(--ds-text-xs)}