@charset "utf-8";
/* =====================================================================
   OMPRO 窄屏适配补丁（1024–1235 视口）
   背景：版面按 1226px 定宽设计，style.css 里又写了 body{min-width:1226px}
        （原意是让全宽背景条在手机桌面模式下铺满），导致 1024–1225 的
        笔记本窗口右侧被切、出现横向滚动条（1024 下超出 202px）。
   做法：容器改弹性（>=1226 时视觉完全不变，因为有 max-width 兜住），
        再针对会撑破布局的固定宽度逐个覆盖。全部集中在本文件，
        官方 CSS 一行未改，回滚只需删掉 file 里的引用。
   注意：本文件由 ViewFilterBehavior 注入到 </head> 前，
        位置在所有官方样式之后，同特异性下优先级最高。
   ===================================================================== */

/* ---------- 1. 容器弹性化（宽屏无影响） ---------- */
.width,
.eyou_gg,
.home-banner-box,
.eyou_foot .baozheng,
.eyou_foot .nav-art {
    width: 100% !important;
    max-width: 1226px !important;
}

/* style.css 里的 body{min-width:1226px} 在窄窗口会把版面顶出可视区 */
body {
    min-width: 0 !important;
}

/* ---------- 2. 首页轮播：取消 1200 最小宽度 ---------- */
.banner,
.banner .carousel-item a {
    min-width: 0 !important;
}

/* 全宽 banner 图不加这条会按原始 1226px 撑开 */
.home-banner-box img,
.banner .carousel-item img {
    max-width: 100%;
    height: auto;
}

/* ---------- 3. 1024–1235 区间的细部压缩 ----------
   （上界取 1235 而非 1225：.bs-grid 的 -7px 负边距让 1226 这个“设计宽度”
     反而溢出 7px，一并纳入处理） */
@media (min-width: 1024px) and (max-width: 1235px) {
    /* .bs-grid 沿用了 bootstrap 的 -7px 左右负外边距，容器收缩后会顶出 14px；
       区间内去掉，卡片左右各留 7px、视觉对称（宽屏保持原样不动） */
    .bs-grid {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* 商品详情：.w1200 是写死 1200 的图片列基准宽度（只为让 .col-xs-4 = 400px），
       在窄屏会顶出 200px 横向滚动条。改成跟随 .picfl，图片列占满 */
    .w1200 {
        width: 100% !important;
    }
    .w1200 > .col-xs-4 {
        width: 100% !important;
        float: none !important;
    }

    /* 顶部工具条与头部：1226 定宽的 row 收缩后，靠内边距和字号微调避免挤压 */
    .eyoucms_top,
    .eyoucms_head {
        padding-left: 12px;
        padding-right: 12px;
    }

    /* 主导航项原本靠固定宽度排列，窄屏统一压缩左右间距 */
    .eyoucms_head .nav > ul > li > a {
        padding-left: 10px;
        padding-right: 10px;
        font-size: 14px;
    }

    /* 页脚信息条 */
    .eyou_foot .baozheng,
    .eyou_foot .nav-art {
        padding-left: 12px;
        padding-right: 12px;
    }

    /* ---------- 会员中心 / 购物车 / 结算 ---------- */
    /* .w1226 与购物车头部原本写死 1226/1200，窄屏会整块顶出可视区 */
    .w1226 {
        width: 100% !important;
        max-width: 1226px !important;
    }
    .ey-cart-header-con {
        width: 100% !important;
        max-width: 1200px !important;
        box-sizing: border-box;
        padding-left: 12px;
        padding-right: 12px;
    }

    /* 购物车表格列宽：原本按 150+170+380+150+150+120+80=1200 写死，
       容器变窄后固定列宽会把 table 撑回 1200（table-layout:fixed 下
       width:100% 只是期望值，列宽合计更大时以列宽为准），故改百分比。
       前缀必须与模板内联规则完全一致（5 层类名），否则特异性不足压不住。
       ⚠ 列在 .item-row 里、不在 .item-table 里；表头 .list-head 的 26px 右内边距
         必须保留，否则表头 1024 与商品行 998 两套基准，整列右移 26px。 */
    .cart-container .container-main .cart-wrap .cart-goods-list .list-head .col-check,
    .cart-container .container-main .cart-wrap .cart-goods-list .item-row .col-check {
        width: 12.5% !important;
    }
    .cart-container .container-main .cart-wrap .cart-goods-list .list-head .col-img,
    .cart-container .container-main .cart-wrap .cart-goods-list .item-row .col-img {
        width: 14.1667% !important;
    }
    .cart-container .container-main .cart-wrap .cart-goods-list .list-head .col-name,
    .cart-container .container-main .cart-wrap .cart-goods-list .item-row .col-name {
        width: 31.6667% !important;
    }
    .cart-container .container-main .cart-wrap .cart-goods-list .list-head .col-price,
    .cart-container .container-main .cart-wrap .cart-goods-list .item-row .col-price {
        width: 12.5% !important;
    }
    .cart-container .container-main .cart-wrap .cart-goods-list .list-head .col-num,
    .cart-container .container-main .cart-wrap .cart-goods-list .item-row .col-num {
        width: 12.5% !important;
    }
    .cart-container .container-main .cart-wrap .cart-goods-list .list-head .col-total,
    .cart-container .container-main .cart-wrap .cart-goods-list .item-row .col-total {
        width: 10% !important;
    }
    .cart-container .container-main .cart-wrap .cart-goods-list .list-head .col-action,
    .cart-container .container-main .cart-wrap .cart-goods-list .item-row .col-action {
        width: 6.6667% !important;
    }
    /* 结算页商品行：good-img70 + good-name620 + good-price150 + good-status100 + good-total190，
       合计 1130 > 1024 容器，最后的小计列被挤出可视区。让商品名弹性收缩即可 */
    .goods-list .good-item .good-name {
        width: auto !important;
        flex: 1 1 auto !important;
        min-width: 0 !important;
        word-break: normal;
        overflow-wrap: break-word;
    }
    /* 小计列固定 190px 在窄屏会让整行右移，改为按内容自适应 */
    .goods-list .good-item .good-total {
        width: auto !important;
        flex: 0 0 auto !important;
        min-width: 110px;
        padding-left: 10px;
    }

    /* 缩略图列是全站唯一 content-box 的列（`.mi-cart *{box-sizing:unset}` 取消了 border-box），
       30px 右内边距会额外撑宽列，导致比表头宽 28px；统一成 border-box 后与表头一致 */
    .cart-container .container-main .cart-wrap .cart-goods-list .item-row .col-img {
        box-sizing: border-box !important;
        padding-right: 12px !important;
    }
    /* 缩略图原本写死 140px，列变窄后会撑破格子 */
    .cart-container .container-main .cart-wrap .cart-goods-list .item-box .col-img img {
        max-width: 100% !important;
        height: auto !important;
    }
}