@charset "utf-8";
/*
 * responsive.css —— 全站移动端适配（响应式增强层）
 * ------------------------------------------------------------------
 * 加载位置：所有业务页面在 bootstrap / layui / Common.css / Edit.css / b3compat.css
 *           之后引入本文件（紧邻 </head> 之前），保证覆盖优先级最高。
 * 适用范围：除 /EAdmin/Print/（打印模板，需固定纸张尺寸）之外的全部页面。
 * 设计原则：只做「覆盖式增强」，不改动原样式文件，桌面端视觉保持 100% 不变。
 *
 * 文件结构（断点优先、功能次之；后者覆盖前者，级联顺序一目了然）：
 *   0. 设计令牌
 *   1. 基础组件（全尺寸生效）
 *   2. ≤1200px  小尺寸桌面 / 横屏平板
 *   3. ≤992px   竖屏平板 + 抽屉导航
 *   4. ≤768px   手机（主要适配区间）
 *   5. ≤480px   小屏手机
 *   6. 动效偏好
 *   每个断点在本文件中只出现一次，禁止为同一断点散落多个 @media 块。
 *
 * ⚠ 三条血泪经验（改动前必读）
 *   1. iframe 弹窗（layer.open type:2）内的媒体查询按「弹窗视口」计算，弹窗宽 ≈ 96vw。
 *      写阈值必须按 0.96×手机视口宽 折算并留余量（例：想让 375px 手机保持两列，
 *      阈值须 < 375×0.96 = 360，本项目取 330）。
 *   2. flex 平铺 th/td 想做到「每行 N 组」，必须把标签宽度固定锁死，
 *      否则长标签/长值会重排成不等分组。
 *   3. 每次修改本文件或 responsive.js 后必须执行：
 *         powershell -File .codebuddy\tmp_add_ver.ps1 -Ver <新版本号>
 *      否则浏览器沿用缓存，修复会「看似不生效」。
 * ------------------------------------------------------------------
 */

/* ==================================================================
 * 0. 设计令牌
 *    收口全部魔法数字；使用处一律写成 var(--x, 字面量)，
 *    老 WebView 不支持自定义属性时自动降级为括号内的字面量。
 * ================================================================== */
:root {
    --m-nav-h: 60px;         /* 框架页顶栏高度（= layui 默认） */
    --m-drawer-w: 220px;     /* 抽屉 / 侧边栏宽度 */
    --m-drawer-dur: .25s;    /* 抽屉动画时长 */

    --m-gutter: 10px;        /* 手机端容器内边距 */
    --m-gutter-sm: 8px;      /* 小屏容器内边距 */
    --m-gutter-md: 14px;     /* 平板容器内边距 */

    --m-label-w: 84px;       /* ht_table 标签固定宽（锁死「每行 2 组」） */
    --m-label-min: 60px;     /* search_table 标签最小宽 */
    --m-cell-min: 130px;     /* search_table 单元格基准宽 */

    --m-fs-xs: 12px;
    --m-fs-sm: 13px;
    --m-fs-md: 14px;
    --m-fs-lg: 15px;
    --m-fs-input: 16px;      /* iOS Safari 聚焦不自动放大的下限 */

    --m-tap-h: 34px;         /* 按钮 / 分页可点击区最小高度 */

    --m-z-mask: 1001;        /* 抽屉遮罩 */
    --m-z-side: 1002;        /* 抽屉侧栏 */
    --m-z-toggle: 1003;      /* 汉堡按钮（须高于侧栏与遮罩） */
}

/* ==================================================================
 * 1. 基础组件（所有屏幕尺寸生效，桌面端无副作用）
 * ================================================================== */

/* ---- 1.1 数据表横滚容器（由 /Js/EA/responsive.js 自动包裹宽表生成） ---- */
.m-table-wrap {
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
}

    .m-table-wrap > table {
        width: 100%;
    }

/* ---- 1.2 layui 下拉面板限高 ----
   本站 layui 的 select 无方向自适应（固定 top:42px 向下展开、max-height:300px），
   在 layer 弹窗（iframe）等矮容器里会被底边裁剪。
   这里只做「不大于 layui 原生 300px、且不大于可用视口高度」的收缩：
   桌面大屏结果与 layui 原生完全一致，只有矮容器才真正收紧。
   （另有「展开即浮到父页面顶层」的增强，见 responsive.js）。 */
.layui-form-select dl {
    max-height: 300px;                          /* 老浏览器兜底（= layui 原生值） */
    max-height: min(300px, 100vh - 110px);      /* 110px = 弹窗标题栏 + top:42px + 余量 */
    overflow-y: auto;
}

/* ---- 1.3 移动端顶部抽屉导航（框架页 /Home/Default.aspx 使用） ---- */
.m-nav-toggle {
    display: none;
    position: absolute;
    left: 4px;
    top: 0;
    width: 44px;
    height: var(--m-nav-h, 60px);
    padding-top: 22px;
    box-sizing: border-box;
    z-index: var(--m-z-toggle, 1003);
    text-align: center;
    line-height: 0;
    color: #fff;
    text-decoration: none;
}

    .m-nav-toggle span {
        display: block;
        width: 20px;
        height: 2px;
        margin: 0 auto 5px;
        background: #d8d8d8;
        border-radius: 2px;
    }

    .m-nav-toggle span:last-child {
        margin-bottom: 0;
    }

.m-nav-mask {
    display: none;
}

/* ---- 1.4 跨文档下拉浮层（responsive.js 克隆到父页面，突破弹窗高度限制） ----
   几何量（left / top / width / max-height）由 JS 内联下发，这里只放静态外观，
   避免样式散落在脚本里。wrap 必须带 layui-form-select 类（由 JS 添加），
   否则 layui 的 dd / dd:hover / dd.layui-this 样式全部失效。 */
.m-select-float {
    position: fixed;
    z-index: 2147483000;     /* > layer 的 19891000+ 与项目内的 9999999 */
    margin: 0;
    padding: 0;
    font-size: var(--m-fs-md, 14px);
    color: #5f5f5f;
}

    .m-select-float > dl {
        position: static;
        display: block;
        width: 100%;
        min-width: 0;
        margin: 0;
        overflow-y: auto;
    }

/* ==================================================================
 * 2. ≤1200px：小尺寸桌面 / 横屏平板 —— 解除写死的最小宽度
 * ================================================================== */
@media screen and (max-width: 1200px) {
    /* 框架页原先写死 body/html/.layui-header 1200px、主体 980px，
       窄屏会出现整页横向滚动条 */
    body, html, .layui-header {
        min-width: 0 !important;
    }

    .layui-layout-admin .layui-body {
        min-width: 0 !important;
    }

    .iframe_layout {
        min-width: 0 !important;
    }
}

/* ==================================================================
 * 3. ≤992px：竖屏平板 —— 容器内边距收紧 + 抽屉导航
 * ================================================================== */
@media screen and (max-width: 992px) {
    /* ---- 3.1 全局 ---- */
    html, body {
        overflow-x: hidden;
    }

    /* ---- 3.2 容器 / 固定宽容器自适应 ---- */
    .corners_content {
        padding: var(--m-gutter-md, 14px);
        min-height: 0;
    }

    .corners_search {
        padding: 12px var(--m-gutter-md, 14px);
        margin-bottom: var(--m-gutter-md, 14px);
    }

    .corners_main {
        padding: 12px var(--m-gutter-md, 14px);
    }

    .Location {
        padding: 10px var(--m-gutter-md, 14px);
    }

    .webox_500, .webox_930, .webox_auto,
    .dialog_layout, .webox_layout,
    .DelDiv, .AEDiv {
        width: auto;
        max-width: 100%;
        height: auto;
    }

    /* ---- 3.3 框架页抽屉导航 ---- */
    .layui-layout-admin .m-nav-toggle {
        display: block;
    }

    .layui-layout-admin .layui-logo {
        left: 50px;
        width: auto;
        text-align: left;
        font-size: var(--m-fs-lg, 15px);
    }

    /* 侧边栏默认移出屏幕 */
    .layui-layout-admin .layui-side {
        left: calc(-1 * var(--m-drawer-w, 220px));
        width: var(--m-drawer-w, 220px);
        z-index: var(--m-z-side, 1002);
        transition: left var(--m-drawer-dur, .25s) ease;
        box-shadow: 2px 0 8px rgba(0, 0, 0, .25);
    }

    .layui-layout-admin .layui-side-scroll {
        width: calc(var(--m-drawer-w, 220px) + 20px);
    }

    .layui-layout-admin .layui-nav-tree {
        width: var(--m-drawer-w, 220px);
    }

    body.m-nav-open .layui-layout-admin .layui-side {
        left: 0;
    }

    /* 遮罩：仅在抽屉展开时显示（.m-nav-mask 默认 display:none 见 1.3） */
    body.m-nav-open .m-nav-mask {
        display: block;
        position: fixed;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        z-index: var(--m-z-mask, 1001);
        background: rgba(0, 0, 0, .35);
    }

    /* 主体区域占满宽度 */
    .layui-layout-admin .layui-body {
        left: 0;
        padding-bottom: 0;                                  /* 老浏览器兜底 */
        padding-bottom: env(safe-area-inset-bottom, 0px);   /* iPhone 底部安全区 */
        overflow: hidden;
        -webkit-overflow-scrolling: touch;
    }

        .layui-layout-admin .layui-body iframe {
            overflow: auto;
            -webkit-overflow-scrolling: touch;
        }

    /* 顶部右侧导航在小屏收窄 */
    .layui-layout-admin .layui-layout-right {
        padding-right: 4px;
    }

        .layui-layout-admin .layui-layout-right .layui-nav-item {
            line-height: var(--m-nav-h, 60px);
        }
}

/* ==================================================================
 * 4. ≤768px：手机 —— 主要适配区间
 * ================================================================== */
@media screen and (max-width: 768px) {

    /* ---------- 4.1 基础排版 ---------- */
    /* 表单控件字号 >=16px，避免 iOS Safari 聚焦时自动放大页面 */
    body input:not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="checkbox"]):not([type="radio"]),
    body select,
    body textarea,
    body .form-control,
    body .ef-input,
    body .layui-input,
    body .layui-textarea {
        font-size: var(--m-fs-input, 16px) !important;
    }

    /* ---------- 4.2 页面容器 ---------- */
    .iframe_layout {
        min-width: 0 !important;
        padding: 0 0 20px 0;
    }

    .Location {
        padding: var(--m-gutter-sm, 8px) 12px;
        font-size: var(--m-fs-sm, 13px);
        line-height: 20px;
    }

    .corners_content {
        padding: var(--m-gutter, 10px);
        min-height: 0;
    }

    .corners_main {
        padding: var(--m-gutter, 10px);
        margin-bottom: 12px;
    }

    .corners_search {
        padding: var(--m-gutter, 10px);
        margin-bottom: var(--m-gutter, 10px);
        border-radius: 2px;
    }

    /* ---------- 4.3 搜索区：标签 + 控件成对折行 ---------- */
    .search_table {
        display: block;
        width: 100%;
    }

        .search_table tbody {
            display: block;
            width: 100%;
        }

        .search_table tr {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
        }

        .search_table th {
            display: block;
            flex: 0 0 auto;
            width: auto !important;
            padding: 4px 6px 4px 0;
            font-size: var(--m-fs-sm, 13px);
            white-space: nowrap;
        }

        .search_table td {
            display: block;
            flex: 1 1 var(--m-cell-min, 130px);
            min-width: 0;
            padding: 4px 10px 4px 0;
            font-size: var(--m-fs-sm, 13px);
        }

            .search_table td:last-child {
                flex: 0 0 auto;
                padding-right: 0;
            }

            /* 控件撑满所在单元格 */
            .search_table td .form-control,
            .search_table td select,
            .search_table td input[type="text"],
            .search_table td input[type="password"],
            .search_table td input[type="number"],
            .corners_search td > .form-control,
            .corners_search td > select {
                width: 100% !important;
                min-width: 0;
                display: block;
            }

            /* 日期控件保持两个并排（108px 在 320px 屏上仍可容纳） */
            .search_table td input.Account_date {
                width: 108px !important;
                display: inline-block;
            }

            /* 日期区间组：给足基础宽度，保证「日期：」标签与两个日期框同行。
               两条选择器并存：现代浏览器由 :has() 立即生效（无重排闪烁），
               老 WebView 由 responsive.js 补 .m-date-cell 类兜底。 */
            .search_table td:has(input.Account_date),
            .search_table td.m-date-cell {
                flex: 1 1 250px;
            }

        /* 按钮所在单元格：不撑满，按钮自身保持 auto 宽度，
           这样多个按钮（重置 / 搜索）可在一行内排列，不占满整行 */
        .search_table td:has(.stbtn),
        .search_table td.stbtn-cell {
            flex: 0 0 auto;
            padding-right: 4px;
        }

        .search_table .stbtn,
        .corners_search .stbtn {
            width: auto !important;
            min-width: 72px;
            margin-left: 0;
            margin-top: 4px;
            padding: 6px 14px;
            white-space: nowrap;
            display: inline-block;
        }

            /* 同一单元格内多按钮：保持行内并排 */
            .search_table td:has(.stbtn) .stbtn + .stbtn,
            .corners_search td .stbtn + .stbtn {
                margin-left: 6px;
            }

    /* ---------- 4.4 数据表：容器内横向滚动 ---------- */
    .m-table-wrap {
        margin-bottom: var(--m-gutter, 10px);
    }

        /* 单元格 nowrap 时 width:100% 只是下限，这里显式放宽让表格按内容展开 */
        .m-table-wrap > table {
            width: auto;
            min-width: 100%;
        }

            .m-table-wrap > table th,
            .m-table-wrap > table td {
                white-space: nowrap;
            }

    .table_style th,
    .table_style td {
        padding: 7px 8px;
        font-size: var(--m-fs-sm, 13px);
        line-height: 20px;
    }

    .table_border th,
    .table_border td {
        padding: 6px 8px;
        font-size: var(--m-fs-sm, 13px);
    }

    /* 检验大字号表 */
    .jy {
        font-size: 18px;
    }

        .jy th {
            font-size: var(--m-fs-lg, 15px);
            line-height: 24px;
        }

        .jy td {
            font-size: var(--m-fs-md, 14px);
            line-height: 22px;
        }

    /* ---------- 4.5 分页 ---------- */
    .pages {
        margin: 12px 0;
        font-size: var(--m-fs-sm, 13px);
        line-height: 1.8;
        white-space: normal;
    }

        .pages a, .pages span {
            min-width: 30px;
            height: 30px;
            line-height: 28px;
            padding: 0 8px;
            margin: 3px 2px;
            font-size: var(--m-fs-sm, 13px);
        }

        .pages table {
            width: 100%;
        }

    /* ---------- 4.6 按钮区 ---------- */
    .corners_btn {
        margin-bottom: 12px;
    }

        .corners_btn .btn {
            float: none;
            display: inline-block;
            margin: 0 8px 8px 0;
            padding: 8px 16px;
        }

    /* 加大点击区域；排除 btn-sm / btn-lg，避免覆盖其自身尺寸 */
    .btn:not(.btn-sm):not(.btn-lg) {
        padding: 8px 14px;
        font-size: var(--m-fs-md, 14px);
    }

    .btn-xs {
        padding: 4px 8px;
        font-size: var(--m-fs-sm, 13px);
    }

    /* ---------- 4.7 编辑页（edit_layout / layer 弹层内独立页） ---------- */
    .edit_layout,
    .edit_main,
    .edit_top {
        width: auto;
    }

    .edit_main {
        margin: 6px 10px;
    }

    .edit_top {
        margin: 0;
        overflow: visible;
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
    }

    /* 表单字段每行 2 列（标签+控件为一组） */
    .edit_top_fl {
        float: none;
        display: block;
        flex: 0 0 50%;
        box-sizing: border-box;
        margin: 0 0 10px 0;
        padding: 0 8px 0 0;
        overflow: hidden;
    }

        /* 单独成组的字段（产品 / 备注等）恢复整行 */
        .edit_top_fl:only-child {
            flex-basis: 100%;
            padding-right: 0;
        }

        .edit_top_fl .lab {
            min-width: 64px;
        }

        .edit_top_fl .form-control,
        .edit_top_fl select,
        .edit_top_fl input[type="text"],
        .edit_top_fl textarea {
            width: 100%;
        }

    /* 按钮区独占一行 */
    .edit_top .edit_btn {
        flex: 0 0 100%;
    }

    .edit_i_60, .edit_i_100, .edit_i_120, .edit_i_160,
    .edit_i_200, .edit_i_280, .edit_i_350, .edit_i_425,
    .ei460, .ei600 {
        width: 100% !important;
        float: none !important;
        margin-left: 0 !important;
    }

    .edit_btn {
        margin: 16px auto;
    }

        .edit_btn .btn {
            width: 100%;
            max-width: 320px;
        }

    .DoBtn {
        width: 50%;
        float: left;
        margin-top: 12px;
        text-align: center;
    }

    /* ---------- 4.8 弹层扁平表单（.edit_form） ---------- */
    .edit_form {
        padding: var(--m-gutter-sm, 8px) var(--m-gutter, 10px) 4px;
    }

        .edit_form .form-row {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            margin-bottom: var(--m-gutter-sm, 8px);
            line-height: 26px;
        }

        .edit_form .lab {
            flex: 0 0 auto;
            display: block;
            min-width: 62px;
            text-align: right;
            margin-right: 6px;
        }

        .edit_form .ef-input {
            flex: 1 1 120px;
            width: auto !important;
            min-width: 0;
            height: var(--m-tap-h, 34px);
            padding: 5px 8px;
            font-size: var(--m-fs-input, 16px);
        }

        .edit_form .unit,
        .edit_form .sep {
            flex: 0 0 auto;
        }

        .edit_form .form-actions {
            margin-top: 12px;
            padding-top: var(--m-gutter, 10px);
        }

            .edit_form .form-actions .btn {
                min-width: 96px;
                padding: 8px 18px;
            }

    /* ---------- 4.9 新增 / 编辑表格（table_operate / dialog_table） ---------- */
    .table_operate,
    .table_operate tbody,
    .table_operate tr,
    .table_operate th,
    .table_operate td,
    .dialog_table,
    .dialog_table tbody,
    .dialog_table tr,
    .dialog_table th,
    .dialog_table td {
        display: block;
        width: auto;
    }

    .table_operate th,
    .dialog_table tr th {
        text-align: left;
        padding: 6px 0 2px;
        font-size: var(--m-fs-sm, 13px);
    }

    .table_operate td,
    .dialog_table tr td {
        padding: 2px 0 var(--m-gutter-sm, 8px);
        font-size: var(--m-fs-sm, 13px);
    }

        .table_operate td input,
        .table_operate td select,
        .table_operate td textarea,
        .dialog_table tr td input,
        .dialog_table tr td select,
        .dialog_table tr td textarea {
            width: 100% !important;
        }

        .table_operate td em.Prompt {
            float: none;
            display: block;
            padding: 4px 0 0 0;
        }

    /* ---------- 4.10 详情页 ht_table（订单 / 销售 / 采购等 5+ 组字段并排的表格）
       改为每 2 组（标签+值）一行的两列布局：
       标签宽度必须固定锁死，否则长值会把一行挤成 3 组或不等分组。 ---------- */
    .ht_table,
    .ht_table tbody,
    .ht_table td {
        display: block;
        width: auto;
    }

    .ht_table tr {
        display: flex;
        flex-wrap: wrap;
        align-items: baseline;
    }

        .ht_table th {
            display: block;
            flex: 0 0 var(--m-label-w, 84px);
            box-sizing: border-box;
            width: var(--m-label-w, 84px) !important;
            text-align: left;
            color: #666;
            font-weight: normal;
            padding: var(--m-gutter-sm, 8px) 0 6px;
            font-size: var(--m-fs-sm, 13px);
        }

        .ht_table td {
            display: block;
            flex: 1 1 calc(50% - var(--m-label-w, 84px));
            box-sizing: border-box;
            min-width: 0;
            width: auto;
            padding: var(--m-gutter-sm, 8px) 4px 6px 0;
            font-size: var(--m-fs-lg, 15px);
            word-break: normal;
            overflow-wrap: break-word;
            border-bottom: 1px dashed #e5e5e5;
        }

    /* 极窄容器才降为单列：注意 layer 弹窗宽为 96vw——
       375px 手机弹窗实际 360px，阈值必须低于 0.96×360=345.6，否则两列被误降级 */
    @media screen and (max-width: 330px) {
        .ht_table td {
            flex-basis: calc(100% - var(--m-label-w, 84px));
        }
    }

    /* ---------- 4.11 详情页客户信息表（corners_btn 内嵌的 table_style 60%） ---------- */
    .corners_btn > .table_style {
        width: 100% !important;
    }

        .corners_btn > .table_style th,
        .corners_btn > .table_style td {
            white-space: normal;
        }

        .corners_btn > .table_style th {
            background: #f5f5f5;
            font-size: var(--m-fs-sm, 13px);
        }

    /* ---------- 4.12 标签页（Tag_layout） ---------- */
    .Tag_layout ul.Tag_ul {
        display: flex;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

        .Tag_layout ul.Tag_ul li {
            flex: 0 0 auto;
            width: auto;
            padding: 0 14px;
        }

    .Tag_layout .Tag_content {
        padding: var(--m-gutter, 10px) 12px;
    }

        .Tag_layout .Tag_content .Tag_table th {
            text-align: left;
            padding: 6px 8px 2px 0;
        }

        .Tag_layout .Tag_content .Tag_table td {
            padding: 2px 0 var(--m-gutter-sm, 8px);
        }

            .Tag_layout .Tag_content .Tag_table .form-control {
                width: 100%;
                display: block;
            }

    /* ---------- 4.13 弹层容器（layui layer） ---------- */
    .layui-layer {
        max-width: 100% !important;
    }

    .layui-layer-content {
        overflow: auto;
        -webkit-overflow-scrolling: touch;
    }

    .layui-layer-iframe iframe {
        width: 100% !important;
    }

    .layui-layer-title {
        padding: 0 60px 0 12px;
        height: 46px;
        line-height: 46px;
        font-size: var(--m-fs-lg, 15px);
    }

    .layui-layer-btn {
        padding: 0 var(--m-gutter, 10px) var(--m-gutter, 10px);
        padding-bottom: calc(var(--m-gutter, 10px) + env(safe-area-inset-bottom, 0px));
        text-align: center;
    }

        .layui-layer-btn a {
            height: var(--m-tap-h, 34px);
            line-height: var(--m-tap-h, 34px);
            margin: 0 4px !important;
            padding: 0 18px;
            font-size: var(--m-fs-md, 14px);
        }

    .layui-layer-msg {
        min-width: 0;
        max-width: 86%;
    }

    /* ---------- 4.14 layui 表单 ---------- */
    .layui-form-item {
        margin-bottom: var(--m-gutter, 10px);
    }

    .layui-form-label {
        float: none;
        width: auto !important;
        padding: 6px 2px;
        text-align: left;
        font-size: var(--m-fs-md, 14px);
    }

    .layui-input-block {
        margin-left: 0;
        min-height: 0;
    }

    .layui-form-item .layui-inline {
        margin-right: 0;
        display: block;
    }

    .layui-form-select {
        position: relative;
    }

    /* ---------- 4.15 标题 / 图标类小元素 ---------- */
    .dialog_layout h1.dialog-tit {
        line-height: var(--m-tap-h, 34px);
        font-size: var(--m-fs-input, 16px);
    }

    .dialog_layout .sl {
        padding-left: 0;
    }

    .dialog_select {
        min-width: 0;
        width: 100%;
    }

    .DelTit {
        width: auto;
        max-width: 100%;
        font-size: 18px;
    }

    .DelDiv, .AEDiv, .AECON, .DelBtn, .AEBtn {
        width: auto;
        max-width: 100%;
        height: auto;
        float: none;
        margin-left: 0;
        margin-right: 0;
    }

    .DelBtn, .AEBtn {
        display: inline-block;
        min-width: 110px;
        margin-top: 12px;
    }

    /* ---------- 4.16 模块 Tab 导航（corners_nav）横滑 ---------- */
    .corners_nav {
        display: flex;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        white-space: nowrap;
        padding: 0 4px;
    }

        .corners_nav a {
            float: none;
            flex: 0 0 auto;
            padding: 0 14px;
            font-size: var(--m-fs-md, 14px);
        }

    /* ---------- 4.17 检测报告录入页（EAdmin/SC/Jcbg_Add.aspx） ---------- */
    .report-card {
        max-width: 100%;
        padding: 12px var(--m-gutter, 10px);
    }

    .report-title {
        font-size: 18px;
        margin-bottom: 12px;
        letter-spacing: 1px;
    }

    .report-section {
        margin-bottom: 14px;
    }

    .report-table {
        font-size: var(--m-fs-xs, 12px);
    }

        .report-table th,
        .report-table td {
            padding: 5px 4px;
        }

    /* 产品参数表：允许换行，避免 nowrap 撑宽 */
    .info-table td {
        white-space: normal;
        padding: 5px 6px;
    }

    .info-table .param-label {
        width: auto;
        min-width: 70px;
        font-size: var(--m-fs-sm, 13px);
    }

    .info-table td .layui-form-select,
    .info-table td .layui-form-select .layui-select-title {
        width: 100%;
        max-width: 180px;
    }

    .inline-input,
    .mid-input,
    .wide-input,
    .date-input {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }

    .sign-row {
        margin-top: 12px;
        flex-direction: column;
        align-items: stretch;
    }

    .sign-item {
        margin: 4px 0;
    }

    .btn-row {
        margin-top: 16px;
        padding-bottom: var(--m-gutter, 10px);
    }

        .btn-row .layui-btn {
            width: 46%;
            max-width: 240px;
            margin: 0 2%;
            height: 40px;
            line-height: 40px;
        }

    .section-hint {
        display: block;
        margin-left: 0;
        margin-top: 2px;
    }

    /* ---------- 4.18 权限管理表（Mge/Group、Mge/GAE） ---------- */
    .Add_qx_content {
        padding: 6px;
    }

    .Add_qx_content .Add_qx_table {
        margin-top: var(--m-gutter, 10px);
    }

    .manage_main .checkB_Tlist th,
    .manage_main .checkB_Tlist td {
        padding: 6px 4px;
        font-size: var(--m-fs-sm, 13px);
    }

    .group_layout .group_T .group_TL,
    .group_layout .group_T .group_TR {
        float: none;
        width: 100%;
    }

    /* ---------- 4.19 登录 / 注册 / 验证码小容器 ----------
       这些页面的 <style> 位于 body 内，晚于本文件加载，
       故用 !important 保证覆盖（320px 写死宽度在窄屏会溢出） */
    .demo-login-container,
    .demo-reg-container {
        width: auto !important;
        max-width: 340px;
        min-width: 0;
        margin: 12px auto 0 !important;
        padding: 0 var(--m-gutter, 10px);
        height: auto !important;
    }

        .demo-login-container .layui-tab,
        .demo-reg-container .layui-tab {
            height: auto !important;
        }

    .dwz_qr {
        width: 100% !important;
        max-width: 300px;
        height: auto !important;
        padding-left: 0;
        margin: 0 auto;
    }

        .dwz_qr img {
            width: 100% !important;
            height: auto !important;
        }

    /* ---------- 4.20 表格兜底 ---------- */
    table[width] {
        max-width: 100%;
    }

    /* 未被 JS 包裹的宽表退化为自身横滚，避免撑破页面
       （与 responsive.js 的容器包裹互为冗余保险） */
    .corners_content > table:not(.m-in-wrap),
    .corners_main > table:not(.m-in-wrap) {
        display: block;
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}

/* ==================================================================
 * 5. ≤480px：小屏手机
 * ================================================================== */
@media screen and (max-width: 480px) {
    .corners_content {
        padding: var(--m-gutter-sm, 8px);
    }

    .corners_search {
        padding: var(--m-gutter-sm, 8px);
    }

    /* 搜索区：每 2 组（标签+控件）放一行，而不是每组独占一行 */
    .search_table td {
        flex: 1 1 calc(50% - 80px);
        padding-right: 0;
    }

    .search_table th {
        min-width: var(--m-label-min, 60px);
    }

    /* 日期区间组：独占一行的同时，让「日期：」标签与日期框同行
       （70px ≈ th 的 min-width 60px + padding-right 6px，余量留给分隔符） */
    .search_table td:has(input.Account_date),
    .search_table td.m-date-cell {
        flex: 1 1 calc(100% - 70px);
        min-width: 0;
    }

    /* 两个日期框各占所在单元格约一半，确保并排塞进同一行 */
    .search_table td:has(input.Account_date) input.Account_date,
    .search_table td.m-date-cell input.Account_date {
        width: calc(50% - 16px) !important;
    }

    .table_style th,
    .table_style td {
        padding: 6px;
        font-size: var(--m-fs-xs, 12px);
    }

    .pages a, .pages span {
        min-width: 28px;
        padding: 0 6px;
        font-size: var(--m-fs-xs, 12px);
    }

    .edit_btn .btn {
        max-width: 100%;
    }

    .Location {
        font-size: var(--m-fs-xs, 12px);
        padding: var(--m-gutter-sm, 8px) var(--m-gutter, 10px);
    }
}

/* ==================================================================
 * 6. 动效偏好：系统开启「减弱动效」时关闭抽屉过渡
 * ================================================================== */
@media screen and (prefers-reduced-motion: reduce) {
    .layui-layout-admin .layui-side {
        transition: none;
    }
}