/* Custom styles for The Rewatchables AU */

/* Streaming service badge colors */
.badge-netflix { background-color: #E50914; }
.badge-stan { background-color: #0FB9FF; }
.badge-prime { background-color: #00A8E1; }
.badge-disney { background-color: #0A1C44; }
.badge-binge { background-color: #FF6B00; }
.badge-paramount { background-color: #0064FF; }
.badge-apple { background-color: #000000; border: 1px solid #333; }
.badge-max { background-color: #000000; border: 1px solid #333; }
.badge-rent { background-color: #4B5563; }

/* Episode card styling */
.episode-card {
    background: #ffffff;
    border: 1px solid #e5e5e5;
    transition: all 0.3s ease;
}

.episode-card:hover {
    border-color: #ffa500;
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(0, 51, 102, 0.15);
}

/* Movie poster placeholder gradient */
.poster-gradient {
    background: linear-gradient(145deg, #003366 0%, #004488 100%);
}

/* Active filter state */
.filter-active {
    border-color: #ffa500 !important;
    background-color: rgba(255, 165, 0, 0.1) !important;
}

/* Streaming badge base */
.streaming-badge {
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.025em;
}

/* Star rating */
.star-rating {
    color: #ffa500;
}

.star-empty {
    color: #d1d5db;
}

/* Spotify button */
.spotify-btn {
    background-color: #1DB954;
    transition: background-color 0.2s ease;
}

.spotify-btn:hover {
    background-color: #1ed760;
}

/* Apple Podcasts button */
.apple-btn {
    background-color: #872EC4;
    transition: background-color 0.2s ease;
}

.apple-btn:hover {
    background-color: #9b3edb;
}

/* Custom scrollbar */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: #e5e5e5;
}

::-webkit-scrollbar-thumb {
    background: #003366;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: #004488;
}

/* Focus states for accessibility */
input:focus,
select:focus,
button:focus {
    outline: 2px solid #ffa500;
    outline-offset: 2px;
}

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

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

/* Responsive adjustments */
@media (max-width: 640px) {
    .episode-card {
        margin-bottom: 1rem;
    }

    .streaming-badge {
        font-size: 0.65rem;
        padding: 0.2rem 0.4rem;
    }
}