@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

:root{
  --emc-bg:#07111c;
  --emc-sidebar:#0b1724;
  --emc-surface:#0f1b29;
  --emc-surface-2:#122131;
  --emc-surface-3:#16283a;
  --emc-line:#26394b;
  --emc-line-soft:#1d3041;
  --emc-text:#f3f7fb;
  --emc-muted:#91a4b7;
  --emc-blue:#20a8f6;
  --emc-blue-strong:#1687dc;
  --emc-cyan:#19c8d8;
  --emc-green:#37d477;
  --emc-amber:#f2b824;
  --emc-red:#ef5656;
  --emc-shadow:0 14px 34px rgba(0,0,0,.24);
}

html{color-scheme:dark}
body{
  font-family:Inter,Arial,sans-serif!important;
  background:var(--emc-bg)!important;
  color:var(--emc-text)!important;
  letter-spacing:0!important;
}
body:before{display:none!important}
button,input,textarea,select{font-family:inherit!important;letter-spacing:0}
button,a,input,textarea,select{transition:border-color .16s ease,background .16s ease,color .16s ease,box-shadow .16s ease,transform .16s ease}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{
  outline:2px solid rgba(32,168,246,.85)!important;
  outline-offset:2px;
}
input,textarea,select{
  border:1px solid var(--emc-line)!important;
  border-radius:6px!important;
  background:#0b1724!important;
  color:var(--emc-text)!important;
  box-shadow:none!important;
}
input:hover,textarea:hover,select:hover{border-color:#3a5269!important}
input:focus,textarea:focus,select:focus{border-color:var(--emc-blue)!important;box-shadow:0 0 0 3px rgba(32,168,246,.12)!important}
label{color:#b8c6d4!important;font-weight:600!important}
.muted,.meta,.brand span{color:var(--emc-muted)!important}
.primary,.btn.primary{
  color:#fff!important;
  border:1px solid var(--emc-blue)!important;
  border-radius:6px!important;
  background:var(--emc-blue-strong)!important;
  box-shadow:none!important;
  font-weight:700!important;
}
.primary:hover,.btn.primary:hover{background:var(--emc-blue)!important;transform:translateY(-1px)}
.ghost,.btn,.small-btn{
  color:#dce7f1!important;
  border:1px solid var(--emc-line)!important;
  border-radius:6px!important;
  background:#111f2e!important;
  box-shadow:none!important;
}
.ghost:hover,.btn:hover,.small-btn:hover{border-color:#3b556c!important;background:#172a3d!important}
.danger{
  color:#ff9c9c!important;
  border:1px solid rgba(239,86,86,.4)!important;
  border-radius:6px!important;
  background:rgba(239,86,86,.1)!important;
}
.danger:hover{background:rgba(239,86,86,.18)!important}
.mark{
  border-radius:7px!important;
  color:#fff!important;
  background:linear-gradient(145deg,#22b7f5,#315de6)!important;
  box-shadow:none!important;
}
.chip{
  border-radius:5px!important;
  border:1px solid var(--emc-line)!important;
  background:#142536!important;
  color:#bdccda!important;
}
.chip.green{color:#6ce99c!important;border-color:rgba(55,212,119,.22)!important;background:rgba(55,212,119,.1)!important}
.chip.yellow{color:#ffd46e!important;border-color:rgba(242,184,36,.24)!important;background:rgba(242,184,36,.1)!important}
.chip.red{color:#ff9393!important;border-color:rgba(239,86,86,.24)!important;background:rgba(239,86,86,.1)!important}
.eyebrow{color:#45bfff!important;letter-spacing:.7px!important}

/* Office Admin */
.emc-admin .topbar{
  min-height:64px;
  padding:10px 20px!important;
  border-bottom:1px solid var(--emc-line-soft)!important;
  background:#091522!important;
  backdrop-filter:none!important;
  box-shadow:none!important;
}
.emc-admin .shell{grid-template-columns:232px minmax(0,1fr)!important;min-height:calc(100vh - 64px)!important}
.emc-admin .sidebar{padding:14px 10px!important;border-right:1px solid var(--emc-line-soft)!important;background:var(--emc-sidebar)!important;backdrop-filter:none!important}
.emc-admin .nav{gap:3px!important;top:78px!important}
.emc-admin .nav button{
  min-height:42px;
  padding:10px 13px!important;
  border:0!important;
  border-radius:6px!important;
  background:transparent!important;
  color:#b6c5d4!important;
  font-weight:600;
}
.emc-admin .nav button:hover{background:#122638!important;color:#fff!important}
.emc-admin .nav button.active{
  color:#54c6ff!important;
  background:#152c40!important;
  box-shadow:inset 3px 0 0 var(--emc-blue)!important;
}
.emc-admin .content{padding:18px 20px!important;background:var(--emc-bg)!important}
.emc-admin .page-head{margin-bottom:14px!important;align-items:center!important}
.emc-admin h1{font-size:24px!important;line-height:1.2!important}
.emc-admin h2{font-size:16px!important}
.emc-admin .grid{gap:10px!important}
.emc-admin .metrics{grid-template-columns:repeat(5,minmax(0,1fr))!important}
.emc-admin .metric,.emc-admin .card,.emc-admin .item{
  border:1px solid var(--emc-line-soft)!important;
  border-radius:6px!important;
  background:var(--emc-surface)!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
}
.emc-admin .metric{min-height:108px;padding:15px!important}
.emc-admin .metric:after{left:0!important;right:auto!important;top:0!important;bottom:0!important;width:3px!important;height:auto!important;background:var(--emc-blue)!important;box-shadow:none!important}
.emc-admin .metric span{color:var(--emc-muted)!important}
.emc-admin .metric strong{font-size:28px!important}
.emc-admin .layout{grid-template-columns:340px minmax(0,1fr)!important;gap:12px!important}
.emc-admin .pool{gap:0!important;padding:0!important;border:1px solid var(--emc-line-soft);border-radius:6px;overflow:auto;background:var(--emc-surface)}
.emc-admin .pool>.item{border:0!important;border-bottom:1px solid var(--emc-line-soft)!important;border-radius:0!important;background:transparent!important}
.emc-admin .pool>.item:last-child{border-bottom:0!important}
.emc-admin .lorry-tabs{gap:7px!important}
.emc-admin .lorry-tab{
  min-width:150px!important;
  border-color:var(--emc-line)!important;
  border-radius:6px!important;
  background:#0c1926!important;
}
.emc-admin .lorry-tab.active{border-color:var(--emc-blue)!important;background:#132b40!important;color:#5ac8ff!important}
.emc-admin .sticky-dispatch-tools{top:74px!important;background:var(--emc-bg)!important}
.emc-admin .bulk-assign-bar{border-color:var(--emc-line)!important;background:#0b1724!important;backdrop-filter:none!important}
.emc-admin .map-layout{grid-template-columns:minmax(0,1fr) 310px!important}
.emc-admin .map-board,.emc-admin .map-detail{
  border-radius:6px!important;
  border-color:var(--emc-line)!important;
  background:var(--emc-surface)!important;
}
.emc-admin .login-card{
  border-radius:8px!important;
  border-color:var(--emc-line)!important;
  background:var(--emc-surface)!important;
  box-shadow:var(--emc-shadow)!important;
}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.emc-admin .dispatch-page-head{align-items:flex-end!important}
.emc-admin .dispatch-head-actions{display:grid;grid-template-columns:minmax(260px,1fr) auto auto;gap:8px;align-items:center;min-width:min(650px,58vw)}
.emc-admin .dispatch-lorry-strip{margin-bottom:12px;padding:14px 16px!important}
.emc-admin .dispatch-lorry-strip .eyebrow{margin-bottom:3px}
.emc-admin .dispatch-lorry-strip h2{margin:0}
.emc-admin .lorry-tab{position:relative;padding:11px 12px 11px 30px!important}
.emc-admin .lorry-online-dot{position:absolute;left:12px;top:14px;width:8px;height:8px;border-radius:50%;background:var(--emc-green);box-shadow:0 0 0 3px rgba(55,212,119,.12)}
.emc-admin .dispatch-command-layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:12px;align-items:start}
.emc-admin .dispatch-main-column{display:grid;gap:12px;min-width:0}
.emc-admin .dispatch-insight-column{display:grid;gap:12px;position:sticky;top:76px}
.emc-admin .dispatch-table-card{padding:0!important;overflow:hidden}
.emc-admin .dispatch-section-head{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:14px 16px;border-bottom:1px solid var(--emc-line-soft)}
.emc-admin .dispatch-section-head h2{margin:0 0 3px}
.emc-admin .dispatch-table-wrap{overflow:auto}
.emc-admin .dispatch-table{width:100%;border-collapse:collapse;min-width:820px;font-size:13px}
.emc-admin .dispatch-table th{padding:10px 12px;text-align:left;color:#8fa2b5;font-size:11px;text-transform:uppercase;border-bottom:1px solid var(--emc-line);background:#0b1724;white-space:nowrap}
.emc-admin .dispatch-table td{padding:11px 12px;border-bottom:1px solid var(--emc-line-soft);vertical-align:middle;color:#dce6ef}
.emc-admin .dispatch-table tr:last-child td{border-bottom:0}
.emc-admin .dispatch-table tr:hover td{background:#122231}
.emc-admin .dispatch-table strong{display:block;color:#f5f8fb}
.emc-admin .dispatch-table small{display:block;color:var(--emc-muted);margin-top:3px;white-space:nowrap}
.emc-admin .dispatch-table select{min-width:138px;padding:8px!important}
.emc-admin .dispatch-table input[type=checkbox]{width:18px;height:18px;accent-color:var(--emc-blue)}
.emc-admin .empty-table{text-align:center!important;color:var(--emc-muted)!important;padding:28px!important}
.emc-admin .next-day-section{border-color:rgba(255,183,77,.35)!important;background:linear-gradient(135deg,rgba(255,183,77,.08),rgba(14,24,39,.82))!important}
.emc-admin .next-day-section .dispatch-section-head{background:linear-gradient(90deg,rgba(255,183,77,.12),rgba(12,20,34,.7))}
.emc-admin .next-day-actions{display:flex;gap:8px;align-items:center;justify-content:flex-end;padding:10px 16px;border-bottom:1px solid var(--emc-line-soft);background:rgba(8,14,24,.66)}
.emc-admin .next-day-actions .meta{margin-left:auto;color:#ffc773}
.emc-admin .next-day-section .dispatch-table th{background:rgba(34,25,10,.72)}
.emc-admin .next-day-section .row-actions{display:flex;gap:7px;flex-wrap:wrap}
.emc-admin .unassigned-section{margin:0!important;padding:0!important;border:0!important}
.emc-admin .dispatch-workload,.emc-admin .dispatch-route-panel{padding:15px!important}
.emc-admin .workload-visual{display:grid;grid-template-columns:112px 1fr;gap:16px;align-items:center;margin-top:14px}
.emc-admin .workload-ring{--progress:0deg;width:108px;height:108px;border-radius:50%;display:grid;place-content:center;text-align:center;background:conic-gradient(var(--emc-blue) var(--progress),#223448 0);position:relative}
.emc-admin .workload-ring:after{content:"";position:absolute;inset:10px;border-radius:50%;background:var(--emc-surface)}
.emc-admin .workload-ring strong,.emc-admin .workload-ring span{position:relative;z-index:1}
.emc-admin .workload-ring strong{font-size:25px}
.emc-admin .workload-ring span{font-size:10px;color:var(--emc-muted)}
.emc-admin .workload-legend{display:grid;gap:8px}
.emc-admin .workload-legend span{display:grid;grid-template-columns:9px 1fr auto;gap:7px;align-items:center;color:var(--emc-muted);font-size:12px}
.emc-admin .workload-legend i{width:7px;height:7px;border-radius:50%;background:#6b7b8d}.emc-admin .workload-legend i.blue{background:var(--emc-blue)}.emc-admin .workload-legend i.green{background:var(--emc-green)}.emc-admin .workload-legend i.amber{background:var(--emc-amber)}
.emc-admin .dispatch-route-map{height:210px;margin:14px 0;border:1px solid var(--emc-line-soft);border-radius:6px;position:relative;overflow:hidden;background-color:#0b1825;background-image:linear-gradient(rgba(57,82,105,.25) 1px,transparent 1px),linear-gradient(90deg,rgba(57,82,105,.25) 1px,transparent 1px);background-size:30px 30px}
.emc-admin .dispatch-route-map:before{content:"";position:absolute;left:16%;top:28%;width:68%;height:42%;border:3px solid #218ff0;border-left-color:transparent;border-bottom-color:#2fc1df;border-radius:50% 20% 45% 28%;transform:rotate(8deg)}
.emc-admin .dispatch-route-map span{position:absolute;z-index:1;width:25px;height:25px;border-radius:50%;display:grid;place-items:center;background:#207fe1;border:3px solid #9ed9ff;color:white;font-size:10px;font-weight:800;transform:translate(-50%,-50%)}
.emc-admin .next-stop{padding:12px 0;border-bottom:1px solid var(--emc-line-soft)}
.emc-admin .next-stop strong{display:block;margin:5px 0}
.emc-admin .next-stop p{font-size:12px;color:var(--emc-muted);line-height:1.45;margin:0}
.emc-admin .route-stop-list{display:grid;margin-top:6px}
.emc-admin .route-stop-list>div{display:grid;grid-template-columns:28px 1fr;gap:8px;padding:9px 0;border-bottom:1px solid var(--emc-line-soft)}
.emc-admin .route-stop-list>div>span{width:23px;height:23px;border-radius:50%;display:grid;place-items:center;background:#143b5c;color:#6cc8ff;font-size:11px}
.emc-admin .route-stop-list p{margin:0}.emc-admin .route-stop-list small{display:block;color:var(--emc-muted);margin-top:3px}
.emc-admin .dispatch-bulk-bar{margin:12px 0 0!important;border:1px solid var(--emc-line)!important;border-radius:6px!important;display:grid!important;grid-template-columns:auto auto minmax(180px,1fr) auto auto!important;bottom:8px!important}
.emc-admin .order-entry-dialog{width:min(860px,calc(100vw - 24px));border:0;padding:0;background:transparent}
.emc-admin .order-entry-dialog::backdrop{background:rgba(1,8,15,.78);backdrop-filter:blur(4px)}
.emc-admin .order-entry-card{padding:18px!important;box-shadow:var(--emc-shadow)!important}
.emc-admin .order-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 12px}
.emc-admin .order-address-field{grid-row:span 2}
.emc-admin .order-address-field textarea{min-height:132px}

/* Driver */
.emc-driver{background:#08131f!important}
.emc-driver .top{
  padding:10px 14px!important;
  border-bottom:1px solid var(--emc-line-soft)!important;
  background:#0a1724!important;
}
.emc-driver main{width:min(820px,100%)!important;padding:14px!important}
.emc-driver .card{
  border:1px solid var(--emc-line-soft)!important;
  border-radius:7px!important;
  background:var(--emc-surface)!important;
  box-shadow:none!important;
}
.emc-driver .task{position:relative;padding-left:18px!important}
.emc-driver .task:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:#294258}
.emc-driver .task.done:before{background:var(--emc-green)}
.emc-driver .task.locked:before{background:#546273}
.emc-driver .actions button{min-height:44px}
.emc-driver dialog .card{box-shadow:var(--emc-shadow)!important}

/* Super Admin */
.emc-super{background:var(--emc-bg)!important}
.emc-super .top{
  min-height:64px;
  padding:10px 20px!important;
  border-bottom:1px solid var(--emc-line-soft)!important;
  background:#091522!important;
}
.emc-super .brand strong{display:block}
.emc-super main{padding:18px 20px!important;max-width:1500px;margin:0 auto}
.emc-super .grid{grid-template-columns:minmax(0,1.45fr) minmax(330px,.55fr)!important;gap:12px!important}
.emc-super .card,.emc-super .node{
  border:1px solid var(--emc-line-soft)!important;
  border-radius:6px!important;
  background:var(--emc-surface)!important;
  box-shadow:none!important;
}
.emc-super .pool{gap:0!important;border:1px solid var(--emc-line-soft);border-radius:6px;overflow:hidden}
.emc-super .pool>.node{border:0!important;border-bottom:1px solid var(--emc-line-soft)!important;border-radius:0!important}
.emc-super .pool>.node:last-child{border-bottom:0!important}

/* Landing */
.emc-landing{background:#07111c!important}
.emc-landing .top{
  min-height:68px;
  padding:12px 5vw!important;
  border-bottom:1px solid var(--emc-line-soft)!important;
  background:rgba(8,20,32,.96)!important;
  backdrop-filter:blur(12px)!important;
}
.emc-landing .hero{min-height:calc(100vh - 68px)!important;gap:58px!important}
.emc-landing .hero h1{font-size:clamp(44px,6vw,78px)!important;line-height:1!important}
.emc-landing .product,.emc-landing .panel,.emc-landing .plan,.emc-landing .feature,.emc-landing .step,.emc-landing .trust div{
  border:1px solid var(--emc-line-soft)!important;
  border-radius:7px!important;
  background:var(--emc-surface)!important;
  box-shadow:none!important;
}
.emc-landing .product{padding:0!important;overflow:hidden}
.emc-landing .appbar{padding:14px 16px!important;background:#0a1724}
.emc-landing .screen{padding:14px!important}
.emc-landing .side span,.emc-landing .row,.emc-landing .mini{border-radius:5px!important;background:#122131!important}
.emc-landing .guide-band{border-radius:7px!important;background:#102236!important}
.emc-landing .footer{border-color:var(--emc-line-soft)!important}

/* Guide */
.emc-guide{background:var(--emc-bg)!important}
.emc-guide .top{background:#091522!important;border-color:var(--emc-line-soft)!important}
.emc-guide .card,.emc-guide .step,.emc-guide .panel{
  border:1px solid var(--emc-line-soft)!important;
  border-radius:7px!important;
  background:var(--emc-surface)!important;
  box-shadow:none!important;
}
.emc-guide .num{border-radius:5px!important;background:#14314a!important;color:#5bc9ff!important}

@media(max-width:980px){
  .emc-admin .shell{grid-template-columns:1fr!important}
  .emc-admin .content{padding:14px 12px 98px!important}
  .emc-admin .metrics{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .emc-admin .layout,.emc-admin .map-layout{grid-template-columns:1fr!important}
  .emc-admin .dispatch-page-head{align-items:stretch!important}
  .emc-admin .dispatch-head-actions{min-width:0;grid-template-columns:minmax(0,1fr) auto}
  .emc-admin .dispatch-head-actions .danger{grid-column:1/-1}
  .emc-admin .dispatch-command-layout{grid-template-columns:1fr}
  .emc-admin .dispatch-insight-column{position:static;grid-template-columns:1fr 1fr}
  .emc-admin .dispatch-bulk-bar{bottom:82px!important;grid-template-columns:1fr 1fr!important}
  .emc-admin .dispatch-bulk-bar #dispatchSelectionCount,.emc-admin .dispatch-bulk-bar select{grid-column:1/-1}
  .emc-admin .mobile-nav{
    border-radius:8px!important;
    border-color:var(--emc-line)!important;
    background:#0b1724!important;
    box-shadow:0 12px 30px rgba(0,0,0,.36)!important;
  }
  .emc-admin .mobile-nav button{border-radius:5px!important}
  .emc-admin .mobile-more{border-radius:7px!important;background:#0d1b29!important}
  .emc-super .grid{grid-template-columns:1fr!important}
}

@media(max-width:620px){
  .emc-admin .topbar,.emc-driver .top{min-height:58px!important}
  .emc-admin .topbar{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    padding:8px 10px!important;
  }
  .emc-admin .topbar .brand{min-width:0}
  .emc-admin .topbar .brand .mark{width:38px!important;height:38px!important;flex:0 0 38px}
  .emc-admin .topbar .brand strong{font-size:14px;white-space:nowrap}
  .emc-admin .topbar .brand span{display:none!important}
  .emc-admin .topbar .actions{width:auto!important;display:flex!important;gap:6px!important;align-items:center}
  .emc-admin .topbar select{width:92px!important;padding:9px 8px!important}
  .emc-admin .topbar #logoutBtn{padding:9px!important;font-size:0}
  .emc-admin .topbar #logoutBtn:after{content:"Log out";font-size:12px}
  .emc-admin .content{padding:12px 10px 96px!important}
  .emc-admin .page-head{gap:10px!important}
  .emc-admin .page-head .primary{align-self:flex-start}
  .emc-admin .metric{min-height:92px;padding:12px!important}
  .emc-admin .metric strong{font-size:24px!important}
  .emc-admin #dashboard>.grid:not(.metrics){grid-template-columns:1fr!important}
  .emc-admin .bulk-assign-bar{bottom:74px!important}
  .emc-admin .dispatch-board{min-width:0}
  .emc-admin .sticky-dispatch-tools{top:60px!important}
  .emc-admin .lorry-tab{min-width:132px!important}
  .emc-admin .pool>.item{padding:12px 10px!important}
  .emc-admin .dispatch-head-actions{grid-template-columns:1fr!important}
  .emc-admin .dispatch-head-actions .danger{grid-column:auto}
  .emc-admin .dispatch-insight-column{grid-template-columns:1fr}
  .emc-admin .dispatch-table{min-width:720px}
  .emc-admin .dispatch-bulk-bar{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;padding:8px!important;gap:6px!important}
  .emc-admin .dispatch-bulk-bar #dispatchSelectionCount{grid-column:1/-1!important;font-size:11px}
  .emc-admin .dispatch-bulk-bar select{grid-column:1/2!important;width:100%;padding:8px!important;font-size:12px}
  .emc-admin .dispatch-bulk-bar button{grid-column:auto!important;width:100%;min-height:36px!important;padding:7px!important;font-size:11px}
  .emc-admin .dispatch-bulk-bar button:nth-of-type(2){grid-column:2/3!important;grid-row:2!important}
  .emc-admin .order-form-grid{grid-template-columns:1fr}
  .emc-admin .order-address-field{grid-row:auto}
  .emc-driver main{padding:10px!important}
  .emc-driver .card{padding:13px!important}
  .emc-driver .top .actions{grid-template-columns:1fr auto!important}
  .emc-driver #portal>.line{display:grid!important;gap:8px!important}
  .emc-driver #portal>.line h1{font-size:25px!important;margin-bottom:4px!important}
  .emc-driver #portal>.line .chip{width:max-content;white-space:normal!important}
  .emc-landing .top{
    position:relative!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    padding:10px 14px!important;
  }
  .emc-landing .brand{min-width:0}
  .emc-landing .brand .mark{width:38px!important;height:38px!important;flex:0 0 38px}
  .emc-landing .brand strong{font-size:15px;white-space:nowrap}
  .emc-landing .brand .muted{display:none!important}
  .emc-landing .nav{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px!important;width:100%}
  .emc-landing .nav .btn{width:100%;padding:9px 8px!important;text-align:center}
  .emc-landing .hero{min-height:auto!important;padding-top:42px!important}
  .emc-landing .hero,.emc-landing .section{padding-left:16px!important;padding-right:16px!important}
}