/* MISTER FAST LiveMapChat WEB Theme V3.0
   Design overlay only. Keeps existing PHP/API/Map/Chat engines intact. */
:root{
  --mf30-blue:#003da5;
  --mf30-blue-dark:#00317f;
  --mf30-blue-deep:#062f72;
  --mf30-gold:#ffc400;
  --mf30-white:#fff;
  --mf30-line:#dce6f3;
  --mf30-soft:#f5f8fd;
  --mf30-text:#08285f;
  --mf30-muted:#617390;
  --mf30-shadow:0 10px 28px rgba(1,42,105,.12);
  --mf30-radius:18px;
}

html,body{margin:0;background:#eef3fa;color:var(--mf30-text);font-family:Kanit,Prompt,"Noto Sans Thai",system-ui,sans-serif}
body.mf-web-theme-v30{overflow-x:hidden}
.mf-web-theme-v30 .mf514-window{min-height:100vh;background:#eef3fa}

/* Header */
.mf-web-theme-v30 .mf-web-header{
  min-height:82px!important;
  padding:0 24px!important;
  background:linear-gradient(100deg,var(--mf30-blue-deep),var(--mf30-blue))!important;
  border:0!important;
  color:#fff!important;
  box-shadow:none!important;
}
.mf-web-theme-v30 .mf-web-header *{color:inherit}
.mf-web-theme-v30 .mf-web-header .mf-web-header-brand small,
.mf-web-theme-v30 .mf-web-header small{color:#dce9ff!important}
.mf-web-theme-v30 .mf-web-header-status>*,
.mf-web-theme-v30 .mf-web-header .mf-web-status-chip{
  background:rgba(255,255,255,.055)!important;
  border:1px solid rgba(255,255,255,.22)!important;
  color:#fff!important;
  border-radius:16px!important;
}

/* Grid — no map/chat seam */
.mf-web-theme-v30 .mf514-grid{
  grid-template-columns:268px minmax(520px,1fr) 0 minmax(390px,36vw)!important;
  gap:0!important;
  background:#fff!important;
  align-items:stretch!important;
}
.mf-web-theme-v30 .mf514-sidebar{
  background:linear-gradient(180deg,#073c88 0%,#003da5 55%,#002f78 100%)!important;
  min-height:calc(100vh - 82px)!important;
  border-right:0!important;
  padding:18px 14px 20px!important;
}
.mf-web-theme-v30 .mf514-brand{padding:8px 10px 20px!important;color:#fff!important}
.mf-web-theme-v30 .mf514-menu{gap:10px!important}
.mf-web-theme-v30 .mf514-menu button{
  min-height:58px!important;
  border-radius:15px!important;
  background:rgba(255,255,255,.035)!important;
  border:1px solid rgba(255,255,255,.07)!important;
  color:#fff!important;
  padding:0 17px!important;
  box-shadow:none!important;
}
.mf-web-theme-v30 .mf514-menu button span{font-size:22px!important}
.mf-web-theme-v30 .mf514-menu button b{font-size:16px!important;color:#fff!important}
.mf-web-theme-v30 .mf514-menu button:hover{background:rgba(255,255,255,.10)!important}
.mf-web-theme-v30 .mf514-menu button.is-active{
  color:#062f72!important;
  background:linear-gradient(135deg,#ffd632,#ffc400)!important;
  border-color:#ffc400!important;
  box-shadow:0 9px 22px rgba(255,196,0,.22)!important;
}
.mf-web-theme-v30 .mf514-menu button.is-active b{color:#062f72!important}

/* Sidebar toggle */
.mf-web-theme-v30 .mf212-sidebar-toggle{
  left:250px!important;
  width:38px!important;
  height:78px!important;
  border-radius:0 14px 14px 0!important;
  background:var(--mf30-blue)!important;
  border:1px solid rgba(255,255,255,.28)!important;
  color:#fff!important;
  box-shadow:0 8px 20px rgba(0,45,115,.22)!important;
  z-index:90!important;
}
.mf-web-theme-v30 .mf212-sidebar-toggle:hover{background:var(--mf30-blue-dark)!important;color:#fff!important}

/* Center / map */
.mf-web-theme-v30 .mf514-map-pane{background:#fff!important;border:0!important;min-width:0}
.mf-web-theme-v30 .mf514-map-toolbar{
  min-height:96px!important;
  padding:18px 24px!important;
  background:#fff!important;
  border-bottom:1px solid var(--mf30-line)!important;
  box-shadow:none!important;
}
.mf-web-theme-v30 .mf534-map-title,.mf-web-theme-v30 .mf514-kpis{display:none!important}
.mf-web-theme-v30 .mf514-routebar{display:flex!important;gap:14px!important;width:100%!important}
.mf-web-theme-v30 .mf514-routebar button{
  flex:1 1 0!important;
  min-height:62px!important;
  border-radius:16px!important;
  background:#fff!important;
  border:1px solid #d8e2f1!important;
  color:var(--mf30-text)!important;
  box-shadow:0 5px 16px rgba(13,57,116,.06)!important;
}
.mf-web-theme-v30 .mf514-routebar button:hover,
.mf-web-theme-v30 .mf514-routebar button.is-active{border-color:#adc8ee!important;background:#f8fbff!important}
.mf-web-theme-v30 .mf514-map-wrap{position:relative!important;min-height:440px!important;overflow:hidden!important;background:#e7eef8!important}
.mf-web-theme-v30 #mf514Map{min-height:440px!important;height:100%!important}

/* Compact overlays */
.mf-web-theme-v30 .mf532-radius-panel{display:none!important}
.mf-web-theme-v30 .mf514-estimate{display:none!important}
.mf-web-theme-v30 .mf521-map-quick{left:20px!important;top:108px!important;right:auto!important;gap:12px!important}
.mf-web-theme-v30 .mf521-map-quick button,
.mf-web-theme-v30 .mf514-locate{
  width:48px!important;height:48px!important;border-radius:14px!important;
  background:#fff!important;color:var(--mf30-blue)!important;
  border:1px solid #dce6f3!important;box-shadow:var(--mf30-shadow)!important
}
.mf-web-theme-v30 .mf514-locate{left:20px!important;top:20px!important;background:var(--mf30-blue)!important;color:#fff!important;border-color:var(--mf30-blue)!important}

/* Notification + map-open buttons */
.mf-web-theme-v30 .mf30-map-actions{
  position:absolute;top:18px;right:18px;z-index:800;
  display:flex;gap:10px;align-items:center;
}
.mf-web-theme-v30 .mf30-map-action{
  position:relative;width:48px;height:48px;border-radius:14px;border:1px solid #dbe5f2;
  background:#fff;color:var(--mf30-blue);box-shadow:var(--mf30-shadow);
  display:grid;place-items:center;font-size:20px;cursor:pointer;
}
.mf-web-theme-v30 .mf30-map-action:hover{transform:translateY(-1px);border-color:#9dbbe4}
.mf-web-theme-v30 .mf30-map-action .mf30-badge{
  position:absolute;right:-4px;top:-5px;min-width:18px;height:18px;padding:0 4px;border-radius:20px;
  background:#ed3434;color:#fff;font-size:11px;font-weight:800;display:grid;place-items:center
}
.mf-web-theme-v30 .mf52-map-fullscreen{display:none!important}

/* Radius slider compact, bottom-right */
.mf-web-theme-v30 .mf54-range-wrap{
  position:absolute!important;right:22px!important;bottom:22px!important;z-index:700!important;
  width:250px!important;padding:18px 20px!important;background:#fff!important;border-radius:18px!important;
  box-shadow:var(--mf30-shadow)!important;border:1px solid #dbe5f2!important
}

/* Driver section */
.mf-web-theme-v30 .mf215-map-driver-splitter{height:7px!important;background:#eef3f9!important;border:0!important}
.mf-web-theme-v30 .mf6192-driver-section{padding:22px 24px 28px!important;background:#fff!important}
.mf-web-theme-v30 .mf6192-driver-head{margin-bottom:14px!important}
.mf-web-theme-v30 .mf6192-driver-head b{font-size:26px!important;color:var(--mf30-blue)!important}
.mf-web-theme-v30 [data-mf542-driver-list],
.mf-web-theme-v30 .mf6193-driver-list{display:grid!important;grid-template-columns:1fr!important;gap:10px!important}
.mf-web-theme-v30 .mf6193-driver-card,
.mf-web-theme-v30 [data-mf542-driver-list] article{
  border:1px solid #dce6f3!important;border-radius:16px!important;background:#fff!important;
  box-shadow:none!important;padding:13px 15px!important;min-height:84px!important
}

/* Chat — directly attached to map */
.mf-web-theme-v30 .mf212-chat-divider{width:0!important;min-width:0!important;background:transparent!important;border:0!important;overflow:visible!important;z-index:120!important}
.mf-web-theme-v30 .mf212-chat-divider::before,.mf-web-theme-v30 .mf212-chat-divider::after{display:none!important}
.mf-web-theme-v30 .mf514-chat-pane{margin:0!important;border:0!important;border-left:1px solid var(--mf30-line)!important;background:#fff!important;min-width:0}
.mf-web-theme-v30 .mf514-chat-head{min-height:92px!important;padding:16px 20px!important;background:#fff!important;color:var(--mf30-text)!important;border-bottom:1px solid var(--mf30-line)!important}
.mf-web-theme-v30 .mf514-chat-head *{color:inherit}
.mf-web-theme-v30 .mf514-chat-tabs{background:#fff!important;border-bottom:1px solid var(--mf30-line)!important;padding:10px 12px 0!important;gap:6px!important}
.mf-web-theme-v30 .mf514-chat-tabs button{border-radius:12px 12px 0 0!important;background:#f6f8fc!important;color:var(--mf30-text)!important}
.mf-web-theme-v30 .mf514-chat-tabs button.is-active{color:var(--mf30-blue)!important;border-bottom:3px solid var(--mf30-blue)!important;background:#fff!important}
.mf-web-theme-v30 .mf514-chat-messages{background:#fff!important;padding:22px!important}
.mf-web-theme-v30 .mf514-composer{background:#fff!important;border-top:1px solid var(--mf30-line)!important;padding:13px 16px!important}

/* Footer */
.mf-web-theme-v30 .mf-web-footer{background:linear-gradient(100deg,var(--mf30-blue-deep),var(--mf30-blue))!important;color:#fff!important;border:0!important}
.mf-web-theme-v30 .mf-web-footer *{color:inherit!important}

/* Map-only page in a new browser tab/window */
body.mf30-map-only{overflow:hidden!important;background:#eef3fa!important}
body.mf30-map-only .mf-web-header,
body.mf30-map-only .mf514-sidebar,
body.mf30-map-only .mf212-sidebar-toggle,
body.mf30-map-only .mf514-chat-pane,
body.mf30-map-only .mf212-chat-divider,
body.mf30-map-only .mf6192-driver-section,
body.mf30-map-only .mf215-map-driver-splitter,
body.mf30-map-only .mf-web-footer,
body.mf30-map-only .mf514-map-toolbar{display:none!important}
body.mf30-map-only .mf514-window,
body.mf30-map-only .mf514-grid,
body.mf30-map-only .mf514-map-pane,
body.mf30-map-only .mf514-map-wrap,
body.mf30-map-only #mf514Map{
  position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;max-width:none!important;min-height:100vh!important;margin:0!important;padding:0!important;border:0!important
}
body.mf30-map-only .mf514-grid{display:block!important}
body.mf30-map-only .mf30-map-actions{top:18px!important;right:18px!important}
body.mf30-map-only .mf30-map-close{display:grid!important}
body:not(.mf30-map-only) .mf30-map-close{display:none!important}
body.mf30-map-only .mf30-map-open{display:none!important}

@media(max-width:1180px){
  .mf-web-theme-v30 .mf514-grid{grid-template-columns:80px minmax(480px,1fr) 0 minmax(330px,38vw)!important}
  .mf-web-theme-v30 .mf514-menu button b,.mf-web-theme-v30 .mf514-brand b,.mf-web-theme-v30 .mf514-brand small{display:none!important}
  .mf-web-theme-v30 .mf212-sidebar-toggle{left:62px!important}
}
