/* Canonical WW website identity: walsallwood.netlify.app, 18 October 2026. */
@font-face{font-family:Sora;font-style:normal;font-weight:100 800;font-display:swap;src:url('/assets/fonts/Sora-Variable.ttf') format('truetype')}
:root,body,body.light{
 --ww-bg:#121317;--ww-nav:#16171b;--ww-panel:#1b1d22;--ww-field:#16171b;
 --ww-hover:#23252b;--ww-selected:#15313a;--ww-line:#32353d;--ww-control-line:#686b74;
 --ww-text:#ece7df;--ww-muted:#b8b1a8;--ww-accent:#1c8fa8;--ww-link:#70c2d5;--ww-on-accent:#06171c;
 --ww-success:#78d2ab;--ww-warning:#e6bd70;--ww-danger:#f18a94;
 --navy:var(--ww-bg);--panel:var(--ww-panel);--panel2:var(--ww-field);--cream:var(--ww-bg);--card:var(--ww-panel);
 --ink:var(--ww-text);--ink2:var(--ww-muted);--txt:var(--ww-text);--text:var(--ww-text);--white:var(--ww-text);--heading:var(--ww-text);
 --mut:var(--ww-muted);--muted:var(--ww-muted);--line:var(--ww-line);--line2:var(--ww-line);--line3:var(--ww-control-line);
 --bright:var(--ww-link);--gold:var(--ww-accent);--gold-dk:#3da6bd;--onacc:var(--ww-on-accent);--tagk:var(--ww-link);
 --green:var(--ww-success);--amber:var(--ww-warning);--red:var(--ww-danger);
 --rowline:var(--ww-line);--rowhover:var(--ww-hover);--nav-bg:var(--ww-nav);--nav-fg:var(--ww-text);--nav-mut:var(--ww-muted);--nav-accent:var(--ww-link);--nav-logo-invert:0;
 --sans:Sora,Arial,Helvetica,sans-serif;--serif:var(--sans);--mono:Consolas,Monaco,monospace;
 --primary:var(--ww-accent);--primary-hover:#3da6bd;--accent:var(--ww-link);--dark:var(--ww-bg);--warm-white:var(--ww-bg);--light:var(--ww-panel);
 color-scheme:dark;
}
html{background:var(--ww-bg)}
body,body.light{background:var(--ww-bg);color:var(--ww-text);font-family:var(--sans);-webkit-font-smoothing:antialiased}
body:has(.access-header){background:var(--ww-bg)}
button,input,select,textarea{font-family:var(--sans)}
h1,h2,h3,h4,h5,h6,.portal-header>span,.access-header .brand{font-family:var(--sans);color:var(--ww-text);letter-spacing:-.025em}
h1{font-weight:600}h2,h3{font-weight:600}
a{color:var(--ww-link);text-underline-offset:3px}a:hover{color:var(--ww-text)}
small,.muted,.note,.lc-note,.cms-note,.garage-contact,footer,.ww-network,.staff-access-status{color:var(--ww-muted)}
::selection{background:#1c8fa866;color:var(--ww-text)}
input::placeholder,textarea::placeholder{color:#aaa59d;opacity:1}
input:not([type=checkbox]):not([type=radio]):not([name=registration]),select,textarea{background:var(--ww-field);color:var(--ww-text);border-color:var(--ww-control-line)}
input:read-only{color:var(--ww-muted)}
input[type=checkbox],input[type=radio],progress{accent-color:var(--ww-accent)}
button,.btn,.tbtn,input,select,textarea{border-radius:6px}
button,.btn,.tbtn{transition:background-color .12s,border-color .12s;color:var(--ww-text)}
button:hover,.btn:hover,.tbtn:hover{background-color:var(--ww-hover);border-color:var(--ww-control-line)}
button.primary,.claim-actions .primary,.auth-submit,.btn.gold,button.p,.tb button.p,.vs-cases button[type=submit],#vs-case-new{background:var(--ww-accent);border-color:var(--ww-accent);color:var(--ww-on-accent);font-weight:600}
button.primary:hover,.claim-actions .primary:hover,.auth-submit:hover,.btn.gold:hover,button.p:hover,.tb button.p:hover,.vs-cases button[type=submit]:hover,#vs-case-new:hover{background:#3da6bd;border-color:#3da6bd;color:var(--ww-on-accent)}
button.danger,.error,[role=alert].error,#vehicle-lookup-error,#message,#error{color:var(--ww-danger)}
.success{color:var(--ww-success)}
:where(a,button,input,select,textarea,summary):focus-visible{outline:2px solid var(--ww-link);outline-offset:3px}
:where(input:not([type=checkbox]):not([type=radio]),textarea,select):focus{border-color:var(--ww-link)!important;box-shadow:0 0 0 2px #1c8fa83d;outline:none}
.portal-header,.access-header,.auth-art,body>nav[data-zone="1"]{background:var(--ww-nav);border-color:var(--ww-line);color:var(--ww-text)}
.portal-header{border-bottom:1px solid var(--ww-line)}
.card,.claim-card,.auth-layout,.cms-document,.cms-details,.cms-block,.cms-media-item,.vs-case-form{background:var(--ww-panel);border-color:var(--ww-line);border-radius:8px}
.card,.claim-card{box-shadow:none}
.avatar{background:var(--ww-selected);color:var(--ww-text)}
#portal-nav button[aria-current=page],#website-nav button[aria-current=page],.view-tabs button[aria-current=page]{background:var(--ww-selected);border-color:#326374;color:var(--ww-text)}
.state{background:var(--ww-selected);color:#c5e7ef;border-radius:4px}
.message{background:var(--ww-field);border-color:var(--ww-line)}.message.mine{background:var(--ww-selected)}.message.staff{border-left-color:var(--ww-accent)}
.member-card{background:var(--ww-nav);color:var(--ww-text);border-color:var(--ww-control-line);border-radius:8px}
.member-card .qr{background:#fff;color:#000;color-scheme:light}
.member-card small{color:var(--ww-muted)}
.photo-grid img,.photo-cover,.cms-field img{border-color:var(--ww-line);border-radius:6px}
.vehicle-confirmation{color:var(--ww-text)}.vehicle-details-note{color:var(--ww-muted)}
.plate,input[name=registration]{background:#f6ce35;color:#151b1d;font-family:UKNumberPlate,monospace;color-scheme:light}
input[name=registration]{border-color:#b79c36}
.vehicle-progress progress{background:var(--ww-hover)}
.vehicle-progress progress::-webkit-progress-bar{background:var(--ww-hover)}
.vehicle-progress progress:indeterminate::-webkit-progress-bar{background:linear-gradient(90deg,var(--ww-hover),var(--ww-accent),var(--ww-hover));background-size:200% 100%}
.vehicle-text-button{color:var(--ww-link)}
.ww-app-switcher{font-family:var(--sans)}
.ww-app-switcher .ww-app-trigger{font-family:var(--sans);color:var(--ww-text);border-color:var(--ww-control-line);background:transparent}
.ww-app-switcher .ww-app-trigger:hover,.ww-app-switcher .ww-app-trigger[aria-expanded=true]{background:transparent;border-color:var(--ww-link)}
.ww-app-switcher .ww-app-panel{background:var(--ww-nav);color:var(--ww-text);border-color:var(--ww-line);box-shadow:0 16px 40px #0006}
.ww-app-switcher .ww-app-option{color:var(--ww-text);border-color:transparent}
.ww-app-switcher .ww-app-option:hover,.ww-app-switcher .ww-app-option[aria-current=page]{background:var(--ww-selected);border-color:#326374}
.ww-app-copy small,.ww-app-heading,.ww-app-empty,.ww-app-chevron{color:var(--ww-muted)}
.ww-app-icon,.ww-app-trigger-icon{background:#ece7df;border-color:#ece7df;color:#121317}
.ww-app-icon:has(img[src$="vehicle-house.png"]){background:#16171b;border-color:var(--ww-control-line)}
.staff-module-option:has(input:checked){background:var(--ww-selected);border-color:#326374}
.staff-module-option:has(input:focus-visible){outline-color:var(--ww-link)}
.cms-modal{background:#08090bbf}.cms-modal>section{background:var(--ww-bg);border-color:var(--ww-line);border-radius:8px}
.cms-dirty{color:var(--ww-warning)}.cms-preview{background:var(--ww-field);border-color:var(--ww-line)}
.cms-preview iframe{color-scheme:normal}.cms-preview-controls .on{background:var(--ww-selected);color:var(--ww-text)}
.cms-review-list .cms-document{border-left-color:var(--ww-warning)}
.header-note,.art-caption span{color:var(--ww-muted)}
.auth-form h1{font-weight:600}.auth-form form label,.remember-device{color:var(--ww-text)}
.auth-layout,.claim-card{border-color:var(--ww-line)}
.auth-art{background:var(--ww-nav)}.auth-art:after{border-color:var(--ww-line)}
.auth-art .art-caption{font-family:var(--sans)}
.skip{background:var(--ww-panel);color:var(--ww-link)}
#notice{background:var(--ww-panel);color:var(--ww-text);border:1px solid var(--ww-control-line);border-radius:6px}
.dashboard-action,.dashboard-action:hover{background:var(--ww-selected);color:var(--ww-text);border-color:#326374}
.dashboard-action>span:last-child{color:var(--ww-muted)}
.tb button,button.p,nav #navtabs a,nav #navtabs button,.k,.tbtn{letter-spacing:0;text-transform:none}
.head h1{letter-spacing:-.025em}.head .kpi .n{font-family:var(--sans);font-variant-numeric:tabular-nums}
table{color:var(--ww-text)}th{color:var(--ww-muted)}
body>nav .r,body>nav #navtabs{scrollbar-color:var(--ww-control-line) var(--ww-nav)}
@media(max-width:640px){button,.btn,.tbtn,select,input:not([type=checkbox]):not([type=radio]){min-height:44px}.auth-form h1{font-size:26px}.page-head h1{font-size:26px}}
@media(prefers-reduced-motion:reduce){button,.btn,.tbtn{transition:none}}

/* Signature ink and QR codes retain a reliable white recording surface. */
.esign-canvas{background:#fff;color-scheme:light}
.error.ok{color:var(--ww-success)}

.garage-identity img[src$='/logo.svg']{filter:brightness(0) invert(1)}
.tb{flex-wrap:wrap}.tb>input{flex:1 1 220px;min-width:0;width:auto}
.head .top{flex-wrap:wrap;gap:12px}.head .kpi{max-width:100%;flex-wrap:wrap}.head .kpi .c{min-width:0}@media(max-width:640px){.head .kpi{width:100%;gap:0}.head .kpi .c{flex:1;padding:6px 10px}.head .kpi .c:first-child{padding-left:0}}
button,.btn,.tbtn{background-color:var(--ww-panel);border-color:var(--ww-control-line)}.auth-submit{border-radius:6px}.tb button.on{background:var(--ww-accent);border-color:var(--ww-accent);color:var(--ww-on-accent)}
