/* Page-specific styles extracted from html/vod/type.html; kept separate to allow browser caching. */
/* --- extracted styles from html/vod/type.html --- */
/* 视频分类标题：与视频大全完全统一 */
        .vod-search-page > h1 {
            margin: 0 0 12px;
            padding: 5px 0 5px 14px;
            border-left: 4px solid #16a34a;
            font-size: 22px;
            font-weight: 700;
            line-height: 1.5;
            color: var(--zy-color);
            box-sizing: border-box;
        }

        /* 分类区域 */
        .article-categories {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
            margin: 0 0 24px;
            padding: 16px;
            background: var(--zy-bggray);
            border: 1px solid rgba(22, 163, 74, .55);
            border-radius: 12px;
            box-shadow: 0 0 0 1px rgba(22,163,74,.06);
        }

        .article-categories a {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: 8px 14px;
            border: 1px solid #444451;
            border-radius: 20px;
            color: var(--zy-color);
            text-decoration: none;
            font-size: 14px;
            transition: all .2s ease;
        }

        .article-categories a:hover {
            background: var(--zy-hover);
            border-color: var(--zy-hover);
            color: #fff;
        }

        /* 手机端分类区域 */
        @media (max-width: 700px) {
            .vod-search-page > h1 {
                font-size: 19px;
            }

            .article-categories {
                gap: 8px;
                padding: 12px;
            }

            .article-categories a {
                padding: 7px 11px;
            }
        }

        /* 分类列表页：宽度与首页内容区一致，避免外层 container 再次限宽 */
        body.body .container.vod-search-page {
            width: calc(100% - 32px);
            max-width: 1320px !important;
            margin-left: auto;
            margin-right: auto;
            padding-left: 0;
            padding-right: 0;
            box-sizing: border-box;
        }

        /* 模板原结构内层又套了一层 .container，取消二次限宽 */
        body.body .vod-search-page > .container {
            width: 100%;
            max-width: none !important;
            margin-left: 0;
            margin-right: 0;
            padding-left: 0;
            padding-right: 0;
            box-sizing: border-box;
        }

        /* 视频列表区域占满父容器，网格不再被旧版 1080px 宽度限制 */
        body.body .vod-search-page .category-con,
        body.body .vod-search-page .category-con .a-con {
            width: 100%;
            max-width: none;
            box-sizing: border-box;
        }

        @media (max-width: 600px) {
            body.body .container.vod-search-page {
                width: calc(100% - 20px);
            }
        }

/* 视频分类页：视频卡片统一采用首页的海报网格样式 */
.vod-search-page .category-con {
    width: 100%;
    padding: 16px;
    margin: 0 0 22px;
    border: 1px solid rgba(22, 163, 74, .72);
    border-radius: 14px;
    background: var(--zy-bggray, rgba(255,255,255,.02));
    box-shadow: 0 0 0 1px rgba(22,163,74,.08), 0 8px 24px rgba(22,163,74,.06);
    box-sizing: border-box;
}
.vod-search-page .category-con .a-tit {
    margin: 0 0 14px;
    padding: 4px 0 4px 12px;
    border-left: 4px solid #16a34a;
}
.vod-search-page .category-con .a-tit h1 {
    margin: 0;
    color: var(--zy-color);
    font-size: 20px;
    line-height: 1.5;
    font-weight: 700;
}
.vod-search-page .category-con .page-count {
    margin: 0 0 16px;
    color: #888;
    font-size: 13px;
}
.vod-search-page .category-con .page-count strong {
    color: #16a34a;
    font-weight: 700;
}
.vod-search-page .category-con .a-con {
    display: grid !important;
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: 22px 16px !important;
    width: 100%;
    max-width: none;
}
.vod-search-page .category-con .a-con-inner {
    min-width: 0;
    overflow: hidden;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}
.vod-search-page .category-con .pic {
    position: relative;
    overflow: hidden;
    width: 100%;
    aspect-ratio: 3 / 4;
    border-radius: 9px;
    background: #202026;
}
.vod-search-page .category-con .pic > a:first-child {
    display: block;
    width: 100%;
    height: 100%;
}
.vod-search-page .category-con .pic img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .3s ease;
}
.vod-search-page .category-con .pic .bofang {
    position: absolute;
    z-index: 2;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
    font-size: 36px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .25s ease, visibility .25s ease;
}
.vod-search-page .category-con .pic .s5 {
    position: absolute;
    z-index: 2;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 22px 8px 8px;
    color: #fff;
    font-size: 11px;
    line-height: 1.5;
    background: linear-gradient(transparent, rgba(0,0,0,.8));
    opacity: 0;
    visibility: hidden;
    transition: opacity .25s ease, visibility .25s ease;
}
.vod-search-page .category-con .pic .s5 b { display: block; font-weight: 400; overflow-wrap: anywhere; }
.vod-search-page .category-con .pic .s5 .jj { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
@media (hover: hover) and (pointer: fine) {
    .vod-search-page .category-con .a-con-inner:hover .pic img { transform: scale(1.045); }
    .vod-search-page .category-con .a-con-inner:hover .pic .bofang,
    .vod-search-page .category-con .a-con-inner:hover .pic .s5 { opacity: 1; visibility: visible; }
}
.vod-search-page .category-con .s1 {
    display: -webkit-box;
    margin-top: 9px;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.55;
}
.vod-search-page .category-con .s1 a { color: var(--zy-color); text-decoration: none; overflow-wrap: anywhere; }
.vod-search-page .category-con .s1 a:hover { color: #16a34a; }
.vod-search-page .category-con .vod-time { display: block; margin-top: 5px; color: #888; font-size: 12px; line-height: 1.5; }
.vod-search-page .category-con .s2 { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 7px; }
.vod-search-page .category-con .s2 a { display: inline-block; padding: 2px 7px; border-radius: 4px; background: rgba(22,163,74,.1); color: #16a34a; font-size: 11px; line-height: 1.6; text-decoration: none; }
.vod-search-page .category-con .s2 a:hover { background: #16a34a; color: #fff; }
@media (min-width: 601px) and (max-width: 1024px) {
    .vod-search-page .category-con .a-con { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 18px 12px !important; }
}
@media (max-width: 600px) {
    .vod-search-page .category-con { padding: 12px; border-radius: 11px; }
    .vod-search-page .category-con .a-con { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 14px 8px !important; }
    .vod-search-page .category-con .s1 { margin-top: 6px; font-size: 12px; line-height: 1.5; }
    .vod-search-page .category-con .vod-time { margin-top: 4px; font-size: 10px; }
    .vod-search-page .category-con .s2 { gap: 3px; margin-top: 5px; }
    .vod-search-page .category-con .s2 a { padding: 2px 4px; font-size: 10px; }
}
@media (max-width: 360px) {
    .vod-search-page .category-con .a-con { gap: 12px 7px !important; }
}


/* 2026-10-29：首页统一背景与绿色外框优化 */
body.body .container.vod-search-page .article-categories,
body.body .container.vod-search-page .category-con,
body.body .container.vod-search-page .paging,
body.body .container.vod-search-page .page,
body.body .container.vod-search-page .mac_pages {
    background: linear-gradient(135deg, #25252b 0%, #30303a 100%) !important;
    border: 1px solid rgba(22, 163, 74, .72) !important;
    border-radius: 14px;
    box-shadow: 0 0 0 1px rgba(22,163,74,.07), 0 8px 24px rgba(0,0,0,.14);
}
body.body .container.vod-search-page .article-categories { padding: 16px; }
body.body .container.vod-search-page .category-con { padding: 16px; }
body.body .container.vod-search-page .article-categories a {
    background: rgba(255,255,255,.035);
    border-color: rgba(22,163,74,.28);
}
body.body .container.vod-search-page .article-categories a:hover {
    background: var(--zy-hover) !important;
    border-color: var(--zy-hover) !important;
}
@media (max-width: 600px) {
    body.body .container.vod-search-page .article-categories,
    body.body .container.vod-search-page .category-con { padding: 11px; border-radius: 11px; }
}


/* 2026-10-29：标题与内容统一收进绿色面板，背景改为首页同系绿色 */
body.body .container.vod-search-page .vod-category-panel,
body.body .main .container.vod-search-page .vod-keyword-panel,
body.body .container.vod-search-page .category-con,
body.body .main .container.vod-search-page .search-con {
    background: linear-gradient(135deg, rgba(22,163,74,.20) 0%, rgba(22,163,74,.09) 100%) !important;
    border: 1px solid rgba(22,163,74,.82) !important;
    border-radius: 14px !important;
    box-shadow: 0 0 0 1px rgba(22,163,74,.10), 0 8px 24px rgba(0,0,0,.12) !important;
    box-sizing: border-box;
}
body.body .container.vod-search-page .vod-category-panel,
body.body .main .container.vod-search-page .vod-keyword-panel {
    padding: 16px;
    margin: 0 0 22px;
}
body.body .container.vod-search-page .vod-category-panel > h1,
body.body .main .container.vod-search-page .vod-keyword-panel > h1 {
    margin: 0 0 14px !important;
    padding: 4px 0 4px 12px !important;
    border-left: 4px solid #16a34a !important;
    color: var(--zy-color, #fff);
}
body.body .container.vod-search-page .vod-category-panel .article-categories,
body.body .main .container.vod-search-page .vod-keyword-panel .vod-search-categories {
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}
body.body .container.vod-search-page .category-con,
body.body .main .container.vod-search-page .search-con { padding: 16px !important; }
body.body .container.vod-search-page .category-con .a-tit { margin-bottom: 14px; }
body.body .container.vod-search-page .category-con .a-tit h1,
body.body .main .container.vod-search-page .search-con .res h1 {
    border-left: 4px solid #16a34a;
    padding-left: 12px;
    margin: 0;
}
body.body .container.vod-search-page .article-categories a,
body.body .main .container.vod-search-page .vod-search-categories a {
    background: rgba(22,163,74,.10) !important;
    border-color: rgba(22,163,74,.38) !important;
}
body.body .container.vod-search-page .article-categories a:hover,
body.body .main .container.vod-search-page .vod-search-categories a:hover {
    background: #16a34a !important; border-color: #16a34a !important; color: #fff !important;
}
@media (max-width: 600px) {
    body.body .container.vod-search-page .vod-category-panel,
    body.body .main .container.vod-search-page .vod-keyword-panel,
    body.body .container.vod-search-page .category-con,
    body.body .main .container.vod-search-page .search-con { padding: 11px !important; border-radius: 11px !important; }
}

/* 2026-10-29：与首页「必备资源」统一深色背景、标题字号和单竖杠 */
body.body .container.vod-search-page .vod-category-panel,
body.body .main .container.vod-search-page .vod-keyword-panel,
body.body .container.vod-search-page .category-con,
body.body .main .container.vod-search-page .search-con {
    background: linear-gradient(135deg, #25252b 0%, #30303a 100%) !important;
    border: 1px solid #3c3c48 !important;
    border-radius: 14px !important;
    box-shadow: 0 0 0 1px rgba(22,163,74,.08), 0 8px 24px rgba(0,0,0,.14) !important;
    box-sizing: border-box;
}

/* 标题字号与首页区块标题一致：桌面 22px，手机 20px */
body.body .container.vod-search-page .vod-category-panel > h1,
body.body .main .container.vod-search-page .vod-keyword-panel > h1,
body.body .container.vod-search-page .category-con .a-tit h1,
body.body .main .container.vod-search-page .search-con > .res h1 {
    font-size: 22px !important;
    line-height: 1.4 !important;
    font-weight: 700 !important;
    color: var(--zy-color, #fff) !important;
}

/* 分类列表标题只保留一个绿色竖杠：竖杠放在标题容器上 */
body.body .container.vod-search-page .category-con .a-tit {
    border-left: 4px solid #16a34a !important;
    padding-left: 12px !important;
    margin-bottom: 14px !important;
}
body.body .container.vod-search-page .category-con .a-tit h1 {
    border-left: 0 !important;
    padding-left: 0 !important;
    margin: 0 !important;
}

/* 标题在框内统一留白 */
body.body .container.vod-search-page .vod-category-panel > h1,
body.body .main .container.vod-search-page .vod-keyword-panel > h1 {
    border-left: 4px solid #16a34a !important;
    padding: 0 0 0 12px !important;
    margin: 0 0 14px !important;
}
body.body .main .container.vod-search-page .search-con > .res h1 {
    border-left: 4px solid #16a34a !important;
    padding-left: 12px !important;
    margin: 0 0 14px !important;
}

@media (max-width: 600px) {
    body.body .container.vod-search-page .vod-category-panel > h1,
    body.body .main .container.vod-search-page .vod-keyword-panel > h1,
    body.body .container.vod-search-page .category-con .a-tit h1,
    body.body .main .container.vod-search-page .search-con > .res h1 {
        font-size: 20px !important;
    }
}


/* 分类页：视频列表下方的上一页/下一页分页区域不显示绿色外框 */
body.body .container.vod-search-page .paging,
body.body .container.vod-search-page .page,
body.body .container.vod-search-page .mac_pages,
body.body .container.vod-search-page .pagination,
body.body .container.vod-search-page .page-list {
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    border-radius: 0 !important;
}


/* 视频分类页（type/show）：视频列表下方分页区不显示绿色外框 */
body.body .container.vod-search-page .paging,
body.body .container.vod-search-page .page,
body.body .container.vod-search-page .mac_pages,
body.body .container.vod-search-page .pagination,
body.body .container.vod-search-page .page-list,
body.body .container.vod-search-page .paging a,
body.body .container.vod-search-page .page a,
body.body .container.vod-search-page .mac_pages a,
body.body .container.vod-search-page .pagination a,
body.body .container.vod-search-page .page-list a {
    box-shadow: none !important;
}
body.body .container.vod-search-page .paging,
body.body .container.vod-search-page .page,
body.body .container.vod-search-page .mac_pages,
body.body .container.vod-search-page .pagination,
body.body .container.vod-search-page .page-list {
    border: 0 !important;
    outline: 0 !important;
    background: transparent !important;
    border-radius: 0 !important;
}
