/* =================================================================
   UPCOMING MOVIES/SHOWS - GRID & CAROUSEL VIEWS
   ================================================================= */

/* Grid View */
.bo-upcoming-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 20px;
    padding: 20px 0;
}

.bo-upcoming-card {
    transition: transform 0.3s, box-shadow 0.3s;
}

.bo-upcoming-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3);
}

/* Carousel View */
.bo-upcoming-carousel {
    display: flex;
    overflow-x: auto;
    gap: 20px;
    padding: 20px 0;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
}

.bo-upcoming-carousel::-webkit-scrollbar {
    height: 8px;
}

.bo-upcoming-carousel::-webkit-scrollbar-track {
    background: #151823;
    border-radius: 4px;
}

.bo-upcoming-carousel::-webkit-scrollbar-thumb {
    background: var(--bo-gold);
    border-radius: 4px;
}

.bo-upcoming-carousel .bo-upcoming-card {
    min-width: 280px;
    max-width: 280px;
    scroll-snap-align: start;
}

/* =================================================================
   V3 FIX 2026-01-08: RELEASE STATUS BADGES
   ================================================================= */

/* Release status badge - positioned on top-right of poster */
.bo-release-badge {
    position: absolute;
    top: 10px;
    right: 10px;
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 700;
    z-index: 10;
    text-shadow: 0 1px 2px rgba(0,0,0,0.3);
    box-shadow: 0 2px 8px rgba(0,0,0,0.2);
}

/* Upcoming movies - gold gradient */
.bo-release-badge.upcoming {
    background: linear-gradient(135deg, #FFD700, #FFA500);
    color: #000;
}

/* Recently released - green gradient */
.bo-release-badge.released {
    background: linear-gradient(135deg, #27ae60, #2ecc71);
    color: #fff;
}

/* Releasing today - red with pulsing animation */
.bo-release-badge.today {
    background: linear-gradient(135deg, #e74c3c, #c0392b);
    color: #fff;
    animation: pulse-badge 1.5s infinite;
}

/* Archive status - grey gradient */
.bo-release-badge.archive {
    background: linear-gradient(135deg, #95a5a6, #7f8c8d);
    color: #fff;
}

/* Pulsing animation for "today" badge */
@keyframes pulse-badge {
    0%, 100% { 
        transform: scale(1); 
        opacity: 1; 
    }
    50% { 
        transform: scale(1.05); 
        opacity: 0.9; 
    }
}

/* Show Grid/Carousel */
.bo-shows-container.bo-view-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 20px;
    padding: 20px 0;
}

.bo-shows-container.bo-view-carousel {
    display: flex;
    overflow-x: auto;
    gap: 20px;
    padding: 20px 0;
    scroll-snap-type: x mandatory;
}

.bo-shows-container.bo-view-carousel .bo-show-card {
    min-width: 280px;
    max-width: 280px;
    scroll-snap-align: start;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .bo-upcoming-grid,
    .bo-shows-container.bo-view-grid {
        grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
        gap: 15px;
    }
    
    .bo-upcoming-carousel .bo-upcoming-card,
    .bo-shows-container.bo-view-carousel .bo-show-card {
        min-width: 220px;
        max-width: 220px;
    }
}

@media (max-width: 480px) {
    .bo-upcoming-grid,
    .bo-shows-container.bo-view-grid {
        grid-template-columns: 1fr;
    }
    
    .bo-upcoming-carousel .bo-upcoming-card,
    .bo-shows-container.bo-view-carousel .bo-show-card {
        min-width: 260px;
        max-width: 260px;
    }
}