/* Custom styles beyond Tailwind */
* { scrollbar-width: thin; scrollbar-color: #a3abbc transparent; }
.dark * { scrollbar-color: #425466 transparent; }

/* Smooth scrolling */
html { scroll-behavior: smooth; }

/* Suggestion dropdown animation */
.suggest-list { animation: slideDown 0.15s ease-out; }
@keyframes slideDown { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: translateY(0); } }

/* Quality/subtitle button active state */
.quality-btn.active, .subtitle-btn.active {
    background: #635bff !important;
    color: white !important;
    border-color: #635bff !important;
}


.quality-btn.active .text-navy-400 {
    color: lightblue !important;
}
.subtitle-btn.active .text-navy-400 {
    color: lightblue !important;
}
.quality-btn.active .text-navy-700 {
    color: white !important;
}
.subtitle-btn.active .text-navy-700 {
    color: white !important;
}


.dark .quality-btn.active, .dark .subtitle-btn.active {
    background: #7a73ff !important;
}

/* Episode button active/selected state */
.ep-btn.active {
    background: #635bff !important;
    color: white !important;
}
.dark .ep-btn.active {
    background: #7a73ff !important;
}

/* Movie card hover */
.movie-card { transition: transform 0.2s ease, box-shadow 0.2s ease; }
.movie-card:hover { transform: translateY(-2px); }

/* Modal animation */
.modal-overlay { animation: fadeIn 0.2s ease; }
.modal-content { animation: scaleIn 0.2s ease; }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

/* Loading spinner */
.spinner { border: 3px solid rgba(99,91,255,0.2); border-top-color: #635bff; border-radius: 50%; width: 24px; height: 24px; animation: spin 0.6s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

/* Pulse for search icon */
.search-pulse { animation: pulse 2s infinite; }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }