/* ═══════════════════════════════════════════════
   YDRIP — ANIMATIONS CSS
═══════════════════════════════════════════════ */

/* FADE IN */
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes fadeInUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
@keyframes fadeInDown { from { opacity: 0; transform: translateY(-20px); } to { opacity: 1; transform: translateY(0); } }
@keyframes fadeInLeft { from { opacity: 0; transform: translateX(-20px); } to { opacity: 1; transform: translateX(0); } }
@keyframes fadeInRight { from { opacity: 0; transform: translateX(20px); } to { opacity: 1; transform: translateX(0); } }
@keyframes scaleIn { from { opacity: 0; transform: scale(0.9); } to { opacity: 1; transform: scale(1); } }
@keyframes slideUp { from { transform: translateY(100%); } to { transform: translateY(0); } }

/* PRODUCT CARD ENTRANCE */
.product-card {
  animation: fadeInUp 0.5s ease both;
}
.product-card:nth-child(1) { animation-delay: 0s; }
.product-card:nth-child(2) { animation-delay: 0.05s; }
.product-card:nth-child(3) { animation-delay: 0.1s; }
.product-card:nth-child(4) { animation-delay: 0.15s; }
.product-card:nth-child(5) { animation-delay: 0.2s; }
.product-card:nth-child(6) { animation-delay: 0.25s; }
.product-card:nth-child(7) { animation-delay: 0.3s; }
.product-card:nth-child(8) { animation-delay: 0.35s; }

/* GRADIENT ANIMATION */
@keyframes gradientShift {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
.animated-gradient {
  background: linear-gradient(-45deg, #3b82f6, #8b5cf6, #06b6d4, #7c3aed);
  background-size: 400% 400%;
  animation: gradientShift 6s ease infinite;
}

/* GLOW PULSE */
@keyframes glowPulse {
  0%, 100% { box-shadow: 0 0 20px rgba(139,92,246,0.2); }
  50% { box-shadow: 0 0 40px rgba(139,92,246,0.4); }
}
.glow-pulse { animation: glowPulse 2s ease-in-out infinite; }

/* SPIN */
@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
.spin { animation: spin 1s linear infinite; }

/* BOUNCE */
@keyframes bounce {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}

/* NUMBER COUNT */
.stat-num { transition: all 0.3s ease; }

/* NOTIFICATION DOT */
@keyframes notifPulse {
  0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(139,92,246,0.4); }
  70% { transform: scale(1); box-shadow: 0 0 0 8px rgba(139,92,246,0); }
  100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(139,92,246,0); }
}
.notif-pulse { animation: notifPulse 1.5s ease infinite; }

/* HOVER LIFT */
.hover-lift { transition: transform 0.3s ease, box-shadow 0.3s ease; }
.hover-lift:hover { transform: translateY(-4px); box-shadow: 0 12px 40px rgba(0,0,0,0.3); }

/* CLICK FEEDBACK */
.click-effect:active { transform: scale(0.97); }

/* SHIMMER */
@keyframes shimmer {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}
.shimmer {
  background: linear-gradient(90deg, var(--bg-3) 0%, var(--bg-2) 50%, var(--bg-3) 100%);
  background-size: 200% 100%;
  animation: shimmer 1.5s infinite;
}

/* TYPING INDICATOR */
@keyframes typingBounce {
  0%, 60%, 100% { transform: translateY(0); }
  30% { transform: translateY(-8px); }
}
.typing-dot { display: inline-block; animation: typingBounce 1.2s ease infinite; }
.typing-dot:nth-child(2) { animation-delay: 0.15s; }
.typing-dot:nth-child(3) { animation-delay: 0.3s; }

/* UNDERLINE HOVER */
.underline-hover { position: relative; }
.underline-hover::after {
  content: '';
  position: absolute;
  bottom: -2px; left: 0;
  width: 0; height: 2px;
  background: var(--gradient);
  transition: width 0.3s ease;
}
.underline-hover:hover::after { width: 100%; }

/* CARD SHINE EFFECT */
.card-shine {
  position: relative;
  overflow: hidden;
}
.card-shine::before {
  content: '';
  position: absolute;
  top: 0; left: -100%;
  width: 50%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.04), transparent);
  transform: skewX(-25deg);
  transition: left 0.5s ease;
  z-index: 1;
}
.card-shine:hover::before { left: 150%; }

/* MODAL ENTRANCE */
.modal-overlay.open .modal-content { animation: scaleIn 0.3s cubic-bezier(0.34, 1.56, 0.64, 1); }

/* PANEL SLIDE */
.msg-panel, .fav-panel {
  transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

/* PRODUCT TAG PILL */
.size-tag, .badge, .modal-tag {
  transition: all 0.15s ease;
}
.modal-size-btn { transition: all 0.15s ease; }
.modal-size-btn:hover { transform: scale(1.05); }

/* PREFERS REDUCED MOTION */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}