/* === ANIMATIONS.CSS for GetUpDeals === */

/* Fade-in entry for homepage sections */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.section {
  animation: fadeInUp 0.5s ease-out both;
}

/* Smooth horizontal carousel scroll snap */
.category-scroll {
  scroll-behavior: smooth;
}

/* Tap feedback animation */
@keyframes tapScale {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(0.95);
  }
  100% {
    transform: scale(1);
  }
}
.category-item:active,
.subcategory-item:active,
.subsubcategory-item:active {
  animation: tapScale 0.2s ease;
}

/* Card hover scale effect */
.subcategory-item:hover,
.subsubcategory-item:hover {
  transform: scale(1.05);
  transition: transform 0.25s ease;
}

/* Fade in product cards */
@keyframes cardFade {
  0% {
    opacity: 0;
    transform: translateY(10px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
.product-card {
  animation: cardFade 0.4s ease forwards;
}

/* Tab indicator slide (for Most Viewed / New Arrivals / Top Rated) */
.tab-indicator {
  transition: transform 0.3s ease, width 0.3s ease;
}

/* Auto-scroll indicator highlight effect */
@keyframes pulseHighlight {
  0%, 100% {
    background-color: #fff;
  }
  50% {
    background-color: #ffc107;
  }
}
.scroll-indicator.active {
  animation: pulseHighlight 1s infinite;
}

/* Slide-in for quick preview modal */
@keyframes slideUpModal {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.quick-preview-modal {
  animation: slideUpModal 0.3s ease forwards;
}

/* Wishlist icon pulse */
@keyframes wishPulse {
  0% {
    transform: scale(1);
  }
  25% {
    transform: scale(1.2);
  }
  50% {
    transform: scale(1);
  }
}
.wishlist-icon.liked {
  animation: wishPulse 0.4s ease;
}