/* Ana animasyonlar */
@keyframes gradientBG {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

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

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

/* Buton zıplama animasyonu */
@keyframes buttonBounce {
  0% {
    transform: translateY(0) scale(1);
  }
  20% {
    transform: translateY(-10px) scale(1.1) rotate(-2deg);
  }
  40% {
    transform: translateY(-5px) scale(1.05) rotate(1deg);
  }
  60% {
    transform: translateY(-8px) scale(1.08) rotate(-1deg);
  }
  80% {
    transform: translateY(-3px) scale(1.02) rotate(0.5deg);
  }
  100% {
    transform: translateY(0) scale(1) rotate(0deg);
  }
}

/* Ağlayan emoji animasyonu */
@keyframes cryingEmojiFloat {
  0% {
    transform: translateY(0) translateX(0) scale(0.5) rotate(0deg);
    opacity: 0;
  }
  20% {
    transform: translateY(-20px) translateX(-10px) scale(1) rotate(-10deg);
    opacity: 1;
  }
  40% {
    transform: translateY(-40px) translateX(10px) scale(1.1) rotate(5deg);
    opacity: 0.9;
  }
  60% {
    transform: translateY(-60px) translateX(-5px) scale(1) rotate(-5deg);
    opacity: 0.7;
  }
  80% {
    transform: translateY(-80px) translateX(15px) scale(0.8) rotate(10deg);
    opacity: 0.4;
  }
  100% {
    transform: translateY(-100px) translateX(-20px) scale(0.3) rotate(-15deg);
    opacity: 0;
  }
}

/* Süper güçlü kırmızı neon ışık animasyonu */
@keyframes redNeonPulse {
  0% {
    box-shadow: 0 0 20px #ff0000, 0 0 40px #ff0000, 0 0 60px #ff0000, 0 0 80px #ff0000, 0 0 100px #ff0000, inset 0 0
      20px rgba(255, 0, 0, 0.2);
    border-color: #ff0000;
  }
  25% {
    box-shadow: 0 0 25px #ff3333, 0 0 50px #ff3333, 0 0 75px #ff3333, 0 0 100px #ff3333, 0 0 125px #ff3333, inset 0 0
      25px rgba(255, 51, 51, 0.3);
    border-color: #ff3333;
  }
  50% {
    box-shadow: 0 0 30px #ff6666, 0 0 60px #ff6666, 0 0 90px #ff6666, 0 0 120px #ff6666, 0 0 150px #ff6666, inset 0 0
      30px rgba(255, 102, 102, 0.4);
    border-color: #ff6666;
  }
  75% {
    box-shadow: 0 0 25px #cc0000, 0 0 50px #cc0000, 0 0 75px #cc0000, 0 0 100px #cc0000, 0 0 125px #cc0000, inset 0 0
      25px rgba(204, 0, 0, 0.3);
    border-color: #cc0000;
  }
  100% {
    box-shadow: 0 0 35px #ff0000, 0 0 70px #ff0000, 0 0 105px #ff0000, 0 0 140px #ff0000, 0 0 175px #ff0000, inset 0 0
      35px rgba(255, 0, 0, 0.5);
    border-color: #ff0000;
  }
}

/* Uçan kalpler animasyonu */
@keyframes float-heart {
  0% {
    transform: translateY(100vh) translateX(0) rotate(0deg);
    opacity: 0.6;
  }
  100% {
    transform: translateY(-100px) translateX(100px) rotate(360deg);
    opacity: 0;
  }
}

/* Kalp balonları animasyonları */
@keyframes balloonFly {
  0% {
    transform: translateY(0) scale(0.5) rotate(0deg);
    opacity: 0;
  }
  20% {
    opacity: 1;
    transform: translateY(-20vh) scale(1) rotate(10deg);
  }
  80% {
    opacity: 0.8;
    transform: translateY(-80vh) scale(0.8) rotate(-10deg);
  }
  100% {
    transform: translateY(-100vh) scale(0.3) rotate(20deg);
    opacity: 0;
  }
}

@keyframes balloonFlySlow {
  0% {
    transform: translateY(0) scale(0.3) rotate(0deg);
    opacity: 0;
  }
  30% {
    opacity: 1;
    transform: translateY(-30vh) scale(1.2) rotate(-15deg);
  }
  100% {
    transform: translateY(-100vh) scale(0.5) rotate(30deg);
    opacity: 0;
  }
}

@keyframes balloonFlyFast {
  0% {
    transform: translateY(0) scale(0.8) rotate(0deg);
    opacity: 0;
  }
  15% {
    opacity: 1;
    transform: translateY(-15vh) scale(1) rotate(5deg);
  }
  100% {
    transform: translateY(-100vh) scale(0.2) rotate(-25deg);
    opacity: 0;
  }
}

/* Havai fişek animasyonu */
@keyframes fireworkExplode {
  0% {
    transform: translateX(0) translateY(0) scale(1);
    opacity: 1;
  }
  50% {
    transform: translateX(var(--dx)) translateY(var(--dy)) scale(1.2);
    opacity: 0.8;
  }
  100% {
    transform: translateX(calc(var(--dx) * 2)) translateY(calc(var(--dy) * 2)) scale(0);
    opacity: 0;
  }
}