/* Skeleton shimmer */
@keyframes shimmer {
  0% { background-position: -200px 0; }
  100% { background-position: calc(200px + 100%) 0; }
}
.skeleton {
  background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
  background-size: 200px 100%;
  animation: shimmer 1.5s ease-in-out infinite;
  border-radius: var(--ag-radius-xs, 6px);
}

/* Card staggered fade-in */
.result-card {
  opacity: 0;
  transform: translateY(8px);
  animation: fadeInUp 0.3s ease forwards;
}
.result-card:nth-child(1) { animation-delay: 0.05s; }
.result-card:nth-child(2) { animation-delay: 0.1s; }
.result-card:nth-child(3) { animation-delay: 0.15s; }
.result-card:nth-child(4) { animation-delay: 0.2s; }
.result-card:nth-child(5) { animation-delay: 0.25s; }

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

/* Checkout step transitions */
.checkout-step {
  transition: opacity 0.25s ease, transform 0.25s ease;
}
.checkout-step--entering {
  opacity: 0;
  transform: translateX(20px);
}
.checkout-step--active {
  opacity: 1;
  transform: translateX(0);
}
.checkout-step--exiting {
  opacity: 0;
  transform: translateX(-20px);
}

/* Fare calendar selection */
.fare-calendar__day {
  transition: transform 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}

/* Boarding pass entrance */
@keyframes boardingPassEntrance {
  0% { opacity: 0; transform: scale(0.9) rotate(-2deg); }
  100% { opacity: 1; transform: scale(1) rotate(0); }
}
.boarding-pass-card {
  animation: boardingPassEntrance 0.5s ease 0.2s forwards;
  opacity: 0;
}

/* Corridor badge tooltip */
.corridor-badge {
  transition: transform 0.15s ease;
}
.corridor-badge:hover {
  transform: scale(1.1);
}

/* Suggestion item hover */
.suggestion-item {
  transition: background 0.15s ease;
}
.suggestion-item:hover {
  background: var(--ag-surface-soft, #f8f9fa);
}

/* Reduced motion override */
@media (prefers-reduced-motion: reduce) {
  .result-card,
  .boarding-pass-card {
    animation: none;
    opacity: 1;
    transform: none;
  }
}