/* ==========================================================================
   EWB Radar – distance_labels.css
   Entfernungskreis-Labels (POI-Distanzringe, als L.divIcon gesetzt).
   Ausgelagert aus style.css (Modularisierung, Issue #94).
   ========================================================================== */

/* --------------------------------------------------------------------------
   Entfernungskreis-Labels (distance-label)
   Werden als L.divIcon per JS am Südpol jedes Kreises gesetzt.
   Farbe und Rahmen kommen via inline style (ringColor) aus poi_layer.js.
   -------------------------------------------------------------------------- */
.distance-label {
  /* Leaflet setzt pointer-events auf das Wrapper-Div – hier deaktivieren */
  pointer-events: none !important;
  align-items: center;
  justify-content: center;
  display: flex;
}

.distance-label-content {
  /* Flexbox statt line-height: zentriert Text exakt vertikal + horizontal */
  display: inline-flex;
  align-items: center;
  justify-content: center;

  font-size: 11px;
  font-weight: 600;
  font-family: var(--font-body);
  /* Feste Höhe + symmetrisches padding statt line-height */
  height: 16px;
  padding: 0 4px;
  border-radius: 3px;
  border: 1px solid;            /* Farbe via inline style */
  background: rgba(0, 0, 0, 0.55);
  white-space: nowrap;
  pointer-events: none;
  user-select: none;
}

/* Im Light Mode soll die Hintergrundfarbe der Entfernungskreis-Labels heller sein, damit sie nicht zu dominant wirken. */
[data-theme="light"] .distance-label-content {
  background: rgba(255, 255, 255, 0.82);
}