/* ===== 29.com threecol layout collapse fix start ===== */

/* 核心修复：
   29号模板 body 有 layout-threecol，
   原始 CSS 会把 .site-main 变成 220px + 内容 + 300px 三栏。
   但首页实际只有一个 .two-col.home-feed 直接子元素，
   结果整个首页被塞进左侧 220px，导致页面全部挤到左边。
*/

/* 关闭 29号模板错误的 site-main 三栏外框 */
body.tpl-29.layout-threecol .site-main {
    display: block !important;
    width: min(1280px, 94vw) !important;
    max-width: 1280px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 28px 0 70px !important;
}

/* 首页真正的左右栏：左内容 + 右榜单 */
body.tpl-29.layout-threecol .two-col,
body.tpl-29.layout-threecol .home-feed {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 320px !important;
    gap: 24px !important;
    align-items: start !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* 防止左侧内容再次被压窄 */
body.tpl-29.layout-threecol .home-feed > div,
body.tpl-29.layout-threecol .two-col > div {
    min-width: 0 !important;
    width: 100% !important;
}

/* 右侧排行榜恢复正常宽度 */
body.tpl-29.layout-threecol .home-feed > aside,
body.tpl-29.layout-threecol .two-col > aside {
    width: 320px !important;
    min-width: 0 !important;
}

/* 模块恢复正常宽度 */
body.tpl-29.layout-threecol .recommend-lunli,
body.tpl-29.layout-threecol .tpl-section,
body.tpl-29.layout-threecol .rank-panel {
    width: 100% !important;
    max-width: 100% !important;
    margin-bottom: 24px !important;
    overflow: hidden !important;
}

/* 影片网格恢复正常，不再一列竖排 */
body.tpl-29.layout-threecol .vod-collection,
body.tpl-29.layout-threecol .collection-media,
body.tpl-29.layout-threecol .collection-feed,
body.tpl-29.layout-threecol .collection-info,
body.tpl-29.layout-threecol .collection-poster,
body.tpl-29.layout-threecol .lunli-cards {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)) !important;
    gap: 18px !important;
    align-items: start !important;
}

/* media 卡片在 29号模板首页统一改为上图下文，避免左图右文被挤压 */
body.tpl-29.layout-threecol .vod-collection .card-media,
body.tpl-29.layout-threecol .vod-collection .card-wide,
body.tpl-29.layout-threecol .vod-collection .card-poster,
body.tpl-29.layout-threecol .vod-collection .card-app {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    padding: 0 !important;
    overflow: hidden !important;
    writing-mode: horizontal-tb !important;
}

/* 图片比例正常 */
body.tpl-29.layout-threecol .vod-collection .card-media > img,
body.tpl-29.layout-threecol .vod-collection .card-wide > img,
body.tpl-29.layout-threecol .vod-collection .card-app > img,
body.tpl-29.layout-threecol .vod-collection .poster-img img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 2 / 3 !important;
    object-fit: cover !important;
    border-radius: 12px !important;
}

/* 标题和信息禁止竖排 */
body.tpl-29.layout-threecol .vod-card,
body.tpl-29.layout-threecol .vod-card * {
    writing-mode: horizontal-tb !important;
    text-orientation: mixed !important;
}

/* 标题最多两行 */
body.tpl-29.layout-threecol .vod-card strong {
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    white-space: normal !important;
    word-break: break-word !important;
    line-height: 1.35 !important;
    font-size: 15px !important;
    margin-top: 8px !important;
}

/* 年份、地区、清晰度最多一行 */
body.tpl-29.layout-threecol .vod-card span,
body.tpl-29.layout-threecol .vod-card small,
body.tpl-29.layout-threecol .vod-card em {
    display: block !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
    line-height: 1.45 !important;
}

/* 简介隐藏，避免卡片被撑高 */
body.tpl-29.layout-threecol .vod-card p {
    display: none !important;
}

/* 排行榜内部恢复正常 */
body.tpl-29.layout-threecol .rank-panel {
    position: sticky !important;
    top: 96px !important;
}

body.tpl-29.layout-threecol .rank-list {
    display: block !important;
}

body.tpl-29.layout-threecol .rank-item {
    display: grid !important;
    grid-template-columns: 38px minmax(0, 1fr) auto !important;
    gap: 10px !important;
    align-items: center !important;
}

/* 移动端 */
@media (max-width: 1080px) {
    body.tpl-29.layout-threecol .two-col,
    body.tpl-29.layout-threecol .home-feed {
        display: block !important;
    }

    body.tpl-29.layout-threecol .home-feed > aside,
    body.tpl-29.layout-threecol .two-col > aside {
        width: 100% !important;
    }

    body.tpl-29.layout-threecol .rank-panel {
        position: static !important;
    }
}

@media (max-width: 768px) {
    body.tpl-29.layout-threecol .site-main {
        width: calc(100vw - 20px) !important;
        padding: 18px 0 80px !important;
    }

    body.tpl-29.layout-threecol .vod-collection,
    body.tpl-29.layout-threecol .collection-media,
    body.tpl-29.layout-threecol .collection-feed,
    body.tpl-29.layout-threecol .collection-info,
    body.tpl-29.layout-threecol .collection-poster,
    body.tpl-29.layout-threecol .lunli-cards {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 12px !important;
    }
}

/* ===== 29.com threecol layout collapse fix end ===== */