body:is([data-role=driver],[data-role=supplier]){--team:#185d70;--team-dark:#123847;--team-tint:#eaf3f5;background:#f2f5f5;color:#1d343d}body[data-role=supplier]{--team:#936022;--team-dark:#503d24;--team-tint:#f6efe1;background:#f8f6f1}body:is([data-role=driver],[data-role=supplier]) main{max-width:1080px;padding:24px}body:is([data-role=driver],[data-role=supplier]) header{padding-bottom:20px;border-bottom:1px solid #dce3e3}body:is([data-role=driver],[data-role=supplier]) header strong{letter-spacing:2px;color:var(--team)}body:is([data-role=driver],[data-role=supplier]) header h1{font-size:25px}body:is([data-role=driver],[data-role=supplier]) header a{display:none}body:is([data-role=driver],[data-role=supplier]) button{min-height:46px;border-radius:12px;border-color:#ced8db;color:var(--team-dark)}body:is([data-role=driver],[data-role=supplier]) button.primary,body:is([data-role=driver],[data-role=supplier]) nav button.active{background:var(--team);border-color:var(--team);color:white}body:is([data-role=driver],[data-role=supplier]) button:focus-visible{outline:3px solid #d59b45;outline-offset:3px}body:is([data-role=driver],[data-role=supplier]) nav{padding:8px 0;gap:8px}body:is([data-role=driver],[data-role=supplier]) .card{border-radius:20px;border-color:#dfe5e4;box-shadow:0 5px 20px #12384705;padding:24px}body:is([data-role=driver],[data-role=supplier]) #message{position:static;background:var(--team-tint);color:var(--team-dark);font-size:13px}body:is([data-role=driver],[data-role=supplier]) .notice{background:#eeeae0;color:#5b5e54;font-size:12px}body:is([data-role=driver],[data-role=supplier]) .badge{background:var(--team-tint);color:var(--team-dark);border-radius:25px;line-height:1.8}body:is([data-role=driver],[data-role=supplier]) dialog{border-radius:22px;border-color:#d8e1e1}body:is([data-role=driver],[data-role=supplier]) input,body:is([data-role=driver],[data-role=supplier]) select{min-height:46px}.team-hero{padding:30px;border-radius:24px;background:var(--team-dark);color:#fff;margin:20px 0}.team-hero-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.team-eyebrow{font-size:11px;letter-spacing:1.7px;font-weight:700}.team-hero .team-eyebrow{color:#d5e4e6}.team-hero h2{font-size:clamp(23px,3.5vw,32px);line-height:1.4;margin:14px 0 10px}.team-hero p{font-size:14px;color:#e2e7e5}.team-role-pill{border:1px solid #ffffff50;border-radius:30px;padding:8px 12px;font-size:12px;white-space:nowrap}.team-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:24px}.team-metric{padding:17px;border:1px solid #ffffff28;background:#ffffff09;border-radius:14px;min-width:0}.team-metric strong{display:block;font-size:30px;line-height:1.3;font-variant-numeric:tabular-nums}.team-metric span{display:block;font-size:12px;margin-top:8px;color:#e2e7e5}.team-next{display:flex;align-items:center;justify-content:space-between;gap:16px;background:var(--team-tint);border:1px solid #ccdedf;padding:24px;border-radius:20px}.team-next h3{margin:10px 0}.team-next p{margin:0;color:#4d626b;font-size:14px}.team-tip{font-size:13px;line-height:1.8;color:#58656a;margin:20px 4px}.team-flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:22px 0}.team-flow article{background:#fff;border:1px solid #e4dfd5;border-radius:18px;padding:22px}.team-flow span{display:block;font-size:13px;color:var(--team);margin-bottom:14px;font-weight:700}.team-flow strong{font-size:18px}.team-flow p{font-size:14px;line-height:1.7;color:#696458;margin-bottom:0}.route-progress{padding:15px 18px;border-radius:12px;background:var(--team-tint);margin:16px 0}.route-progress>div{display:flex;justify-content:space-between;gap:12px;font-size:13px}.route-progress progress{display:block;width:100%;height:8px;border:0;border-radius:10px;margin-top:12px;accent-color:#218263;overflow:hidden}.route-progress progress::-webkit-progress-bar{background:#d5e3e3}.route-progress progress::-webkit-progress-value{background:#218263}body[data-role=driver] .step{border-left:3px solid #b7d0d6;border-bottom:1px solid #edf1f1;padding:12px 16px 18px;margin:16px 0}body[data-role=driver] .step.stop-delivered{border-left-color:#318268;background:#f3f8f4;border-radius:0 12px 12px 0}body[data-role=driver] .step.stop-arrived{border-left-color:#c48a24;background:#fff9ec;border-radius:0 12px 12px 0}.driver-route-card>p{line-height:1.75;overflow-wrap:anywhere}.driver-route-card>.row{gap:10px}
@media(max-width:650px){body:is([data-role=driver],[data-role=supplier]) main{padding:14px}body:is([data-role=driver],[data-role=supplier]) header>.row{gap:6px}body:is([data-role=driver],[data-role=supplier]) header button{font-size:12px;padding:9px;min-height:42px}body:is([data-role=driver],[data-role=supplier]) nav{position:sticky;top:0;z-index:4;background:#f3f5f3}body:is([data-role=driver],[data-role=supplier]) nav button{flex-shrink:0;font-size:14px}body:is([data-role=driver],[data-role=supplier]) .card{padding:18px}.team-hero{padding:24px 18px}.team-role-pill{display:none}.team-metrics{gap:8px}.team-metric{padding:12px 9px}.team-metric strong{font-size:23px}.team-metric span{font-size:11px}.team-next{align-items:stretch;flex-direction:column;padding:20px}.team-flow{grid-template-columns:1fr;gap:10px}.team-flow article{padding:18px}.team-flow span{float:left;margin:2px 15px 0 0}.team-flow p{margin-top:8px}.driver-route-card>.row>button{flex:1 1 140px}}

.team-date-bar{display:flex;align-items:end;justify-content:space-between;gap:14px;flex-wrap:wrap;margin:20px 0}.team-date-bar label{margin:0;min-width:180px;font-size:13px;color:var(--team-dark)}
/* Shared operational workspace: keep data dense while separating each action group. */
body:is([data-workspace=admin],[data-role=supplier],[data-role=driver]){background:#f4f6fa;color:#20334d}
.workflow-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:20px 0}.workflow-heading h2{margin:0;font-size:25px}.workflow-heading p{margin:7px 0;color:#64748b;font-size:14px}.workflow-heading label{margin:0;min-width:185px;font-size:13px}.workflow-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:20px 0}.workflow-group{background:#fff;border:1px solid #dfe6ef;border-radius:16px;padding:20px;border-top:3px solid #33758b;box-shadow:0 4px 16px #20334d04}.workflow-group h3{margin:0 0 10px;font-size:17px}.workflow-group p{color:#607086;font-size:14px;line-height:1.7;min-height:48px}.workflow-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.workflow-actions button{font-size:14px;padding:9px 12px;min-height:40px}.workflow-actions details{margin:0}.workflow-actions summary{cursor:pointer;padding:9px 12px;border:1px solid #dce3ec;border-radius:9px;font-size:14px}.workflow-actions details[open]{flex-basis:100%}.workflow-actions details .workflow-actions{padding-top:9px}.workflow-summary{display:flex;gap:12px;flex-wrap:wrap}.workflow-summary>span{padding:12px 18px;background:#eaf0f7;border-radius:10px;color:#4b6079;font-size:14px}.workflow-summary b{font-size:21px;margin-left:10px;color:#18374e}.status-pill{display:inline-block;border-radius:20px;background:#edf3f9;color:#375674;padding:5px 10px;font-size:13px;white-space:nowrap}.archive-routes{background:#eef1f6;border:1px solid #dce3ec;border-radius:12px;padding:15px}.archive-routes summary{cursor:pointer;color:#52647b}.empty-state{padding:24px;color:#64748b;text-align:center}
body[data-workspace=admin] #content>.card{border-radius:16px;padding:22px;border-color:#e0e6ef;box-shadow:0 4px 16px #20334d03}body[data-workspace=admin] #content>.card>h2{margin:0 0 18px;font-size:19px}body[data-workspace=admin] table th,body[data-role=supplier] table th{background:#f0f4f8;color:#52657c;font-size:13px;font-weight:600;white-space:nowrap}body[data-workspace=admin] table td,body[data-role=supplier] table td{vertical-align:top}body[data-workspace=admin] table tr:hover td,body[data-role=supplier] table tr:hover td{background:#fafcff}body[data-workspace=admin] button:hover:not(:disabled){border-color:#5582ab;background:#edf4fb}body[data-workspace=admin] button.primary:hover:not(:disabled){background:#1243ac;color:white}body[data-workspace=admin] button:focus-visible{outline:3px solid #8db4ef;outline-offset:2px}body[data-workspace=admin] #content .card>button{margin:0 8px 8px 0}button[data-action=route-revoke],button[data-action=user-status]{color:#a83232;border-color:#e8baba;background:#fff7f7}button[data-close],button#close,button[data-action=close]{background:#e8edf4!important;border-color:#b6c4d6!important;color:#243d59!important}dialog [role=alert],.formError{color:#b42318}dialog{box-shadow:0 20px 70px #102b4238}button,input,select,textarea{transition:border-color .15s,background-color .15s}button:disabled{cursor:not-allowed}
@media(max-width:850px){.workflow-grid{grid-template-columns:1fr}.workflow-group p{min-height:0}.workflow-heading{align-items:flex-start;flex-wrap:wrap}.workflow-heading label{width:100%}.workflow-summary{gap:7px}.workflow-summary>span{padding:9px 12px}.workflow-actions button{flex:1 1 auto}.workflow-heading h2{font-size:22px}}

.workflow-actions button,.workflow-actions summary{white-space:nowrap}.workflow-actions{min-width:110px}