/* === EO Product Labels — CSS Animations === */

/* Pulse — soft scale */
@keyframes eo-pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.08); }
}
.eo-label--anim-pulse { animation: eo-pulse 2s ease-in-out infinite; }

/* Glow — box-shadow */
@keyframes eo-glow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0); }
    50% { box-shadow: 0 0 8px 2px rgba(255, 255, 255, 0.4); }
}
.eo-label--anim-glow { animation: eo-glow 2s ease-in-out infinite; }

/* Shake — brief horizontal wiggle, then pause */
@keyframes eo-shake {
    0%, 14% { transform: translateX(0); }
    2% { transform: translateX(-2px); }
    4% { transform: translateX(2px); }
    6% { transform: translateX(-2px); }
    8% { transform: translateX(2px); }
    10% { transform: translateX(-1px); }
    12% { transform: translateX(1px); }
}
.eo-label--anim-shake { animation: eo-shake 3.5s ease-in-out infinite; }

/* Bounce — vertical bounce */
@keyframes eo-bounce {
    0%, 100% { transform: translateY(0); }
    40% { transform: translateY(-6px); }
    60% { transform: translateY(-3px); }
}
.eo-label--anim-bounce { animation: eo-bounce 1s ease infinite; }

/* Fade in — one-shot */
@keyframes eo-fade-in {
    from { opacity: 0; }
    to { opacity: 1; }
}
.eo-label--anim-fade-in { animation: eo-fade-in 0.5s ease forwards; }

/* Slide in — one-shot from left */
@keyframes eo-slide-in {
    from { opacity: 0; transform: translateX(-20px); }
    to { opacity: 1; transform: translateX(0); }
}
.eo-label--anim-slide-in { animation: eo-slide-in 0.4s ease forwards; }

/* Hover pause */
.eo-label--anim-hover-pause:hover {
    animation-play-state: paused !important;
}

/* Reduced motion: disable all animations */
@media (prefers-reduced-motion: reduce) {
    .eo-label--anim-pulse,
    .eo-label--anim-glow,
    .eo-label--anim-shake,
    .eo-label--anim-bounce,
    .eo-label--anim-fade-in,
    .eo-label--anim-slide-in {
        animation: none !important;
    }
}
