/*
 * HC2026 电脑版落地页的响应式补齐（方案第八章 阶段三）
 *
 * 为什么需要这个文件：
 * 判断规则改成按视口宽度走之前，所有平板都被 UA 判成手机、跳去 /mob/ 页面，
 * 992–1449px 这一段**从来没有真正进过电脑版页面**。现在 iPad 横放（1180×820）、
 * iPad mini 横放（1133×744）、4:3 平板（1024×768）会停在这里。
 *
 * HC2026 原来没有 responsive.css，只有 breakpoint.css（而且 cnshow / enshow
 * 根本没引用它——那份内容被抄进了 live.css:568 起的一段）。已有的断点是：
 *
 *   live.css `@media (max-width: 1000px)`            嘉宾头像、频道简介堆叠
 *   live.css `@media (max-width: 1100px) and (min-width: 1000px)`  头部内边距、议程栅格
 *   live.css `@media (max-width: 1400px) and (min-width: 990px)`   .guest-list（另一个组件）
 *
 * 真正的空白是 **1101–1199**，正好是 iPad mini 1133 和 iPad 10.9 横放 1180 落的位置。
 *
 * 这个文件只做加法，排在 live.css 之后加载，不改 ≥1450px 的现有观感。
 * 992px 以下不写规则——那一段由 viewport-rule.js 判去手机版页面了，
 * 只留一条防横向溢出的兜底。
 */

/* ---------------------------------------------------------------
 * 通用兜底：任何宽度下都不允许横向滚动
 * --------------------------------------------------------------- */

html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

.main-wrap img,
.live-guests img,
.live-channel-intro img {
    max-width: 100%;
    height: auto;
}

/* ---------------------------------------------------------------
 * 992–1199px：平板横放的主战场
 *
 * 这一段 .main-wrap 的实际宽度是 min(85% × 视口, 960)，
 * 也就是视口 1000 时只有 850px，视口 1130 以上才被 960 卡住。
 * （live.css:5 的 `.main-wrap { width: 85% !important }`）
 * --------------------------------------------------------------- */

@media (min-width: 992px) and (max-width: 1199px) {

    /* 头部：原来只有 1000–1100 有规则，1101–1199 是空的，菜单会挤到换行 */
    header .content-wrap {
        padding-left: 24px;
        padding-right: 24px;
    }

    header nav.navbar .navbar-nav .nav-link {
        padding-left: 10px !important;
        padding-right: 10px !important;
        font-size: 14px;
    }

    .top-nav .content-wrap {
        padding-left: 24px;
        padding-right: 24px;
    }

    /* 直播区：容器已经是 85%，这里只保证 iframe 不被写死的 min-width 顶出去 */
    .live-tv-iframe,
    .live-iframe {
        min-width: auto !important;
        width: 100% !important;
    }

    /* 频道简介：≤1000px 已经堆叠了，1001–1199 保持左右两栏但收紧间距 */
    .live-channel-intro .row {
        padding-left: .75rem !important;
        padding-right: .75rem !important;
    }

    .live-channel-intro .live-channel-logo {
        width: 72px !important;
        height: 72px !important;
        transform: none;
    }

    .live-channel-intro .live-channel-desc {
        padding-left: 1.25rem !important;
    }

    .live-channel-intro .pl-md-5 {
        padding-left: 1.25rem !important;
    }

    /* 区块标题：主标题和副标题在窄一点的容器里别互相挤 */
    .live-title {
        padding-left: 8px;
        flex-wrap: wrap;
    }

    .live-title span.title-sub {
        margin-left: 10px;
    }

    /* 嘉宾：每屏放几个由 sino_agenda.js 的 swiper 断点决定（992 起 4 个），
       这里只调字号和留白，避免姓名和职务在窄格子里换行成三四行 */
    .live-guests .live-guest-info {
        padding-bottom: 12px;
    }

    .live-guests .live-guest-info .guest-title {
        font-size: 13px;
        width: 88%;
    }

    .live-guests .live-guest-info:hover .guest-title {
        width: 88%;
    }

    .live-guests .live-guest-info .font-weight-bold {
        font-size: 15px;
    }

    /* 议程：col-md-6 在 768px 以上就是两列，这里只收内边距 */
    .live-agenda-list > li {
        padding-left: 8px;
        padding-right: 8px;
    }

    .live-agenda-time {
        font-size: 13px;
    }

    /* 其它模块：一行两个，别挤成四个 */
    .live-others .live-others-list li {
        width: 50% !important;
        max-width: 50% !important;
        flex: 0 0 50% !important;
    }

    /* 页脚：两栏保持，收内边距 */
    footer .content-wrap {
        padding-left: 16px;
        padding-right: 16px;
    }
}

/* ---------------------------------------------------------------
 * 1200–1449px：小尺寸桌面窗口和 iPad Pro 横放（1194 落在上一段）
 *
 * 这一段 .main-wrap 是 min(85% × 视口, 1140)，基本够用，只做轻微收敛。
 * --------------------------------------------------------------- */

@media (min-width: 1200px) and (max-width: 1449px) {

    header nav.navbar .navbar-nav .nav-link {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    .live-guests .live-guest-info .guest-title {
        font-size: 13px;
    }
}
