/* Basic Animations */
@keyframes float {
    0%,
    100% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-10px);
    }
}

@keyframes pulse {
    0%,
    100% {
        opacity: 1;
    }
    50% {
        opacity: 0.6;
    }
}

@keyframes glow {
    0%,
    100% {
        filter: drop-shadow(0 0 2px var(--accent-neon));
    }
    50% {
        filter: drop-shadow(0 0 8px var(--accent-neon));
    }
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

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

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeOut {
    from {
        opacity: 1;
        transform: translateY(0);
    }
    to {
        opacity: 0;
        transform: translateY(10px);
    }
}

@keyframes slideInRight {
    from {
        transform: translateX(30px);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes slideInLeft {
    from {
        transform: translateX(-30px);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes wiggle {
    0%,
    100% {
        transform: rotate(0deg);
    }
    25% {
        transform: rotate(5deg);
    }
    75% {
        transform: rotate(-5deg);
    }
}

/* System-specific animations */
@keyframes switchGlitch {
    0% {
        transform: translate(0) skew(0);
        filter: hue-rotate(0deg);
    }
    20% {
        transform: translate(-2px, 2px) skew(2deg, -2deg);
        filter: hue-rotate(90deg);
    }
    40% {
        transform: translate(2px, 0) skew(-2deg, 0);
        filter: hue-rotate(180deg);
    }
    60% {
        transform: translate(0, -2px) skew(0, 2deg);
        filter: hue-rotate(270deg);
    }
    80% {
        transform: translate(-2px, 0) skew(2deg, 0);
        filter: hue-rotate(360deg);
    }
    100% {
        transform: translate(0) skew(0);
        filter: hue-rotate(0deg);
    }
}

@keyframes statusBlink {
    0%,
    49% {
        opacity: 1;
    }
    50%,
    100% {
        opacity: 0.7;
    }
}

/* Add animation classes */
.animate-float {
    animation: float 3s ease-in-out infinite;
}

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

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

.animate-spin {
    animation: spin 1s linear infinite;
}

.animate-bounce {
    animation: bounce 1s ease-in-out infinite;
}

.animate-fade-in {
    animation: fadeIn 0.5s ease-in-out forwards;
}

.animate-fade-out {
    animation: fadeOut 0.5s ease-in-out forwards;
}

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

.animate-slide-in-left {
    animation: slideInLeft 0.3s ease-out forwards;
}

.animate-wiggle {
    animation: wiggle 1s ease-in-out;
}

.animate-switch-glitch {
    animation: switchGlitch 0.5s ease-in-out;
}

.animate-status-blink {
    animation: statusBlink 1s infinite;
}

/* Delay Utilities */
.delay-100 {
    animation-delay: 100ms;
}

.delay-200 {
    animation-delay: 200ms;
}

.delay-300 {
    animation-delay: 300ms;
}

.delay-500 {
    animation-delay: 500ms;
}

.delay-700 {
    animation-delay: 700ms;
}

.delay-1000 {
    animation-delay: 1000ms;
}

/* Duration Utilities */
.duration-300 {
    animation-duration: 300ms;
}

.duration-500 {
    animation-duration: 500ms;
}

.duration-700 {
    animation-duration: 700ms;
}

.duration-1000 {
    animation-duration: 1000ms;
}

.duration-2000 {
    animation-duration: 2000ms;
}

.duration-3000 {
    animation-duration: 3000ms;
}

/* Animation behavior */
.animation-once {
    animation-iteration-count: 1;
}

.animation-twice {
    animation-iteration-count: 2;
}

.animation-infinite {
    animation-iteration-count: infinite;
}

/* Pause animations when prefers-reduced-motion */
@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}
