/* Style spécifique pour les keyframes */

/* ------------------------------------------------------ Rebond ------------------------------------------------------ */

@keyframes bounce {
  0% {
    transform: translateY(0);
  }
  30% {
    transform: translateY(-10px);
  }
  50% {
    transform: translateY(0);
  }
  70% {
    transform: translateY(-5px);
  }
  100% {
    transform: translateY(0);
  }
}

/* ------------------------------------------------------ Fade-in ------------------------------------------------------ */

@keyframes fadeInMenu {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ------------------------------------------------------ Dégradé ------------------------------------------------------ */

@keyframes gradientMoveReverse {
  0% {
    background-position: 100% center;
  }
  100% {
    background-position: 0% center;
  }
}

/* ------------------------------------------------------ Wizz ------------------------------------------------------ */

@keyframes wizz {
  0% {
    transform: translate(0, 0) rotate(0deg) scale(1);
  }
  20% {
    transform: translate(-5px, 5px) rotate(-2deg) scale(1.05);
  }
  40% {
    transform: translate(5px, -5px) rotate(2deg) scale(0.98);
  }
  60% {
    transform: translate(-5px, -5px) rotate(-2deg) scale(1.03);
  }
  80% {
    transform: translate(5px, 5px) rotate(2deg) scale(1.01);
  }
  100% {
    transform: translate(0, 0) rotate(0deg) scale(1);
  }
}

/* ------------------------------------------------------ Pulse Green ------------------------------------------------------ */

@keyframes pulse-green {
  0% {
    box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.7);
  }
  70% {
    box-shadow: 0 0 0 10px rgba(34, 197, 94, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(34, 197, 94, 0);
  }
}

/* ------------------------------------------------------ Pulse Glow ------------------------------------------------------ */

@keyframes pulseGlow {
  0%,
  100% {
    text-shadow: 0 0 4px var(--purple-color-opacity);
  }
  50% {
    text-shadow: 0 0 18px var(--purple-color);
  }
}

/* ------------------------------------------------------ Wave Hand ------------------------------------------------------ */

@keyframes waveHand {
  0%,
  100% {
    transform: rotate(0deg);
  }
  10%,
  30% {
    transform: rotate(14deg);
  }
  20% {
    transform: rotate(-8deg);
  }
  40% {
    transform: rotate(-4deg);
  }
  50% {
    transform: rotate(10deg);
  }
}

/* ------------------------------------------------------ Fade Slide ------------------------------------------------------ */

@keyframes fadeSlide {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ------------------------------------------------------ Fade Slide Legal ------------------------------------------------------ */

@keyframes fadeSlideLegal {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ------------------------------------------------------ Float & Drift ------------------------------------------------------ */

@keyframes float {
  0%,
  100% {
    transform: translateY(0) translateX(0);
  }
  25% {
    transform: translateY(-15px) translateX(10px);
  }
  50% {
    transform: translateY(-10px) translateX(-10px);
  }
  75% {
    transform: translateY(-20px) translateX(5px);
  }
}

@keyframes drift {
  0%,
  100% {
    transform: translateY(0) translateX(0);
  }
  50% {
    transform: translateY(-25px) translateX(15px);
  }
}

/* ------------------------------------------------------ bounce & pulse ------------------------------------------------------ */

@keyframes bounce {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-20px);
  }
}

@keyframes pulse {
  0%,
  100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.1);
  }
}