:root{--nav:#2f3b50;--nav2:#435168;--top:#9caabd;--paper:#f1f3f7;--ink:#273246;--line:#526078;--blue:#4599e8;--orange:#ff9418;--green:#6fc82d;--cyan:#25b1d8}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:12px Arial,sans-serif}.sidebar{position:fixed;inset:0 auto 0 0;width:205px;background:var(--nav);color:white;z-index:4}.logo{height:75px;display:grid;place-items:center;font:bold italic 31px Georgia;letter-spacing:4px;border-bottom:1px solid #657084}.logo:after{content:"";width:130px;border-bottom:2px solid white;position:absolute;top:49px}.sidebar nav{padding:18px 0}.nav-item{display:flex;gap:12px;align-items:center;padding:9px 24px;color:#fff;text-decoration:none;cursor:pointer}.nav-item:hover,.nav-item.active{background:var(--nav2)}.nav-icon{width:18px;text-align:center}.subnav{padding:4px 12px 8px 48px;color:#dce2eb;font-size:10px;line-height:2;cursor:pointer}main{margin-left:205px;min-height:100vh}header{height:52px;background:var(--top);color:white;display:flex;align-items:center;padding:0 28px;justify-content:space-between}header h1{font-size:16px;font-weight:normal;margin:0}header span{font-size:10px}.menu-toggle{display:none}.content{padding:28px 32px}.toolbar{display:flex;gap:10px;align-items:center;margin-bottom:20px}.search{height:32px;flex:1;border:1px solid var(--line);padding:0 12px;background:white}.btn{border:0;border-radius:3px;background:var(--nav);color:white;padding:7px 18px;font-size:10px;text-transform:uppercase;cursor:pointer}.btn.blue{background:var(--blue)}.btn:hover{filter:brightness(1.15)}.dashboard-search{max-width:850px;margin:0 auto 20px}.dashboard-search .toolbar{margin:0}.date-box{border:1px solid var(--line);background:#fff;padding:10px;text-align:center;width:310px;margin:0 auto 20px;font-weight:bold}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;max-width:900px;margin:auto}.metric{background:#fff;border:1px solid var(--line);text-align:center;padding:12px 10px 8px;position:relative}.metric .label{font-size:10px;text-align:left;text-transform:uppercase}.metric .value{font-size:52px;font-weight:300;margin:6px}.metric .btn{font-size:8px;padding:5px 13px;position:absolute;bottom:-24px;left:50%;transform:translateX(-50%)}.orange{color:var(--orange)}.green{color:var(--green)}.cyan{color:var(--cyan)}.tan{color:#bf9865}.charts{max-width:900px;margin:60px auto 0}.chart{background:#fff;border:1px solid var(--line);padding:16px;margin-bottom:28px}.bars{display:grid;grid-template-columns:160px 1fr;gap:10px}.bar{height:14px;margin-bottom:10px}.chart-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px}.line-chart{height:125px;background:linear-gradient(150deg,transparent 35%,#65b953 36%,transparent 37%),linear-gradient(25deg,transparent 55%,#65b953 56%,transparent 57%);border-bottom:1px solid #ddd}.donut{width:110px;height:110px;border-radius:50%;background:conic-gradient(#299c9a 0 61%,#64cbc8 61% 86%,#86ddd6 86%);position:relative;margin:10px auto}.donut:after{content:"";position:absolute;inset:25px;border-radius:50%;background:#fff}.access-grid{display:grid;grid-template-columns:repeat(4,145px);gap:28px;justify-content:center}.access-card{height:135px;background:#8e9cb0;border:4px solid #aab6c5;color:white;display:grid;place-items:center;text-align:center;cursor:pointer}.access-card b{font-size:38px}.table-wrap{background:#fff;overflow:auto}table{width:100%;border-collapse:collapse;font-size:11px}th,td{border:1px solid var(--line);padding:8px 9px;text-align:left}th{background:#fff;text-transform:uppercase;font-size:10px}.total-row td{font-weight:bold}.exports{display:flex;gap:14px;margin-top:18px;font-size:11px}.exports span{cursor:pointer}.inventory-top{display:flex;justify-content:flex-end;gap:55px;margin:0 0 25px}.inventory-alert{text-align:center}.cube{font-size:43px}.detail-card{background:white;border:1px solid var(--line);padding:15px;display:grid;grid-template-columns:260px 1fr 1fr;gap:20px}.vehicle-img{height:150px;background:linear-gradient(160deg,#eef2f4,#aab3bd);display:grid;place-items:center;font-size:76px}.status-flow{display:grid;grid-template-columns:repeat(8,1fr);gap:8px;margin:20px 0;text-align:center;font-size:9px}.status-step{cursor:pointer}.check{font-size:30px;color:var(--green)}.detail-bottom{display:grid;grid-template-columns:1.3fr 1fr;gap:25px;margin-top:20px}.panel{background:#fff;border:1px solid var(--line);padding:15px}.report-list{line-height:2.3;text-transform:uppercase}.modal-backdrop{position:fixed;inset:0;background:#1c273680;display:grid;place-items:center;z-index:10}.modal{background:#f8fafc;width:min(560px,94vw);box-shadow:0 12px 35px #18223155}.modal-head{background:var(--blue);color:#fff;padding:14px 20px;display:flex;justify-content:space-between}.modal-body{padding:20px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.field label{display:block;margin-bottom:5px}.field input,.field select,.field textarea{width:100%;border:1px solid #84bff4;padding:8px;background:white}.checks{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:15px 0}.signature{height:90px;border:1px solid #84bff4;background:white;font:italic 34px cursive;display:grid;place-items:center}.empty{padding:70px;text-align:center;color:#6a7587}
@media(max-width:900px){.sidebar{transform:translateX(-100%);transition:.2s}.sidebar.open{transform:none}.menu-toggle{display:block;background:none;border:0;color:white;font-size:20px}main{margin-left:0}.metrics,.chart-grid{grid-template-columns:1fr}.access-grid{grid-template-columns:repeat(2,145px)}.detail-card,.detail-bottom{grid-template-columns:1fr}.status-flow{grid-template-columns:repeat(4,1fr)}header h1{font-size:11px}.content{padding:20px 14px}}
.row-actions{white-space:nowrap}.row-actions button{border:0;background:none;color:#2877b7;text-decoration:underline;cursor:pointer;font-size:10px;margin-right:7px}.badge{display:inline-block;border-radius:12px;background:#e6eef7;padding:4px 8px;white-space:nowrap}.stock-low{background:#fff0ce;color:#9b5b00;font-weight:bold}.stock-out{background:#ffe1e1;color:#b21d1d;font-weight:bold}.empty-cell{text-align:center;padding:30px;color:#778195}.panel{margin-top:18px}.modal.wide{width:min(850px,95vw);max-height:92vh;overflow:auto}.field.full{grid-column:1/-1}.field textarea{min-height:90px;resize:vertical}.status-options{display:grid;grid-template-columns:1fr 1fr;gap:10px}.status-options .btn{text-align:left}.status-step.current{background:#d8edff;border-radius:4px;padding:5px}.status-step.current .check{color:#187ec2}.calendar-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:18px}.calendar-day{background:#fff;border:1px solid var(--line);padding:12px;min-height:150px}.calendar-day h3{margin:0 0 12px;border-bottom:1px solid #ccd2dc;padding-bottom:8px}.event{background:#e5f2ff;border-left:4px solid var(--blue);padding:9px;margin-bottom:8px;cursor:pointer}.report-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:25px}.report-card{background:#fff;border:1px solid var(--line);padding:20px;display:flex;justify-content:space-between;align-items:center}.report-card b{font-size:30px;color:var(--blue)}.settings-form{max-width:750px}.toast{position:fixed;right:22px;bottom:22px;background:#26834b;color:white;padding:13px 20px;border-radius:4px;z-index:30;box-shadow:0 5px 18px #0004}.toast.error{background:#b83232}.btn.blue{background:var(--blue)}[data-close]{cursor:pointer}.inventory-alert b{font-size:18px}@media(max-width:900px){.report-cards{grid-template-columns:1fr}.form-grid,.status-options{grid-template-columns:1fr}.field.full{grid-column:auto}.toolbar{flex-wrap:wrap}.toolbar .search{flex-basis:100%}}
@media print{.sidebar,header,.toolbar,.exports,.row-actions,.btn{display:none!important}main{margin:0}.content{padding:0}body{background:white}}
.logout{border:1px solid #fff7;background:transparent;color:white;border-radius:3px;padding:3px 8px;cursor:pointer;font-size:10px}.role-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:22px}.role-summary .panel{margin:0}.role-summary small{color:#677386;line-height:1.6}.form-note{background:#e7f2fb;padding:9px;color:#456}.login-screen{position:fixed;inset:0;background:linear-gradient(135deg,#2f3b50,#687890);display:grid;place-items:center;z-index:100}.login-card{width:min(390px,92vw);background:white;padding:32px;box-shadow:0 20px 60px #16203388}.login-card h2{margin-bottom:4px}.login-card p{color:#6d7888;margin:0 0 22px}.login-card .field{margin-bottom:15px}.login-card .btn{width:100%;padding:11px;margin:5px 0 18px}.login-card small{display:block;text-align:center;color:#7b8491}.login-logo{font:bold italic 34px Georgia;color:var(--nav);letter-spacing:5px;border-bottom:2px solid var(--nav);display:inline-block;margin-bottom:15px}.logged-out .sidebar,.logged-out main{visibility:hidden}@media(max-width:900px){.role-summary{grid-template-columns:1fr}}
.role-editor{display:grid;gap:18px}.role-form{border:1px solid #b8c1cf;background:white;padding:15px}.role-form h3{margin-top:0}.write-permission{display:block;font-weight:bold;margin-bottom:12px}.permission-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:15px}@media(max-width:900px){.permission-grid{grid-template-columns:1fr 1fr}}
.status-subnav{background:#263246;padding:4px 0 8px}.status-subnav a{display:block;color:#cfd7e2;padding:5px 15px 5px 52px;font-size:9px;cursor:pointer}.status-subnav a:hover{background:#435168;color:white}.status-tabs{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:18px}.status-tabs button{border:1px solid #8f9bae;background:#fff;color:var(--ink);padding:10px;text-align:left;cursor:pointer;font-size:9px;text-transform:uppercase}.status-tabs button b{float:right;background:#e4eaf1;padding:2px 6px;border-radius:10px}.status-tabs button.active{background:var(--nav);color:white}.status-tabs button.active b{color:var(--nav)}.table-help{color:#697588;margin:0 0 10px}.row-actions button[data-detail]{font-weight:bold;color:#176ba7}@media(max-width:1100px){.status-tabs{grid-template-columns:repeat(3,1fr)}}@media(max-width:700px){.status-tabs{grid-template-columns:1fr 1fr}}
.detail-navigation{margin-bottom:10px}
.status-badge{background:var(--badge-color);color:white}
.vehicle-photo img{width:100%;height:100%;max-height:290px;object-fit:contain}
.vehicle-photo{position:relative}.photo-button{position:absolute;left:12px;bottom:12px;border:0;background:#2f3b50;color:white;padding:8px 12px;border-radius:4px;cursor:pointer;font-size:10px}.vehicle-photo>small{position:absolute;right:12px;bottom:14px;color:#687386;background:#fff;padding:4px}.photo-upload{text-align:center;margin-bottom:18px}.photo-upload img{display:none;width:100%;max-height:320px;object-fit:contain;border:1px solid #b8c1cf;margin-bottom:15px}.photo-upload label{display:inline-block}.photo-upload input{display:none}.photo-upload p{color:#6f7988}
.settings-page form{display:grid;grid-template-columns:1fr 1fr;gap:20px}.settings-section{background:#fff;border:1px solid #aeb7c4;padding:20px}.settings-section h2{font-size:15px;margin:0 0 18px;color:#344054;border-bottom:1px solid #d4dae2;padding-bottom:10px}.settings-section .form-grid{grid-template-columns:1fr 1fr}.backup-section p{color:#687386;line-height:1.5}.settings-save{grid-column:1/-1;position:sticky;bottom:0;background:#f1f3f7;padding:12px 0;text-align:right}.settings-save .btn{font-size:12px;padding:10px 24px}@media(max-width:1100px){.settings-page form{grid-template-columns:1fr}}@media(max-width:700px){.settings-section .form-grid{grid-template-columns:1fr}}
.sidebar{display:flex;flex-direction:column}.logo{min-height:75px}.sidebar nav{flex:1;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:#738096 #2f3b50}.nav-arrow{margin-left:auto}.status-subnav{display:none}.status-subnav.open{display:block}.status-subnav a.active{background:#435168;color:white}
.vehicle-detail-page{max-width:1700px;margin:auto}.vehicle-overview{display:grid;grid-template-columns:minmax(280px,.85fr) minmax(420px,1.15fr);gap:16px;position:relative}.vehicle-photo,.vehicle-spec-card{background:#fff;border:1px solid #8993a1;min-height:315px}.vehicle-photo{display:grid;place-items:center;padding:20px}.vehicle-photo svg{width:100%;max-height:290px}.vehicle-spec-card{position:relative;padding:24px 28px}.pre-delivery{position:absolute;right:0;top:-42px;padding:9px 18px;color:#fff;border-radius:0 0 7px 7px;font-size:20px}.pre-delivery.yes{background:#26914a}.pre-delivery.no{background:#b94b4b}.vehicle-specs{display:grid;grid-template-columns:1fr 1fr;font-size:18px;line-height:1.5}.vehicle-specs>div+div{border-left:1px solid #aeb6c1;padding-left:28px}.vehicle-specs b{font-weight:normal}.detail-edit{position:absolute;right:22px;bottom:15px;border:0;background:transparent;color:#344054;font-size:15px;cursor:pointer}.detail-actions{display:flex;justify-content:center;gap:36px;margin:24px 0}.detail-actions .btn{font-size:17px;min-width:180px;border-radius:12px;padding:10px 24px}.detail-status-flow{display:grid;grid-template-columns:repeat(8,1fr);gap:10px;margin:16px 0 30px}.detail-status{border:0;background:transparent;color:#303a4c;cursor:pointer;text-align:center;padding:8px 2px;min-width:0}.status-check{display:block;width:50px;height:28px;border-left:10px solid var(--status-color);border-bottom:10px solid var(--status-color);transform:rotate(-45deg);margin:0 auto 20px;opacity:1}.detail-status.current{background:#fff;border-radius:8px;box-shadow:0 0 0 2px var(--status-color)}.detail-status strong{display:block;font-size:14px;text-transform:uppercase;font-weight:normal;line-height:1.3}.accessories-table th,.accessories-table td{font-size:14px;padding:14px 20px}.accessories-table tbody tr{height:48px}@media(max-width:900px){.vehicle-overview{grid-template-columns:1fr}.vehicle-spec-card{min-height:285px}.pre-delivery{top:0}.detail-status-flow{grid-template-columns:repeat(4,1fr)}}@media(max-width:750px){.vehicle-specs{grid-template-columns:1fr;font-size:16px}.vehicle-specs>div+div{border-left:0;border-top:1px solid #aeb6c1;padding:12px 0 0;margin-top:12px}.detail-actions{gap:8px;flex-wrap:wrap}.detail-actions .btn{min-width:130px;font-size:12px}.detail-status-flow{grid-template-columns:repeat(2,1fr)}.vehicle-photo,.vehicle-spec-card{min-height:auto}.pre-delivery{position:static;display:inline-block;float:right;margin:-24px -28px 15px 15px}}
