/* ========================================
   Favorite Button
   ======================================== */

/* Pop animation for post-toggle feedback */
@keyframes fav-pop {
  0%   { transform: scale(0.6); opacity: 0.5; }
  50%  { transform: scale(1.3); }
  100% { transform: scale(1); opacity: 1; }
}

.fav-btn {
  background: none;
  border: none;
  cursor: pointer;
  font-size: 1.25rem;
  color: var(--text-secondary);
  transition: color var(--transition-fast), transform var(--transition-fast),
              text-shadow var(--transition-fast);
  padding: 0.6rem;
  line-height: 1;
  min-width: 2.75rem;
  min-height: 2.75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Inactive hover: preview "will become favorited" */
.fav-btn:hover {
  color: var(--accent);
  transform: scale(1.2);
  text-shadow: 0 0 8px rgba(200, 169, 110, 0.4);
}

/* Active (favorited) state */
.fav-btn--active {
  color: var(--accent);
  text-shadow: 0 0 6px rgba(200, 169, 110, 0.3);
}

/* Active hover: preview "will be removed" */
.fav-btn--active:hover {
  color: var(--text-secondary);
  transform: scale(0.9);
  text-shadow: none;
}

/* Glyph span for animation targeting */
.fav-btn__glyph {
  display: inline-block;
  line-height: 1;
}

/* Animation triggered by Stimulus on turbo replacement */
.fav-btn--animate .fav-btn__glyph {
  animation: fav-pop 350ms ease-in-out forwards;
}