.fleet-qr-image { width:120px; height:120px; border:8px solid #fff; border-radius:10px; object-fit:contain; box-shadow:0 0 0 1px #e0e7e5; }
#page-fleet { --fleet-ink:#14231f; --fleet-green:#174f43; --fleet-teal:#1abc9c; padding:24px 28px 42px; min-width:0; overflow:hidden; }
body:has(#page-fleet.active) .main { min-width:0; max-width:calc(100vw - 230px); overflow-x:hidden; }
.fleet-shell { width:min(1480px,100%); margin:0 auto; color:var(--fleet-ink); }
.fleet-hero { display:flex; align-items:flex-end; justify-content:space-between; gap:28px; min-height:190px; padding:30px; border-radius:24px; color:#fff; background:radial-gradient(circle at 78% -25%,rgba(90,236,205,.42),transparent 38%),linear-gradient(125deg,#122520 0%,#174f43 68%,#16735f 100%); box-shadow:0 18px 46px rgba(17,69,58,.17); }
.fleet-hero h2,.fleet-mode-intro h2 { margin:8px 0 0; max-width:660px; font-size:clamp(25px,3vw,38px); line-height:1.08; letter-spacing:-.045em; }
.fleet-hero p { max-width:650px; margin:12px 0 0; color:rgba(255,255,255,.72); font-size:13px; line-height:1.65; }
.fleet-eyebrow { color:#9ce8d7; font-size:10px; font-weight:800; letter-spacing:.15em; }
.fleet-hero-actions,.fleet-access-actions { display:flex; gap:9px; flex-wrap:wrap; }
.fleet-btn { display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:0 16px; border:1px solid transparent; border-radius:11px; font:700 11px/1 'Sora',sans-serif; text-decoration:none; cursor:pointer; }
.fleet-btn:focus-visible,.fleet-tabs button:focus-visible,.fleet-driver-card button:focus-visible,.fleet-queue button:focus-visible { outline:3px solid rgba(26,188,156,.3); outline-offset:2px; }
.fleet-btn--primary { color:#fff; background:#174f43; }.fleet-btn--light { color:#174f43; background:#fff; }.fleet-btn--glass { color:#fff; border-color:rgba(255,255,255,.24); background:rgba(255,255,255,.09); }.fleet-btn--neutral { color:#31433e; border-color:#dce7e4; background:#fff; }
.fleet-payment-kpis { margin:0 0 16px; }.fleet-payment-list { display:grid; gap:11px; }.fleet-payment-card { overflow:hidden; border:1px solid #dce7e3; border-radius:14px; background:#fff; }.fleet-payment-card header { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding:16px 18px; }.fleet-payment-card h4 { margin:8px 0 3px; font-size:15px; }.fleet-payment-card p { margin:0; color:#71807a; font-size:11px; }.fleet-payment-card header>div:last-child { display:grid; justify-items:end; gap:9px; }.fleet-payment-card header>div:last-child>strong { color:#174f43; font:800 20px/1 'JetBrains Mono',monospace; }.fleet-payment-card .fleet-btn { min-height:36px; padding:0 12px; }.fleet-payment-card ul,.fleet-settlement-deliveries { display:grid; gap:0; margin:0; padding:0; list-style:none; border-top:1px solid #edf1ef; }.fleet-payment-card li,.fleet-settlement-deliveries li { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; align-items:center; padding:10px 18px; border-bottom:1px solid #edf1ef; font-size:11px; }.fleet-payment-card li:last-child,.fleet-settlement-deliveries li:last-child { border-bottom:0; }.fleet-payment-card li span { overflow:hidden; color:#71807a; text-overflow:ellipsis; white-space:nowrap; }.fleet-payment-card li b { color:#174f43; font:700 11px 'JetBrains Mono',monospace; }.fleet-payment-card .fleet-payment-more { display:block; color:#71807a; font-weight:700; }.fleet-payment-history { margin-top:22px; }.fleet-payment-history h4 { margin:0 0 10px; font-size:14px; }.fleet-history-empty { margin:0; padding:15px; border:1px dashed #d7e4e0; border-radius:11px; color:#77857f; font-size:11px; }.fleet-settlement-total { display:grid; gap:5px; padding:16px; border:1px solid #c7e9df; border-radius:13px; background:#f1fcf8; }.fleet-settlement-total span,.fleet-settlement-total small { color:#647871; font-size:11px; }.fleet-settlement-total strong { color:#174f43; font:800 27px/1 'JetBrains Mono',monospace; }.fleet-settlement-deliveries { max-height:190px; margin:15px 0; overflow:auto; border:1px solid #e2ebe8; border-radius:11px; }.fleet-settlement-deliveries li { padding:9px 11px; }.fleet-settlement-deliveries strong { color:#174f43; font:700 11px 'JetBrains Mono',monospace; }
.fleet-preview { display:flex; gap:10px; align-items:center; margin-top:14px; padding:11px 14px; border:1px solid #ead8a8; border-radius:12px; color:#7b5a0f; background:#fff9e9; font-size:10px; }.fleet-preview span { color:#927526; }
.fleet-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin:16px 0; }
.fleet-kpi { display:flex; justify-content:space-between; gap:12px; padding:18px; border:1px solid #e0e9e6; border-radius:16px; background:#fff; box-shadow:0 5px 18px rgba(22,67,57,.045); }.fleet-kpi div { display:grid; gap:5px; }.fleet-kpi span { color:#72817d; font-size:10px; font-weight:750; }.fleet-kpi strong { font:800 25px/1 'JetBrains Mono',monospace; }.fleet-kpi small { color:#87948f; font-size:9px; }.fleet-kpi i { display:grid; place-items:center; width:38px; height:38px; border-radius:12px; background:#eff6f4; font-style:normal; }.fleet-kpi--success i { background:#e8faf3; }.fleet-kpi--route i { background:#ebf2ff; }.fleet-kpi--danger i { background:#fff0ee; }
.fleet-tabs { display:flex; gap:5px; margin-bottom:12px; padding:5px; border:1px solid #e0e9e6; border-radius:13px; background:#eef3f1; overflow-x:auto; }.fleet-tabs button { min-height:40px; padding:0 14px; border:0; border-radius:9px; color:#65746f; background:transparent; font:700 11px 'Sora',sans-serif; white-space:nowrap; cursor:pointer; }.fleet-tabs button.is-active { color:#143f36; background:#fff; box-shadow:0 2px 9px rgba(20,63,54,.08); }.fleet-tabs button span { margin-left:7px; padding:3px 6px; border-radius:12px; background:#e5efec; font:700 9px 'JetBrains Mono',monospace; }
.fleet-panel { padding:20px; border:1px solid #e0e9e6; border-radius:18px; background:#f9fbfa; }.fleet-panel-head { display:flex; justify-content:space-between; align-items:flex-end; gap:18px; margin-bottom:18px; }.fleet-panel-head h3 { margin:0; font-size:17px; }.fleet-panel-head p { margin:5px 0 0; color:#788680; font-size:10px; }
.fleet-filters,.fleet-report-filters { display:flex; align-items:flex-end; gap:9px; }.fleet-filters label { display:grid; gap:5px; color:#75847f; font-size:9px; font-weight:800; text-transform:uppercase; }.fleet-filters input,.fleet-filters select,.fleet-report-filters input { min-height:42px; padding:0 11px; border:1px solid #dce6e3; border-radius:9px; background:#fff; font:500 11px 'Sora',sans-serif; }
.fleet-driver-grid { display:grid; grid-template-columns:repeat(3,minmax(240px,1fr)); gap:12px; }.fleet-driver-card { padding:16px; border:1px solid #dce7e3; border-radius:15px; background:#fff; box-shadow:0 4px 13px rgba(25,66,57,.04); }.fleet-driver-card.is-inactive { opacity:.68; filter:saturate(.55); }.fleet-driver-top { display:flex; align-items:center; gap:10px; }.fleet-avatar { display:grid; place-items:center; width:42px; height:42px; flex:0 0 auto; border-radius:13px; color:#176353; background:#e3f8f2; font:800 12px 'Sora',sans-serif; }.fleet-driver-top h4 { margin:0 0 4px; font-size:13px; }.fleet-more { margin-left:auto; width:40px; height:40px; border:0; border-radius:9px; background:#f3f6f5; cursor:pointer; }.fleet-driver-card dl { display:grid; grid-template-columns:1fr 1fr; gap:12px 8px; margin:16px 0 12px; }.fleet-driver-card dl div { min-width:0; }.fleet-driver-card dt { color:#96a29e; font-size:8px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }.fleet-driver-card dd { margin:4px 0 0; overflow:hidden; color:#354741; font:650 10px 'Sora',sans-serif; text-overflow:ellipsis; white-space:nowrap; }.fleet-status { display:inline-flex; align-items:center; width:max-content; padding:4px 7px; border-radius:999px; font-size:8px; font-weight:800; text-transform:uppercase; }.fleet-status--success { color:#12674f; background:#e4f8ef; }.fleet-status--route { color:#225e9f; background:#e7f1ff; }.fleet-status--danger { color:#a3382e; background:#ffebe9; }.fleet-status--muted { color:#687872; background:#edf1f0; }.fleet-capacity { height:5px; border-radius:8px; background:#edf2f0; overflow:hidden; }.fleet-capacity i { display:block; width:var(--fleet-load); height:100%; border-radius:inherit; background:#1abc9c; }.fleet-driver-card footer { display:flex; justify-content:flex-end; gap:6px; margin-top:13px; padding-top:12px; border-top:1px solid #eef2f1; }.fleet-driver-card footer button { min-height:38px; padding:0 9px; border:1px solid #e0e7e5; border-radius:8px; color:#35574f; background:#fff; font:700 9px 'Sora',sans-serif; cursor:pointer; }
.fleet-queue-grid { display:grid; grid-template-columns:repeat(2,minmax(280px,1fr)); gap:12px; }.fleet-queue { border:1px solid #dce7e3; border-radius:15px; background:#fff; overflow:hidden; }.fleet-queue>header { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:14px 15px; border-bottom:1px solid #edf2f0; }.fleet-queue header div { display:grid; gap:3px; }.fleet-queue header strong { font-size:12px; }.fleet-queue header small { color:#83918c; font:600 9px 'JetBrains Mono',monospace; }.fleet-queue-item { display:grid; grid-template-columns:28px minmax(0,1fr) auto; gap:9px; align-items:center; padding:11px 13px; border-bottom:1px solid #f0f3f2; }.fleet-queue-item>span { display:grid; place-items:center; width:26px; height:26px; border-radius:8px; color:#176151; background:#e9f8f4; font:800 9px 'JetBrains Mono',monospace; }.fleet-queue-item div:nth-child(2) { display:grid; gap:3px; min-width:0; }.fleet-queue-item strong { overflow:hidden; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }.fleet-queue-item small { color:#7f8e89; font-size:9px; }.fleet-order-controls { display:flex; gap:3px; }.fleet-order-controls button { width:34px; height:34px; border:1px solid #e0e8e5; border-radius:8px; background:#fff; cursor:pointer; }.fleet-order-controls button:disabled { opacity:.35; cursor:not-allowed; }.fleet-queue-empty { padding:22px; color:#81908b; font-size:10px; text-align:center; }.fleet-realtime { display:flex; align-items:center; gap:6px; color:#64756f; font-size:9px; }.fleet-realtime i { width:7px; height:7px; border-radius:50%; background:#36bd76; box-shadow:0 0 0 4px rgba(54,189,118,.1); }
.fleet-report-table { overflow:hidden; border:1px solid #e0e8e5; border-radius:13px; background:#fff; }.fleet-report-row { display:grid; grid-template-columns:minmax(180px,1.4fr) repeat(4,minmax(80px,.6fr)); gap:10px; align-items:center; min-height:48px; padding:0 14px; border-bottom:1px solid #edf1f0; font-size:10px; }.fleet-report-row--head { min-height:40px; color:#82908c; background:#f1f5f4; font-size:8px; font-weight:800; text-transform:uppercase; }.fleet-report-loading { padding:35px; color:#74837e; text-align:center; }
.fleet-mode-intro { display:grid; justify-items:center; min-height:620px; padding:70px 28px; border-radius:24px; color:#fff; background:radial-gradient(circle at 50% -5%,rgba(56,216,182,.42),transparent 38%),linear-gradient(145deg,#10231f,#164a3f 68%,#176c5a); text-align:center; }.fleet-mode-intro>p { max-width:610px; margin:14px 0 24px; color:rgba(255,255,255,.72); font-size:13px; line-height:1.7; }.fleet-mode-intro>small { max-width:520px; margin-top:14px; color:rgba(255,255,255,.6); font-size:9px; }.fleet-mode-illustration { position:relative; display:grid; place-items:center; width:102px; height:102px; margin-bottom:24px; border:1px solid rgba(255,255,255,.2); border-radius:30px; background:rgba(255,255,255,.1); font-size:43px; }.fleet-mode-illustration i { position:absolute; inset:-14px; border:1px solid rgba(255,255,255,.1); border-radius:36px; }.fleet-mode-illustration b { position:absolute; right:-8px; bottom:-8px; display:grid; place-items:center; width:33px; height:33px; border-radius:50%; color:#15483e; background:#7eebce; font-size:14px; }.fleet-mode-benefits { display:flex; gap:8px; flex-wrap:wrap; justify-content:center; margin-bottom:25px; }.fleet-mode-benefits span { display:flex; align-items:center; gap:7px; padding:9px 12px; border:1px solid rgba(255,255,255,.16); border-radius:999px; background:rgba(255,255,255,.07); font-size:9px; }.fleet-mode-benefits b { color:#82e8cf; font:700 8px 'JetBrains Mono',monospace; }
.fleet-state { display:grid; justify-items:center; align-content:center; min-height:520px; padding:30px; text-align:center; }.fleet-state>span { font-size:44px; }.fleet-state h2 { margin:16px 0 6px; }.fleet-state p { max-width:470px; color:#788680; line-height:1.6; }.fleet-state .fleet-btn { margin-top:18px; }.fleet-loading { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }.fleet-loading i { height:220px; border-radius:16px; background:linear-gradient(90deg,#eef3f1,#f8faf9,#eef3f1); background-size:200% 100%; animation:fleet-loading 1.2s infinite; }@keyframes fleet-loading { to { background-position:-200% 0; } }
.fleet-form-note { display:flex; gap:10px; margin-bottom:15px; padding:11px 12px; border:1px solid #dcebe7; border-radius:10px; color:#48645d; background:#f2faf7; }.fleet-form-note p { margin:0; font-size:10px; line-height:1.5; }.fleet-form-error { margin-top:12px; color:#b3382d; font-size:10px; }.fleet-modal-spacer { flex:1; }.fleet-access-status { padding:16px; border:1px solid #e0e9e6; border-radius:13px; background:#f7faf9; }.fleet-access-status p { margin:8px 0 0; color:#75847f; font-size:10px; }.fleet-access-card { display:grid; grid-template-columns:120px minmax(0,1fr); gap:16px; margin-top:14px; padding:15px; border:1px solid #dce8e4; border-radius:14px; }.fleet-qr-placeholder { display:grid; place-items:center; align-content:center; gap:4px; aspect-ratio:1; border:8px solid #fff; border-radius:10px; color:#fff; background:repeating-conic-gradient(#153f36 0 25%,#fff 0 50%) 50%/18px 18px; box-shadow:0 0 0 1px #e0e7e5; }.fleet-qr-placeholder span,.fleet-qr-placeholder small { padding:3px 5px; color:#153f36; background:#fff; font-weight:800; }.fleet-qr-placeholder small { font-size:6px; }.fleet-access-card>div:last-child>strong { font-size:13px; }.fleet-access-card p { color:#75847f; font-size:10px; line-height:1.5; }.fleet-access-card input { width:100%; min-height:42px; padding:0 10px; border:1px solid #dce7e3; border-radius:9px; color:#5d6f69; background:#f5f7f6; font:500 9px 'JetBrains Mono',monospace; }.fleet-access-actions { margin-top:9px; }.fleet-privacy-note { margin-top:9px; color:#876c27; font-size:8px; }
.fleet-empty { grid-column:1/-1; display:grid; justify-items:center; gap:6px; padding:50px; color:#7d8b87; text-align:center; }.fleet-empty>span { font-size:28px; }.fleet-empty strong { color:#42534e; }
#nav-fleet.fleet-mode-off { opacity:.72; }
@media(max-width:1100px){.fleet-driver-grid{grid-template-columns:repeat(2,minmax(230px,1fr))}.fleet-kpis{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){#page-fleet{padding:16px 12px 32px}body:has(#page-fleet.active) .main{max-width:100vw}.fleet-hero{align-items:flex-start;flex-direction:column;padding:24px}.fleet-hero-actions{width:100%}.fleet-hero-actions .fleet-btn{flex:1}.fleet-panel-head,.fleet-filters,.fleet-report-filters{align-items:stretch;flex-direction:column}.fleet-filters label{width:100%}.fleet-driver-grid,.fleet-queue-grid{grid-template-columns:1fr}.fleet-report-table{overflow-x:auto}.fleet-report-row{min-width:650px}.fleet-access-card{grid-template-columns:1fr}.fleet-qr-placeholder{width:120px}.fleet-modal-spacer{display:none}}
@media(max-width:480px){.fleet-kpis{grid-template-columns:1fr}.fleet-mode-intro{padding:48px 18px}.fleet-driver-grid{grid-template-columns:minmax(0,1fr)}}
