/* ==========================================================================
   EWB Radar – leaflet_overrides.css
   Leaflet-Overrides (Zoom-Control, Standard-Attribution aus), eigene
   Attribution-Bar (#attr-bar) und scharfe Radar-Overlay-Bilder.
   Ausgelagert aus style.css (Modularisierung, Issue #94).
   ========================================================================== */

/* --------------------------------------------------------------------------
   Leaflet-Overrides
   -------------------------------------------------------------------------- */
.leaflet-control-zoom {
  border: none !important;
  box-shadow: var(--shadow-md) !important;
  border-radius: var(--radius-xl) !important;
  /* #147: visible statt hidden, sonst klippt der Container den Zoom-Tooltip
     (::after, ragt rechts raus). Sonst alles wie vor #147. */
  overflow: visible;
  /* #140: Zoom-Buttons liegen IM Karten-Container → ohne touch-action würde
     ein Pinch hier die Karte zoomen. */
  touch-action: none;
}

.leaflet-control-zoom a {
  background: var(--glass-bg) !important;
  border: none !important;
  border-bottom: 1px solid var(--color-border) !important;
  color: var(--color-text-muted) !important;
  font-size: 1.1rem !important;
  width: 34px !important;
  height: 34px !important;
  line-height: 34px !important;
  transition: background var(--transition-fast), color var(--transition-fast);
}

/* #147: Außenecken der Buttons runden — oben/unten je nur die äußeren Ecken.
   Ersetzt das frühere overflow:hidden-Clipping (overflow ist jetzt visible für
   den Tooltip). !important schlägt Leaflets .leaflet-touch-Radius-Defaults. */
.leaflet-control-zoom a:first-child {
  border-radius: var(--radius-xl) var(--radius-xl) 0 0 !important;
}
.leaflet-control-zoom a:last-child {
  border-bottom: none !important;
  border-radius: 0 0 var(--radius-xl) var(--radius-xl) !important;
}

.leaflet-control-zoom a:hover {
  background: var(--color-accent-dim) !important;
  color: var(--color-accent) !important;
}

/* Leaflet-Standard-Attribution ausblenden – eigenes #attr-bar übernimmt. */
.leaflet-control-attribution { display: none !important; }

/* --------------------------------------------------------------------------
   Attribution-Bar – einzeilig, unten-rechts, bündig am Kartenrand.
   Ersetzt das Leaflet-Standard-Attribution-Control.

   Layout: [ewb-link] · [dwd/eumetnet-quelle] · © OSM · CARTO
   Die Datenquellen-Sektion (#attr-source) wird per updateAttribution()
   in map.js nach Produktwechsel dynamisch befüllt oder geleert.

   z-index: 400 = Leaflet-Standard für Controls (unter unseren UI-Elementen).
   border-radius: oben-rechts rund, drei andere Ecken am Rand bündig.
   -------------------------------------------------------------------------- */
#attr-bar {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 400;
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 5px 5px;
  background: var(--glass-bg);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-radius: var(--radius-md) 0 0 0;
  font-size: 11px;
  line-height: 1;
  white-space: nowrap;
  pointer-events: auto;
  touch-action: none;  /* #140: kein Pinch-Zoom der Karte über der Attribution. */
}

#attr-bar a {
  color: var(--color-text-muted);
  text-decoration: none;
}

#attr-bar a:hover { color: var(--color-text); }

/* Mini-Favicon-Logo neben Quellen-Link */
.attr-logo {
  width: 16px;
  height: 16px;
  border-radius: 3px;
  flex-shrink: 0;
  vertical-align: middle;
}

/* Trennzeichen zwischen den Attributions-Einträgen */
.attr-sep {
  color: var(--color-text-faint);
  font-size: 10px;
  user-select: none;
}

/* Inline-Flex damit Logo + Text innerhalb des Quellen-Spans
   exakt vertikal zentriert sind – verhindert Baseline-Versatz
   durch das <a><img></a> neben dem Textlink. */
#attr-source {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.attr-source-dwd .attr-logo {
  margin-right: 3px;
}

.attr-source-eumetnet .attr-logo {
  margin-right: 5px;
}

/* Wenn #attr-source leer ist (kein Produkt mit Quellenangabe),
   den span selbst und den direkt nachfolgenden Trenner ausblenden –
   verhindert doppelte Punkte in der Bar. */
#attr-source:empty + .attr-sep,
#attr-source:empty { display: none; }

/* Radar-Overlay-Bilder scharf halten – Browser-Bilinear-Interpolation
   beim Zoom unterdrücken; pixelated = Chrome/Edge/Safari, crisp-edges = Firefox */
.leaflet-image-layer {
  image-rendering: pixelated;
  image-rendering: crisp-edges;
}