/**
 * WCC Map markers — SVG stamp & pin.
 */

.wcc-marker {
  background: transparent !important;
  border: 0 !important;
}

.wcc-marker--collected {
  cursor: pointer;
}

.wcc-marker__stamp-wrap {
  display: block;
  width: 32px;
  height: 32px;
  transform-origin: 50% 50%;
  line-height: 0;
  transform: scale(1);
  transition:
    transform 200ms cubic-bezier(0.22, 1, 0.36, 1),
    filter 200ms ease;
  will-change: transform;
}

/* Inclinaison posée en inline (séparée du scale hover) */
.wcc-marker__stamp-tilt {
  display: block;
  width: 32px;
  height: 32px;
  transform-origin: 50% 50%;
  line-height: 0;
}

.wcc-marker__stamp {
  display: block;
  width: 32px;
  height: 32px;
  overflow: visible;
  pointer-events: none;
  user-select: none;
}

.wcc-marker__stamp circle {
  transition: fill-opacity 200ms ease;
}

/* Légère animation au survol / focus clavier (scale seul — garde l’angle) */
.wcc-marker--collected:hover .wcc-marker__stamp-wrap,
.wcc-marker--collected:focus-visible .wcc-marker__stamp-wrap {
  transform: scale(1.14);
  filter: drop-shadow(0 2px 4px rgba(28, 37, 65, 0.28));
}

.wcc-marker--collected:hover .wcc-marker__stamp circle,
.wcc-marker--collected:focus-visible .wcc-marker__stamp circle {
  fill-opacity: 0.3;
}

@media (prefers-reduced-motion: reduce) {
  .wcc-marker__stamp-wrap,
  .wcc-marker__stamp circle {
    transition: none;
  }

  .wcc-marker--collected:hover .wcc-marker__stamp-wrap,
  .wcc-marker--collected:focus-visible .wcc-marker__stamp-wrap {
    transform: scale(1.06);
  }
}

/* Explored pin — DivIcon */
.wcc-marker__inner {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 36px;
}

.wcc-marker__halo {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 28px;
  height: 28px;
  margin: -14px 0 0 -14px;
  border-radius: 50%;
  background: rgba(176, 83, 42, 0.18);
  pointer-events: none;
}

.wcc-marker__svg {
  position: relative;
  z-index: 1;
  display: block;
  width: 24px;
  height: 28px;
  overflow: visible;
}

.wcc-marker:focus-visible {
  outline: 2px solid #1C2541;
  outline-offset: 2px;
  border-radius: 4px;
}
