/* The saved DieselService prototype's visual language, applied to live forms.
   Screen-only rules preserve the existing issued-invoice print stylesheet. */
@media screen {
  :root { --bg:#10161d;--panel:#18222d;--panel-alt:#1d2a37;--border:#2a3745;--text:#e7edf4;--muted:#99aabe;--accent:#9bc3fb;--accent-text:#101c2c;--link:#89b4f4;--danger:#f28c92;--ok:#65d3a5;--font-display:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color-scheme:dark }
  body { font-family:var(--font-display);font-size:14px;line-height:1.5;padding-bottom:0 }
  button,input,select,textarea { font-family:inherit }
  button { font-weight:550;text-transform:none;letter-spacing:0;font-size:13px;min-height:39px;border-radius:7px }
  button:hover:not(:disabled) { filter:brightness(1.13) }
  button.small { font-size:12px;min-height:32px }
  button.danger,.banner { background:#552d35;color:#ffe3e5;border-color:#864650 }
  h1,h2,h3 { text-transform:none;letter-spacing:-.4px;font-weight:650 }
  input,select,textarea { background:#111a24;border-color:#3a4b5d;border-radius:7px;min-height:42px;font-size:14px }
  input[type=checkbox] { min-height:18px;width:18px;accent-color:var(--accent);vertical-align:middle }
  input:focus,select:focus,textarea:focus,button:focus-visible,a:focus-visible { outline:2px solid var(--accent);outline-offset:3px }
  label { font-size:12px;font-weight:500;text-transform:none;letter-spacing:0;color:#bac8d8;margin-top:14px }
  .hint { font-size:12px }
  .eyebrow { font-size:12px;color:var(--muted);letter-spacing:.08em;font-weight:600 }
  .panel { border-radius:12px;padding:20px;margin-bottom:18px;min-width:0 }
  .row { gap:12px }
  .empty { font-size:13px;padding:30px 12px }
  .badge { font-size:11px;font-weight:550;text-transform:none;letter-spacing:0;border-radius:5px }
  .badge.paid { background:#65d3a51c;color:#65d3a5 }
  .badge.unpaid,.badge.low { background:#f28c921c;color:#f28c92 }
  .badge.fleet { background:#89b4f420;color:#b5d1f8 }
  .list-item { padding:14px 8px;gap:12px }
  .list-item .meta { font-size:12px;overflow-wrap:anywhere }
  th { background:#141e28;color:#99adc3;text-transform:uppercase;font-size:11px }
  th,td { padding:11px 9px }
  td { font-size:13px }
  .modal-bg { padding:5vh 16px;z-index:100 }
  .modal { border-radius:12px;padding:24px;max-width:760px;overflow-wrap:anywhere }
  #sidebar { position:fixed;inset:0 auto 0 0;width:224px;background:#121b24;border-right:1px solid var(--border);z-index:60;display:flex;flex-direction:column }
  .workspace-brand { display:flex;align-items:center;gap:9px;padding:22px 16px;color:var(--text);font-size:17px;font-weight:700;letter-spacing:-.6px;white-space:nowrap }
  .workspace-brand em { color:var(--accent);font-style:normal }
  .workspace-logo { display:grid;place-items:center;width:31px;height:34px;background:var(--accent);border-radius:7px;color:#14202c;font-size:13px;letter-spacing:-1px }
  .shop-switcher { margin:0 12px 12px;padding:12px;border:1px solid var(--border);border-radius:8px;background:#18232e }
  .shop-switcher label { margin:0 0 6px;text-transform:uppercase;font-size:10px;letter-spacing:.1em;color:var(--muted) }
  #shopSelect { padding:8px;font-size:12px;min-height:38px }
  #shopNav { position:static;display:flex;flex-direction:column;overflow-y:auto;flex:1;padding:0 11px 18px;border:0;background:transparent }
  .nav-group { margin:18px 11px 8px;color:#7e92a9;font-size:10px;font-weight:650;text-transform:uppercase;letter-spacing:.13em }
  .tabbtn { display:flex;align-items:center;gap:11px;flex:0 0 auto;width:100%;padding:10px 11px;text-align:left;border:0;border-radius:7px;font-size:13px;min-height:40px;color:#a6b5c6;text-transform:none;font-weight:500;letter-spacing:0;margin:2px 0 }
  .tabbtn.active { color:#b5d1f8;background:#89b4f416;box-shadow:inset 2px 0 var(--link) }
  .nav-icon { display:inline-grid;place-items:center;width:18px;font-family:var(--font-data);font-size:16px;color:var(--link) }
  .sidebar-footer { padding:14px;border-top:1px solid var(--border) }
  #whoami { overflow-wrap:anywhere;color:var(--muted);font-size:11px;margin-bottom:9px }
  .sidebar-actions { display:flex;gap:7px;flex-wrap:wrap }
  #workspaceShell { margin-left:224px;min-width:0 }
  .workspace-topbar { display:flex;align-items:center;gap:16px;position:sticky;top:0;z-index:45;background:#10161df5;backdrop-filter:blur(12px);border-bottom:1px solid var(--border);padding:16px 28px;min-height:74px }
  .workspace-search { flex:1;position:relative;max-width:650px;display:flex;gap:8px }
  .workspace-search input { background:var(--panel);border-color:var(--border);font-size:13px }
  .workspace-search button { flex:0 0 auto }
  .search-popover { position:absolute;left:0;right:0;top:50px;max-height:65vh;overflow-y:auto;padding:8px;background:#202c39;border:1px solid #43576d;border-radius:10px;box-shadow:0 16px 40px #0008 }
  .record-button { display:flex;align-items:center;gap:12px;text-align:left;width:100%;padding:12px;border:0;background:transparent;letter-spacing:0;white-space:normal;border-radius:6px }
  .record-button:hover { background:#2b3c4e }
  .record-button strong { display:block;font-weight:550 }
  .record-button small { display:block;color:var(--muted);font-size:12px;font-weight:400;margin-top:3px;overflow-wrap:anywhere }
  .record-kind { color:var(--link);font-size:11px;min-width:53px;text-transform:capitalize }
  .record-amount { margin-left:auto;text-align:right;white-space:nowrap }
  .workspace-topbar .shop-context { margin-left:auto;text-align:right;min-width:0 }
  #shopNameHdr { font-size:13px;color:var(--text);letter-spacing:0;margin:0 }
  #shopSubHdr { font-size:11px;color:var(--muted);max-width:290px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis }
  #shopMain { max-width:1500px;margin:0 auto;padding:28px }
  #shopGate { margin:24px auto !important }
  .workspace-page-heading { display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:24px }
  .workspace-page-heading h1 { font-size:28px;line-height:1.3;margin:0 }
  .workspace-page-heading p { margin:7px 0 0;color:var(--muted);font-size:13px }
  .heading-actions { display:flex;gap:8px;flex-wrap:wrap }
  .metrics-grid { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:22px }
  .workspace-metric { background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:19px 20px;min-width:0 }
  .workspace-metric .metric-label { color:#aab8c8;font-size:13px }
  .workspace-metric strong { display:block;font-size:28px;font-weight:600;letter-spacing:-.8px;line-height:1.3;margin:10px 0 7px;overflow-wrap:anywhere }
  .workspace-metric small { display:block;color:var(--muted);font-size:12px }
  .dashboard-grid { display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:18px;align-items:start }
  .dashboard-grid .panel { padding:0;overflow:hidden }
  .panel-heading { display:flex;justify-content:space-between;align-items:center;gap:12px;padding:18px 20px;border-bottom:1px solid var(--border) }
  .panel-heading h2 { margin:0;font-size:16px }
  .panel-body { padding:8px 12px }
  .dashboard-lookup { padding:20px !important;background:linear-gradient(110deg,#1b2c3b,#17212d);border-color:#384b5f }
  .dashboard-lookup h2 { margin:0 0 8px;font-size:17px }
  .dashboard-lookup p { color:var(--muted);font-size:13px;margin:0 0 14px }
  .dashboard-lookup button { width:100% }
  .workspace-toolbar { display:flex;gap:12px;align-items:center;margin-bottom:16px }
  .workspace-toolbar input { flex:1 }
  .workspace-pagination { display:flex;justify-content:space-between;align-items:center;gap:12px;padding-top:12px }
  #workspaceStatus:empty { display:none }
  #workspaceStatus { margin:0 28px;padding:12px;color:var(--danger) }
  #navScrim,#menuToggle { display:none }
  .skip-link { position:fixed;left:12px;top:-80px;z-index:200;background:var(--accent);color:var(--accent-text);padding:12px;border-radius:6px }
  .skip-link:focus { top:12px }
  #authScreen .brand h1 { color:var(--accent);letter-spacing:-.7px;text-transform:none }
  #authScreen .brand .sub { font-size:13px }
  #tab-invoice { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 20px;align-items:start }
  #tab-invoice .invoice-lines { grid-column:1 / -1 }
  .lineitem-grid { grid-template-columns:minmax(120px,1fr) 76px 105px 105px 32px;gap:8px }
  .lineitem-grid input { font-size:14px }
  .totals { max-width:460px;margin-left:auto }
  .totals .grand { font-size:24px }
  @media(min-width:1150px) { #tab-settings,#tab-parts { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 20px;align-items:start } #teamPanel { grid-column:1 / -1 } }
  @media(max-width:1100px) { .workspace-topbar .shop-context { display:none } .metrics-grid { grid-template-columns:repeat(2,minmax(0,1fr)) } .dashboard-grid { grid-template-columns:1fr } #tab-invoice { grid-template-columns:1fr } }
  @media(max-width:760px) {
    #sidebar { transform:translateX(-100%);transition:transform .18s ease;visibility:hidden }
    #app.nav-open #sidebar { transform:none;visibility:visible }
    #app.nav-open #navScrim { display:block;position:fixed;inset:0;background:#0009;border:0;border-radius:0;z-index:59 }
    #menuToggle { display:block;font-size:18px;min-width:40px }
    #workspaceShell { margin-left:0 }
    .workspace-topbar { padding:12px 16px;gap:10px }
    #shopMain { padding:22px 16px }
    .workspace-page-heading { flex-wrap:wrap }
    .workspace-page-heading h1 { font-size:25px }
    .metrics-grid { gap:10px }
    .workspace-metric { padding:16px 13px }
    .workspace-metric strong { font-size:24px }
    .panel { padding:16px }
    .lineitem-grid { grid-template-columns:minmax(80px,1fr) 48px 64px 68px 26px;gap:4px }
    .lineitem-grid input { font-size:12px;padding:7px 4px;min-width:0 }
    .record-button { padding:11px 6px;gap:8px }
    .record-kind { min-width:45px;font-size:10px }
    .workspace-toolbar { flex-wrap:wrap }
    .modal { padding:16px;overflow-x:auto }
  }
  @media(prefers-reduced-motion:reduce) { *,*::before,*::after { transition:none !important;scroll-behavior:auto !important } }
}

/* Work-order queue and service record */
.wo-toolbar{display:flex;gap:10px;align-items:center;margin-bottom:16px}.wo-toolbar input{flex:1;min-width:160px}.wo-toolbar select{width:auto;min-width:150px}.wo-layout{display:grid;grid-template-columns:minmax(280px,.85fr) minmax(380px,1.4fr);gap:18px;align-items:start}.wo-layout .panel{margin-top:0;min-width:0}.wo-list-row{display:flex;flex-direction:column;width:100%;gap:7px;text-align:left;padding:15px;margin-bottom:8px;background:var(--panel-alt);white-space:normal;font-size:14px}.wo-list-row .between{display:flex;justify-content:space-between;gap:8px;width:100%}.wo-list-row span{overflow-wrap:anywhere}.wo-complaint{color:var(--muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.wo-urgent{color:#fbbf24}.wo-copy{white-space:pre-wrap;overflow-wrap:anywhere}.wo-pages{align-items:center;justify-content:space-between;margin-top:12px}.wo-pages .hint{flex:1;text-align:center}.wo-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}.wo-event{display:flex;flex-direction:column;gap:5px;border-top:1px solid var(--border);padding:12px 0}.wo-layout label{font-size:14px}.wo-layout input,.wo-layout textarea,.wo-layout select{font-size:16px}.wo-layout h3{margin-top:22px}.wo-layout #woSave{margin-top:16px}.wo-layout #woSaveStatus,.wo-toolbar+#woStatus{margin:10px 0}
@media(max-width:1100px){.wo-layout{grid-template-columns:1fr}.wo-toolbar{flex-wrap:wrap}.wo-toolbar input{width:100%}.wo-fields{grid-template-columns:1fr}}

.wo-intake{padding:16px;margin-bottom:20px;border:1px solid var(--border);border-radius:10px;background:var(--panel)}
