.teo-map,
.teo-maplibre,
.teo-map .maplibregl-canvas-container,
.teo-map .maplibregl-canvas {
  width: 100%;
  height: 100%;
}

.teo-map { background: #f5f6f7; }
.teo-map .maplibregl-canvas { outline: 0; }
.teo-map .maplibregl-ctrl-top-right { top: 12px; right: 12px; }
.teo-map .maplibregl-ctrl-group {
  overflow: hidden;
  margin: 0 !important;
  border: 1px solid rgba(15, 22, 31, .06);
  border-radius: 16px;
  background: rgba(255, 255, 255, .82);
  box-shadow: 0 10px 28px rgba(24, 31, 41, .10);
  backdrop-filter: blur(18px) saturate(150%);
  -webkit-backdrop-filter: blur(18px) saturate(150%);
}
.teo-map .maplibregl-ctrl-group button {
  width: 44px;
  height: 44px;
  border: 0;
  background-color: transparent;
}
.teo-map .maplibregl-ctrl-group button + button { border-top: 1px solid rgba(15, 22, 31, .06); }
.teo-map .maplibregl-ctrl-icon { opacity: .78; }
.teo-map .maplibregl-ctrl-attrib,
.taxi-home .teo-map .maplibregl-ctrl-attrib {
  max-width: min(72%, 340px);
  padding: 3px 7px;
  border-radius: 10px 0 0 0;
  background: rgba(255, 255, 255, .84) !important;
  color: #747b84 !important;
  font: 500 9px/1.25 -apple-system, BlinkMacSystemFont, "SF Pro Text", Inter, sans-serif;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}
.teo-map .maplibregl-ctrl-attrib a,
.taxi-home .teo-map .maplibregl-ctrl-attrib a { color: #535960 !important; }
.teo-map .maplibregl-popup-content {
  padding: 13px 15px;
  border: 1px solid rgba(15, 22, 31, .07);
  border-radius: 16px;
  background: rgba(255, 255, 255, .92);
  color: #1c2025;
  box-shadow: 0 14px 36px rgba(24, 31, 41, .14);
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", Inter, sans-serif;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.teo-map-marker,
.teo-circle-marker,
.taxi-point-marker,
.hero-route-pin,
.taxi-review-point,
.taxi-user-location-marker,
.taxi-vehicle-leaflet,
.driver-route-car,
.ab-marker,
.feed-marker {
  display: grid;
  place-items: center;
  pointer-events: auto;
  will-change: transform;
}
.teo-circle-marker { box-sizing: border-box; box-shadow: 0 5px 14px rgba(18, 25, 34, .2); }
.teo-map-tooltip {
  position: absolute;
  inset: 50% auto auto 50%;
  transform: translate(-50%, -50%);
  color: #171a1f;
  font: 900 10px/1 -apple-system, BlinkMacSystemFont, Inter, sans-serif;
  pointer-events: none;
}
.taxi-user-location-marker > span {
  position: relative;
  width: 14px;
  height: 14px;
  display: block;
  border: 3px solid #fff;
  border-radius: 50%;
  background: #2388ff;
  box-shadow: 0 2px 10px rgba(35, 136, 255, .35);
}
.taxi-user-location-marker > span::before {
  content: "";
  position: absolute;
  inset: -10px;
  z-index: -1;
  border-radius: 50%;
  background: rgba(35, 136, 255, .18);
  animation: teo-location-pulse 2.1s ease-out infinite;
}

.taxi-home .teo-map .teo-map-pin.pickup::before {
  border-color: #171a1f !important;
  background: #fff !important;
}
.taxi-home .teo-map .teo-map-pin.pickup::after { background: #171a1f !important; }
.taxi-home .teo-map .teo-map-pin.pickup i {
  background: transparent !important;
  color: #171a1f !important;
}
.taxi-home .teo-map .teo-map-pin.dropoff::before {
  border-color: #fff !important;
  background: #ff7a21 !important;
}
.taxi-home .teo-map .teo-map-pin.dropoff::after { background: #ff7a21 !important; }
.taxi-home .teo-map .teo-map-pin.dropoff i {
  background: transparent !important;
  color: #fff !important;
}
.taxi-home .teo-map .teo-map-pin.via::before,
.taxi-home .teo-map .teo-map-pin.via::after { background: #ffd057 !important; }
.taxi-home .teo-map .teo-map-pin.via i {
  background: transparent !important;
  color: #171a1f !important;
}
@keyframes teo-location-pulse {
  0% { transform: scale(.72); opacity: .9; }
  75%, 100% { transform: scale(1.35); opacity: .08; }
}
.taxi-vehicle-leaflet img,
.driver-route-car img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transform: rotate(var(--car-heading, 0deg));
  transform-origin: 50% 50%;
  transition: transform .4s ease;
}
.driver-visual { background: #f5f6f7 !important; }
.driver-visual::before,
.driver-visual::after { pointer-events: none; }

@media (max-width: 760px) {
  .teo-map .maplibregl-ctrl-top-right { top: 10px; right: 10px; }
  .teo-map .maplibregl-ctrl-group { border-radius: 14px; }
  .teo-map .maplibregl-ctrl-group button { width: 44px; height: 44px; }
}
