/* Small custom CSS — Tailwind handles the rest */
html { scroll-behavior: smooth; scroll-padding-top: 5rem; }

/* Shadow added to the navbar when the page is scrolled (toggled in script.js) */
#navbar.scrolled { box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08); }

/* Filled heart when a product is in the wishlist */
.wish-btn.active svg { fill: #ff4d2e; stroke: #ff4d2e; }

/* Brief pop when the cart badge updates */
@keyframes pop { 50% { transform: scale(1.4); } }
.pop { animation: pop 0.3s ease; }

:focus-visible { outline: 2px solid #ff4d2e; outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { transition-duration: 0.01ms !important; animation: none !important; }
}