:root[data-theme="dark"]{--ink:#f0eff8;--muted:#aaa8ba;--line:#3a394b;--surface:#242331;--bg:#171722;--purple:#65b6ff;--purple-light:#20364d;--shadow:0 12px 30px rgba(0,0,0,.25)}
:root[data-theme="dark"] body{background:var(--bg);color:var(--ink)}
:root[data-theme="dark"] .panel,:root[data-theme="dark"] .stat-card,:root[data-theme="dark"] .modal,:root[data-theme="dark"] .user-modal,:root[data-theme="dark"] .staff-modal{background:var(--surface);color:var(--ink);border-color:var(--line)}
:root[data-theme="dark"] input,:root[data-theme="dark"] select,:root[data-theme="dark"] textarea{color:var(--ink);background:#1d1c29;border-color:var(--line)}
:root[data-theme="dark"] h1,:root[data-theme="dark"] h2,:root[data-theme="dark"] h3,:root[data-theme="dark"] strong{color:var(--ink)}
:root[data-theme="dark"] p,:root[data-theme="dark"] small,.modal-copy{color:var(--muted)}
:root[data-theme="dark"] th{border-bottom-color:var(--line)}
:root[data-theme="dark"] td{border-bottom-color:var(--line);color:var(--muted)}
:root[data-theme="dark"] .dealership-item,:root[data-theme="dark"] .alert-item{border-color:var(--line);background:var(--surface)}
:root[data-theme="dark"] .model-link{background:#2d2c3b;color:var(--ink)}
:root[data-theme="dark"] .model-link span:last-child{background:#3b3a4d;color:var(--purple)}
:root[data-theme="dark"] .model-link:hover,:root[data-theme="dark"] .model-link:focus-visible{background:var(--purple-light);color:var(--purple)}
:root[data-theme="dark"] .brand-logo-fallback{background:#343344;color:var(--ink)}
:root[data-theme="dark"] .followup-step{background:#302f40;color:#f0eff8}
:root[data-theme="dark"] .followup-step small{color:#aaa8ba}
:root[data-theme="dark"] .followup-step.overdue{background:#4a2028;color:#ffb0b5}
:root[data-theme="dark"] .followup-step.overdue small{color:#ffb0b5}
:root[data-theme="dark"] .followup-step.completed{background:#1f473b;color:#9ce2bf}
:root[data-theme="dark"] .followup-step.completed small{color:#9ce2bf}
:root[data-theme="dark"] .followup-step.upcoming{background:#303b55;color:#b7d8ff}
:root[data-theme="dark"] .followup-step.upcoming small{color:#b7d8ff}

/* Use a crisp modern system sans-serif everywhere without loading a remote font. */
:root{--font-sans:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
html,body,button,input,textarea,select,body *{font-family:var(--font-sans)!important}

:root[data-custom-accent]{--purple:var(--accent);--purple-light:color-mix(in srgb,var(--accent) 12%,var(--surface))}
:root[data-custom-accent][data-theme="dark"]{--purple:color-mix(in srgb,var(--accent) 65%,white);--purple-light:color-mix(in srgb,var(--accent) 22%,var(--surface))}
:root[data-custom-accent] .primary-button,:root[data-custom-accent] .brand-mark{background:var(--accent);color:var(--accent-contrast);box-shadow:0 4px 12px color-mix(in srgb,var(--accent) 20%,transparent)}
:root[data-custom-accent] .primary-button:hover{background:color-mix(in srgb,var(--accent) 88%,black)}
:root[data-custom-accent] .nav-item.active,:root[data-custom-accent] .mobile-nav-item.active{background:var(--purple-light)!important;color:var(--purple)!important}

/* Softer light surfaces and consistent filled-button labels. */
:root:not([data-theme="dark"]){--bg:#e9edf2;--surface:#f8f9fb;--line:#d5dce5;--muted:#6f7887;--shadow:0 4px 16px rgba(35,49,67,.045)}
:root:not([data-theme="dark"]) body,:root:not([data-theme="dark"]) .main-content{background:var(--bg)}
:root:not([data-theme="dark"]) .sidebar{background:#e1e7ee;border-color:#ccd5e0}
:root:not([data-theme="dark"]) .topbar{background:#f0f3f7;border-color:var(--line)}
:root:not([data-theme="dark"]) .panel,:root:not([data-theme="dark"]) .stat-card,:root:not([data-theme="dark"]) .settings-card-inline{background:var(--surface);border-color:var(--line)}
:root:not([data-theme="dark"]) .modal,:root:not([data-theme="dark"]) .staff-modal{background:#f8f9fb}
:root:not([data-theme="dark"]) th{background:#edf1f6;color:#697486}
:root:not([data-theme="dark"]) input,:root:not([data-theme="dark"]) select,:root:not([data-theme="dark"]) textarea{background:#f0f3f7;border-color:var(--line)}
:root .primary-button,:root .primary-button:hover,:root .primary-button:focus-visible,:root .primary-button span,:root .primary-button strong,:root .brand-mark{color:#fff!important}

:root[data-custom-accent] .main-nav .nav-item.active{background:var(--accent)!important;color:#fff!important}
:root[data-custom-accent] .main-nav .nav-item.active .nav-tint-icon{stroke:#fff!important}
:root[data-custom-accent] .main-nav .nav-item.active .nav-icon{color:#fff!important}
:root[data-custom-accent] .main-nav .nav-item.active .nav-count{background:rgba(255,255,255,.2);color:#fff}

:root[data-custom-accent] .primary-button,:root[data-custom-accent] .primary-button:hover,:root[data-custom-accent] .primary-button:focus-visible,:root[data-custom-accent] .primary-button span,:root[data-custom-accent] .primary-button strong,:root[data-custom-accent] .brand-mark{color:var(--accent-contrast)!important}
:root[data-custom-accent] .main-nav .nav-item.active,:root[data-custom-accent] .main-nav .nav-item.active .nav-icon,:root[data-custom-accent] .main-nav .nav-item.active .nav-count{color:var(--accent-contrast)!important}
:root[data-custom-accent] .main-nav .nav-item.active .nav-tint-icon{stroke:var(--accent-contrast)!important}