/**
 * wishlist.css — Gemeinsamer "Merken"-Button (Issue #19).
 *
 * Self-contained (vgl. LL-028): NUR eigene --wish-*-Werte, keine globalen
 * --c-*-Tokens (wirkt modulübergreifend auf booking/events/infrastructure/
 * packages, deren Token-Sets sich unterscheiden).
 *
 * Zwei Kontexte:
 *   .osttirol-wish--card   → runder Overlay-Button oben rechts auf der Karte
 *   .osttirol-wish--detail → flacher Button neben dem Detail-Titel
 */
:root {
  --wish-saved: #b51621;        /* Osttirol-Markenrot, gefülltes Herz = gemerkt */
  --wish-idle: #5a5f66;         /* neutrales Grau, Umriss-Herz = nicht gemerkt */
  --wish-bg: rgba(255, 255, 255, 0.92);
  --wish-bg-hover: #ffffff;
  --wish-shadow: 0 1px 4px rgba(0, 0, 0, 0.18);
}

.osttirol-wish {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 0;
  cursor: pointer;
  background: transparent;
  color: var(--wish-idle);
  -webkit-tap-highlight-color: transparent;
  transition: color 0.15s ease, transform 0.12s ease, background-color 0.15s ease;
}

.osttirol-wish:focus-visible {
  outline: 2px solid var(--wish-saved);
  outline-offset: 2px;
}

.osttirol-wish__icon {
  width: 22px;
  height: 22px;
  display: block;
  pointer-events: none;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Gemerkt: Herz gefüllt + Markenrot. */
.osttirol-wish.is-saved {
  color: var(--wish-saved);
}
.osttirol-wish.is-saved .osttirol-wish__icon {
  fill: var(--wish-saved);
  stroke: var(--wish-saved);
}

.osttirol-wish:active {
  transform: scale(0.9);
}

/* --- Karten-Overlay --------------------------------------------------- */
.osttirol-wish--card {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 3;                    /* über dem Karten-Link/Bild */
  /* Touch-Target >= 44px (UI-Checkliste) bei optisch kleinerem Kreis. */
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--wish-bg);
  box-shadow: var(--wish-shadow);
}
.osttirol-wish--card:hover {
  background: var(--wish-bg-hover);
}

/* Karten-Wurzeln müssen positioniert sein, damit das Overlay sitzt
   (Badges sind dort i. d. R. bereits absolut — defensiv hier sichergestellt). */
.osttirol-card,
.ev-card,
.pk-card {
  position: relative;
}

/* --- Detail-Header ---------------------------------------------------- */
.osttirol-wish--detail {
  min-height: 44px;
  padding: 8px 14px;
  border: 1px solid currentColor;
  border-radius: 999px;
  background: #ffffff;
  font: inherit;
  font-size: 14.4px;
  font-weight: 600;
  white-space: nowrap;
}
.osttirol-wish--detail:hover {
  background: rgba(181, 22, 33, 0.06);
}

@media (prefers-reduced-motion: reduce) {
  .osttirol-wish,
  .osttirol-wish:active {
    transition: none;
    transform: none;
  }
}