/* ========================================
   Personalized Video Recommender 
   SpaceX Theme Adapter CSS
   ======================================== */

/* --- PVR Widget Container --- */
.pvr-widget-wrap {
    width: 100%;
    margin-bottom: 2rem;
}

.pvr-widget-wrap .widget-title {
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 1rem;
}

/* --- Skeleton Loader --- */
.pvr-recommendation-container.is-loading {
    cursor: progress;
    pointer-events: none;
}

.pvr-recommendation-container.is-loading .is-skeleton {
    opacity: 0.6;
}

.skeleton-box {
    background-color: var(--bg-card);
    background-image: linear-gradient(
        90deg,
        rgba(255, 255, 255, 0),
        rgba(255, 255, 255, 0.05),
        rgba(255, 255, 255, 0)
    );
    background-size: 200% 100%;
    animation: skeleton-pulse 1.8s infinite cubic-bezier(0.4, 0, 0.6, 1);
    border-radius: 0.5rem;
}

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

/* Skeleton text blocks */
.skeleton-text,
.skeleton-text-short {
    background-color: var(--bg-card);
    border-radius: 4px;
}

/* --- Responsive - 確保在所有螢幕正確顯示 --- */
@media (max-width: 767px) {
    .pvr-widget-wrap .row-5px {
        gap: 10px 0;
    }
}

/* --- Loading State --- */
.pvr-recommendation-container.is-loading .video-img {
    background-color: var(--bg-card);
}

.pvr-recommendation-container.is-loading .video-desc {
    opacity: 0.5;
}

/* --- 空狀態 --- */
.pvr-widget-wrap .empty-state {
    text-align: center;
    padding: 2rem;
    color: var(--text-muted);
    font-size: 0.9rem;
}

/* --- 確保與主題網格對齊 --- */
.pvr-widget-wrap .row-5px {
    margin-left: -2.5px;
    margin-right: -2.5px;
}

.pvr-widget-wrap .row-5px > [class*='col-'] {
    padding-left: 2.5px;
    padding-right: 2.5px;
}

/* --- 卡片懸停效果 (與主題一致) --- */
.pvr-widget-wrap .thumb-block:hover .video-desc a {
    color: var(--primary-color);
}

.pvr-widget-wrap .thumb-block:hover .video-img {
    transform: translateY(-2px);
    transition: transform 0.3s ease;
}