/* Page-specific styles extracted from html/vod/search.html; kept separate to allow browser caching. */
/* --- extracted styles from html/vod/search.html --- */
/* ===== 页面整体布局 ===== */
    .vod-search-page {
        width: calc(100% - 40px);
        max-width: 1600px;
        margin: 18px auto 24px;
        padding: 0 8px;
        color: var(--zy-color);
        box-sizing: border-box;
    }

    .vod-search-page h1 {
        font-size: 24px;
        line-height: 1.45;
        margin: 0 0 12px;
        color: var(--zy-color);
    }

    /* ===== 搜索框 ===== */
    .vod-search-form {
        display: flex;
        gap: 10px;
        width: 100%;
        max-width: 900px;
        margin: 12px 0 18px;
    }

    .vod-search-form input {
        flex: 1;
        min-width: 0;
        padding: 12px 15px;
        border: 1px solid #444451;
        border-radius: 8px;
        background: var(--zy-bggray);
        color: #111 !important;
        caret-color: #111;
        outline: none;
        font-size: 15px;
        box-sizing: border-box;
    }

    .vod-search-form input::placeholder {
        color: #888 !important;
        opacity: 1;
    }

    .vod-search-form input:focus {
        border-color: var(--zy-hover);
        box-shadow: 0 0 0 3px rgba(var(--zy-hover-rgb), .16);
    }

    .vod-search-form button {
        flex-shrink: 0;
        padding: 11px 24px;
        border: 0;
        border-radius: 8px;
        background: var(--zy-hover) !important;
        color: #fff;
        cursor: pointer;
        font-size: 15px;
    }

    .vod-search-form button:hover {
        filter: brightness(1.08);
    }

    /* ===== 热门关键词 ===== */
    .vod-search-categories {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin: 0 0 20px;
        padding: 12px;
        background: var(--zy-bggray);
        border: 1px solid #363640;
        border-radius: 10px;
        box-sizing: border-box;
    }

    .vod-search-categories a {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 7px 12px;
        border: 1px solid #444451;
        border-radius: 20px;
        color: var(--zy-color);
        text-decoration: none;
        font-size: 14px;
        line-height: 1.5;
        transition: background .2s, border-color .2s, color .2s;
    }

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

    /* ===== 视频列表：电脑端三列 ===== */
    .vod-search-page .poster-grid,
    .vod-search-page .module-items,
    .vod-search-page .vod-list,
    .vod-search-page .vodlist,
    .vod-search-page .video-list,
    .vod-search-page .video-grid {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 20px 16px !important;
        width: 100% !important;
        max-width: none !important;
        box-sizing: border-box;
    }

    /* 视频卡片宽度自适应 */
    .vod-search-page .poster-card,
    .vod-search-page .module-item,
    .vod-search-page .vodlist_item,
    .vod-search-page .video-card,
    .vod-search-page .video-item {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        margin: 0 !important;
        box-sizing: border-box;
    }

    /* 视频封面 */
    .vod-search-page .poster-img,
    .vod-search-page .module-item-cover,
    .vod-search-page .vodlist_thumb,
    .vod-search-page .video-cover {
        width: 100%;
        overflow: hidden;
    }

    .vod-search-page .poster-img img,
    .vod-search-page .module-item-cover img,
    .vod-search-page .vodlist_thumb img,
    .vod-search-page .video-cover img {
        display: block;
        width: 100%;
        height: auto;
        object-fit: cover;
    }

    /* 防止列表内部元素撑破布局 */
    .vod-search-page .poster-card *,
    .vod-search-page .module-item *,
    .vod-search-page .vodlist_item *,
    .vod-search-page .video-card *,
    .vod-search-page .video-item * {
        min-width: 0;
        box-sizing: border-box;
    }

    /* 标题绿色竖杠 */
    .vod-search-page > h1 {
        border-left: 4px solid #22c55e;
        padding-left: 12px;
    }

    /* ===== 平板 ===== */
    @media (max-width: 900px) {
        .vod-search-page {
            width: calc(100% - 24px);
            padding: 0 4px;
        }

        .vod-search-page .poster-grid,
        .vod-search-page .module-items,
        .vod-search-page .vod-list,
        .vod-search-page .vodlist,
        .vod-search-page .video-list,
        .vod-search-page .video-grid {
            gap: 14px 10px !important;
        }
    }

    /* ===== 手机端：视频两列 ===== */
    @media (max-width: 600px) {
        .vod-search-page {
            width: calc(100% - 20px);
            margin: 12px auto 20px;
            padding: 0;
        }

        .vod-search-page h1 {
            font-size: 21px;
            margin-bottom: 10px;
        }

        .vod-search-form {
            gap: 8px;
            margin: 10px 0 16px;
        }

        .vod-search-form input {
            padding: 10px 12px;
            font-size: 14px;
        }

        .vod-search-form button {
            padding: 10px 17px;
            font-size: 14px;
        }

        .vod-search-categories {
            gap: 7px;
            padding: 10px;
            margin-bottom: 16px;
        }

        .vod-search-categories a {
            padding: 6px 10px;
            font-size: 13px;
        }

        .vod-search-page .poster-grid,
        .vod-search-page .module-items,
        .vod-search-page .vod-list,
        .vod-search-page .vodlist,
        .vod-search-page .video-list,
        .vod-search-page .video-grid {
            grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
            gap: 14px 9px !important;
        }
    }

/* 搜索结果：与首页视频卡片保持统一视觉 */
.vod-search-page .search-con {
    width: 100%;
    margin: 18px 0 24px !important;
    padding: 16px;
    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 .search-con > .res {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px 16px;
    margin: 0 0 18px;
    padding: 4px 0 4px 12px;
    border-left: 4px solid #16a34a;
}
.vod-search-page .search-con > .res h1 {
    /* 绿色竖杠由 .res 容器统一绘制，标题自身不再重复绘制 */
    border-left: 0;
    padding-left: 0;
    margin: 0;
    color: var(--zy-color);
    font-size: 20px;
    font-weight: 700;
    line-height: 1.5;
    overflow-wrap: anywhere;
}
.vod-search-page .search-con > .res p {
    margin: 0;
    padding: 5px 10px;
    border: 1px solid rgba(22,163,74,.25);
    border-radius: 20px;
    background: rgba(22,163,74,.09);
    color: #888;
    font-size: 13px;
    white-space: nowrap;
}
.vod-search-page .search-con > .res .mac_total { color: #16a34a; font-weight: 700; }
.vod-search-page .search-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 .search-con .a-con-inner { min-width: 0; overflow: hidden; padding: 0; border: 0; background: transparent; box-shadow: none; }
.vod-search-page .search-con .pic { position: relative; overflow: hidden; width: 100%; aspect-ratio: 3 / 4; border-radius: 9px; background: #202026; }
.vod-search-page .search-con .pic > a:first-child { display: block; width: 100%; height: 100%; }
.vod-search-page .search-con .pic img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .3s ease; }
.vod-search-page .search-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; }
@media (hover: hover) and (pointer: fine) {
    .vod-search-page .search-con .a-con-inner:hover .pic img { transform: scale(1.045); }
    .vod-search-page .search-con .a-con-inner:hover .pic .bofang { opacity: 1; visibility: visible; }
}
.vod-search-page .search-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 .search-con .s1 a { color: var(--zy-color); text-decoration: none; overflow-wrap: anywhere; }
.vod-search-page .search-con .s1 a:hover { color: #16a34a; }
.vod-search-page .search-con .vod-time { display: block; margin-top: 5px; color: #888; font-size: 12px; line-height: 1.5; }
.vod-search-page .search-con .s2 { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 7px; }
.vod-search-page .search-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 .search-con .s2 a:hover { background: #16a34a; color: #fff; }
@media (min-width: 601px) and (max-width: 1024px) {
    .vod-search-page .search-con .a-con { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 18px 12px !important; }
}
@media (max-width: 600px) {
    .vod-search-page .search-con { padding: 12px; border-radius: 11px; }
    .vod-search-page .search-con > .res { align-items: flex-start; flex-direction: column; gap: 8px; margin-bottom: 14px; }
    .vod-search-page .search-con > .res h1 { font-size: 17px; }
    .vod-search-page .search-con .a-con { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 14px 8px !important; }
    .vod-search-page .search-con .s1 { margin-top: 6px; font-size: 12px; line-height: 1.5; }
    .vod-search-page .search-con .vod-time { margin-top: 4px; font-size: 10px; }
    .vod-search-page .search-con .s2 { gap: 3px; margin-top: 5px; }
    .vod-search-page .search-con .s2 a { padding: 2px 4px; font-size: 10px; }
}
@media (max-width: 360px) { .vod-search-page .search-con .a-con { gap: 12px 7px !important; } }


/* 2026-10-29：首页统一背景与绿色外框优化 */
body.body .main .container.vod-search-page .vod-search-categories,
body.body .main .container.vod-search-page .search-con,
body.body .main .container.vod-search-page .vod-search-form {
    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 .main .container.vod-search-page .vod-search-categories { padding: 16px; }
body.body .main .container.vod-search-page .search-con { padding: 16px; }
body.body .main .container.vod-search-page .vod-search-categories a {
    background: rgba(255,255,255,.035);
    border-color: rgba(22,163,74,.28);
}
body.body .main .container.vod-search-page .vod-search-categories a:hover {
    background: var(--zy-hover) !important;
    border-color: var(--zy-hover) !important;
}
body.body .main .container.vod-search-page .vod-search-form input {
    background: rgba(22,22,26,.78) !important;
    border-color: rgba(22,163,74,.35) !important;
}
@media (max-width: 600px) {
    body.body .main .container.vod-search-page .vod-search-categories,
    body.body .main .container.vod-search-page .search-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;
    }
}


/* 2026-10-29：search 页面框体背景与首页绿色系卡片统一 */
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(145deg, #1a231c 0%, #151b16 100%) !important;
    border-color: rgba(111, 211, 133, .16) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .16) !important;
}


/* 2026-10-29 修正：分类/视频大全/热门关键词/搜索关键词区域统一为首页绿色卡片背景 */
body.body .container.vod-search-page .vod-category-panel,
body.body .container.vod-search-page .vod-category-panel .article-categories,
body.body .container.vod-search-page .vod-category-panel .category-list,
body.body .container.vod-search-page .category-con,
body.body .container.vod-search-page .vod-keyword-panel,
body.body .container.vod-search-page .vod-search-categories,
body.body .container.vod-search-page .search-con,
body.body .container.vod-search-page .search-con .res {
    background: linear-gradient(135deg, #1b3021 0%, #17251b 55%, #151f18 100%) !important;
    border-color: rgba(50, 190, 91, .38) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .16), inset 0 1px 0 rgba(83, 220, 125, .04) !important;
}

/* 搜索关键词标签保持半透明绿色，不覆盖文字与链接交互 */
body.body .container.vod-search-page .article-categories a,
body.body .container.vod-search-page .vod-search-categories a {
    background: rgba(22, 163, 74, .12) !important;
    border-color: rgba(50, 190, 91, .28) !important;
}
body.body .container.vod-search-page .article-categories a:hover,
body.body .container.vod-search-page .vod-search-categories a:hover {
    background: #16a34a !important;
    border-color: #16a34a !important;
    color: #fff !important;
}


/* 2026-10-29：搜索页移除包住搜索结果的多余大框，仅保留关键词区域的独立框 */
body.body .main .container.vod-search-page .search-con {
    background: transparent !important;
    border: 0 !important;
    border-color: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin-top: 0 !important;
}
@media (max-width: 600px) {
    body.body .main .container.vod-search-page .search-con {
        padding: 0 !important;
        border-radius: 0 !important;
    }
}


/* 2026-10-29：彻底移除搜索页搜索结果区域外层灰色大框，只保留热门关键词独立框 */
html body.body main.main.vod-search-main,
html body.body main.main.vod-search-main > .container.vod-search-page,
html body.body main.main.vod-search-main > .container.vod-search-page > .block.search-con,
html body.body main.main.vod-search-main .block.search-con {
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}
html body.body main.main.vod-search-main::before,
html body.body main.main.vod-search-main::after,
html body.body main.main.vod-search-main > .container.vod-search-page::before,
html body.body main.main.vod-search-main > .container.vod-search-page::after,
html body.body main.main.vod-search-main .block.search-con::before,
html body.body main.main.vod-search-main .block.search-con::after {
    content: none !important;
    display: none !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}
/* 搜索结果区域不保留大框内边距；热门关键词框不受影响 */
html body.body main.main.vod-search-main .block.search-con {
    padding: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}


/* 2026-11-02：搜索页面板使用首页 hub-section 中性灰透明背景，覆盖所有旧绿色规则 */
html body.body .main.vod-search-main .vod-search-page .vod-keyword-panel,
html body.body .main.vod-search-main .vod-search-page .search-content-panel,
html body.body .main.vod-search-main .vod-search-page .search-con,
html body.body .main.vod-search-main .vod-search-page .search-con > .res,
html body.body .main.vod-search-main .vod-search-page .category-con {
    background: linear-gradient(145deg, rgba(255,255,255,.028), rgba(255,255,255,.008)) !important;
    background-color: transparent !important;
    border-color: rgba(255,255,255,.07) !important;
    box-shadow: none !important;
}
html body.body .main.vod-search-main .vod-search-page .vod-search-categories a {
    background: rgba(128,128,128,.08) !important;
    border-color: rgba(255,255,255,.08) !important;
    box-shadow: none !important;
}
html body.body .main.vod-search-main .vod-search-page .vod-search-categories a:hover {
    background: rgba(128,128,128,.16) !important;
    border-color: rgba(255,255,255,.16) !important;
    color: inherit !important;
}


/* ===== 搜索页左右留白优化：充分利用屏幕宽度 ===== */
html body.body main.main.vod-search-main {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}
html body.body main.main.vod-search-main > .container.vod-search-page {
    width: calc(100% - 48px) !important;
    max-width: 1800px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
}
html body.body main.main.vod-search-main .vod-search-page .search-content-panel,
html body.body main.main.vod-search-main .vod-search-page .vod-keyword-panel {
    width: 100% !important;
}
@media (max-width: 900px) {
    html body.body main.main.vod-search-main > .container.vod-search-page {
        width: calc(100% - 28px) !important;
    }
}
@media (max-width: 600px) {
    html body.body main.main.vod-search-main > .container.vod-search-page {
        width: calc(100% - 20px) !important;
    }
}