/* DanceGrove — directory map view. Terracotta Atelier skin tokens only (--dg-*). */

.dg-map-shell{
  padding:0;
  overflow:hidden;
  border-radius:18px;
  border:1px solid var(--dg-line,#e3d8c6);
  background:var(--dg-paper,#fffaf2);
  margin:8px 0 28px;
}

.dg-map{
  position:relative;
  width:100%;
  height:540px;
  min-height:360px;
  background:var(--dg-linen-2,#f1e7d6);
}
@media (max-width:720px){ .dg-map{ height:62vh } }

/* Loading / empty status overlay (uses the same muted ink + body font). */
.dg-map-status{
  position:absolute; inset:0; z-index:500;
  display:flex; align-items:center; justify-content:center; gap:10px;
  font-family:var(--dg-font-body,system-ui,sans-serif);
  font-size:14px; color:var(--dg-ink-soft,#7a6a59);
  background:color-mix(in srgb,var(--dg-paper,#fffaf2) 70%,transparent);
  pointer-events:none; text-align:center; padding:24px;
}
.dg-map-spinner{
  width:16px; height:16px; border-radius:50%;
  border:2px solid color-mix(in srgb,var(--dg-clay,#c2683f) 35%,transparent);
  border-top-color:var(--dg-clay,#c2683f);
  animation:dg-map-spin .8s linear infinite;
}
@keyframes dg-map-spin{ to{ transform:rotate(360deg) } }
@media (prefers-reduced-motion:reduce){ .dg-map-spinner{ animation:none } }

/* "N results here" badge (Leaflet control). */
.dg-map-count{
  font-family:var(--dg-font-body,system-ui,sans-serif);
  font-size:12px; font-weight:600; letter-spacing:.02em;
  color:#fff; background:var(--dg-clay,#c2683f);
  padding:6px 12px; border-radius:999px;
  box-shadow:0 8px 18px -10px var(--dg-clay,#c2683f);
}

/* Popup — re-skin Leaflet's default bubble in Atelier paper + clay. */
.leaflet-popup-content-wrapper{
  background:var(--dg-paper,#fffaf2);
  color:var(--dg-ink,#2c211a);
  border:1px solid var(--dg-line,#e3d8c6);
  border-radius:14px;
  box-shadow:0 22px 44px -22px rgba(44,33,26,.55);
}
.leaflet-popup-tip{ background:var(--dg-paper,#fffaf2); border:1px solid var(--dg-line,#e3d8c6) }
.leaflet-popup-content{ margin:12px 16px; font-family:var(--dg-font-body,system-ui,sans-serif) }

.dg-pop .dg-pop-title{
  display:inline-flex; align-items:center; gap:7px;
  font-family:var(--dg-font-heading,inherit);
  font-weight:700; font-size:14px; line-height:1.25;
  color:var(--dg-clay,#c2683f); text-decoration:none;
}
.dg-pop a.dg-pop-title:hover{ text-decoration:underline }
.dg-pop-meta{ margin-top:4px; font-size:12px; color:var(--dg-ink-soft,#7a6a59) }

/* Kind dot — studios clay, events sage. */
.dg-pop-kind{ width:8px; height:8px; border-radius:50%; flex:0 0 auto; background:var(--dg-clay,#c2683f) }
.dg-pop-event{ background:var(--dg-sage,#7c8c6b) }
.dg-pop-studio{ background:var(--dg-clay,#c2683f) }

/* Map view / list view toggle row (central integration injects the buttons;
   this styles the wrapper consistently with the chip row). */
.dg-view-toggle{
  display:inline-flex; gap:8px; align-items:center; margin:4px 0 14px;
}
.dg-view-toggle .chip2.on{ background:var(--dg-clay,#c2683f); border-color:var(--dg-clay,#c2683f); color:#fff }

/* Cluster bubbles tinted to the Atelier palette (override markercluster defaults). */
.marker-cluster{
  background:color-mix(in srgb,var(--dg-clay,#c2683f) 24%,transparent);
}
.marker-cluster div{
  background:var(--dg-clay,#c2683f); color:#fff;
  font-family:var(--dg-font-body,system-ui,sans-serif); font-weight:700;
}