/* ==========================================================================
   StreamOTT — animations.css
   ========================================================================== */

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

@keyframes fadeIn {
    from { opacity: 0; } to { opacity: 1; }
}

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

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

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

@keyframes pulseRing {
    0% { box-shadow: 0 0 0 0 rgba(229, 9, 20, 0.4); }
    100% { box-shadow: 0 0 0 10px rgba(229, 9, 20, 0); }
}

.fade-in { animation: fadeIn 0.4s ease both; }
.slide-up { animation: slideUp 0.5s ease both; }

.up-next-card:not([hidden]) { animation: slideInRight 0.4s ease both; }
.toast { animation: toastIn 0.25s ease both; }

.video-card, .playlist-card { animation: fadeIn 0.4s ease both; }

.hero-dot.is-active { transition: width 0.3s ease, background 0.3s ease; }

@media (prefers-reduced-motion: reduce) {
    .video-card, .playlist-card, .up-next-card, .toast { animation: none !important; }
}