@charset "UTF-8";
/* ============================================================
 * common.css — MES 业务公共层（高端实用型 · 2026-09-26 重写）
 *
 * 定位：mes.css 之上的 MES 业务语义层，只做四件事——
 *   1) MES 专属类（徽章/状态/加载/空态）
 *   2) 旧主题类名的兼容映射（旧蓝 → 新中性灰令牌）
 *   3) iframe 场景 body 收口
 *   4) 手机端全局收口
 *
 * 令牌与组件全部来自 mes.css，本文件不再自定义颜色值
 * （--mes-* 旧变量映射到新令牌，兼容历史页面内联 style）。
 * ============================================================ */

/* ---------- 旧变量映射（历史页面 style="color:var(--mes-...)" 兼容） ---------- */
:root {
    --mes-primary:      var(--accent);
    --mes-primary-dark: var(--ink);
    --mes-primary-mid:  var(--accent-ink);
    --mes-primary-light:#b9c9de;
    --mes-primary-pale: var(--accent-bg);
    --mes-bg:           var(--bg);

    --mes-success:      var(--ok);
    --mes-success-bg:   var(--ok-bg);
    --mes-warning:      var(--warn);
    --mes-warning-bg:   var(--warn-bg);
    --mes-danger:       var(--danger);
    --mes-danger-bg:    var(--danger-bg);
    --mes-info:         var(--info);
    --mes-info-bg:      var(--info-bg);

    --mes-text:         var(--ink);
    --mes-text-muted:   var(--ink-3);
    --mes-border:       var(--line);
}

/* ---------- 全局 body（非 iframe 整页场景） ---------- */
body.mes-body {
    background: var(--bg);
    padding: 24px;
    font-family: var(--font);
    color: var(--ink);
}

/* ---------- 状态色（报表/日志常用） ---------- */
.status-ok      { color: var(--ok);     font-weight: 700; }
.status-fail    { color: var(--danger); font-weight: 700; }
.status-warn    { color: var(--warn);   font-weight: 700; }
.status-muted   { color: var(--ink-3); }

/* ---------- 按钮尺寸补丁 ---------- */
.btn-xs {
    font-size: 11px;
    padding: 0 8px;
    height: 22px;
    border-radius: 5px;
}
.btn-sm-compact {
    font-size: 12px;
    padding: 0 8px;
    height: 26px;
    border-radius: 6px;
}

/* ---------- 软徽章（MES 语义） ---------- */
.badge-soft {
    display: inline-block;
    padding: 2px 8px;
    border-radius: var(--r-chip);
    font-size: 11px;
    font-weight: 700;
    line-height: 1.5;
    white-space: nowrap;
}
.badge-soft-primary { background: var(--accent-bg); color: var(--accent-ink); }
.badge-soft-success { background: var(--ok-bg);     color: var(--ok-ink); }
.badge-soft-warning { background: var(--warn-bg);   color: var(--warn-ink); }
.badge-soft-danger  { background: var(--danger-bg); color: var(--danger-ink); }
.badge-soft-info    { background: var(--info-bg);   color: var(--info-ink); }
.badge-soft-violet  { background: var(--violet-bg); color: var(--violet-ink); }

/* ---------- 通用间距工具 ---------- */
.mt-6 { margin-top: 40px; }
.mb-6 { margin-bottom: 40px; }

/* ---------- 加载中遮罩 ---------- */
.mes-loading {
    position: fixed;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    background: var(--surface);
    padding: 24px 34px;
    border-radius: var(--r-panel);
    border: 1px solid var(--line);
    box-shadow: var(--shadow-lg);
    z-index: 9999;
    font-size: 14px;
    color: var(--ink-2);
}

/* ---------- 空状态 ---------- */
.empty-state {
    text-align: center;
    color: var(--ink-3);
    padding: 40px 0;
    font-size: 13px;
}

/* ---------- iframe 场景的 body 样式 ---------- */
body.in-iframe {
    padding: 20px;
    background: var(--bg);
    margin: 0;
}
body.in-iframe .mes-content {
    margin: 0 !important;
    padding: 0 !important;
}

/* ---------- 手机端全局收口 ----------
   企微 X5 内核有时按虚拟桌面宽度（约 980px）渲染，max-width:768px 不触发，
   叠加「触屏 + 视口不超 1024」判定兜底 */
@media (max-width: 768px), (pointer: coarse) and (max-width: 1024px) {
    html, body { max-width: 100%; overflow-x: hidden; }
    body.mes-body { padding: 12px; }
    body.in-iframe { padding: 10px; }
    img { max-width: 100%; height: auto; }
}
