/**
 * MISTER FAST LiveMapChat WEB V4.3.4
 * Smart Marker Labels
 */

/* Remove old multi-ring marker presentation. */
.leaflet-marker-icon.mf433-marker::after{
  display:none!important;
  animation:none!important;
}

.leaflet-marker-icon.mf433-marker::before{
  display:none!important;
}

.leaflet-marker-icon.mf434-marker{
  position:relative!important;
  width:42px!important;
  height:42px!important;
  margin-left:-21px!important;
  margin-top:-21px!important;
  border:0!important;
  background:transparent!important;
  overflow:visible!important;
  box-shadow:none!important;
}

.mf434-vehicle{
  position:absolute;
  left:50%;
  top:50%;
  z-index:3;
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  transform:translate(-50%,-50%);
  border:3px solid #fff;
  border-radius:50%;
  box-shadow:0 6px 16px rgba(0,43,105,.30);
  font-size:20px;
  line-height:1;
}

.mf434-driver-working .mf434-vehicle{
  background:#1cb765;
}

.mf434-driver-available .mf434-vehicle{
  background:#ffc400;
}

.mf434-driver-offline .mf434-vehicle{
  background:#94a3b8;
  opacity:.82;
}

.mf434-user-dot{
  position:absolute;
  left:50%;
  top:50%;
  z-index:3;
  width:16px;
  height:16px;
  transform:translate(-50%,-50%);
  border:3px solid #fff;
  border-radius:50%;
  background:#0057d9;
  box-shadow:0 4px 12px rgba(0,61,165,.38);
}

.mf434-user-online .mf434-user-dot::after{
  content:"";
  position:absolute;
  inset:-7px;
  border:2px solid rgba(0,87,217,.52);
  border-radius:50%;
  animation:mf434MobilePulse 1.35s ease-out infinite;
}

@keyframes mf434MobilePulse{
  0%{transform:scale(.62);opacity:.95}
  75%,100%{transform:scale(1.7);opacity:0}
}

.mf434-marker-label{
  position:absolute;
  left:50%;
  bottom:48px;
  z-index:5;
  display:flex;
  align-items:center;
  gap:6px;
  min-width:max-content;
  max-width:210px;
  padding:6px 9px;
  transform:translateX(-50%);
  border:1px solid #d6e1ef;
  border-radius:10px;
  background:rgba(255,255,255,.96);
  box-shadow:0 6px 18px rgba(0,43,105,.14);
  color:#123f73;
  font-family:"Kanit","Prompt","Segoe UI",Arial,sans-serif;
  font-size:10px;
  line-height:1.15;
  pointer-events:none;
  white-space:nowrap;
}

.mf434-marker-label b{
  max-width:112px;
  overflow:hidden;
  color:#003da5;
  font-size:11px;
  font-weight:900;
  text-overflow:ellipsis;
}

.mf434-marker-label span{
  display:inline-flex;
  align-items:center;
  gap:4px;
  font-weight:900;
}

.mf434-marker-label span::before{
  content:"";
  width:7px;
  height:7px;
  border-radius:50%;
}

.mf434-driver-working .mf434-marker-label span{
  color:#0d7f40;
}

.mf434-driver-working .mf434-marker-label span::before{
  background:#1cb765;
}

.mf434-driver-available .mf434-marker-label span{
  color:#8a6700;
}

.mf434-driver-available .mf434-marker-label span::before{
  background:#ffc400;
}

.mf434-driver-offline .mf434-marker-label span{
  color:#667487;
}

.mf434-driver-offline .mf434-marker-label span::before{
  background:#94a3b8;
}

.mf434-user-online .mf434-marker-label span{
  color:#0057d9;
}

.mf434-user-online .mf434-marker-label span::before{
  background:#0057d9;
}

.mf434-marker:hover .mf434-marker-label,
.mf434-marker.mf434-selected .mf434-marker-label{
  z-index:1000;
  border-color:#9db8dc;
  box-shadow:0 8px 22px rgba(0,43,105,.22);
}

@media(max-width:700px){
  .mf434-marker-label{
    bottom:43px;
    max-width:160px;
    padding:5px 7px;
    font-size:9px;
  }

  .mf434-marker-label b{
    max-width:80px;
    font-size:10px;
  }
}

@media(prefers-reduced-motion:reduce){
  .mf434-user-online .mf434-user-dot::after{
    animation:none!important;
  }
}
