/* Fall in Fun - Ana CSS Dosyası */

/* Tailwind CSS Konfigürasyonu */
:root {
  --primary: #FF6B6B;
  --secondary: #4ECDC4;
  --button-radius: 8px;
}

/* Remixicon Düzeltmesi */
:where([class^="ri-"])::before { 
  content: "\f3c2"; 
}

/* Animasyonlar */
.balloon-float { 
  animation: float 6s ease-in-out infinite; 
}

.balloon-float:nth-child(2) { 
  animation-delay: -2s; 
}

.balloon-float:nth-child(3) { 
  animation-delay: -4s; 
}

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

.pulse-cta { 
  animation: pulse 2s infinite; 
}

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

/* Konfeti Animasyonu */
.confetti { 
  position: absolute; 
  width: 10px; 
  height: 10px; 
  background: var(--primary); 
}

.confetti:nth-child(1) { 
  left: 10%; 
  animation: confetti-fall 3s linear infinite; 
  animation-delay: 0s; 
}

.confetti:nth-child(2) { 
  left: 20%; 
  animation: confetti-fall 3s linear infinite; 
  animation-delay: 0.5s; 
  background: var(--secondary); 
}

.confetti:nth-child(3) { 
  left: 30%; 
  animation: confetti-fall 3s linear infinite; 
  animation-delay: 1s; 
  background: #FFE66D; 
}

.confetti:nth-child(4) { 
  left: 40%; 
  animation: confetti-fall 3s linear infinite; 
  animation-delay: 1.5s; 
  background: #A8E6CF; 
}

.confetti:nth-child(5) { 
  left: 50%; 
  animation: confetti-fall 3s linear infinite; 
  animation-delay: 2s; 
  background: #FF8B94; 
}

.confetti:nth-child(6) { 
  left: 60%; 
  animation: confetti-fall 3s linear infinite; 
  animation-delay: 2.5s; 
  background: #B4A7D6; 
}

.confetti:nth-child(7) { 
  left: 70%; 
  animation: confetti-fall 3s linear infinite; 
  animation-delay: 3s; 
  background: #D4A574; 
}

.confetti:nth-child(8) { 
  left: 80%; 
  animation: confetti-fall 3s linear infinite; 
  animation-delay: 3.5s; 
  background: #88D8B0; 
}

@keyframes confetti-fall { 
  0% { 
    transform: translateY(-100vh) rotate(0deg); 
    opacity: 1; 
  } 
  100% { 
    transform: translateY(100vh) rotate(720deg); 
    opacity: 0; 
  } 
}

/* Rezervasyon Sihirbazı */
.wizard-step { 
  display: none; 
}

.wizard-step.active { 
  display: block; 
}

.step-indicator { 
  background: #E5E7EB; 
}

.step-indicator.active { 
  background: var(--primary); 
}

.step-indicator.completed { 
  background: var(--secondary); 
}

/* Genel Stiller */
body {
  font-family: 'Inter', sans-serif;
  background-color: #f9fafb;
}

/* Buton Stilleri */
.btn-primary {
  background-color: var(--primary);
  color: white;
  padding: 0.75rem 1.5rem;
  border-radius: var(--button-radius);
  font-weight: 600;
  transition: all 0.3s ease;
  border: none;
  cursor: pointer;
}

.btn-primary:hover {
  background-color: rgba(255, 107, 107, 0.9);
  transform: translateY(-1px);
}

.btn-secondary {
  background-color: white;
  color: var(--primary);
  border: 2px solid var(--primary);
  padding: 0.75rem 1.5rem;
  border-radius: var(--button-radius);
  font-weight: 600;
  transition: all 0.3s ease;
  cursor: pointer;
}

.btn-secondary:hover {
  background-color: var(--primary);
  color: white;
}

/* Kart Stilleri */
.card {
  background: white;
  border-radius: 16px;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease;
}

.card:hover {
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
  transform: translateY(-2px);
}

/* Responsive Tasarım */
@media (max-width: 768px) {
  .hero-title {
    font-size: 2.5rem;
  }
  
  .hero-subtitle {
    font-size: 1.125rem;
  }
}

/* Utility Classes */
.text-primary {
  color: var(--primary);
}

.text-secondary {
  color: var(--secondary);
}

.bg-primary {
  background-color: var(--primary);
}

.bg-secondary {
  background-color: var(--secondary);
}

.rounded-button {
  border-radius: var(--button-radius);
}