/* Device appearance and record surfaces. Invoice paper remains white for printing. */
.theme-choice{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:10px 0;font-size:11px;font-weight:650;color:var(--muted)}
.theme-choice select{padding:7px 9px;border:1px solid var(--border);border-radius:8px;background:var(--panel);color:var(--ink);min-height:40px;max-width:140px;font-size:12px}
.dense-table tbody .job-row>td{border-top:5px solid var(--panel);border-bottom:1px solid #b9cce7}
.dense-table tbody .job-row>td:first-child{box-shadow:inset 5px 0 #8eafd9}
.dense-table tbody .job-row.row-band{background:#eaf1fb}
.dense-table tbody .job-row:hover,.dense-table tbody .job-row:focus-within{background:#dceaff}
.dense-table tbody .job-row:hover>td:first-child,.dense-table tbody .job-row:focus-within>td:first-child{box-shadow:inset 5px 0 #376bd0}
.dense-table tbody .job-row>td:first-child strong{display:inline-block;padding:4px 7px;border-radius:6px;background:#e1ebfc;color:#214b95;font-weight:800}
html[data-theme="dark"] body{color-scheme:dark;--bg:#0c1422;--panel:#141f30;--ink:#e6eefb;--muted:#a7b7cf;--border:#33435a;--accent:#9cbaff;--soft:#233452;--shadow:0 4px 18px #0003;background:var(--bg);color:var(--ink)}
html[data-theme="dark"] :is(.authscreen,.main){background:#0c1422}
html[data-theme="dark"] :is(.sidebar,.topbar,.panel,.modal,.column,.deal,.stat,.authcard,.billing-modal-header){background:var(--panel);border-color:var(--border);color:var(--ink)}
html[data-theme="dark"] :is(.nav button,.control-caption,.field-caption,.spec-label,.status-guidance,.activity-time,.booking-field-hint,.brand-product strong,.portal-location>strong,.form-layout label,.authcard label,.intake-field>span,.billing-field,.billing-list-toolbar label,.coltitle){color:var(--muted)}
html[data-theme="dark"] :is(.portal-organisation,.brand-organisation,.topbar b,.compact-kpi .kpi-value,.compact-kpi .kpi-label,.inline-detail-title,.booking-preset-field label){color:var(--ink)}
html[data-theme="dark"] .brand-it{color:#9abaff}
html[data-theme="dark"] .company-logo{background:#fff;border-radius:6px;padding:3px}
html[data-theme="dark"] :is(.nav button.active,.nav button:hover:not(.active)){background:#243956;color:#c7d9ff}
html[data-theme="dark"] :is(.btn,.small-btn,.cro-actions .cro-action,.sidebar-signout,.booking-pick,.compact-kpi,.compact-kpi .kpi-affordance,.avatar,.portal-badge){background:#1c2c43;border-color:#405571;color:#d4e2fa;box-shadow:none}
html[data-theme="dark"] :is(.btn:hover,.small-btn:hover,.cro-actions .cro-action:hover,.booking-pick:hover,.compact-kpi:hover){background:#2c4261;border-color:#7195ca;color:#f1f6ff}
html[data-theme="dark"] :is(.btn.primary,.cro-actions .cro-action-primary,.compact-kpi[aria-pressed="true"] .kpi-affordance){background:#3868d8;border-color:#7197ed;color:#fff}
html[data-theme="dark"] .compact-kpi[aria-pressed="true"]{background:#253e64;border-color:#88aaff;box-shadow:inset 3px 0 #8dafff}
html[data-theme="dark"] :is(.compact-kpi[aria-pressed="true"] .kpi-label,.compact-kpi[aria-pressed="true"] .kpi-value){color:#e6efff}
html[data-theme="dark"] :is(input:not([type="checkbox"]):not([type="radio"]),textarea,select,#billingModal .field){background:#101c2c;color:#e5eefc;border-color:#465c78}
html[data-theme="dark"] ::placeholder{color:#8fa3bf;opacity:1}
html[data-theme="dark"] input:-webkit-autofill{-webkit-text-fill-color:#e5eefc;-webkit-box-shadow:0 0 0 1000px #1b2e49 inset}
html[data-theme="dark"] :is(.table th,.dense-table thead th,.billing-lines th){background:#1d2c42;color:#b8cef0;border-color:#3c506d}
html[data-theme="dark"] :is(.table td,.table th,.intake-section-title,.activity-cell,.latest-note,.cro-actions,.inline-job-detail){border-color:var(--border)}
html[data-theme="dark"] .dense-table tbody .job-row{background:#142236}
html[data-theme="dark"] .dense-table tbody .job-row.row-band{background:#1d3049}
html[data-theme="dark"] .dense-table tbody .job-row>td{border-top-color:#0d1727;border-bottom-color:#425a79}
html[data-theme="dark"] .dense-table tbody .job-row:hover,html[data-theme="dark"] .dense-table tbody .job-row:focus-within,html[data-theme="dark"] .dense-table tbody .job-row.is-expanded{background:#294b73}
html[data-theme="dark"] .dense-table tbody .job-row>td:first-child{box-shadow:inset 5px 0 #668fcb}
html[data-theme="dark"] .dense-table tbody .job-row>td:first-child strong{background:#315381;color:#f0f6ff}
html[data-theme="dark"] .dense-table tbody .job-row td small{color:#b3c5df}
html[data-theme="dark"] :is(.notice,.feedback,.repair-next-step,.booking-preset-hint,.intake-panel .booking-preset-hint,.stage-confirmation,.workflow-section,.part-card,.inline-job-detail,.staff-editor,.billing-tax,.qc-checklist,.archive-editor,.workflow-steps li){background:#1b2d46;border-color:#425d82;color:#d4e3fb}
html[data-theme="dark"] :is(.repair-next-step p,.guide-caption,.repair-text-preview summary span,.latest-note,.stage-confirmation p,.booking-preset-hint,.workflow-steps li small){color:#b8cdee}
html[data-theme="dark"] .feedback.error{background:#492533;color:#ffc4ce}
html[data-theme="dark"] :is(.stage-tone,.inline-stage){color:#d5e6ff!important;background:#263d5b!important;border-color:#6c92c8!important}
html[data-theme="dark"] :is(.stage-ready_for_pickup,.stage-delivered,.billing-status-paid){background:#173d37!important;color:#a4ead2!important;border-color:#4f9f8b!important}
html[data-theme="dark"] :is(.stage-cancelled,.billing-status-void){background:#472735!important;color:#ffc0d0!important;border-color:#bd7088!important}
html[data-theme="dark"] :is(.stage-diagnosis,.stage-quality_control){background:#342d50!important;color:#dbcaff!important;border-color:#9b88cf!important}
html[data-theme="dark"] :is(.stage-quote_pending,.stage-parts_sourcing,.stage-on_hold,.stage-awaiting_customer,.billing-status-open){background:#443821!important;color:#f4db9d!important;border-color:#a88b4b!important}
html[data-theme="dark"] :is(.billing-status-draft,.billing-status-issued,.billing-status-partial){background:#283f61;color:#c8dcff}
html[data-theme="dark"] .billing-paper{color-scheme:light;background:#fff;color:#16243a}
html[data-theme="dark"] .billing-paper :is(p,dd,dt,td,th,strong){color:inherit}
@media(max-width:720px){.dense-table tbody .job-row{border-left-width:5px}.dense-table tbody .job-row>td{border-top:0;border-bottom:0}.dense-table tbody .job-row>td:first-child{box-shadow:none}html[data-theme="dark"] .dense-table tbody .job-row{border-color:#456285;border-left-color:#7ca2d6}html[data-theme="dark"] .dense-table tbody .job-row>td:first-child{box-shadow:none}.theme-choice select{font-size:16px}}
html[data-theme="dark"] :is(h1,h2,h3){color:var(--ink)}
html[data-theme="dark"] .billing-paper{--ink:#16243a;--muted:#52627a;--border:#ccd8e8}
html[data-theme="dark"] .billing-paper :is(h1,h2,h3){color:#16243a}
@media print{html[data-theme="dark"] body.billing-printing{background:#fff!important;color:#16243a;color-scheme:light}}
/* Activity and field captions remain readable on every dark row surface. */
html[data-theme="dark"] .dense-table :is(.activity-summary,.latest-note){color:#d6e3f6}
html[data-theme="dark"] .dense-table :is(.activity-time,.status-guidance){color:#b6c9e6!important}
html[data-theme="dark"] .cro-more-actions>summary{color:#b8d1f5}
@media(max-width:1000px){html[data-theme="dark"] .dense-table tbody .job-row{border-color:#415b7c;border-left-color:#7d9fce}html[data-theme="dark"] .dense-table tbody .job-row>td:first-child{box-shadow:none}html[data-theme="dark"] .dense-table tbody .job-row>td{border-top:0;border-bottom:0}html[data-theme="dark"] .dense-table tbody .job-row>td:first-child{border-bottom:1px solid #415b7c}}

/* 3.7.0 — Railway-inspired workshop surfaces, original WORKDESK layout. */
@media screen{
 :root{--bg:#f6f5f8;--panel:#fff;--ink:#25212f;--muted:#696375;--border:#e3dfe9;--accent:#7045bd;--soft:#f0eafa;--shadow:0 2px 8px #21142e04,0 8px 24px #21142e04;--wd-hover:#eee8f7;--wd-band:#f8f6fb;--wd-control:#fff;--wd-table:#f4f1f7;--wd-button:#fff;--wd-button-border:#d7cfdf;--wd-primary:#7045bd;--wd-primary-hover:#6037a6;--wd-focus:#9c78dc}
 html[data-theme="dark"] body{--bg:#0b0910;--panel:#14111b;--ink:#f0edf5;--muted:#b3aabd;--border:#342c40;--accent:#c5a5ff;--soft:#30233f;--shadow:0 8px 24px #0002;--wd-hover:#2a2136;--wd-band:#1c1724;--wd-control:#100d16;--wd-table:#211a2c;--wd-button:#241c30;--wd-button-border:#51415f;--wd-primary:#7950c4;--wd-primary-hover:#8960d4;--wd-focus:#c5a5ff}
 body{font-family:Inter,"Segoe UI",-apple-system,BlinkMacSystemFont,Arial,sans-serif;letter-spacing:0;color:var(--ink);background:var(--bg)}
 html[data-theme] :is(.main,.authscreen){background:var(--bg)}
 html[data-theme] :is(.sidebar,.topbar,.panel,.modal,.column,.deal,.stat,.authcard,.billing-modal-header){background:var(--panel);border-color:var(--border);color:var(--ink)}
 .panel,.stat,.column{border-radius:12px;box-shadow:var(--shadow)}
 .topbar{box-shadow:none}
 html[data-theme] :is(.portal-organisation,.brand-organisation,.topbar b,.inline-detail-title,.heading h1){color:var(--ink);letter-spacing:-.025em}
 html[data-theme] .brand-it{color:var(--accent)}
 html[data-theme] :is(.nav button,.control-caption,.field-caption,.spec-label,.status-guidance,.activity-time,.booking-field-hint,.form-layout label,.intake-field>span,.billing-field,.coltitle){color:var(--muted)}
 html[data-theme] .nav button{border-radius:8px;font-weight:550;transition:background-color .16s,color .16s;transform:none}
 html[data-theme] :is(.nav button.active,.nav button:hover:not(.active)){background:var(--soft);color:var(--accent);transform:none}
 .nav button.active:before{background:var(--accent)}
 html[data-theme] :is(.btn,.small-btn,.cro-actions .cro-action,.sidebar-signout,.booking-pick,.compact-kpi,.compact-kpi .kpi-affordance,.avatar,.portal-badge){background:var(--wd-button);border-color:var(--wd-button-border);color:var(--ink);border-radius:8px;box-shadow:none}
 html[data-theme] :is(.btn,.small-btn,.cro-action,.booking-pick){font-weight:600;transition:background-color .16s ease,border-color .16s ease,box-shadow .16s ease}
 html[data-theme] :is(.btn:hover,.small-btn:hover,.cro-actions .cro-action:hover,.booking-pick:hover,.compact-kpi:hover){background:var(--wd-hover);border-color:var(--wd-focus);color:var(--ink)}
 html[data-theme] :is(.btn.primary,.cro-actions .cro-action-primary,.compact-kpi[aria-pressed="true"] .kpi-affordance){background:var(--wd-primary);border-color:var(--wd-primary);color:#fff;box-shadow:0 2px 5px #7045bd1c}
 html[data-theme] :is(.btn.primary:hover,.cro-actions .cro-action-primary:hover){background:var(--wd-primary-hover);border-color:var(--wd-primary-hover);color:#fff}
 html[data-theme] .compact-kpi{border-color:var(--border);background:var(--panel)}
 html[data-theme] .compact-kpi[aria-pressed="true"]{background:var(--soft);border-color:var(--wd-focus);box-shadow:inset 3px 0 var(--accent)}
 html[data-theme] :is(.compact-kpi .kpi-value,.compact-kpi .kpi-label){color:var(--ink)}
 html[data-theme] :is(.compact-kpi[aria-pressed="true"] .kpi-value,.compact-kpi[aria-pressed="true"] .kpi-label){color:var(--accent)}
 .kpi-value{font-variant-numeric:tabular-nums}
 html[data-theme] :is(input:not([type="checkbox"]):not([type="radio"]),textarea,select,#billingModal .field){background:var(--wd-control);border-color:var(--wd-button-border);color:var(--ink);border-radius:8px}
 input[type="checkbox"],input[type="radio"]{accent-color:var(--wd-primary)}
 html[data-theme] ::placeholder{color:var(--muted);opacity:1}
 html[data-theme] :is(button,input,select,textarea,summary,a):focus-visible{outline:2px solid var(--wd-focus);outline-offset:3px}
 html[data-theme] :is(.table th,.dense-table thead th,.billing-lines th){background:var(--wd-table);border-color:var(--border);color:var(--muted);font-weight:650;letter-spacing:.055em}
 html[data-theme] .dense-table tbody .job-row{background:var(--panel)}
 html[data-theme] .dense-table tbody .job-row.row-band{background:var(--wd-band)}
 html[data-theme] .dense-table tbody .job-row>td{border-top:4px solid var(--bg);border-bottom:1px solid var(--border);transition:background-color .14s ease}
 html[data-theme] .dense-table tbody .job-row>td:first-child{box-shadow:inset 3px 0 var(--wd-button-border)}
 html[data-theme] .dense-table tbody .job-row>td:first-child strong{background:var(--soft);color:var(--accent);border-radius:5px;font-size:11px;letter-spacing:.01em;font-variant-numeric:tabular-nums}
 html[data-theme] .dense-table tbody .job-row:is(:hover,:focus-within,.is-expanded){background:var(--wd-hover)}
 html[data-theme] .dense-table tbody .job-row:is(:hover,:focus-within,.is-expanded)>td:first-child{box-shadow:inset 3px 0 var(--accent)}
 html[data-theme] .dense-table tbody .job-row td small{color:var(--muted)}
 html[data-theme] :is(.table td,.table th,.intake-section-title,.activity-cell,.latest-note,.cro-actions,.inline-job-detail){border-color:var(--border)}
 html[data-theme] :is(.notice,.feedback,.repair-next-step,.booking-preset-hint,.intake-panel .booking-preset-hint,.stage-confirmation,.workflow-section,.part-card,.inline-job-detail,.staff-editor,.billing-tax,.qc-checklist,.archive-editor,.workflow-steps li){background:var(--wd-band);border-color:var(--border);color:var(--ink)}
 html[data-theme] :is(.repair-next-step p,.guide-caption,.repair-text-preview summary span,.latest-note,.stage-confirmation p,.booking-preset-hint,.workflow-steps li small){color:var(--muted)}
 html[data-theme] .feedback.error{background:#fff0f2;color:#9c2344;border-color:#f0c5d1}
 html[data-theme="dark"] .feedback.error{background:#3b1825;color:#ffbfce;border-color:#813651}
 .sidefoot{border-color:var(--border)}
 .authscreen{background:radial-gradient(ellipse at 20% 15%,#9870d51c,transparent 55%),var(--bg)!important}
 .authcard{border-radius:18px;box-shadow:0 20px 70px #20103012}
 html[data-theme] .login-tech-panel{background:radial-gradient(ellipse at top left,#67418f66,transparent 65%),#13101c;color:#f3edf9;border-color:#342942}
 html[data-theme] .login-tech-copy strong{color:#f3edf9}
 html[data-theme] .login-tech-copy span{color:#c4b6d8}
 html[data-theme] .login-tech-panel svg{filter:hue-rotate(30deg);opacity:.95}
 .login-tech-panel:before{opacity:.35}
 html[data-theme] .authcard label{color:var(--muted)}
 html[data-theme] .authcard h2{letter-spacing:-.035em;color:var(--ink)}
 html[data-theme] .authcard input:-webkit-autofill{-webkit-text-fill-color:var(--ink);-webkit-box-shadow:0 0 0 1000px var(--wd-control) inset}
 html button:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}
 @media(max-width:1000px){html[data-theme] .dense-table tbody .job-row{border-color:var(--border);border-radius:10px}html[data-theme] :is(.btn,.small-btn,.cro-actions .cro-action){min-height:40px}}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* 3.7.1 — compact sign-in with the same violet/charcoal theme. */
@media screen{
 #loginScreen .authcard{width:min(740px,100%);grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:22px 28px;padding:26px;border-radius:18px;box-shadow:0 18px 60px #24133212}
 #loginScreen .brand-login{gap:16px;padding-bottom:18px}
 #loginScreen .brand-login .company-logo{width:84px}
 #loginScreen .login-identity{font-size:17px;white-space:normal}
 #loginScreen .login-repair-theme{min-height:280px;align-self:stretch;justify-content:center;gap:20px;padding:20px;border-radius:12px;border-color:#49335f;background:radial-gradient(ellipse at 10% 0%,#69409066,transparent 70%),#17111f;color:#ddc9f5}
 #loginScreen .login-repair-theme .login-tech-label{color:#c9ace7;font-size:9px;letter-spacing:1.7px}
 #loginScreen .login-repair-theme svg{width:160px;max-width:100%;max-height:120px;align-self:center;filter:hue-rotate(35deg)}
 #loginScreen .login-tech-copy strong{font-size:23px;color:#f5eefe;letter-spacing:-.6px}
 #loginScreen .login-tech-copy span{font-size:11px;color:#c9b8db;margin-top:8px}
 #loginScreen .login-form-panel{padding:0}
 #loginScreen .login-form-panel h2{font-size:24px;color:var(--ink)}
 #loginScreen .login-form-panel>p{margin-bottom:18px;color:var(--muted)}
 #loginScreen #loginForm .field{min-height:44px;background:var(--wd-control);border-color:var(--wd-button-border);border-radius:8px}
 #loginScreen #loginForm .field:focus{border-color:var(--wd-focus);box-shadow:0 0 0 3px #9563ce20}
 #loginScreen #loginForm>.btn{min-height:44px;border-radius:8px;background:var(--wd-primary);color:#fff;box-shadow:0 3px 10px #7045bd20}
 #loginScreen #loginForm>.btn:hover:not(:disabled){background:var(--wd-primary-hover)}
 #loginScreen .login-form-panel .theme-choice{padding-top:12px;margin-top:16px}
 @media(max-width:680px){
  #loginScreen .authcard{width:min(440px,100%);grid-template-columns:minmax(0,1fr);padding:22px;gap:18px}
  #loginScreen .brand-login{flex-direction:row;flex-wrap:wrap;gap:10px;padding-bottom:16px}
  #loginScreen .login-identity{font-size:15px}
  #loginScreen .login-repair-theme{min-height:0;display:grid;grid-template-columns:80px minmax(0,1fr);gap:14px;padding:14px}
  #loginScreen .login-repair-theme .login-tech-label{display:none}
  #loginScreen .login-repair-theme svg{width:80px;max-height:70px}
  #loginScreen .login-tech-copy strong{font-size:18px}
  #loginScreen .login-tech-copy span{font-size:10px}
 }
}

/* 3.7.2 — aligned login typography, consistent system sans-serif. */
@media screen{
 #loginScreen,#loginScreen :is(h2,p,label,input,button,select,strong,span,div){font-family:"Segoe UI",-apple-system,BlinkMacSystemFont,Arial,sans-serif}
 #loginScreen .brand-login{display:flex;align-items:center;justify-content:flex-start;gap:16px;min-height:52px}
 #loginScreen .brand-login .company-logo{display:block;width:84px;height:auto;flex:none;object-fit:contain}
 #loginScreen .login-identity{display:flex;align-items:center;flex-wrap:wrap;gap:8px 12px;line-height:1.3;font-size:18px;font-weight:600;letter-spacing:-.35px;margin:0}
 #loginScreen .login-workdesk{display:inline-flex;align-items:center;font-size:11px;line-height:18px;letter-spacing:1.2px;font-weight:600;margin:0;padding-left:12px;border-color:var(--border)}
 #loginScreen .login-form-panel{align-self:start;padding:6px 0 0}
 #loginScreen .login-form-panel h2{font-size:25px;font-weight:600;line-height:1.25;letter-spacing:-.65px;margin:0 0 10px}
 #loginScreen .login-form-panel>p{font-size:13px;line-height:1.6;max-width:34ch;margin:0 0 24px;color:var(--muted)}
 #loginScreen #loginForm label{display:block;font-size:12px;font-weight:600;line-height:1.4;margin:0 0 7px;color:var(--ink)}
 #loginScreen #loginForm .field{font-size:14px;font-weight:400;margin:0 0 18px;line-height:1.4}
 #loginScreen #loginForm>.btn{font-size:13px;font-weight:600;letter-spacing:.1px;margin-top:0}
 #loginScreen .login-tech-copy strong{font-weight:600;line-height:1.25;font-size:22px;letter-spacing:-.5px}
 #loginScreen .login-tech-copy span{font-size:12px;font-weight:400;line-height:1.5}
 #loginScreen .login-form-panel .theme-choice{font-size:12px;font-weight:500}
 @media(max-width:680px){#loginScreen .brand-login{gap:12px}#loginScreen .login-identity{font-size:16px;gap:5px 9px}#loginScreen .login-workdesk{font-size:10px;padding-left:9px}#loginScreen .login-form-panel{padding:0}#loginScreen .login-tech-copy strong{font-size:18px}}
}

/* 3.7.3 — cohesive company name and right-aligned product identity. */
@media screen{
 #loginScreen .brand-login{gap:16px;padding-bottom:16px}
 #loginScreen .login-identity{flex:1;min-width:0;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:nowrap}
 #loginScreen .login-company-name{display:block;white-space:nowrap;font-weight:600;letter-spacing:-.35px}
 #loginScreen .login-company-name .brand-it{display:inline}
 #loginScreen .login-workdesk{margin-left:auto;flex:none;border:0;padding:0;text-align:right}
 #loginScreen .login-form-panel>p{max-width:none;margin-bottom:18px}
 #loginScreen .login-repair-theme{justify-content:space-evenly;gap:14px;padding:20px}
 #loginScreen .login-form-panel{padding-top:0}
 #loginScreen .authcard{gap:22px 28px}
 @media(max-width:480px){#loginScreen .brand-login{gap:10px}#loginScreen .brand-login .company-logo{width:64px}#loginScreen .login-identity{gap:8px;font-size:14px}#loginScreen .login-workdesk{font-size:9px;letter-spacing:.8px}}
 @media(max-width:360px){#loginScreen .brand-login .company-logo{width:50px}#loginScreen .login-identity{font-size:12px}#loginScreen .login-workdesk{font-size:8px;letter-spacing:.4px}}
}