/* Approved Layout 2 — Map & Dispatch. */
:root{--navy:#082747;--blue:#087aff;--orange:#ff6a00;--bg:#f2f6fa}
body{background:#f2f6fa}.sidebar{background:#082747}.sidebar .brand{margin:0 auto}.sidebar .brand img{width:205px}.sidebar .workspace{background:#153c60;border:1px solid #365a7c;border-radius:10px;padding:12px}.sidebar .nav-item{border:1px solid #41668b;border-radius:9px;background:#16446d;margin-bottom:8px;min-height:48px;color:#fff}.sidebar .nav-item:hover{background:#215a8c}.sidebar .nav-item.active{background:#ff6a00;border-color:#ff6a00;color:#102b45;box-shadow:0 3px 10px #0002}.sidebar .nav-item.active svg{color:inherit}.sidebar .nav-count{background:#ffffff22;color:inherit}
.topbar{background:white;border-bottom:1px solid #dce5ee}.top-actions button{font-size:12px;min-height:40px}.demo-banner{display:none}#cloudSyncStatus[data-connection="online"]{display:none}#cloudSyncStatus:not([data-connection="online"]){position:relative;z-index:40;margin-left:246px!important}.page-heading{margin-bottom:20px}.page-heading h1{font-size:30px}main{padding-top:25px}.panel{border-radius:12px;box-shadow:0 3px 14px #08274705}
.dispatch-board{margin-bottom:24px}.dispatch-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:20px}.dispatch-stats>div{background:#fff;border:1px solid #dce5ee;border-radius:11px;display:flex;align-items:center;gap:14px;padding:17px 20px}.dispatch-stats strong{font-size:28px;color:#082747}.dispatch-stats span{font-size:13px;color:#526b82}
.dispatch-grid{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:20px;align-items:start}#dispatchSelection{min-width:0}.dispatch-map-panel,.dispatch-driver-panel,.dispatch-detail{background:white;border:1px solid #dce5ee;border-radius:12px;overflow:hidden}.dispatch-panel-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:18px 20px}.dispatch-panel-head h2,.dispatch-detail h2{font-size:19px;margin:3px 0}.dispatch-map-panel .driver-location-map{display:block;height:390px;margin:0;border:0;border-radius:0}.dispatch-map-caption{padding:14px 20px;display:flex;gap:10px;justify-content:space-between;flex-wrap:wrap;font-size:12px;color:#526b82}.dispatch-map-caption strong{color:#173a59}.dispatch-no-location{height:390px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#edf4fa;padding:30px;text-align:center;color:#526b82}.dispatch-no-location>span{font-size:70px;color:#087aff}.dispatch-no-location h3{font-size:22px;color:#173a59;margin:12px 0}.dispatch-no-location p{max-width:350px;line-height:1.7}.dispatch-empty{padding:35px 24px;color:#526b82}
.dispatch-sort{padding:0 18px 15px;display:grid;gap:7px;font-size:12px;color:#526b82}.dispatch-sort select{width:100%;min-height:42px}.dispatch-driver-list{max-height:560px;overflow:auto;padding:0 12px 12px}.dispatch-driver{width:100%;display:flex;gap:12px;padding:15px 10px;margin-bottom:8px;text-align:left;background:white;border:1px solid #dce5ee;border-radius:10px;font-weight:400;line-height:1.5}.dispatch-driver.selected{background:#edf5ff;border:2px solid #087aff;padding:14px 9px}.dispatch-driver:hover{background:#f4f8fc}.dispatch-driver>span:last-child{min-width:0;overflow-wrap:anywhere}.dispatch-driver strong{font-size:14px}.dispatch-driver .avatar{flex-shrink:0;background:#e7eff8;color:#1b5688}.dispatch-run{display:block;margin-top:7px;color:#526b82}.dispatch-run .sub{font-size:11px}.dispatch-run strong{font-size:12px}.dispatch-detail{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:20px;margin-top:18px}.dispatch-detail p{font-size:12px;color:#526b82}.dispatch-detail-actions{display:flex;gap:8px;align-content:start;align-items:start;flex-wrap:wrap}.dispatch-detail-actions button{min-height:42px;font-size:12px}.dispatch-detail-actions .primary{background:#ff6a00;border-color:#ff6a00;color:#102b45}.dispatch-detail .sub{white-space:normal}.dispatch-board+.monitor-summary{border-top:1px solid #dce5ee}
@media(min-width:1600px){.dispatch-grid{grid-template-columns:minmax(0,1fr) 360px}.dispatch-map-panel .driver-location-map,.dispatch-no-location{height:440px}}
@media(max-width:1100px){.dispatch-grid{grid-template-columns:minmax(0,1fr) 260px}.dispatch-stats>div{padding:14px;gap:9px}.dispatch-stats strong{font-size:23px}.dispatch-stats span{font-size:11px}.dispatch-detail{grid-template-columns:1fr}.dispatch-map-caption{display:grid}}
@media(max-width:800px){.dispatch-grid{grid-template-columns:1fr}.dispatch-driver-panel{grid-row:1}.dispatch-driver-list{display:flex;max-height:220px;gap:8px;overflow:auto}.dispatch-driver{min-width:220px;max-width:260px;margin:0}.dispatch-sort{display:flex;align-items:center}.dispatch-sort select{flex:1}.dispatch-stats{grid-template-columns:1fr 1fr}.dispatch-map-panel .driver-location-map,.dispatch-no-location{height:320px}.dispatch-detail{grid-template-columns:1fr 1fr}#cloudSyncStatus:not([data-connection="online"]){margin-left:0!important}}
@media(max-width:480px){.top-actions{gap:4px}.top-actions button{font-size:10px;padding:7px}.breadcrumb{display:none}.dispatch-detail{grid-template-columns:1fr}.dispatch-panel-head{padding:15px}.dispatch-panel-head .driver-presence{font-size:11px}}

/* Match the approved logo background; no logo frame. */
.sidebar,.topbar{background:#01245a}.topbar{color:white;border-bottom:0}.topbar .breadcrumb,.topbar .breadcrumb strong,.topbar .breadcrumb span{color:white}.topbar .icon-button{background:transparent;color:white;border-color:#627fa8}.sidebar .brand,.sidebar .brand img{border:0;border-radius:0;box-shadow:none;background:transparent}

/* Shared navigation tiles: same artwork, color and active state in both locations. */
.workspace-primary-nav{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;padding:16px 24px;background:#082747;border-bottom:1px solid #365a7c}
.workspace-primary-nav .nav-item,.sidebar .nav-item{display:flex;align-items:center;gap:10px;min-height:52px;padding:12px;border:1px solid #41668b;border-radius:9px;background:#16446d;color:#fff;font-size:13px;font-weight:700;text-align:left;line-height:1.3;box-shadow:0 2px 3px #0002;margin:0;cursor:pointer}
.workspace-primary-nav .nav-item svg,.sidebar .nav-item svg{width:22px;height:22px;flex:0 0 22px;color:inherit}
.workspace-primary-nav .nav-item:hover,.sidebar .nav-item:hover{background:#215a8c;border-color:#8aa9c3}
.workspace-primary-nav .nav-item.active,.sidebar .nav-item.active{background:#ff6a00;border-color:#ff6a00;color:#102b45;box-shadow:0 3px 10px #0002}
.workspace-primary-nav .nav-item:focus-visible,.sidebar .nav-item:focus-visible{outline:3px solid #ffb65c;outline-offset:3px}
.workspace-primary-nav .nav-item:before,.sidebar .nav-item:before{display:none}
.workspace-primary-nav .nav-count{background:#ffffff22;color:inherit;margin-left:auto}
.sidebar #nav,.workspace-utilities{display:flex;flex-direction:column;gap:8px}
.workspace-utilities{margin-top:14px;padding-top:14px;border-top:1px solid #365a7c;flex-shrink:0}
@media(max-width:1250px){.workspace-primary-nav{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.workspace-primary-nav{padding:12px 16px;gap:8px}.workspace-primary-nav .nav-item{font-size:12px;padding:10px;gap:7px}}
@media(max-width:430px){.workspace-primary-nav{grid-template-columns:repeat(2,minmax(0,1fr))}}