/* Onboarding animations: each step fades/slides in as the Turbo Frame swaps, and the
   gradient progress themes get a subtle moving shimmer. The progress fill itself animates
   via a width transition driven by the onboarding-progress Stimulus controller. */

@keyframes onb-step-in {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

.onb-step-enter {
  animation: onb-step-in 0.35s ease-out both;
}

@keyframes onb-shimmer-move {
  0%   { background-position: 0% 50%; }
  100% { background-position: 200% 50%; }
}

.onb-shimmer {
  background-size: 200% 100%;
  animation: onb-shimmer-move 2s linear infinite;
}

/* "Circles" Halo theme: the current step's ring sweeps and its disc pulses a soft accent glow. */
.onb-halo-sweep {
  transform-box: fill-box;
  transform-origin: center;
  animation: onb-halo-spin 1.6s linear infinite;
}

@keyframes onb-halo-spin {
  to { transform: rotate(360deg); }
}

.onb-halo-pulse {
  animation: onb-halo-glow 1.8s ease-in-out infinite;
}

@keyframes onb-halo-glow {
  0%, 100% { box-shadow: 0 0 0 0 var(--app-accent-soft, rgba(37, 99, 235, 0.35)); }
  50%      { box-shadow: 0 0 0 7px transparent; }
}

@media (prefers-reduced-motion: reduce) {
  .onb-step-enter, .onb-shimmer, .onb-halo-sweep, .onb-halo-pulse { animation: none; }
}