/* Newden maps — free Leaflet + optional Google Maps, brand price pins */

.map-panel,
#lmap,
#lg-map {
  background: var(--blue-lightest, #e9eaf9);
}

#lmap {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
}

#lg-map {
  width: 100%;
  max-width: 100%;
  height: 480px;
  border-radius: var(--radius-card, 16px);
  overflow: hidden;
  border: 1px solid rgba(3, 7, 18, 0.1);
  z-index: 0;
  box-sizing: border-box;
}

@media (max-width: 640px) {
  #lg-map { height: 360px; }
}

.newden-map-host,
.newden-map.newden-map-host,
#lmap.newden-map,
#lg-map.newden-map {
  font-family: "Inter", sans-serif;
  background: var(--blue-lightest, #e9eaf9);
  touch-action: none;
}

.newden-map-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  text-align: center;
  box-sizing: border-box;
}

.newden-map-placeholder-inner p {
  margin: 0 0 10px;
  font-size: 15px;
  line-height: 1.5;
  color: var(--n5, #4c4c4c);
  max-width: 32ch;
}

.newden-map-placeholder-hint {
  font-size: 13px !important;
  color: var(--n3, #b2b2b2) !important;
}

.newden-map-placeholder code {
  font-size: 12px;
  color: var(--blue, #252fc7);
}

.leaflet-container.newden-map,
#lmap.leaflet-container,
#lg-map.leaflet-container {
  touch-action: none;
}

.leaflet-div-icon {
  background: transparent;
  border: none;
}

/* Price pins */
.lpin-ic {
  position: absolute;
  transform: translate(-50%, -50%);
  pointer-events: auto;
}

.leaflet-div-icon .lpin {
  position: absolute;
  transform: translate(-50%, -50%);
}

@keyframes lpin-enter {
  from {
    opacity: 0;
    transform: scale(0.86);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes lpin-enter-leaflet {
  from {
    opacity: 0;
    transform: translate(-50%, -50%) scale(0.86);
  }
  to {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
  }
}

.lpin.lpin--await-enter {
  opacity: 0;
  transform: scale(0.86);
  pointer-events: none;
}
.leaflet-div-icon .lpin.lpin--await-enter {
  transform: translate(-50%, -50%) scale(0.86);
}
.lpin.lpin--enter {
  animation: lpin-enter 0.48s cubic-bezier(0.16, 1, 0.3, 1) both;
  pointer-events: auto;
}
.leaflet-div-icon .lpin.lpin--enter {
  animation: lpin-enter-leaflet 0.48s cubic-bezier(0.16, 1, 0.3, 1) both;
}
.lpin.lpin--enter,
.lpin.lpin--await-enter {
  transition: none;
}

.lpin {
  position: relative;
  transform: none;
  background: var(--blue, #252fc7);
  color: #fff;
  font-family: "Urbanist", sans-serif;
  font-weight: 700;
  font-size: 13px;
  padding: 6px 12px;
  border-radius: 999px;
  border: 2px solid #fff;
  cursor: pointer;
  white-space: nowrap;
  box-shadow: 0 6px 18px -6px rgba(37, 47, 199, 0.45);
  transition: background 0.2s, color 0.2s, transform 0.2s, box-shadow 0.2s;
}

.lpin:hover,
.lpin.active {
  background: var(--cyan, #00d2ff);
  color: var(--ink, #030712);
  box-shadow: 0 8px 22px -6px rgba(0, 210, 255, 0.5);
}

.lpin:hover:not(.lpin--await-enter),
.lpin.active:not(.lpin--await-enter) {
  transform: scale(1.08);
}

.leaflet-div-icon .lpin:hover:not(.lpin--await-enter),
.leaflet-div-icon .lpin.active:not(.lpin--await-enter) {
  transform: translate(-50%, -50%) scale(1.08);
}

@media (prefers-reduced-motion: reduce) {
  .lpin.lpin--enter,
  .lpin.lpin--await-enter {
    animation: none;
    opacity: 1;
    transform: none;
    pointer-events: auto;
  }
  .leaflet-div-icon .lpin.lpin--enter,
  .leaflet-div-icon .lpin.lpin--await-enter {
    transform: translate(-50%, -50%);
  }
}

/* Cluster groups — count label (e.g. "7 listings") */
.newden-map .marker-cluster,
.newden-map .marker-cluster-small,
.newden-map .marker-cluster-medium,
.newden-map .marker-cluster-large {
  background: none !important;
  border: none !important;
}

.newden-map .marker-cluster div {
  background: none !important;
  border: none !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
}

.lpin-cluster {
  background: var(--ink, #030712);
  color: #fff;
  font-family: "Inter", sans-serif;
  font-size: 12px;
  font-weight: 600;
  padding: 7px 13px;
  border-color: rgba(255, 255, 255, 0.92);
  box-shadow: 0 8px 22px -8px rgba(3, 7, 18, 0.45);
}

.lpin-cluster:hover {
  background: var(--blue, #252fc7);
  color: #fff;
  transform: scale(1.06);
}

.leaflet-div-icon .lpin-cluster:hover {
  transform: translate(-50%, -50%) scale(1.06);
}

.leaflet-bar.newden-map-zoom a {
  background: #fff;
  color: var(--blue, #252fc7);
  border-color: rgba(37, 47, 199, 0.18);
  font-weight: 600;
}

.leaflet-bar.newden-map-zoom a:hover {
  background: var(--blue-lightest, #e9eaf9);
  color: var(--blue-dark, #1d259f);
}

.leaflet-control-attribution {
  display: none !important;
}

/* Google zoom / fullscreen controls */
.newden-map .gm-style .gm-style-cc,
.newden-map .gm-style-cc {
  display: none !important;
}

.newden-map .gm-control-active,
.newden-map .gm-fullscreen-control,
.newden-map button.gm-control-active {
  background: #fff !important;
  color: var(--blue, #252fc7) !important;
  box-shadow: 0 4px 14px -6px rgba(37, 47, 199, 0.35) !important;
}

.newden-map .gm-control-active:hover {
  background: var(--blue-lightest, #e9eaf9) !important;
  color: var(--blue-dark, #1d259f) !important;
}
