@import "https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800&display=swap";@import "https://fonts.googleapis.com/css2?family=Hedvig+Letters+Sans&display=swap";:root{--navy:#000;--orange:#d81118;--gold:#f2b705;--muted:#6b6f76;--soft:#f6f7f8;--line:#e4e7eb;--green:#1fbf75}*{box-sizing:border-box}body{background:var(--soft);color:#122033;margin:0;font-family:Inter,Segoe UI,Arial,sans-serif}button,input{font:inherit}.login-page{color:#fff;background:#000;grid-template-columns:.9fr 1.1fr;min-height:100vh;display:grid}.login-hero{background:radial-gradient(circle at 20% 20%,#ff7a1a59,#0000 28%);flex-direction:column;justify-content:center;padding:90px;display:flex}.login-route-panel{grid-area:1/2;align-items:stretch;gap:22px}.login-route-heading .eyebrow{margin:0 0 8px}.login-route-heading h1{color:#fff;max-width:640px;margin:0;font-size:clamp(30px,3vw,42px);line-height:1.04}.login-route-map{background:#dce8e4;border:1px solid #fff3;border-radius:12px;height:clamp(260px,34vh,380px);min-height:260px;position:relative;overflow:hidden}.login-route-leaflet,.login-route-map .leaflet-container{width:100%;height:100%}.login-route-map .leaflet-container{font-family:Hedvig Letters Sans,sans-serif}.login-map-status{z-index:500;color:#16283c;background:#fffffff0;border:1px solid #ffffffbf;border-radius:8px;grid-template-columns:9px 1fr;align-items:center;column-gap:8px;min-width:174px;padding:10px 12px;display:grid;position:absolute;top:12px;left:12px;box-shadow:0 5px 18px #091f3d24}.login-map-status strong{font-size:10px;line-height:1.2}.login-map-status small{color:#697887;grid-column:2;margin-top:3px;font-size:10px}.login-map-status-dot{background:#c58b12;border-radius:50%;width:8px;height:8px}.login-map-status-dot.live{background:#14804a;box-shadow:0 0 0 3px #14804a24}.login-map-status-dot.unavailable{background:#c0392b}.login-map-credit{z-index:500;color:#33475b;background:#ffffffe6;border:1px solid #ffffffbf;border-radius:5px;padding:6px 8px;font-size:9px;text-decoration:none;position:absolute;top:12px;right:12px}.login-map-credit:hover{color:#16283c;text-decoration:underline}.login-route-preview-tag{z-index:500;color:#fff;background:#122538db;border-radius:5px;padding:6px 9px;font-size:9px;font-weight:800;position:absolute;bottom:12px;left:12px}.login-route-truck-icon,.login-live-truck-icon{background:0 0!important;border:0!important}.login-truck-glyph{filter:drop-shadow(0 3px 3px #12253859);place-items:center;width:42px;height:42px;display:grid}.login-truck-glyph svg{width:34px;height:34px;overflow:visible;transform:scaleX(-1)}.login-truck-glyph path{fill:#d81118;stroke:#fff;stroke-linejoin:round;stroke-width:1.5px}.login-truck-glyph circle{fill:#17283a;stroke:#fff;stroke-width:1.2px}.login-route-truck-icon .login-truck-glyph{animation:.85s ease-in-out infinite alternate route-truck-bob}.login-live-truck-icon .login-truck-glyph{animation:1.8s ease-in-out infinite live-truck-pulse}@keyframes route-truck-bob{to{transform:translateY(-4px)}}@keyframes live-truck-pulse{50%{filter:drop-shadow(0 0 8px #d81118ad)}}.login-route-stops{flex-wrap:wrap;gap:8px 0;margin:0;padding:0;list-style:none;display:flex}.login-route-stops li{color:#dbe7f5;white-space:nowrap;align-items:center;font-size:12px;display:flex}.login-route-stops li:not(:last-child):after{content:"";background:#ffffff73;width:20px;height:2px;margin:0 7px}.login-route-stops li:before{content:"";border:2px solid #ffffffbf;border-radius:50%;width:7px;height:7px;margin-right:6px}.login-route-stops .route-endpoint:before{background:#d81118;border-color:#d81118}.login-hero h1{max-width:760px;font-size:clamp(30px,3vw,42px);line-height:1.05}.login-hero p{color:#dbe7f5;font-size:18px}.eyebrow{text-transform:uppercase;letter-spacing:.16em;color:var(--orange);font-size:13px;font-weight:900}.login-card,.form-panel{color:#122033;background:#fff;border-radius:30px;place-self:center;width:min(460px,90%);padding:36px;box-shadow:0 35px 90px #0000002e}.login-card{grid-area:1/1}.login-card h2{margin-top:0;font-size:32px}label{text-transform:uppercase;color:var(--muted);margin:16px 0 8px;font-size:12px;font-weight:900;display:block}input{border:1px solid var(--line);border-radius:16px;width:100%;padding:15px 16px}.primary{background:linear-gradient(135deg, var(--orange), #f24900);color:#fff;cursor:pointer;border:0;border-radius:999px;margin-top:16px;padding:14px 24px;font-weight:900;box-shadow:0 16px 35px #ff7a1a47}.primary:disabled{opacity:.65;cursor:not-allowed}.form-error{color:#b42318;background:#fff0f0;border-radius:14px;margin:14px 0;padding:13px}.form-success{color:#0d7b49;background:#eafaf2;border-radius:14px;margin:14px 0;padding:13px}.app-shell{grid-template-columns:290px 1fr;min-height:100vh;display:grid}.sidebar{background:var(--navy);color:#fff;flex-direction:column;gap:22px;padding:24px;display:flex}.brand{color:#fff;align-items:center;text-decoration:none;display:flex}.brand img{object-fit:contain;width:min(148px,100%);height:auto;display:block}.role-card{background:#ffffff14;border-radius:20px;align-items:center;gap:12px;margin-bottom:16px;padding:16px;display:flex}.role-card small{color:#b9c9dc;margin-top:4px;display:block}.sidebar nav{gap:8px;display:grid}.sidebar nav a,.logout{color:#dce8f6;text-align:left;cursor:pointer;background:0 0;border:0;border-radius:16px;align-items:center;gap:12px;padding:14px;text-decoration:none;display:flex}.sidebar nav a.active,.sidebar nav a:hover,.logout:hover{color:#fff;background:#ffffff1f}.logout{margin-top:auto}.content{padding:42px}.page-title h1{margin:4px 0 30px;font-size:42px}.kpi-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;display:grid}.kpi,.tracking-result,.search-panel,.vehicle-card,.workflow article{border:1px solid var(--line);background:#fff;border-radius:24px;padding:26px;box-shadow:0 16px 45px #091f3d14}.kpi span{color:var(--orange);font-size:34px;font-weight:900}.kpi p{color:var(--muted)}.search-panel{grid-template-columns:1fr auto;gap:14px;margin-bottom:22px;display:grid}.row{border-bottom:1px solid var(--line);justify-content:space-between;gap:20px;padding:14px 0;display:flex}.fleet-grid{grid-template-columns:1.5fr .8fr;gap:22px;display:grid}.map-mock{color:#fff;background:radial-gradient(circle at 70% 40%,#ff7a1a6b,#0000 22%),linear-gradient(135deg,#000,#000);border-radius:28px;align-items:end;min-height:460px;padding:28px;display:flex}.vehicle-card{gap:6px;margin-bottom:14px;display:grid}.vehicle-card span{color:var(--green);font-weight:800}.workflow{grid-template-columns:repeat(5,1fr);gap:18px;display:grid}.workflow article{font-weight:900}@media (width<=980px){.login-page,.app-shell,.kpi-grid,.fleet-grid,.workflow{grid-template-columns:1fr}.login-card{grid-area:1/1}.login-route-panel{grid-area:2/1}.sidebar{position:static}.login-hero{padding:36px 28px}.login-hero h1{font-size:38px}.login-route-map{height:300px}.login-route-stops li:not(:last-child):after{width:12px;margin-inline:5px}.content{padding:24px}}.dashboard-page{gap:24px;display:grid}.dashboard-header{flex-wrap:wrap;justify-content:space-between;align-items:center;display:flex}.dashboard-kpis{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;display:grid}.dashboard-card{text-align:center;background:#fff;border:1px solid #e7edf5;border-radius:20px;padding:24px;box-shadow:0 10px 25px #091f3d0f}.dashboard-card svg{color:#ff7a1a}.dashboard-card h2{margin:12px 0 6px;font-size:2rem}.dashboard-card p{color:#6b7c93;margin:0}.dashboard-section{background:#fff;border:1px solid #e7edf5;border-radius:20px;padding:24px;overflow-x:auto;box-shadow:0 10px 25px #091f3d0f}.dashboard-section h2{margin-top:0}.dashboard-table{border-collapse:collapse;width:100%}.dashboard-table th,.dashboard-table td{text-align:left;border-bottom:1px solid #edf2f7;padding:12px}.dashboard-table th{color:#6b7c93;text-transform:uppercase;font-size:.75rem}@media (width<=1024px){.dashboard-kpis{grid-template-columns:repeat(2,1fr)}}@media (width<=768px){.dashboard-page{gap:16px}.dashboard-header{display:block}.dashboard-kpis{grid-template-columns:1fr}.dashboard-card{text-align:left;align-items:center;gap:16px;display:flex}.dashboard-card h2{margin:0;font-size:1.5rem}.dashboard-section{padding:16px}}@media (width<=480px){.page-title h1{font-size:1.75rem}.dashboard-card{padding:18px}}.fleet-title-row{justify-content:space-between;align-items:flex-start;gap:20px;display:flex}.subtle-text{color:#6b7c93;margin-top:-18px}.compact{white-space:nowrap;align-items:center;gap:8px;width:auto;display:inline-flex}.fleet-grid-map{grid-template-columns:1.6fr .7fr}.google-map-shell{background:#e7edf5;border:1px solid #e7edf5;border-radius:28px;height:620px;min-height:620px;overflow:hidden;box-shadow:0 16px 45px #091f3d14}.map-empty-state{color:#6b7c93;place-items:center;height:100%;font-weight:800;display:grid}.map-info-window{gap:6px;min-width:190px;font-size:13px;display:grid}.map-info-window strong{color:#071b35;font-size:15px}.map-info-window span{color:#34465e}.vehicle-side-list{max-height:620px;padding-right:4px;overflow-y:auto}.vehicle-summary-card{color:#fff;background:#071b35;border-radius:24px;align-items:center;gap:14px;margin-bottom:14px;padding:20px;display:flex}.vehicle-summary-card strong{color:#ffc247;font-size:32px;display:block}.vehicle-summary-card span{color:#dce8f6;display:block}.vehicle-card.clickable{cursor:pointer;transition:transform .2s,border-color .2s,box-shadow .2s}.vehicle-card.clickable:hover{border-color:#ff7a1a;transform:translateY(-2px)}.vehicle-card.selected{border-color:#ff7a1a;box-shadow:0 16px 45px #ff7a1a2e}@media (width<=980px){.fleet-title-row,.fleet-grid-map{grid-template-columns:1fr;display:grid}.google-map-shell{height:460px;min-height:460px}.vehicle-side-list{max-height:none}.tracking-timeline{margin-top:30px;position:relative}.timeline-item{gap:20px;padding-bottom:30px;display:flex;position:relative}.timeline-marker{background:#f5f5f5;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;font-size:20px;display:flex}.timeline-item:before{content:"";background:#ccc;width:2px;height:100%;position:absolute;top:40px;left:20px}.timeline-content{flex:1}.event-time{color:#666}.event-status{font-size:18px;font-weight:700}.event-location{color:#999}.progress-bar{background:#eee;border-radius:30px;width:100%;height:12px}.progress-fill{background:#00b050;border-radius:30px;height:100%}.mobile-topbar{display:none}@media (width<=900px){.app-shell{flex-direction:column;display:flex}.sidebar{z-index:999;width:100%;min-height:auto;padding:12px;position:sticky;top:0}.mobile-topbar{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.desktop-content{flex-direction:column;display:flex}.role-card{display:none}.sidebar nav{scrollbar-width:thin;gap:10px;padding-bottom:5px;display:flex;overflow-x:auto}.sidebar nav a{white-space:nowrap;background:#ffffff14;border-radius:999px;flex-shrink:0;padding:10px 14px}.sidebar nav a.active{color:#fff;background:#ff7a1a}.logout{display:none!important}.mobile-logout{cursor:pointer;color:#fff;background:#d40511;border:0;border-radius:999px;flex-shrink:0;align-items:center;gap:6px;padding:10px 14px;font-size:13px;font-weight:700;display:flex}.content{width:100%;padding:16px}}}.vehicle-card .vehicle-waybill{color:#ef4d00;word-break:break-word;font-size:.8rem;font-weight:800}.dashboard-card-link{cursor:pointer;font:inherit;text-align:center;border:1px solid #0000}.dashboard-card-link:hover,.dashboard-card-link.active{border-color:#ef4d00;transform:translateY(-2px)}.dashboard-row-link{cursor:pointer}.dashboard-row-link:hover{background:#ef4d0014}.dashboard-pager{justify-content:center;align-items:center;gap:16px;margin-top:16px;display:flex}.dashboard-pager button{cursor:pointer;background:#fff;border:1px solid #d6dbe0;border-radius:50%;place-items:center;width:38px;height:38px;display:grid}.dashboard-pager button:hover:not(:disabled){color:#ef4d00;border-color:#ef4d00}.dashboard-pager button:disabled{opacity:.4;cursor:not-allowed}.dashboard-pager span{color:#64748b;font-size:.9rem}:root{--sab-navy:#000;--sab-red:#d81118;--sab-red-dark:#ad0d14;--sab-gold:#fc0;--sab-ink:#1d2733;--sab-text:#535353;--sab-muted:#73777d;--sab-line:#e4e7eb;--sab-surface:#fff;--sab-wash:#ecf0f1;--sab-wash-warm:#f7f8ed;--sab-red-wash:#fff1f1}body{background:var(--sab-wash)!important;color:var(--sab-text)!important;font-family:Hedvig Letters Sans,sans-serif!important}.content{width:100%;min-width:0;padding:clamp(24px,4vw,48px) clamp(16px,4vw,56px) 56px!important}.content>*{width:min(100%,1300px);max-width:1300px;margin-inline:auto}.dashboard-page,.operation-page,.reports-page,.tracking-page,.um-page,.fleet-report-panel{width:100%;max-width:1300px;margin-inline:auto}.dashboard-page,.operation-page,.reports-page,.tracking-page,.um-page{gap:24px;display:grid}.page-title,.dashboard-header,.fleet-title-row,.operation-title,.reports-toolbar,.tracking-hero,.um-hero{width:100%}.page-title h1,.operation-title h1,.reports-toolbar h1,.dashboard-header h1{margin-top:0}h1,h2,h3,h4,.brand,.page-title h1{color:var(--sab-navy);font-family:Outfit,Hedvig Letters Sans,sans-serif}.login-page h1{padding:0!important}.sidebar{background:#000!important}.vehicle-summary-card{background:var(--sab-navy)!important}.sidebar nav a.active,.sidebar nav a:hover,.logout:hover{background:#d8111838!important}.primary,.operation-primary,.tracking-search button,.report-actions button:last-child,.fleet-report-header button,.um-hero>button{box-shadow:0 12px 28px #d8111833;background:var(--sab-red)!important;border-color:var(--sab-red)!important}.primary:hover,.operation-primary:hover,.tracking-search button:hover,.report-actions button:last-child:hover,.fleet-report-header button:hover,.um-hero>button:hover{background:var(--sab-red-dark)!important}.eyebrow,.operation-title>svg,.operation-title p,.reports-toolbar p,.report-card-heading span,.fleet-report-header p,.tracking-kicker,.dashboard-card svg,.um-stats svg{color:var(--sab-red)!important}.operation-title>svg{background:var(--sab-red-wash)!important}.login-page{background:radial-gradient(52% 58% at 20% 48%,#d8111880 0%,#d8111833 48%,#0000 100%),#000!important}.tracking-hero,.map-mock{background:linear-gradient(135deg,#000,#000)!important}.login-hero{background:0 0!important}.login-card,.form-panel,.kpi,.tracking-result,.search-panel,.vehicle-card,.workflow article,.dashboard-card,.dashboard-section,.operation-form,.qr-preview,.report-kpis article,.report-card,.shipment-summary,.updates-card,.um-stats article,.um-toolbar,.um-table-wrap,.fleet-report-panel{border-color:var(--sab-line)!important;box-shadow:0 12px 35px #020e2812!important}input:focus,select:focus,textarea:focus{outline:2px solid #d8111838;border-color:var(--sab-red)!important}.um-hero{color:#fff!important;background:linear-gradient(125deg,#000,#000)!important;box-shadow:0 18px 48px #020e2833!important}.um-hero h1,.um-hero p,.um-hero span{color:#fff}.um-hero>button{color:#fff!important}.fleet-report-kpis article{border-top-color:var(--sab-gold)!important;background:#fff8e1!important}.status-active{background:var(--sab-red-wash)!important;color:var(--sab-red-dark)!important}.mobile-logout{background:var(--sab-red)!important}
