/* app v24 – Kartenthemen (js/saison.js setzt auf <html>: .look .look-<name> und bei dunklen Looks .look-dunkel)
   Kartenfarben selbst: js/kartenstil.js (LOOKS). Hier: Pin-Farben, Deko-Symbole, dunkler Hintergrund, Ersatzkarte. */
.look-fruehling    { --lk: #D9588F; --lk-t: #fff;    --lk-r: #fff;    --lk-bg: #F5F8EE; }
.look-sommer       { --lk: #F3C500; --lk-t: #1D365F; --lk-r: #fff;    --lk-bg: #FBF8F1; }
.look-herbst       { --lk: #C2410C; --lk-t: #fff;    --lk-r: #fff;    --lk-bg: #F5EFE3; }
.look-frost        { --lk: #1D365F; --lk-t: #fff;    --lk-r: #fff;    --lk-bg: #F4F8FB; }
.look-ostern       { --lk: #8E6BD1; --lk-t: #fff;    --lk-r: #fff;    --lk-bg: #F8F7EF; }
.look-kuerbisnacht { --lk: #F08A24; --lk-t: #241B30; --lk-r: #1E1030; --lk-bg: #2B2039; }
.look-winternacht  { --lk: #C8343F; --lk-t: #fff;    --lk-r: #0A1222; --lk-bg: #22304D; }
.look-silvester    { --lk: #F3C500; --lk-t: #1D365F; --lk-r: #090D1A; --lk-bg: #1B2238; }

/* Termin-Pins in Theme-Farbe (Auswahl: Farben getauscht) */
.look .karte .pin-t { background: var(--lk); color: var(--lk-t); box-shadow: 0 0 0 2px var(--lk-r), 0 2px 6px rgba(0, 0, 0, .28); }
.look .karte .pin-stem { background: var(--lk); }
.look .karte .pin-c { background: var(--lk-r); color: var(--lk); }
.look-dunkel .karte .pin-c { color: var(--lk); }
.look .karte .pin.sel .pin-t { background: var(--lk-t); color: var(--lk); box-shadow: 0 0 0 3px var(--lk), 0 4px 10px rgba(0, 0, 0, .35); }
.look .karte .pin.sel .pin-c { background: var(--lk); color: var(--lk-t); }

/* Dunkle Looks: Hintergrund beim Laden, Beschriftungen, Quellenangabe */
.look .karte .map-box { background: var(--lk-bg); }
.look-dunkel .karte .pin .pin-l, .look-dunkel .karte .spin .pin-l { background: rgba(16, 14, 30, .9); color: #F6F2E6; box-shadow: 0 0 0 1px var(--lk); }
.look-dunkel .karte .leaflet-control-attribution { background: rgba(16, 14, 30, .78); color: #C9CED8; }
.look-dunkel .karte .leaflet-control-attribution a { color: var(--lk); }
.look-dunkel .karte .sdot-i { box-shadow: 0 0 0 2px #fff, 0 0 8px rgba(88, 190, 195, .6); }

/* Ersatzkarte (Rasterbilder, nur wenn die Vektorkarte nicht lädt): dunkle Looks per Filter angenähert */
.look-kuerbisnacht .karte .leaflet-tile-pane img.leaflet-tile { filter: sepia(.7) hue-rotate(225deg) saturate(1.4) brightness(.5) contrast(1.15); }
.look-winternacht .karte .leaflet-tile-pane img.leaflet-tile,
.look-silvester .karte .leaflet-tile-pane img.leaflet-tile { filter: invert(.92) hue-rotate(190deg) saturate(.6) brightness(.85); }
.look-frost .karte .leaflet-tile-pane img.leaflet-tile { filter: saturate(.45) brightness(1.04); }

/* Deko-Symbole auf der Karte (Kürbisse, Ostereier, Segelboote) – Größe je Zoom über --kg (saison.js) */
.leaflet-saisonDeko-pane.aus { display: none; }
.kdeko { position: absolute; left: 0; top: 0; width: calc(var(--kg, 26px) * var(--s, 1)); height: calc(var(--kg, 26px) * var(--s, 1));
  transform: translate(-50%, -50%) rotate(var(--r, 0deg)); }
.kdeko svg { display: block; width: 100%; height: 100%; filter: drop-shadow(0 1px 2px rgba(20, 8, 30, .35)); }
.kdeko-kuerbisse::before { content: ''; position: absolute; inset: -55%; border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 170, 60, .32), rgba(255, 170, 60, 0) 65%); animation: kglow 2.6s ease-in-out infinite; animation-delay: var(--d, 0s); }
.kdeko-kuerbisse svg { position: relative; }
.kdeko-kuerbisse .kf { animation: kflacker 2.6s ease-in-out infinite; animation-delay: var(--d, 0s); }
.kdeko-boote { animation: kschaukeln 4s ease-in-out infinite; animation-delay: var(--d, 0s); }
@keyframes kglow { 0%, 100% { opacity: .7; } 50% { opacity: 1; } }
@keyframes kflacker { 0%, 100% { opacity: 1; } 45% { opacity: .75; } 55% { opacity: .95; } }
@keyframes kschaukeln { 0%, 100% { transform: translate(-50%, -50%) rotate(-4deg); } 50% { transform: translate(-50%, -54%) rotate(4deg); } }
@media (prefers-reduced-motion: reduce) { .kdeko, .kdeko::before, .kdeko .kf { animation: none !important; } }
