:root{
  --navy:#063b70;--navy2:#082f59;--blue:#0a72b8;--cyan:#08abc9;--cyan2:#67dce8;
  --ice:#eef8fc;--sky:#dff4fb;--ink:#12324c;--muted:#688096;--line:#d8e8f0;--white:#fff;
  --green:#36a852;--green2:#e8f7ec;--amber:#c78014;--amber2:#fff4df;--red:#c33e48;--red2:#fff0f1;
  --shadow:0 18px 50px rgba(4,54,100,.11);--shadow2:0 8px 24px rgba(4,54,100,.10);--radius:22px;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:#f3f8fb}button,input,select,textarea{font:inherit}button{cursor:pointer}a{color:inherit}.hide{display:none!important}
.btn{border:0;border-radius:12px;padding:11px 15px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;transition:.18s ease}.btn:hover{transform:translateY(-1px)}.btn-primary{background:linear-gradient(90deg,var(--cyan),#0794d0);color:white}.btn-navy{background:var(--navy);color:#fff}.btn-green{background:var(--green);color:#fff}.btn-soft{background:#eaf6fb;color:var(--navy)}.btn-outline{background:white;border:1px solid #b9d6e4;color:var(--navy)}.btn-danger{background:var(--red2);color:var(--red)}.btn-block{width:100%}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow2);padding:20px}.field{display:flex;flex-direction:column;gap:7px}.field label{font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:var(--navy);font-weight:900}.field input,.field select,.field textarea{width:100%;border:1px solid #cfe1ea;border-radius:12px;padding:12px 13px;background:#fff;color:var(--ink);outline:none}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(8,171,201,.10)}.field small{color:var(--muted);font-size:11px;line-height:1.4}.grid{display:grid;gap:14px}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.notice{border-radius:15px;padding:14px 15px;display:flex;gap:12px;align-items:flex-start;font-size:13px}.notice strong{display:block;color:var(--navy);margin-bottom:2px}.notice span{display:block;color:var(--muted);line-height:1.45}.notice.info{background:#edf9fd}.notice.warn{background:var(--amber2)}.notice.error{background:var(--red2)}.notice.success{background:var(--green2)}
.pill{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:7px 10px;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.05em;background:#e8f5fa;color:var(--navy)}.pill.active{background:#e3f6e7;color:#267b3a}.live-dot{width:7px;height:7px;border-radius:50%;background:#29a84a;box-shadow:0 0 0 4px rgba(41,168,74,.12)}
.status{display:inline-flex;padding:6px 9px;border-radius:999px;font-size:10px;font-weight:900;text-transform:uppercase;white-space:nowrap}.status.confirmed{background:#e6f2ff;color:#1365a4}.status.on_way{background:#fff0dd;color:#b56605}.status.arrived{background:#efeaff;color:#6652b9}.status.onboard{background:#e8f5ff;color:#00689b}.status.completed{background:#e6f7ea;color:#2b8b42}.status.cancelled{background:#ffe8ea;color:#b5303c}.status.requested{background:#fff4d8;color:#9a6500}.status.declined{background:#f2f2f2;color:#6f7780}
.metric{background:#f7fbfd;border:1px solid #dcebf2;border-radius:17px;padding:16px}.metric .label{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}.metric .value{font-size:28px;font-weight:900;color:var(--navy);margin-top:5px}.metric .sub{font-size:11px;color:var(--muted);margin-top:2px}
.section-title{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:15px}.section-title h3{margin:0;color:var(--navy)}.section-title p{margin:4px 0 0;color:var(--muted);font-size:12px;line-height:1.45}.summary{background:#f8fcfe;border:1px solid #dcebf2;border-radius:15px;padding:14px}
.auth-gate{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at 50% 20%,#0a79bc 0,#075f9c 30%,#063b70 70%,#052a50 100%);padding:24px}.auth-card{width:min(420px,100%);background:#fff;border-radius:24px;padding:28px;box-shadow:0 24px 60px rgba(0,0,0,.25)}.auth-card img{display:block;width:230px;max-width:80%;margin:0 auto 18px}.auth-card h2{margin:0 0 8px;color:var(--navy)}.auth-card p{color:var(--muted);line-height:1.5;font-size:13px}
.app-layout{min-height:100vh;display:grid;grid-template-columns:235px 1fr}.sidebar{background:linear-gradient(180deg,#062e58,#073f73);color:#fff;padding:25px 18px;position:sticky;top:0;height:100vh}.sidebar img{width:178px;background:#fff;border-radius:15px;padding:10px;margin:0 auto 24px;display:block}.nav{display:flex;flex-direction:column;gap:6px}.nav a{padding:11px 12px;border-radius:10px;text-decoration:none;color:#d6e8f4;font-size:13px;font-weight:750}.nav a:hover,.nav a.active{background:#0d5d98;color:#fff}.main{padding:24px 28px 42px;min-width:0}.page-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:20px}.page-head h1{margin:0;color:var(--navy);font-size:29px}.page-head p{margin:4px 0 0;color:var(--muted);font-size:13px}.office-footer{margin-top:24px;border-top:1px solid var(--line);padding-top:16px;text-align:center;color:var(--muted);font-size:12px}
table{width:100%;border-collapse:collapse;min-width:780px}th,td{text-align:left;padding:11px 10px;border-bottom:1px solid #e7eff4;font-size:12px}th{color:#6b8093;text-transform:uppercase;letter-spacing:.04em;font-size:10px}td{color:#26445d}.map-placeholder{position:relative;min-height:230px;border-radius:17px;overflow:hidden;border:1px solid #bddae8;background:linear-gradient(135deg,#eaf8fb,#cceaf5)}.map-placeholder:before,.map-placeholder:after{content:"";position:absolute;inset:-10%;background:linear-gradient(20deg,transparent 46%,rgba(8,84,130,.15) 47%,rgba(8,84,130,.15) 49%,transparent 50%)}.map-placeholder:after{transform:rotate(50deg)}.map-pin{position:absolute;width:14px;height:14px;border-radius:50%;background:#0b74bb;border:3px solid #fff;box-shadow:0 1px 5px rgba(0,0,0,.25);z-index:4}.fleet-card{display:flex;gap:16px;align-items:center;background:#f9fcfe;border:1px solid var(--line);border-radius:18px;padding:16px}.fleet-card img{width:180px;max-width:45%;object-fit:contain}.fleet-card h3{margin:0 0 6px;color:var(--navy)}.fleet-card p{margin:0 0 10px;color:var(--muted);font-size:12px;line-height:1.5}
.mobile-admin{max-width:720px;margin:0 auto;padding:18px}.brand-mobile{display:flex;align-items:center;gap:10px;margin-bottom:15px}.brand-mobile img{width:120px}.stat-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.stat-mini{background:#fff;border:1px solid var(--line);border-radius:15px;text-align:center;padding:14px}.stat-mini strong{display:block;color:var(--navy);font-size:25px}.stat-mini span{font-size:11px;color:var(--muted)}.footer-note{text-align:center;color:var(--muted);font-size:12px;padding:20px}.footer-note a{color:var(--navy);font-weight:800}
.modal{position:fixed;inset:0;background:rgba(4,31,56,.62);display:none;align-items:center;justify-content:center;padding:20px;z-index:100}.modal.open{display:flex}.modal-card{width:min(480px,100%);background:#fff;border-radius:22px;padding:24px;box-shadow:0 26px 70px rgba(0,0,0,.28)}
.driver-hero{border-radius:22px;background:linear-gradient(120deg,#073b70,#0b5f9b);color:#fff;padding:20px;overflow:hidden}.driver-hero-grid{display:grid;grid-template-columns:1fr 230px;gap:18px;align-items:center}.driver-hero h2{margin:4px 0}.driver-hero img{width:100%;filter:drop-shadow(0 14px 14px rgba(0,0,0,.18))}.shift-bar{background:#ebfaf0;border:1px solid #cdebd7;border-radius:15px;padding:15px}.job-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:18px;box-shadow:var(--shadow2)}.job-route{display:grid;grid-template-columns:20px 1fr;gap:10px}.route-line{display:flex;flex-direction:column;align-items:center}.route-dot{width:10px;height:10px;border-radius:50%;background:var(--cyan)}.route-stem{width:2px;height:48px;background:#bed8e5}.job-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
@media(max-width:900px){.app-layout{grid-template-columns:1fr}.sidebar{position:relative;height:auto;padding:12px 14px}.sidebar img{width:135px;margin:0 0 12px}.nav{flex-direction:row;overflow:auto}.main{padding:16px}.grid-4{grid-template-columns:repeat(2,1fr)}.driver-hero-grid{grid-template-columns:1fr}.driver-hero img{max-width:280px}.page-head{align-items:flex-start}.fleet-card{align-items:flex-start}}
@media(max-width:600px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}.card{padding:16px}.main{padding:12px}.page-head h1{font-size:23px}.sidebar{display:none}.app-layout{display:block}.driver-hero{border-radius:0;margin:-12px -12px 12px}.driver-hero img{display:none}.job-card{border-radius:16px}.stat-strip{gap:6px}.stat-mini{padding:10px}.stat-mini strong{font-size:21px}}

/* Keep Leaflet tiles beneath booking/payment dialogs on compact screens. */
.leaflet-container{isolation:isolate;z-index:0}
.modal{z-index:2000}
#bookingModal,#paymentModal,#walkupModal,#photoModal{z-index:2100}
