/* Clean Animations - No AI Slop */
/* Three professional, smooth animations */

/* Animation 1: Fade In Up - For content appearing */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.fade-in-up {
  animation: fadeInUp 0.6s ease-out forwards;
}

/* Animation 2: Slide In Right - For sidebars and panels */
@keyframes slideInRight {
  from {
    opacity: 0;
    transform: translateX(-50px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.slide-in-right {
  animation: slideInRight 0.5s ease-out forwards;
}

/* Animation 3: Pulse Glow - For buttons and highlights */
@keyframes pulseGlow {
  0%, 100% {
    box-shadow: 0 0 5px rgba(193, 10, 40, 0.3);
  }
  50% {
    box-shadow: 0 0 20px rgba(193, 10, 40, 0.6);
  }
}

.pulse-glow {
  animation: pulseGlow 2s ease-in-out infinite;
}

/* Staggered animation delays */
.stagger-1 { animation-delay: 0.1s; }
.stagger-2 { animation-delay: 0.2s; }
.stagger-3 { animation-delay: 0.3s; }
.stagger-4 { animation-delay: 0.4s; }

/* Loading spinner for async operations */
@keyframes spin {
  to { transform: rotate(360deg); }
}

.spinner {
  display: inline-block;
  width: 20px;
  height: 20px;
  border: 3px solid rgba(193, 10, 40, 0.3);
  border-top-color: #c10a28;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

/* Smooth transitions */
.smooth-transition {
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Hover lift effect */
.hover-lift {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.hover-lift:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
}