.tag-badge {
            cursor: pointer;
            transition: opacity 0.2s;
        }
        .tag-badge:hover {
            opacity: 0.8;
        }
        @media (max-width: 768px) {
            .movie-poster {
                margin-bottom: 1.5rem;
                max-height: 400px;
            }
            .playlist-container {
                max-height: 300px;
            }
        }
        
          .movie-card {
            transition: transform 0.3s;
        }
        .movie-card:hover {
            transform: translateY(-5px);
        }
        .movie-poster {
            height: 300px;
            object-fit: cover;
            border-radius: 8px;
        }
        .category-title {
            border-left: 4px solid #dc3545;
            padding-left: 1rem;
            margin: 2rem 0 1rem;
        }
        .swiper-slide {
            height: 400px;
        }
        .hot-keyword {
            margin: 5px;
            transition: all 0.2s;
        }
        @media (max-width: 768px) {
            .movie-poster {
                height: 200px;
            }
            .swiper-slide {
                height: 250px;
            }
        }

        .search-header {
            background: linear-gradient(135deg, #1a1a1a 0%, #0a0a0a 100%);
            padding: 3rem 0;
            margin-bottom: 2rem;
        }

        .movie-card {
            transition: transform 0.3s ease;
            border-radius: var(--card-radius);
            overflow: hidden;
            background: #111;
            position: relative;
        }

        .movie-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 8px 20px rgba(0,0,0,0.3);
        }

        .pagination .page-link {
            min-width: 40px;
            text-align: center;
            background: #222;
            border-color: #333;
        }

        .no-results {
            min-height: 60vh;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        @media (max-width: 768px) {
            .search-box {
                margin-top: 1rem;
            }
            .movie-info {
                font-size: 0.9rem;
            }
        }
            .popular-searches {
        background-color: #2a2a2a; /* 深灰背景 */
        padding: 15px;
        border-radius: 8px;
    }

    /* 每个链接的样式 */
    .popular-searches span {
        background-color: #333;
        padding: 8px 12px;
        border-radius: 20px; /* 增加圆角 */
        transition: transform 0.3s ease, box-shadow 0.3s ease;
        display: inline-block; /* 保证它们按行排列 */
    }

    .popular-searches span:hover {
        transform: translateY(-3px);
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    }

    .popular-searches a {
        color: #dc3545; /* 红色链接 */
        text-decoration: none; /* 去掉下划线 */
    }

    .popular-searches a:hover {
        color: #ff6f61; /* 悬浮时颜色变化 */
    }

    /* 增加间距 */
    .popular-searches span + span {
        margin-left: 10px; /* 每个项之间增加间距 */
    }

    h4 {
        font-size: 1.5rem;
        font-weight: bold;
    }

    /* 响应式：较小屏幕时，使用单列显示 */
    @media (max-width: 768px) {
        .popular-searches span {
            margin-bottom: 10px;
        }
    }
        /* Styling for the '播放源选择' header */
    .yuan-xsource-zheader {
        font-size: 1.75rem;           /* Larger font size for prominence */
        font-weight: bold;            /* Bold text for importance */
        color: #dc3545;               /* Red color for emphasis */
        margin-bottom: 1.5rem;        /* Space below the header */
        text-align: left;             /* Align the text to the left */
        border-bottom: 3px solid #dc3545; /* Red underline to highlight the header */
        padding-bottom: 0.5rem;       /* Padding at the bottom to give breathing space */
        letter-spacing: 0.5px;        /* Slight letter-spacing for better readability */
    }

    /* Optional: Add a hover effect to give interactivity */
    .yuan-xsource-zheader:hover {
        color: #ff6f61;               /* Slightly lighter red color on hover */
        border-color: #ff6f61;        /* Change the border color to match text on hover */
        cursor: pointer;             /* Show pointer cursor to indicate interactivity */
    }