/* MISTER FAST V45.2 — Mobile Workspace: Menu | [MAP] | CHAT
   Engine, room, map and chat remain the original /modules/livemapchat/ implementation. */
:root{
  --mf452-rail:76px;
  --mf452-chat:360px;
  --mf452-blue:#003da5;
  --mf452-navy:#062b68;
  --mf452-gold:#ffc400;
  --mf452-line:#d9e5f2;
}
body.mf-lmc-mobile-view{background:#dfe9f6!important;overflow:hidden!important}
body.mf-lmc-mobile-view .mf-lmc-app{
  width:min(1120px,100vw)!important;
  max-width:none!important;
  height:100dvh!important;
  min-height:620px!important;
  margin:0 auto!important;
  border-radius:0!important;
  display:grid!important;
  grid-template-columns:var(--mf452-rail) minmax(0,1fr)!important;
  grid-template-rows:minmax(0,1fr) 64px!important;
  grid-template-areas:"rail work" "rail dock"!important;
  background:#fff!important;
  overflow:hidden!important;
  box-shadow:0 18px 65px rgba(6,43,104,.22)!important;
}
/* The app is its own window: no web header, only the blue MF rail. */
body.mf-lmc-mobile-view .mf-mini-appbar{display:none!important}
body.mf-lmc-mobile-view .mf-lmc-sidebar{
  display:flex!important;
  grid-area:rail!important;
  position:relative!important;
  inset:auto!important;
  width:var(--mf452-rail)!important;
  min-width:var(--mf452-rail)!important;
  height:100%!important;
  padding:10px 7px!important;
  flex-direction:column!important;
  align-items:center!important;
  background:linear-gradient(180deg,var(--mf452-navy),var(--mf452-blue))!important;
  color:#fff!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  z-index:180!important;
}
body.mf-lmc-mobile-view .mf-lmc-brand{
  width:54px!important;height:54px!important;min-height:54px!important;
  padding:0!important;margin:0 0 10px!important;border-radius:18px!important;
  display:grid!important;place-items:center!important;background:var(--mf452-gold)!important;
  color:var(--mf452-navy)!important;text-decoration:none!important;
}
body.mf-lmc-mobile-view .mf-lmc-brand span{font-size:0!important}
body.mf-lmc-mobile-view .mf-lmc-brand span:after{content:"MF";font-size:15px;font-weight:1000}
body.mf-lmc-mobile-view .mf-lmc-brand b,body.mf-lmc-mobile-view .mf-lmc-brand small{display:none!important}
body.mf-lmc-mobile-view .mf-lmc-sidebar-toggle{display:none!important}
body.mf-lmc-mobile-view .mf-lmc-profile-card{width:60px!important;min-height:58px!important;padding:6px!important;margin:0 0 8px!important;border-radius:15px!important;display:grid!important;place-items:center!important;background:rgba(255,255,255,.1)!important}
body.mf-lmc-mobile-view .mf-lmc-profile-card>div{display:none!important}
body.mf-lmc-mobile-view .mf-lmc-avatar{width:40px!important;height:40px!important;margin:0!important;border-radius:13px!important;background:var(--mf452-gold)!important;color:var(--mf452-navy)!important}
body.mf-lmc-mobile-view .mf-lmc-role-menu{display:flex!important;flex-direction:column!important;width:100%!important;gap:5px!important}
body.mf-lmc-mobile-view .mf-lmc-role-menu a{
  width:60px!important;height:54px!important;padding:0!important;margin:0 auto!important;border-radius:14px!important;
  display:grid!important;place-items:center!important;color:#fff!important;background:transparent!important;text-decoration:none!important;
}
body.mf-lmc-mobile-view .mf-lmc-role-menu a:hover,body.mf-lmc-mobile-view .mf-lmc-role-menu a.active{background:rgba(255,255,255,.14)!important;box-shadow:inset 3px 0 0 var(--mf452-gold)!important}
body.mf-lmc-mobile-view .mf-lmc-role-menu a span{font-size:20px!important;line-height:1!important}
body.mf-lmc-mobile-view .mf-lmc-role-menu a b{display:none!important}
body.mf-lmc-mobile-view .mf-lmc-help-button,body.mf-lmc-mobile-view .mf-lmc-side-status{width:60px!important;height:50px!important;min-height:50px!important;margin:7px auto 0!important;padding:0!important;border-radius:14px!important;display:grid!important;place-items:center!important;background:rgba(255,255,255,.1)!important;color:#fff!important}
body.mf-lmc-mobile-view .mf-lmc-help-button b,body.mf-lmc-mobile-view .mf-lmc-side-status div,body.mf-lmc-mobile-view .mf-lmc-side-status>span{display:none!important}
body.mf-lmc-mobile-view .mf-v343-system-status{display:none!important}

body.mf-lmc-mobile-view .mf-lmc-main{
  grid-area:work!important;width:100%!important;height:100%!important;min-width:0!important;min-height:0!important;
  transform:none!important;display:block!important;overflow:hidden!important;background:#f4f8fd!important;
}
body.mf-lmc-mobile-view .mf-lmc-topbar{display:none!important}
body.mf-lmc-mobile-view .mf-lmc-workspace{
  display:grid!important;grid-template-columns:0 minmax(0,1fr)!important;gap:0!important;
  width:100%!important;height:100%!important;min-height:0!important;overflow:hidden!important;position:relative!important;
  transition:grid-template-columns .34s cubic-bezier(.2,.8,.2,1)!important;background:#fff!important;
}
body.mf-lmc-mobile-view.mf-v452-map-open .mf-lmc-workspace{grid-template-columns:minmax(360px,1fr) minmax(310px,var(--mf452-chat))!important}
body.mf-lmc-mobile-view .mf-lmc-map-panel{
  position:relative!important;inset:auto!important;grid-column:1!important;width:100%!important;height:100%!important;
  min-width:0!important;transform:none!important;opacity:0!important;pointer-events:none!important;z-index:20!important;
  border:0!important;border-radius:0!important;overflow:hidden!important;transition:opacity .24s ease!important;
}
body.mf-lmc-mobile-view.mf-v452-map-open .mf-lmc-map-panel{opacity:1!important;pointer-events:auto!important}
body.mf-lmc-mobile-view .mf-lmc-chat-panel{
  position:relative!important;inset:auto!important;grid-column:2!important;width:100%!important;height:100%!important;max-width:none!important;
  min-width:0!important;border:0!important;border-radius:0!important;z-index:30!important;display:flex!important;flex-direction:column!important;
  box-shadow:-10px 0 26px rgba(6,43,104,.08)!important;
}
body.mf-lmc-mobile-view .mf-lmc-chat-head{background:linear-gradient(135deg,var(--mf452-navy),var(--mf452-blue))!important;color:#fff!important;border-bottom:3px solid var(--mf452-gold)!important}
body.mf-lmc-mobile-view .mf-lmc-chat-head b,body.mf-lmc-mobile-view .mf-lmc-chat-head small{color:#fff!important}
body.mf-lmc-mobile-view .mf-lmc-chat-head:before{display:none!important}
body.mf-lmc-mobile-view .mf-v452-map-expander{
  position:absolute;z-index:210;left:8px;top:50%;transform:translateY(-50%);width:40px;height:112px;border:0;
  border-radius:0 16px 16px 0;background:linear-gradient(180deg,var(--mf452-blue),var(--mf452-navy));color:#fff;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;box-shadow:7px 0 18px rgba(6,43,104,.22);cursor:pointer;
  transition:left .34s cubic-bezier(.2,.8,.2,1),transform .2s ease;
}
body.mf-lmc-mobile-view .mf-v452-map-expander span{font-size:19px}body.mf-lmc-mobile-view .mf-v452-map-expander b{font-size:9px;writing-mode:vertical-rl}body.mf-lmc-mobile-view .mf-v452-map-expander i{font-style:normal;color:var(--mf452-gold);font-size:23px;line-height:1}
body.mf-lmc-mobile-view.mf-v452-map-open .mf-v452-map-expander{left:calc(100% - var(--mf452-chat) - 20px)}
body.mf-lmc-mobile-view.mf-v452-map-open .mf-v452-map-expander i{transform:rotate(180deg)}
/* Bottom app dock remains independent of the website. */
body.mf-lmc-mobile-view .mf-mini-bottom-nav{grid-area:dock!important;grid-column:2!important;width:100%!important;height:64px!important;z-index:190!important}
body.mf-lmc-mobile-view .mf-mini-map-sheet{display:none!important}
/* V45.1 room list is retained and opens from the MF logo/Home action. */
body.mf-lmc-mobile-view .mf-mobile-home{inset:0 0 0 0!important;z-index:230!important;border-radius:0!important}
body.mf-lmc-mobile-view.mf-v452-workspace-active .mf-mobile-home{transform:translateX(-105%)!important;opacity:0!important;pointer-events:none!important}
body.mf-lmc-mobile-view:not(.mf-v452-workspace-active) .mf-lmc-main{filter:none!important}
/* Remove secondary desktop-only sections from the compact application. */
body.mf-lmc-mobile-view .mf-v361-map-actionbar,body.mf-lmc-mobile-view .mf-v344-tool-dock,body.mf-lmc-mobile-view .mf-v343-advanced-section{display:none!important}

@media(max-width:760px){
  body.mf-lmc-mobile-view .mf-lmc-app{width:100vw!important;max-width:none!important;min-width:0!important}
  body.mf-lmc-mobile-view.mf-v452-map-open .mf-lmc-workspace{grid-template-columns:minmax(0,1fr) 0!important}
  body.mf-lmc-mobile-view.mf-v452-map-open .mf-lmc-chat-panel{opacity:0!important;pointer-events:none!important}
  body.mf-lmc-mobile-view.mf-v452-map-open .mf-v452-map-expander{left:8px!important}
  body.mf-lmc-mobile-view .mf-v452-map-expander{left:8px}
}
@media(min-width:761px){
  body.mf-lmc-mobile-view .mf-lmc-app{width:min(1120px,100vw)!important;max-width:none!important;min-width:430px!important}
}

/* =========================================================
   V45.2.1 — Expandable navigation labels
   Keeps the original LiveMapChat engine and MF identity.
   ========================================================= */
:root{
  --mf452-rail-collapsed:76px;
  --mf452-rail-expanded:292px;
}
body.mf-lmc-mobile-view .mf-lmc-app{
  grid-template-columns:var(--mf452-rail-collapsed) minmax(0,1fr)!important;
  transition:grid-template-columns .32s cubic-bezier(.2,.8,.2,1)!important;
}
body.mf-lmc-mobile-view.mf-v452-sidebar-expanded .mf-lmc-app{
  grid-template-columns:var(--mf452-rail-expanded) minmax(0,1fr)!important;
}
body.mf-lmc-mobile-view .mf-lmc-sidebar{
  width:100%!important;
  min-width:0!important;
  align-items:stretch!important;
  transition:width .32s cubic-bezier(.2,.8,.2,1)!important;
}
body.mf-lmc-mobile-view .mf-lmc-sidebar-toggle{
  display:grid!important;
  place-items:center!important;
  position:sticky!important;
  top:0!important;
  width:52px!important;
  min-height:44px!important;
  margin:0 auto 8px!important;
  border:1px solid rgba(255,255,255,.16)!important;
  border-radius:13px!important;
  background:rgba(255,255,255,.10)!important;
  color:#fff!important;
  cursor:pointer!important;
  z-index:5!important;
}
body.mf-lmc-mobile-view.mf-v452-sidebar-expanded .mf-lmc-sidebar-toggle{
  width:100%!important;
  grid-template-columns:42px 1fr!important;
  justify-content:start!important;
  padding:0 12px!important;
}
body.mf-lmc-mobile-view .mf-lmc-sidebar-toggle::after{content:""}
body.mf-lmc-mobile-view.mf-v452-sidebar-expanded .mf-lmc-sidebar-toggle::after{
  content:"ย่อเมนู";
  font-weight:900;
  font-size:13px;
  text-align:left;
}
body.mf-lmc-mobile-view .mf-lmc-brand{
  width:54px!important;
  min-width:54px!important;
  transition:all .28s ease!important;
}
body.mf-lmc-mobile-view.mf-v452-sidebar-expanded .mf-lmc-brand{
  width:100%!important;
  display:flex!important;
  justify-content:flex-start!important;
  gap:12px!important;
  padding:0 14px!important;
  border-radius:16px!important;
}
body.mf-lmc-mobile-view.mf-v452-sidebar-expanded .mf-lmc-brand span{
  width:42px!important;height:42px!important;min-width:42px!important;
  display:grid!important;place-items:center!important;
  border-radius:12px!important;background:var(--mf452-gold)!important;
  font-size:0!important;
}
body.mf-lmc-mobile-view.mf-v452-sidebar-expanded .mf-lmc-brand span:after{content:"MF";font-size:14px;font-weight:1000}
body.mf-lmc-mobile-view.mf-v452-sidebar-expanded .mf-lmc-brand b,
body.mf-lmc-mobile-view.mf-v452-sidebar-expanded .mf-lmc-brand small{display:block!important;color:#fff!important}
body.mf-lmc-mobile-view.mf-v452-sidebar-expanded .mf-lmc-brand b{font-size:18px!important;line-height:1.1!important}
body.mf-lmc-mobile-view.mf-v452-sidebar-expanded .mf-lmc-brand small{font-size:11px!important;opacity:.82!important}
body.mf-lmc-mobile-view.mf-v452-sidebar-expanded .mf-lmc-profile-card{
  width:100%!important;display:flex!important;align-items:center!important;gap:11px!important;
  justify-content:flex-start!important;padding:10px 12px!important;
}
body.mf-lmc-mobile-view.mf-v452-sidebar-expanded .mf-lmc-profile-card>div{display:block!important;min-width:0!important}
body.mf-lmc-mobile-view.mf-v452-sidebar-expanded .mf-lmc-profile-card b,
body.mf-lmc-mobile-view.mf-v452-sidebar-expanded .mf-lmc-profile-card small{display:block!important;color:#fff!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
body.mf-lmc-mobile-view.mf-v452-sidebar-expanded .mf-lmc-role-menu a{
  width:100%!important;height:60px!important;grid-template-columns:44px minmax(0,1fr) auto!important;
  justify-content:start!important;gap:10px!important;padding:0 12px!important;
}
body.mf-lmc-mobile-view.mf-v452-sidebar-expanded .mf-lmc-role-menu a span{font-size:22px!important}
body.mf-lmc-mobile-view.mf-v452-sidebar-expanded .mf-lmc-role-menu a b{
  display:block!important;text-align:left!important;font-size:14px!important;line-height:1.2!important;color:#fff!important;
}
body.mf-lmc-mobile-view.mf-v452-sidebar-expanded .mf-lmc-role-menu a b::after{
  content:attr(data-subtitle);
  display:block;
  margin-top:3px;
  color:rgba(255,255,255,.68);
  font-size:10px;
  font-weight:600;
}
body.mf-lmc-mobile-view.mf-v452-sidebar-expanded .mf-lmc-help-button,
body.mf-lmc-mobile-view.mf-v452-sidebar-expanded .mf-lmc-side-status{
  width:100%!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:10px!important;padding:0 12px!important;
}
body.mf-lmc-mobile-view.mf-v452-sidebar-expanded .mf-lmc-help-button b,
body.mf-lmc-mobile-view.mf-v452-sidebar-expanded .mf-lmc-side-status div,
body.mf-lmc-mobile-view.mf-v452-sidebar-expanded .mf-lmc-side-status>span{display:block!important;color:#fff!important}
body.mf-lmc-mobile-view.mf-v452-sidebar-expanded .mf-lmc-side-status{height:auto!important;min-height:66px!important}
body.mf-lmc-mobile-view.mf-v452-sidebar-expanded .mf-v452-map-expander{left:10px!important}

/* Mobile: expanded menu becomes a blue drawer over the workspace. */
@media(max-width:760px){
  body.mf-lmc-mobile-view.mf-v452-sidebar-expanded .mf-lmc-app{
    grid-template-columns:var(--mf452-rail-collapsed) minmax(0,1fr)!important;
  }
  body.mf-lmc-mobile-view.mf-v452-sidebar-expanded .mf-lmc-sidebar{
    position:fixed!important;left:0!important;top:0!important;bottom:0!important;
    width:min(292px,88vw)!important;z-index:500!important;
    box-shadow:18px 0 50px rgba(2,31,79,.38)!important;
  }
  body.mf-lmc-mobile-view.mf-v452-sidebar-expanded::after{
    content:"";position:fixed;inset:0;background:rgba(4,24,57,.38);z-index:490;
  }
}

/* V45.2.2 — Guest Login Gate */
body.mf-lmc-mobile-view .mf-v4522-guest-gate{
  margin:10px 10px 6px;
  padding:12px;
  display:grid;
  grid-template-columns:42px minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
  border:1px solid rgba(0,61,165,.16);
  border-left:4px solid #ffc400;
  border-radius:16px;
  background:linear-gradient(135deg,#fff9df 0%,#fff 58%,#eef5ff 100%);
  box-shadow:0 10px 24px rgba(0,38,94,.08);
}
body.mf-lmc-mobile-view .mf-v4522-guest-icon{
  width:42px;height:42px;border-radius:13px;
  display:grid;place-items:center;
  background:#003da5;color:#fff;font-size:20px;
}
body.mf-lmc-mobile-view .mf-v4522-guest-copy{min-width:0}
body.mf-lmc-mobile-view .mf-v4522-guest-copy small{
  display:block;color:#9b6b00;font-weight:900;font-size:10px;letter-spacing:.05em;
}
body.mf-lmc-mobile-view .mf-v4522-guest-copy b{
  display:block;color:#05275f;font-size:12px;line-height:1.35;margin-top:2px;
}
body.mf-lmc-mobile-view .mf-v4522-guest-copy span{
  display:block;color:#64748b;font-size:10px;line-height:1.35;margin-top:3px;
}
body.mf-lmc-mobile-view .mf-v4522-guest-actions{display:flex;gap:6px;align-items:center}
body.mf-lmc-mobile-view .mf-v4522-guest-actions button,
body.mf-lmc-mobile-view .mf-v4522-guest-actions a{
  min-height:34px;padding:0 11px;border-radius:10px;font-size:10px;font-weight:900;
  display:inline-flex;align-items:center;justify-content:center;text-decoration:none;white-space:nowrap;
}
body.mf-lmc-mobile-view .mf-v4522-guest-actions button{border:0;background:#ffc400;color:#05275f;cursor:pointer}
body.mf-lmc-mobile-view .mf-v4522-guest-actions a{border:1px solid #bfd0ea;background:#fff;color:#003da5}
body.mf-lmc-mobile-view.mf-lmc-role-guest .mf-v380-composer{
  position:relative;background:#f8fafc!important;border-top:1px solid #dbe5f2!important;
}
body.mf-lmc-mobile-view.mf-lmc-role-guest .mf-v380-composer input[name="message"]{
  cursor:pointer!important;background:#eef2f7!important;color:#718096!important;
  border-color:#d7e0eb!important;
}
body.mf-lmc-mobile-view.mf-lmc-role-guest .mf-v380-composer button{
  cursor:pointer!important;opacity:.72;
}
body.mf-lmc-mobile-view.mf-lmc-role-guest .mf-v380-composer .mf-v380-send{
  background:#94a3b8!important;color:#fff!important;
}
@media(max-width:760px){
  body.mf-lmc-mobile-view .mf-v4522-guest-gate{grid-template-columns:36px minmax(0,1fr);padding:10px}
  body.mf-lmc-mobile-view .mf-v4522-guest-icon{width:36px;height:36px}
  body.mf-lmc-mobile-view .mf-v4522-guest-actions{grid-column:1/-1}
  body.mf-lmc-mobile-view .mf-v4522-guest-actions button,
  body.mf-lmc-mobile-view .mf-v4522-guest-actions a{flex:1}
}
