/* Animations - Keyframes and animation utilities */

/* Spinner rotation */
@keyframes spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

/* Subtle pulse for loading states */
@keyframes pulse-border {
  0%, 100% { border-color: var(--color-border); }
  50% { border-color: var(--color-accent); }
}

/* Progress bar shimmer */
@keyframes shimmer {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}

/* Success glow */
@keyframes success-glow {
  0%, 100% { box-shadow: 0 0 0 0 rgba(52, 168, 83, 0); }
  50% { box-shadow: 0 0 12px 4px rgba(52, 168, 83, 0.3); }
}

/* Revocation flash */
@keyframes revocation-flash {
  0% { background-color: var(--color-bg); }
  50% { background-color: var(--color-error-light); }
  100% { background-color: var(--color-bg); }
}

/* Text fade swap */
@keyframes text-swap {
  0% { opacity: 1; transform: translateY(0); }
  50% { opacity: 0; transform: translateY(-4px); }
  51% { opacity: 0; transform: translateY(4px); }
  100% { opacity: 1; transform: translateY(0); }
}

/* Fade in */
@keyframes fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* Fade out */
@keyframes fade-out {
  from { opacity: 1; }
  to { opacity: 0; }
}

/* Slide down */
@keyframes slide-down {
  from { 
    opacity: 0;
    transform: translateY(-10px);
  }
  to { 
    opacity: 1;
    transform: translateY(0);
  }
}

/* Slide up */
@keyframes slide-up {
  from { 
    opacity: 1;
    transform: translateY(0);
  }
  to { 
    opacity: 0;
    transform: translateY(-10px);
  }
}

/* Scale in */
@keyframes scale-in {
  from { 
    opacity: 0;
    transform: scale(0.95);
  }
  to { 
    opacity: 1;
    transform: scale(1);
  }
}

/* Scale out */
@keyframes scale-out {
  from { 
    opacity: 1;
    transform: scale(1);
  }
  to { 
    opacity: 0;
    transform: scale(0.95);
  }
}

/* Pulse */
@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}

/* Shake */
@keyframes shake {
  0%, 100% { transform: translateX(0); }
  10%, 30%, 50%, 70%, 90% { transform: translateX(-2px); }
  20%, 40%, 60%, 80% { transform: translateX(2px); }
}

/* Glow */
@keyframes glow {
  0%, 100% { box-shadow: 0 0 0 0 rgba(66, 133, 244, 0); }
  50% { box-shadow: 0 0 8px 2px rgba(66, 133, 244, 0.3); }
}

@keyframes card-settle {
  from {
    opacity: 0.98;
    transform: translateY(8px) scale(0.985);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes content-rise {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes icon-breathe {
  0%, 100% {
    transform: translateY(0);
    opacity: 0.72;
  }
  50% {
    transform: translateY(-1px);
    opacity: 0.9;
  }
}

@keyframes status-drift {
  0% {
    opacity: 0;
    transform: translateY(6px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes feedback-settle {
  0% {
    opacity: 0;
    transform: translateY(-8px) scale(0.99);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

/* Animation utility classes */
.animate-fade-in {
  animation: fade-in var(--duration-normal) var(--ease-out) forwards;
}

.animate-fade-out {
  animation: fade-out var(--duration-normal) var(--ease-out) forwards;
}

.animate-slide-down {
  animation: slide-down var(--duration-normal) var(--ease-out) forwards;
}

.animate-slide-up {
  animation: slide-up var(--duration-normal) var(--ease-out) forwards;
}

.animate-scale-in {
  animation: scale-in var(--duration-normal) var(--ease-out) forwards;
}

.animate-scale-out {
  animation: scale-out var(--duration-normal) var(--ease-out) forwards;
}

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

.animate-shake {
  animation: shake 0.5s var(--ease-out);
}

.animate-glow {
  animation: glow 2s infinite;
}

.animate-spin {
  animation: spin 800ms linear infinite;
}

/* Stagger delays for sequential animations */
.stagger-1 { animation-delay: 50ms; }
.stagger-2 { animation-delay: 100ms; }
.stagger-3 { animation-delay: 150ms; }
.stagger-4 { animation-delay: 200ms; }
.stagger-5 { animation-delay: 250ms; }

/* Transition utilities */
.transition-all {
  transition: all var(--duration-normal) var(--ease-out);
}

.transition-fast {
  transition: all var(--duration-fast) var(--ease-out);
}

.transition-slow {
  transition: all var(--duration-slow) var(--ease-out);
}

/* Animation state classes */
.animating {
  pointer-events: none;
}

.paused {
  animation-play-state: paused;
}