/* ============================================================================
 * EWeb 内容页统一样式基线（2026-09-26）
 * 背景：155 个内容页都是 Layout=null 的独立文档（iframe/弹层加载），
 *       历史上把同一套类名（.ew-msg/.ew-title/.ew-card/table.ew-tbl…）逐页复制，
 *       导致同元素不同页 8px/10px/12px 各行其是。本页=唯一定义处，
 *       各页 <style> 中与之同义的重复定义已由清扫脚本移除（tmp/ew_css_unify.ps1）。
 * 保留策略（页面侧允许覆盖，且覆盖生效——页面 <style> 在本文件之后）：
 *   - 有意变体：display:none 占位、text-align:right 按钮区、flex/float 两种布局、
 *     紧凑表(font-size:12/nowrap)、pre-line 多行提示、含 Razor @表达式/!important 的规则。
 *   - 语义混用的类不做全局定义：.ew-ro .ew-warn .ew-bar .ew-f .ew-fields（两种族并存）。
 * ==========================================================================*/

/* ---- 提示条：info 底 = 留白圆角块；err/ok 为全站统一红/绿 ---- */
.ew-msg { padding: 8px 10px; margin-bottom: 10px; border-radius: 3px; }
.ew-msg.err { background: #fff1f0; color: #c00; border: 1px solid #ffccc7; }
.ew-msg.ok { background: #e6ffed; color: #137a3a; border: 1px solid #b7ebc6; }

/* ---- 灰色小字说明（表单/表格下方补充说明） ---- */
.ew-tip { color: #999; font-size: 12px; margin-top: 8px; line-height: 1.8; }

/* ---- 页面/卡片标题 ---- */
.ew-title { font-size: 15px; font-weight: bold; margin-bottom: 10px; }

/* ---- 白底卡片 ---- */
.ew-card { background: #fff; padding: 14px 16px; border-radius: 3px; box-shadow: 0 1px 4px rgba(0,0,0,.08); }

/* ---- 页面底部按钮区：默认水平居中（右对齐/缩进类页面保留各自定义） ---- */
.ew-btns { margin-top: 14px; text-align: center; }
.ew-btns .layui-btn + .layui-btn { margin-left: 8px; }

/* ---- 统一明细表格：定宽布局 + 细分隔线 + 表头吸顶（页面 th 上的 Width 百分比照常生效） ---- */
table.ew-tbl { width: 100%; border-collapse: collapse; font-size: 13px; table-layout: fixed; }
table.ew-tbl th, table.ew-tbl td { border-bottom: 1px solid #eef1f4; padding: 4px 8px; }
table.ew-tbl thead th { position: sticky; top: 0; background: #f7f9fb; font-weight: 600; }
table.ew-tbl td.c, table.ew-tbl th.c { text-align: center; }
/* 数字/金额列右对齐（2026-09-27 补：各报表页大量用 td.r 但基线只有 .c，
   Bb 系 8 页未自带定义⇒整列左对齐破版；个别页的同义定义照常覆盖无害） */
table.ew-tbl td.r, table.ew-tbl th.r { text-align: right; }
/* ⚠tfoot 合计行底色不做得全局（0927 评估：ScCl/RkAct/HtAct/FpHx/FhAct/CgAct/BjView 等
   既有 ew-tbl+tfoot 页素行是原状，全局黄底=越权改 8 页外观）；需要黄底合计的页自行定义 */

/* ---- 面包屑（2026-09-27 从 Crud.cshtml 页级下沉；⚠负 margin 通栏依赖 body padding:16px，
       非 16px 页（如 MbView 变体）保留自己的页级定义照常覆盖） ---- */
.ew-crumb { margin: -16px -16px 12px; padding: 10px 16px; background: #fff;
            border-bottom: 1px solid #e6e6e6; color: #666; }
.ew-crumb .layui-icon { color: #16baaa; font-size: 16px; margin-right: 6px; vertical-align: -1px; }
.ew-crumb a { color: #666; }
.ew-crumb a:hover { color: #16baaa; }
.ew-crumb .ew-sep { margin: 0 8px; color: #d2d2d2; }
.ew-crumb b { color: #16baaa; font-weight: 600; }

/* ==========================================================================
 * 移动端基线（2026-10-01 阶段1：容器级适配，⛔逐页改造）
 * 生效条件（每个块都是「触屏窄屏」或「极窄容器」二选一即命中）：
 *   ① `(max-width: 900px/480px) and (pointer: coarse)` —— 真触屏设备（手机/平板）；
 *   ② `(max-width: 460px/400px)` —— 无条件窄容器兜底。
 *   ⛔桌面外观零影响的依据：全站桌面弹层最小宽度 = 520px（`CrudConfig.cs` 里 `FormWidth` 实测最小值），
 *     侧栏宿主窗口正常 ≥1024 ⇒ 两道闸都命不中；平板竖屏(768)靠 ① 命中，手机竖屏(≤430)靠 ② 命中 ✓
 *   ⚠内容页都是 iframe 独立文档 ⇒ 媒体查询按 **iframe 视口**判定（手机满屏 iframe≈屏宽，桌面弹层 iframe=area 宽）。
 * 优先级说明：`.wNNN` 等宽度类是**各页自己 <style> 里定义的**（源序晚于本文件），
 *   ⇒ 这里必须用 `!important` 才能压住（仅窄屏内，桌面不受影响）。
 * 覆盖范围：引用本文件的 140/168 个页面；未引用的 28 页里 18 个是打印页（本就纸型），
 *   余 Wk 系列与 DzD/MyEmail/FundPwd/_JcReport/CtBjXls 等低频页本批不动。
 * ========================================================================*/

/* ---- 窄屏（含手机横屏）：字段两列、筛选两列、表格横滚
   闸口 = 「触屏且 ≤900」或「任意指针但 ≤460」；后者用于兜住手机竖屏与本地无头验证，
   且 **低于全站桌面弹层的最小宽度 520px**（CrudConfig 里 FormWidth 最小值）⇒ 桌面弹层不命中 ✓ ---- */
@media (max-width: 900px) and (pointer: coarse), (max-width: 460px) {
    /* 页级 body padding 多为 16px，窄屏收到 10px（面包屑负 margin 同步） */
    body { padding: 10px 10px 4px !important; }
    .ew-card { padding: 10px 12px; }
    .ew-crumb { margin: -10px -10px 10px; padding: 8px 10px; }

    /* ① 固定像素宽度 → 随容器伸缩（全站 23 个 .wNNN 类，定义处 51 页，这里一次兜住） */
    .w100, .w110, .w120, .w130, .w140, .w150, .w160, .w170, .w180, .w185, .w190,
    .w200, .w220, .w260, .w300, .w320, .w330, .w350, .w420, .w425, .w460, .w520, .w560,
    input.w100, input.w110, input.w120, input.w130, input.w150, input.w160,
    input.w180, input.w190, input.w220, input.w300 {
        width: 100% !important; min-width: 0 !important; max-width: 100% !important;
    }

    /* ② 字段格（.ew-f = label 在上 + 控件撑满，见 BjAE 等 36 页）：两列流式
       ⚠必须写在上面 .wNNN 之后：元素同时带 .ew-f 与 .w300，同 !important 时源序后者胜出 */
    .ew-f { float: left !important; width: calc(50% - 6px) !important; margin: 0 6px 8px 0 !important; box-sizing: border-box; }
    /* 长文本/备注类字段（原 ≥350px 宽）整行，避免半列里塞文本域 */
    .ew-f.w350, .ew-f.w420, .ew-f.w425, .ew-f.w460, .ew-f.w520, .ew-f.w560,
    .ew-f.ew-fw { width: 100% !important; margin-right: 0 !important; }
    .ew-f select, .ew-f input, .ew-f textarea,
    .ew-f .layui-input, .ew-f .layui-form-select, .ew-f .layui-input-wrap {
        width: 100% !important; max-width: 100% !important; box-sizing: border-box;
    }
    .ew-f > label { white-space: normal; }
    .ew-clr { clear: both; }

    /* ③ 筛选栏（Crud 顶栏：.layui-input-inline 的内联 style 宽 150~268px → 两列） */
    .ew-bar .layui-form-item { margin-bottom: 4px; }
    .ew-bar .layui-input-inline { width: calc(50% - 6px) !important; margin: 0 6px 6px 0 !important; }
    .ew-bar .layui-input-inline > .layui-input { width: 100% !important; }
    /* 日期区间（一格里两个 118px 输入 + 波浪号）：竖排到整格，比挤成一行可读 */
    .ew-bar .layui-input-inline > span { display: none; }
    .ew-bar .layui-input-inline > .layui-input { display: block; margin: 3px 0; }
    .ew-bar .layui-btn { margin: 0 6px 6px 0; }
    /* 关键词框独占一行 ⇒ 按钮组整体下移一行，不再与输入框混排错位
       （:has() 在 Chrome<105 的旧 WebView 不支持 ⇒ 整条丢弃、退回两列，属可接受降级） */
    .ew-bar .layui-input-inline:has(input[name="keyword"]) { width: 100% !important; }

    /* ④ 表格：手机上“一屏放 12 列”不成立 ⇒ 窄屏改横向滚动
       ⚠这是对用户 2026-09-24「列宽百分比 + 一屏优先」口径的**移动端例外**，桌面口径原样不动。
       实测（390px 截图）：只加 min-width 不够——列宽是**百分比**（=px 权重/权重和），
       容器一窄「类型」这类小权重列就被压成竖排折字、行高爆到 180px。
       ⇒ 窄屏改 `table-layout: auto + width: auto`，让列按内容取宽、超出横向滚，长文本用 ellipsis 截到 240px 封顶 */
    .ew-tablewrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .ew-tablewrap > table { table-layout: auto !important; width: auto !important; min-width: 100% !important; }
    /* ⚠关键：表头是**行内 style="width:X%"**（Crud.cshtml L255~265 由 px 权重折算），
       而百分比列宽在 `width:auto` 的表上会塌成极小 ⇒ 光改 table-layout 无效（390px 实测列仍竖排折字）。
       必须连单元格宽度一起解除（!important 才压得住行内样式） */
    .ew-tablewrap th, .ew-tablewrap td { width: auto !important; min-width: 0 !important; white-space: nowrap; }
    .ew-tablewrap .layui-table-cell, .ew-tablewrap .ew-tc { height: auto; white-space: nowrap;
                                                            max-width: 240px; overflow: hidden; text-overflow: ellipsis; }
    table.ew-tbl { min-width: 720px; }

    /* ⑤ 分页收紧（页码多时防溢出） */
    .layui-laypage a, .layui-laypage span { padding: 0 7px; margin: 2px; }
    .layui-laypage input { width: 40px; }

    /* ⑥ 弹层（layer type:2）窄屏兜底：尺寸由 ewClampArea 算，这里只保证不溢出视口 +
       内容可惯性滚动（⛔不改标题条高度：layui 开层时已按它算过 iframe 高度） */
    .layui-layer { max-width: 100vw !important; }
    .layui-layer-iframe .layui-layer-content { overflow: auto; -webkit-overflow-scrolling: touch; }
}

/* ---- 手机竖屏（≤400px 无条件 / ≤480px 触屏）：一律单列，标准 layui 表单标签上置 ---- */
@media (max-width: 480px) and (pointer: coarse), (max-width: 400px) {
    .ew-f { float: none !important; width: 100% !important; margin-right: 0 !important; }
    .ew-bar .layui-input-inline { width: 100% !important; margin-right: 0 !important; }
    /* 标准 layui 表单（label 90px 同行 → 标签独占一行、**左对齐**、控件撑满）
       特异性与 CrudForm 页级 `.ew-grid .layui-form-label` 同级，靠源序在后覆盖。
       ⚠`text-align:left` 不可省：layui 的 `.layui-form-label` 默认右对齐（为"标签在左成列"设计），
       标签上置后若不覆写，整行右贴边 = 2026-10-02 手机截图「错位」根因之一 */
    .layui-form-item .layui-form-label { float: none !important; display: block !important; width: auto !important; padding: 4px 0 !important; text-align: left !important; }
    /* ⚠layui.css 自带 `@media screen and (max-width:450px){ .layui-form-item .layui-input-inline{
       display:block; float:none; left:-3px; width:auto!important; margin:0 0 10px 112px } }`
       —— 那 112px 缩进是给"标签仍留在左侧成列"用的；本档标签已上置 ⇒ 必须连 left/margin 一起清零，
       否则控件被顶右并溢出视口（382px 实测 scrollWidth=481 ⇒ 出横向滚动条，同为「错位」根因） */
    .layui-form-item .layui-input-inline { float: none !important; display: block !important; width: 100% !important; margin: 0 0 8px 0 !important; left: auto !important; }
    /* 同行右侧的 `.layui-form-mid`（layui ≤450 也给它 margin-left:110px）一并归零 */
    .layui-form-item .layui-form-mid { float: none !important; margin-left: 0 !important; left: auto !important; }
    .layui-form-item .layui-input-block { margin-left: 0 !important; left: auto !important; }
    .ew-btns .layui-btn { margin: 4px 6px 4px 0; }
}