.wishlist-nav-button {
  position: relative;
  overflow: visible;
}

.wishlist-nav__badge {
  position: absolute;
  top: -6px;
  right: -8px;
  min-width: 22px;
  height: 22px;
  padding: 0 6px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #111111;
  color: #ffffff;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  box-shadow: 0 10px 18px rgba(0, 0, 0, 0.18);
  transform-origin: center;
}

.wishlist-nav-button.is-count-bump .wishlist-nav__badge {
  animation: wishlistCountBump 0.42s cubic-bezier(0.22, 1, 0.36, 1);
}

.ref-featured__wish,
.best-sellers__wishlist {
  cursor: pointer;
}

.ref-featured__wish:hover,
.ref-featured__wish:focus-visible,
.best-sellers__wishlist:hover,
.best-sellers__wishlist:focus-visible {
  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.18),
    0 0 24px rgba(200, 169, 106, 0.16);
}

.ref-featured__wish.is-wishlist-pulsing,
.best-sellers__wishlist.is-wishlist-pulsing {
  animation: wishlistPulse 0.52s cubic-bezier(0.22, 1, 0.36, 1);
}

.wishlist-effects-layer {
  position: fixed;
  inset: 0;
  z-index: 2600;
  pointer-events: none;
  overflow: hidden;
}

.wishlist-particle {
  position: fixed;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  opacity: 0;
  transform: translate3d(0, 0, 0) scale(0.6);
  animation: wishlistParticle 0.62s cubic-bezier(0.22, 1, 0.36, 1) forwards;
  box-shadow: 0 0 12px currentColor;
}

.wishlist-fly-clone {
  position: fixed;
  z-index: 2601;
  object-fit: contain;
  pointer-events: none;
  filter: drop-shadow(0 22px 36px rgba(0, 0, 0, 0.22));
  transition:
    transform 0.72s cubic-bezier(0.22, 1, 0.36, 1),
    opacity 0.72s ease,
    filter 0.72s ease;
  will-change: transform, opacity;
}

@keyframes wishlistPulse {
  0% {
    transform: scale(1);
  }

  42% {
    transform: scale(1.14);
  }

  100% {
    transform: scale(1);
  }
}

@keyframes wishlistParticle {
  0% {
    opacity: 0.96;
    transform: translate3d(0, 0, 0) scale(0.7);
  }

  100% {
    opacity: 0;
    transform: translate3d(var(--tx), var(--ty), 0) scale(1.18);
  }
}

@keyframes wishlistCountBump {
  0% {
    transform: scale(1);
  }

  50% {
    transform: scale(1.16);
  }

  100% {
    transform: scale(1);
  }
}
