/* ===================== Leaflet Map ===================== */
/* فقط یکی از این دو ست ارتفاع را داشته باش—ترجیحاً همین */
:root {
  --map-min-h: 320px;
  --map-ideal-h: 58vh;
  --map-max-h: 760px;
}

.leaflet-map {
  inline-size: 100%;
  block-size: clamp(var(--map-min-h), var(--map-ideal-h), var(--map-max-h));
  border-radius: 14px;
  border: 1px solid var(--border);
  overflow: hidden;
  isolation: isolate;
  touch-action: manipulation;
  -webkit-overflow-scrolling: touch;
  /* اسکرول لایه‌های کنترل نرم‌تر */
}

.leaflet-tooltip.prov-tip {
  font-weight: 700;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--card);
  color: var(--text);
  box-shadow: var(--shadow);
  padding: 6px 10px;
  user-select: none;
  pointer-events: none;
  /* روی نقشه کلیک را نبُرد */
}




/* Tooltip: JS مختصات را با left/top تنظیم می‌کند */
.map-tooltip {
  position: fixed;
  /* کلیدِ «همیشه روی موس» */
  pointer-events: none;
  background: var(--card);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 6px 10px;
  font-weight: 700;
  font-size: 13px;
  box-shadow: var(--shadow);
  z-index: 9999;
  opacity: 0;
  transition: opacity .12s ease;
}

.map-tooltip[aria-hidden="false"] {
  opacity: 1;
}

.map-tooltip[aria-hidden="true"] {
  opacity: 0;
}


/* Province polygons (use Leaflet's class) */
.leaflet-container .leaflet-interactive {
  cursor: pointer;
  transition: fill .15s ease, stroke .15s ease, filter .15s ease;
  outline: none;
}

/* فوکوس کیبورد برای دسترسی‌پذیری */
.leaflet-container path[tabindex="0"]:focus {
  filter: drop-shadow(0 0 6px color-mix(in oklab, var(--primary) 35%, transparent));
}

/* Hover fallback (JS هم در رویداد mouseover استایل می‌دهد) */
.leaflet-container .leaflet-interactive:hover {
  filter: drop-shadow(0 0 4px color-mix(in oklab, var(--primary) 25%, transparent));
}

/* Attribution unobtrusive */
.leaflet-control-attribution {
  background: color-mix(in oklab, var(--card) 75%, transparent);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding-inline: 8px;
}

/* Zoom controls */
.leaflet-control-zoom a {
  background: var(--bg-soft);
  border: 1px solid var(--border);
  color: var(--text);
}

.leaflet-control-zoom a:hover {
  background: color-mix(in oklab, var(--primary) 12%, var(--bg-soft));
  border-color: color-mix(in oklab, var(--primary) 30%, var(--border));
}