/* 拾光 · 管理端样式（app.css 的作用域限定版）  static/mgmt.css
 * ==================================================================
 * ⚠️⚠️ 本文件由 C:\Temp\sgchk\gen_mgmt_css.py 从 app.css 生成 —— 别手改，改了会被覆盖。
 *      要改样式请改 app.css，然后重跑生成器。
 *
 * 为什么需要它：index.html（手机壳）和 admin.html/web.html 共用一批同名类，
 *   直接把 app.css 全局引进来会污染员工页，而且【层叠顺序救不了】——
 *   泄漏的是 index 根本没声明的属性。实例：
 *       index   .att-summary { display:flex; gap:8px; margin-bottom:6px }
 *       app.css .att-summary { display:flex; flex-wrap:wrap; gap:10px; margin:10px 10px 0 }
 *   index 没写 flex-wrap ⇒ app.css 的 wrap 生效 ⇒ 统计块换行 ⇒ 本仓管理页高 3142→3600px(+41%)。
 *
 * 本文件把每条选择器限定在 #mgmtRoot 内（手机壳里管理端的唯一根），
 * 所以对 index 现有的员工页【零影响】。
 * 配套改动：checkin/emp/kb/shift 四个模块的弹窗注入目标改成
 *   (document.getElementById('mgmtRoot') || document.body)  —— 弹窗也落进作用域。
 *
 * 📌 只在 index.html 引；admin.html 引原始 app.css；web.html 引 web-module.css
 *    （10-13 16:44 从 app.css 拆出的冻结副本，不再跟 app.css 同步）。
 * ⚠️ 改完顶 ?v=：index.html 的 + service-worker.js 的 CORE 与 CACHE 版本号
 *    （SW 对 /static/* 是 cache-first，不换 URL 会永久固化）。
 * 🚫 本脚本的备份写到 C:\Temp\sgchk\local_baks\ ——【不许再往 server/static/ 里扔 .bak】，
 *    那目录是 web 根，备份会跟着部署公开上线（10-13 已复发过一次，见 patch_nginx_bak.py）。
 * ================================================================== */

#mgmtRoot .top { background: linear-gradient(90deg, #2f4a7a, #456a9e); color: #fff; padding: 16px; position: sticky; top: 0; z-index: 10;}
#mgmtRoot .top h1 { font-size: 18px;}
#mgmtRoot .top .sub { font-size: 12px; opacity: .7; margin-top: 2px;}
#mgmtRoot .tabs { display: flex; background: #fff; border-bottom: 1px solid #e5e6eb; position: sticky; top: 57px; z-index: 9;}
#mgmtRoot .tabs button { flex: 1; padding: 12px; border: none; background: none; font-size: 15px; color: #646a73; cursor: pointer; border-bottom: 2px solid transparent;}
#mgmtRoot .tabs button.on { color: #3f5a8a; border-bottom-color: #3f5a8a; font-weight: 600;}
#mgmtRoot .panel { background: #fff; margin: 10px; padding: 14px; border-radius: 10px;}
#mgmtRoot .panel h2 { font-size: 15px; margin-bottom: 8px;}
#mgmtRoot .lv-nav { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px;}
#mgmtRoot .lv-nav button { padding: 6px 12px; border: 1px solid #e3e6ec; background: #fff; border-radius: 8px; font-size: 14px; color: #3f5a8a; cursor: pointer;}
#mgmtRoot .lv-cal { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px;}
#mgmtRoot .lv-cal .wk { text-align: center; font-size: 12px; color: #8a919f; padding: 4px 0;}
#mgmtRoot .lv-cal .day { position: relative; text-align: center; padding: 9px 0; border-radius: 8px; background: #f7f8fa; font-size: 14px; color: #3a4048; cursor: pointer;}
#mgmtRoot .lv-cal .day.blank { background: transparent; cursor: default;}
#mgmtRoot .lv-cal .day.today { box-shadow: inset 0 0 0 1px #c0c4cc;}
#mgmtRoot .lv-cal .day.has-rest { background: #eef2f8; color: #3f5a8a; font-weight: 700;}
#mgmtRoot .lv-cal .day.has-leave { background: #fff1f0; color: #d4380d; font-weight: 700;}
#mgmtRoot .lv-cal .day.has-both { background: linear-gradient(135deg, #eef2f8 0 50%, #fff1f0 50% 100%); font-weight: 700;}
#mgmtRoot .lv-cal .day.sel { box-shadow: inset 0 0 0 2px #3f5a8a;}
#mgmtRoot .lv-day-detail { margin-top: 8px; padding: 10px; background: #f7f8fa; border-radius: 8px; font-size: 13px; color: #3a4048; line-height: 1.8;}
#mgmtRoot .row { display: flex; align-items: center; margin: 6px 0;}
#mgmtRoot .row label { width: 70px; font-size: 13px; color: #646a73; flex-shrink: 0;}
#mgmtRoot .row input, #mgmtRoot .row select { flex: 1; padding: 8px; border: 1px solid #e3e6ec; border-radius: 8px; font-size: 14px;}
#mgmtRoot .check { display: flex; align-items: center; gap: 6px; font-size: 14px; margin: 8px 0;}
#mgmtRoot .check input { width: 18px; height: 18px;}
#mgmtRoot .btn { padding: 10px 16px; border: none; border-radius: 8px; font-size: 14px; cursor: pointer;}
#mgmtRoot .btn.primary { background: #3f5a8a; color: #fff; width: 100%; margin-top: 8px;}
#mgmtRoot .btn.ghost { width: 100%; margin-top: 6px; background: #f0f1f5; color: #646a73;}
#mgmtRoot .card { background: #fff; margin: 10px; padding: 14px; border-radius: 10px;}
#mgmtRoot .card .head { display: flex; align-items: center; justify-content: space-between;}
#mgmtRoot .card .head .hd-badges { display: flex; align-items: center; gap: 6px; flex-shrink: 0;}
#mgmtRoot .card .title { font-size: 16px; font-weight: 600;}
#mgmtRoot .card .time { font-size: 12px; color: #8a919f; margin-top: 2px;}
#mgmtRoot .card .detail { font-size: 13px; color: #646a73; margin-top: 6px;}
#mgmtRoot .badge { font-size: 11px; padding: 2px 8px; border-radius: 10px; background: #fff1f0; color: #d4380d;}
#mgmtRoot .badge.text { background: #eef2f8; color: #3f5a8a;}
#mgmtRoot .badge.off { background: #f0f1f5; color: #8a919f;}
#mgmtRoot .badge.ok { background: #f0f9eb; color: #389e0d;}
#mgmtRoot .badge.warn { background: #fffbe6; color: #d48806;}
#mgmtRoot .ops { display: flex; gap: 8px; margin-top: 10px;}
#mgmtRoot .ops button { flex: 1; padding: 8px; border: 1px solid #e3e6ec; border-radius: 8px; background: #fff; font-size: 14px; cursor: pointer;}
#mgmtRoot .ops button.del { color: #d4380d; border-color: #ffd6d6;}
#mgmtRoot .ops button.assign { color: #3f5a8a; border-color: #adc6ff; background: #f0f5ff;}
#mgmtRoot .ops button.on-btn { color: #389e0d; border-color: #b7eb8f;}
#mgmtRoot .gap { font-size: 13px; color: #646a73; margin-top: 6px;}
#mgmtRoot .dim { color: #8a919f;}
#mgmtRoot .bossfb { font-size: 13px; margin-top: 8px; padding: 8px 10px; border-radius: 8px; background: #f7f8fa; color: #262626;}
#mgmtRoot .fb-row { display: flex; gap: 8px; margin-top: 8px;}
#mgmtRoot .fb-row input { flex: 1; padding: 8px 10px; border: 1px solid #e3e6ec; border-radius: 8px; font-size: 14px;}
#mgmtRoot .fb-row button { padding: 8px 14px; background: #3f5a8a; color: #fff; border: none; border-radius: 8px; font-size: 14px; cursor: pointer;}
#mgmtRoot /* .empty / .toast / .thumb / .lightbox —— 已抽到 shared.css */ .gate { position: fixed; inset: 0; background: #fff; z-index: 1000; display: flex; align-items: center; justify-content: center;}
#mgmtRoot .gate-box { width: 280px; text-align: center;}
#mgmtRoot .gate-box h2 { font-size: 18px; margin-bottom: 20px; color: #262626;}
#mgmtRoot .gate-box input { width: 100%; padding: 12px; border: 1px solid #e3e6ec; border-radius: 8px; font-size: 15px; margin-bottom: 12px;}
#mgmtRoot .gate-box button { width: 100%; padding: 12px; background: #3f5a8a; color: #fff; border: none; border-radius: 8px; font-size: 15px; cursor: pointer;}
#mgmtRoot .logout { float: right; font-size: 13px; color: #fff; background: none; border: 1px solid rgba(255,255,255,.4); border-radius: 6px; padding: 4px 10px; cursor: pointer;}
#mgmtRoot .chart { width: 100%; height: 220px;}
#mgmtRoot .range-btns { display: flex; gap: 8px; margin-bottom: 4px;}
#mgmtRoot .range { flex: 1; padding: 8px; border: 1px solid #e3e6ec; border-radius: 8px; background: #fff; font-size: 14px; cursor: pointer;}
#mgmtRoot .range.on { background: #3f5a8a; color: #fff; border-color: #3f5a8a;}
#mgmtRoot .table-wrap { margin-top: 10px; overflow-x: auto;}
#mgmtRoot /* 缺货补货 / 今日补货 —— 卡片列表（手机上表格怎么分列都挤，改卡片） */ .card { background: #fff; border-radius: 12px; padding: 10px 13px; margin-bottom: 7px;
          box-shadow: 0 1px 2px rgba(31,36,48,.04);}
#mgmtRoot .card.hotcard { background: #fffafa;}
#mgmtRoot .c-top { display: flex; align-items: center; gap: 6px;}
#mgmtRoot .c-name { font-size: 14.5px; font-weight: 500; min-width: 0; white-space: nowrap;
            overflow: hidden; text-overflow: ellipsis;}
#mgmtRoot .c-big { margin-left: auto; font-size: 15px; font-weight: 600; color: #3f5a8a; white-space: nowrap;}
#mgmtRoot .c-big.red { color: #d4380d;}
#mgmtRoot .c-sub { margin-top: 1px; font-size: 12px; color: #8a919f; display: flex; align-items: baseline; gap: 8px;}
#mgmtRoot .c-sub .code { font-family: ui-monospace, Consolas, Menlo, monospace; font-size: 11.5px;}
#mgmtRoot .c-sub .solo { margin-left: auto; color: #1f2430;}
#mgmtRoot .c-meta { margin-top: 7px; padding-top: 7px; border-top: 1px solid #f2f3f5;
            display: flex; flex-wrap: wrap; gap: 5px 15px; font-size: 12px; color: #8a919f;}
#mgmtRoot .c-meta em { font-style: normal; color: #1f2430; font-weight: 500;}
#mgmtRoot .c-get { margin-top: 6px; font-size: 12px; color: #5c6470; line-height: 1.55;}
#mgmtRoot .c-get b { color: #3f5a8a; font-weight: 600;}
#mgmtRoot .c-get .warn { color: #d4380d; font-weight: 600;}
#mgmtRoot /* ── 补货路线 ── */ .rt-top { font-size: 13px; color: #5c6470; margin: 0 2px 10px;}
#mgmtRoot .rt-top b { color: #1f2430; font-weight: 600;}
#mgmtRoot .rt-hd { display: flex; align-items: baseline; gap: 7px; margin: 14px 2px 8px;
           font-size: 15px; font-weight: 600;}
#mgmtRoot .rt-hd .rt-sub { font-size: 12px; color: #8a919f; font-weight: 400;}
#mgmtRoot .badge { display: inline-block; font-size: 11px; padding: 1px 7px; border-radius: 5px; font-weight: 600;}
#mgmtRoot .badge.a { background: #eaf1ff; color: #3f5a8a;}
#mgmtRoot .badge.b { background: #f0ecff; color: #6b3fd4;}
#mgmtRoot .trip { background: #fff; border-radius: 12px; padding: 11px 13px; margin-bottom: 9px;
          box-shadow: 0 1px 2px rgba(31,36,48,.04);}
#mgmtRoot .t-head { display: flex; align-items: baseline; gap: 7px; margin-bottom: 4px;}
#mgmtRoot .t-no { font-size: 14.5px; font-weight: 600;}
#mgmtRoot .rt-hot { font-size: 11px; padding: 0 5px; border-radius: 4px; background: #ffece8; color: #d4380d;}
#mgmtRoot .t-pk { margin-left: auto; font-size: 13px; font-weight: 600; color: #3f5a8a; white-space: nowrap;}
#mgmtRoot .t-line { font-size: 11.5px; color: #8a919f; margin-bottom: 5px;}
#mgmtRoot .t-line code { font-family: ui-monospace, Consolas, Menlo, monospace; color: #5c6470;}
#mgmtRoot /* 按趟折叠：点趟头收起/展开（默认收起 —— 不向下拉半天） */ .t-head { cursor: pointer; user-select: none;}
#mgmtRoot .t-head .t-fold { margin-left: auto; color: #9aa1ad; font-size: 12px;}
#mgmtRoot .t-body { margin-top: 2px;}
#mgmtRoot .item { border-top: 1px solid #f4f5f8; padding: 7px 0 6px;}
#mgmtRoot .item:first-of-type { border-top: 0;}
#mgmtRoot .item.hot { background: #fff8f7; border-radius: 8px; padding-left: 6px; padding-right: 6px;
              border-top: 0; margin: 3px 0;}
#mgmtRoot .i-top { display: flex; align-items: baseline; gap: 7px;}
#mgmtRoot .seq { flex: none; width: 19px; height: 19px; border-radius: 50%; background: #3f5a8a; color: #fff;
         font-size: 11.5px; font-weight: 600; text-align: center; line-height: 19px;}
#mgmtRoot .i-nm { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 13.5px;}
#mgmtRoot /* ⭐ 箱规钉最右（2026-10-17 奇威）：规格文字左、箱规右，两栏 flex。 右内边距 37px = 22(完成圈) + 8(它的 margin-left) + 7(.rp-itop/.i-top 的 gap) ⇒ 件数和箱规落在同一条竖线上，往下扫就是一把「标尺」。 */ .i-spec { margin: 2px 0 1px 26px; padding-right: 37px; font-size: 12px; color: #8a919f;
            line-height: 1.45; display: flex; align-items: baseline; gap: 8px;}
#mgmtRoot .i-specc { flex: 1; min-width: 0; word-break: break-word;}
#mgmtRoot .i-spec .pk { flex: none;}
#mgmtRoot .i-pk { font-weight: 600; color: #3f5a8a; white-space: nowrap; font-size: 13px;}
#mgmtRoot .i-pk em { font-style: normal; font-size: 12px; color: #8a919f; font-weight: 400; margin-left: 3px;}
#mgmtRoot /* 取货位列【定宽】+ 左对齐 ⇒ 箭头和目标货位都落在同一条竖线上（有个"标尺"） */ .i-where { margin: 3px 0 0 26px; font-size: 12px; color: #5c6470; display: grid;
             grid-template-columns: 100px 20px 16px minmax(0, 1fr); align-items: baseline;}
#mgmtRoot .i-where .pos { font-family: ui-monospace, Consolas, Menlo, monospace; font-size: 11.5px;
                  font-weight: 600; white-space: nowrap;}
#mgmtRoot .i-where .pos.from { color: #3f5a8a; text-align: left;}
#mgmtRoot .i-where .pos.to { color: #0a8f4d; text-align: left;}
#mgmtRoot .i-where .arrow { color: #c9ced8; text-align: center;}
#mgmtRoot /* 一个 SKU 要从多处取 → 货位链摆不下定宽栅格，改成自动换行（2026-10-15） */ .i-where.multi { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 4px;}
#mgmtRoot .i-more { margin: 2px 0 0 26px; font-size: 11.5px; color: #8a919f;}
#mgmtRoot /* 源货位可点：展开该 SKU 全部货位（到了提示货位发现没货 → 看别处还有多少） */ .i-where .pos.from.can { cursor: pointer; border-bottom: 1px dashed #9fb6e8;}
#mgmtRoot .i-where .pos.from.can::after { content: '▾'; font-size: 9px; margin-left: 3px; color: #9fb6e8;}
#mgmtRoot .i-slots { margin: 4px 0 0 26px; padding: 6px 8px; background: #f7f9fc; border-radius: 6px;
             flex-wrap: wrap; gap: 5px 10px; font-size: 12px;}
#mgmtRoot .i-slots .ttl { width: 100%; font-size: 11px; color: #8a919f; margin-bottom: 2px;}
#mgmtRoot .i-slots .sl { font-family: ui-monospace, Consolas, Menlo, monospace; font-size: 11.5px;
                 color: #1f2430;}
#mgmtRoot .i-slots .sl em { font-style: normal; color: #3f5a8a; font-weight: 600; margin-left: 4px;}
#mgmtRoot .i-slots .sl.zero { color: #9aa1ad;}
#mgmtRoot .i-slots .sl.zero em { color: #b3b9c4; font-weight: 400;}
#mgmtRoot .i-slots .sl[onclick] { cursor: pointer;}
#mgmtRoot .i-slots .sl.cur { color: #3f5a8a; font-weight: 700;}
#mgmtRoot .i-slots .sl.cur::before { content: '●'; font-size: 8px; margin-right: 3px;}
#mgmtRoot /* 补货进度：勾选完成（存本机，当天有效） */ .i-done { flex: none; width: 22px; height: 22px; line-height: 20px; text-align: center;
            border: 1.5px solid #c9ced8; border-radius: 50%; color: #fff; cursor: pointer;
            font-size: 13px; margin-left: 8px;}
#mgmtRoot .i-done.on { background: #0a8f4d; border-color: #0a8f4d;}
#mgmtRoot .item.done .i-nm, #mgmtRoot .item.done .i-spec, #mgmtRoot .item.done .i-where, #mgmtRoot .item.done .i-pk { opacity: .4; text-decoration: line-through;}
#mgmtRoot .rt-top .rt-reset { float: right; color: #8a919f; font-size: 11.5px; cursor: pointer; text-decoration: underline;}
#mgmtRoot .rt-top .rt-left { color: #d4380d;}
#mgmtRoot .rt-top.ok { color: #0a8f4d; font-weight: 600;}
#mgmtRoot /* 实取数量录入（推荐 120、货位只有 60 → 录 60） */ .i-act { margin: 3px 0 0 26px; font-size: 12px; color: #5c6470;}
#mgmtRoot .i-act input { width: 64px; padding: 2px 6px; font-size: 12px; border: 1px solid #d5d9e0;
                 border-radius: 5px; font-family: ui-monospace, Consolas, Menlo, monospace;}
#mgmtRoot .i-act input:focus { border-color: #3f5a8a; outline: none;}
#mgmtRoot .i-act .i-diff { color: #d4380d; margin-left: 6px;}
#mgmtRoot .c-dtl { margin-top: 8px; padding-top: 8px; border-top: 1px solid #f2f3f5;}
#mgmtRoot .slot { display: flex; align-items: baseline; gap: 10px; font-size: 12.5px; padding: 3px 0;}
#mgmtRoot .slot .pos { flex: 1; min-width: 0; font-family: ui-monospace, Consolas, Menlo, monospace;
               font-size: 12px; color: #1f2430;}
#mgmtRoot .slot .num { font-weight: 500; color: #1f2430;}
#mgmtRoot .slot .dim { color: #8a919f; font-size: 11.5px;}
#mgmtRoot .rp-tag { display: inline-block; padding: 0 5px; border-radius: 4px; line-height: 16px;
            background: #ffece8; color: #d4380d; font-size: 11px;}
#mgmtRoot .rp-hot { color: #d4380d;}
#mgmtRoot .rp-sum { font-size: 13px; color: #5c6470; margin-bottom: 10px;}
#mgmtRoot .rp-sum b { color: #1f2430; font-weight: 600;}
#mgmtRoot .pk { display: inline-block; min-width: 20px; padding: 0 6px; border-radius: 6px;
        background: #eaf1ff; color: #3f5a8a; font-weight: 500; cursor: pointer;}
#mgmtRoot .pk:active { background: #d9e6ff;}
#mgmtRoot .dtl-hd { padding: 2px 0 6px; font-size: 12px; color: #8a919f;}
#mgmtRoot table.rpt { width: 100%; border-collapse: collapse; font-size: 13px;}
#mgmtRoot table.rpt th, #mgmtRoot table.rpt td { padding: 6px 8px; text-align: center; border-bottom: 1px solid #f0f1f5; white-space: nowrap;}
#mgmtRoot table.rpt th { color: #646a73; font-weight: 500;}
#mgmtRoot table.rpt td.neg { color: #d4380d; font-weight: 600;}
#mgmtRoot table.rpt tr.sum td { border-top: 1px solid #e3e6ec; font-weight: 600; background: #fafbfc;}
@media (max-width: 600px) {
#mgmtRoot table.rpt { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch;}
}
#mgmtRoot .person { cursor: pointer;}
#mgmtRoot .person:active { background: #f7f8fa;}
#mgmtRoot .funnel-tip { font-size: 12px; color: #8a919f; font-weight: 400; margin-left: 6px;}
#mgmtRoot .filter-bar { display: flex; align-items: center; justify-content: space-between; margin: 0 10px 6px;}
#mgmtRoot .filter-bar .tag { font-size: 12px; color: #3f5a8a; background: #eef2f8; padding: 4px 12px; border-radius: 12px;}
#mgmtRoot .filter-bar .clear { font-size: 13px; color: #646a73; background: none; border: none; cursor: pointer;}
#mgmtRoot /* 工作台：总览条 + 功能分组 */ .ov-strip { display: flex; gap: 10px; padding: 12px 12px 0;}
#mgmtRoot .ov-card { flex: 1; background: #fff; border-radius: 12px; padding: 14px 0; text-align: center; cursor: pointer; box-shadow: 0 1px 3px rgba(0,0,0,.05); transition: transform .15s;}
#mgmtRoot .ov-card:active { transform: scale(.97);}
#mgmtRoot .ov-card .ov-num { font-size: 21px; font-weight: 700; color: #3f5a8a;}
#mgmtRoot .ov-card .ov-num.alert { color: #d4380d;}
#mgmtRoot .ov-card .ov-label { font-size: 11px; color: #8a919f; margin-top: 3px;}
#mgmtRoot .group-list { padding: 12px;}
#mgmtRoot .group { background: #fff; border-radius: 12px; margin-bottom: 12px; padding: 14px; box-shadow: 0 1px 3px rgba(0,0,0,.05); transition: opacity .15s;}
#mgmtRoot .group.dragging { opacity: .45; pointer-events: none;}
#mgmtRoot .group-head { display: flex; align-items: center; justify-content: space-between; font-size: 14px; font-weight: 700; color: #1f2329; margin-bottom: 10px;}
#mgmtRoot .grip { color: #c0c4cc; font-size: 16px; letter-spacing: 2px; padding: 4px 6px; cursor: grab; touch-action: none; user-select: none;}
#mgmtRoot .grip:active { cursor: grabbing;}
#mgmtRoot .group-items { display: flex; flex-wrap: wrap; gap: 8px;}
#mgmtRoot .group-items button { position: relative; flex: 1; min-width: 28%; padding: 10px 6px; border: 1px solid #e5e6eb; border-radius: 10px; background: #f8f9fb; font-size: 13px; color: #1f2329; cursor: pointer;}
#mgmtRoot .group-items button:active { background: #eef2ff;}
#mgmtRoot .fav-star { position: absolute; top: 3px; right: 5px; font-size: 15px; line-height: 1; color: #c0c4cc; z-index: 2;}
#mgmtRoot .fav-star.on { color: #f5a623;}
#mgmtRoot .fav-drag { position: absolute; top: 3px; left: 5px; font-size: 14px; line-height: 1; color: #c0c4cc; cursor: grab; touch-action: none; user-select: none; z-index: 2;}
#mgmtRoot .fav-btn.dragging { opacity: .45;}
#mgmtRoot .fav-empty { font-size: 12px; color: #8a919f; padding: 4px 2px;}
#mgmtRoot .group-head .fav-tip { font-size: 11px; color: #8a919f; font-weight: 400; margin-left: 8px;}
#mgmtRoot .page-head { display: flex; align-items: center; gap: 4px; padding: 11px 14px; background: #fff; border-bottom: 1px solid #eef0f3; position: sticky; top: 0; z-index: 9;}
#mgmtRoot .page-head .back { border: none; background: none; color: #3f5a8a; font-size: 15px; cursor: pointer; padding: 4px 10px 4px 0;}
#mgmtRoot .page-head h1 { font-size: 17px; font-weight: 700;}
#mgmtRoot .page-head .pg-right { margin-left: auto;}
#mgmtRoot .page-head .pg-logout { font-size: 12px; color: #646a73; background: none; border: 1px solid #e3e6ec; border-radius: 6px; padding: 4px 10px; cursor: pointer;}
#mgmtRoot .page-head .pg-act { font-size: 12px; color: #3f5a8a; background: none; border: 1px solid #e3e6ec; border-radius: 6px; padding: 4px 10px; cursor: pointer; margin-right: 6px;}
#mgmtRoot .page-head .pg-add { font-size: 13px; color: #fff; background: #3f5a8a; border: none; border-radius: 6px; padding: 5px 12px; cursor: pointer; margin-right: 8px;}
#mgmtRoot /* 漏斗 */ .funnel { padding: 4px 0;}
#mgmtRoot .fbar { height: 38px; display: flex; align-items: center; justify-content: space-between; padding: 0 14px; color: #fff; font-weight: 600; cursor: pointer; border-radius: 10px; box-shadow: 0 1px 2px rgba(0,0,0,.05); margin: 0 auto 7px; transition: transform .12s, filter .12s;}
#mgmtRoot .fbar:last-child { margin-bottom: 0;}
#mgmtRoot .fbar:active { transform: scale(.985); filter: brightness(.92);}
#mgmtRoot .fbar .f-name { font-size: 14px; letter-spacing: .5px;}
#mgmtRoot .fbar .f-right { font-size: 13px; opacity: .92;}
#mgmtRoot /* 出勤看板汇总 + 未打卡 */ .att-summary { display: flex; flex-wrap: wrap; gap: 10px; margin: 10px 10px 0;}
#mgmtRoot .att-box { flex: 1 1 90px; min-width: 90px; background: #fff; border-radius: 10px; padding: 14px 0; text-align: center;}
#mgmtRoot .att-box .num { font-size: 26px; font-weight: 700; color: #1f2329; overflow-wrap: break-word; word-break: break-word; line-height: 1.2;}
#mgmtRoot .att-summary.money .att-box .num { font-size: 15px;}
#mgmtRoot .att-box .lbl { font-size: 12px; color: #8a919f; margin-top: 2px;}
#mgmtRoot .att-box.ok .num { color: #389e0d;}
#mgmtRoot .att-box.off .num { color: #d4380d;}
#mgmtRoot .card.absent { border-left: 3px solid #e3e6ec;}
#mgmtRoot .card.absent .title { color: #8a919f;}
#mgmtRoot .card .status-pill { margin-left: 6px;}
#mgmtRoot /* 出勤看板按仓库分组（手风琴折叠） */ .wh-section { margin: 10px; background: #fff; border-radius: 10px; overflow: hidden;}
#mgmtRoot .wh-head { display: flex; align-items: center; justify-content: space-between; padding: 12px 14px; border-bottom: 1px solid #f0f1f5; font-size: 15px; font-weight: 600; cursor: pointer; user-select: none;}
#mgmtRoot .wh-head .wh-left { display: flex; align-items: center;}
#mgmtRoot .wh-head .arrow { display: inline-block; margin-right: 6px; transition: transform .15s; color: #8a919f; font-size: 12px;}
#mgmtRoot .wh-stat { font-size: 12px; color: #8a919f; font-weight: 400;}
#mgmtRoot .wh-stat b.ok { color: #389e0d; font-weight: 600;}
#mgmtRoot .wh-stat b.off { color: #d4380d; font-weight: 600;}
#mgmtRoot .wh-section.collapsed .wh-head .arrow { transform: rotate(-90deg);}
#mgmtRoot .wh-section.collapsed .wh-body { display: none;}
#mgmtRoot .wh-body .card { margin: 0; border-radius: 0; border-bottom: 1px solid #f5f6f8;}
#mgmtRoot .wh-body .card:last-child { border-bottom: none;}
#mgmtRoot /* 产能排行 */ .caprank-wh { margin: 10px; background: #fff; border-radius: 10px; overflow: hidden;}
#mgmtRoot .caprank-wh .wh-title { padding: 12px 14px; font-size: 15px; font-weight: 700; border-bottom: 1px solid #f0f1f5;}
#mgmtRoot .caprank-group { padding: 6px 14px 12px;}
#mgmtRoot .caprank-group .gp-title { font-size: 13px; font-weight: 600; color: #646a73; margin: 8px 0 4px;}
#mgmtRoot .caprank-row { display: flex; flex-direction: column; gap: 6px; padding: 10px 0; border-bottom: 1px solid #f5f6f8;}
#mgmtRoot .caprank-row:last-child { border-bottom: none;}
#mgmtRoot .caprank-head { display: flex; align-items: center; gap: 8px;}
#mgmtRoot .caprank-head .rk { width: 22px; font-size: 15px; font-weight: 700; color: #c0c4cc; text-align: center; flex-shrink: 0;}
#mgmtRoot .caprank-head .rk.top1 { color: #f5a623;}
#mgmtRoot .caprank-head .rk.top2 { color: #a0a6b1;}
#mgmtRoot .caprank-head .rk.top3 { color: #d48806;}
#mgmtRoot .caprank-head .n { flex: 1; min-width: 0; font-size: 14px; font-weight: 600;}
#mgmtRoot .capbar-wrap { width: 100%;}
#mgmtRoot .capbar { position: relative; height: 12px; background: #eef0f3; border-radius: 6px; overflow: hidden;}
#mgmtRoot .capbar .fill { position: absolute; left: 0; top: 0; bottom: 0; background: linear-gradient(90deg,#2f4a7a,#456a9e); border-radius: 6px;}
#mgmtRoot .capbar .tick { position: absolute; top: -2px; bottom: -2px; width: 3px; background: #f5a623; border-radius: 2px;}
#mgmtRoot .caprank-row .bars { display: flex; flex-direction: column; gap: 3px;}
#mgmtRoot .caprank-row .bar-row { display: flex; align-items: center; gap: 6px;}
#mgmtRoot .caprank-row .bar-row .lbl { width: 30px; font-size: 11px; font-weight: 600; flex-shrink: 0;}
#mgmtRoot .caprank-row .bar-row .lbl.pick { color: #3f5a8a;}
#mgmtRoot .caprank-row .bar-row .lbl.pack { color: #fa8c16;}
#mgmtRoot .caprank-row .bar-row .lbl.rtn { color: #6d4fff;}
#mgmtRoot .caprank-row .bar-row .track { flex: 1; height: 10px; background: #f0f1f5; border-radius: 5px; overflow: hidden;}
#mgmtRoot .caprank-row .bar-row .fill { height: 100%; border-radius: 5px;}
#mgmtRoot .caprank-row .bar-row .fill.pick { background: linear-gradient(90deg,#5b7cb8,#3f5a8a);}
#mgmtRoot .caprank-row .bar-row .fill.pack { background: linear-gradient(90deg,#ffa94d,#fa8c16);}
#mgmtRoot .caprank-row .bar-row .fill.rtn { background: linear-gradient(90deg,#b3a7ff,#6d4fff);}
#mgmtRoot .caprank-row .bar-row .lbl.rpl { color: #0ca678;}
#mgmtRoot .caprank-row .bar-row .fill.rpl { background: linear-gradient(90deg,#38d9a9,#0ca678);}
#mgmtRoot .caprank-row .bar-row .lbl.shl { color: #1098ad;}
#mgmtRoot .caprank-row .bar-row .fill.shl { background: linear-gradient(90deg,#66d9e8,#1098ad);}
#mgmtRoot .caprank-row .bar-row .val { width: 96px; text-align: right; font-size: 12px; font-weight: 600; color: #1f2329; flex-shrink: 0;}
#mgmtRoot .cap-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px 8px; margin: 10px 0;}
#mgmtRoot .cap-grid .cell { font-size: 12px; color: #646a73;}
#mgmtRoot .cap-grid .cell b { color: #1f2329; font-size: 14px;}
#mgmtRoot /* ── 卡片权限配置页（2026-10-13）──────────────────────────────────────── * 挂在 index.html 的 #mgmtRoot 里 ⇒ 吃 mgmt.css（本文件的作用域生成版）。 * 改这里之后【必须】重跑 C:\Temp\sgchk\gen_mgmt_css.py --apply，否则手机端不跟着变。 */ .ccfg-top .row { display: flex; align-items: center; gap: 8px;}
#mgmtRoot .ccfg-top .row + .row { margin-top: 8px;}
#mgmtRoot .ccfg-top .row label { min-width: 52px; color: #646a73; font-size: 13px;}
#mgmtRoot .ccfg-top .row select { flex: 1; padding: 6px 8px; border: 1px solid #e3e6ec; border-radius: 8px; font-size: 13px; background: #fff;}
#mgmtRoot /* 卡片按用途分的三组标题（纯展示，方便老板看） */ .ccfg-tier { display: flex; align-items: baseline; gap: 7px; font-size: 12px; font-weight: 700; color: #3f5a8a;
    padding: 12px 0 5px; border-bottom: 1px solid #eef0f4; margin-bottom: 2px;}
#mgmtRoot .ccfg-tier:first-child { padding-top: 6px;}
#mgmtRoot .ccfg-tier em { font-style: normal; font-size: 11px; font-weight: 600; color: #6b7a95;
    background: #eef2f8; border-radius: 4px; padding: 0 5px;}
#mgmtRoot .ccfg-tier span { font-size: 11px; font-weight: 400; color: #a3abb8; margin-left: auto;}
#mgmtRoot /* ⚠️ 基础 .row 是 `input, #mgmtRoot select {flex:1}
#mgmtRoot `，勾选框会被拉满整行 ⇒ 飘到中间。这里收回它的宽度。 */ .ccfg-top .row input[type="checkbox"] { flex: 0 0 auto; width: 18px; height: 18px; padding: 0;}
#mgmtRoot .ccfg-hint { margin: 10px 12px 4px; font-size: 12px; color: #8a919f; line-height: 1.6;}
#mgmtRoot .ccfg-emp { background: #fff; border-radius: 10px; margin: 8px 10px; overflow: hidden;}
#mgmtRoot .ccfg-head { display: flex; align-items: center; justify-content: space-between; padding: 12px 14px; cursor: pointer;}
#mgmtRoot .ccfg-name { font-size: 15px; font-weight: 600; color: #1f2329;}
#mgmtRoot .ccfg-meta { font-size: 12px; color: #8a919f; margin-top: 2px;}
#mgmtRoot .ccfg-cnt { font-size: 12px; color: #3f5a8a; white-space: nowrap;}
#mgmtRoot .ccfg-arw { color: #c0c4cc; margin-left: 4px;}
#mgmtRoot .ccfg-body { border-top: 1px solid #f0f1f3; padding: 2px 14px 10px;}
#mgmtRoot /* ⚠️ 2026-10-14 对齐修正：原来是 justify-content:space-between + 名字没 flex ⇒「已开」落在 133/147/235 三个位置（差 102px）。现在【状态定宽做第一列】， 名字 flex:1 吃中间，动作/锁靠右。 */ .ccfg-card { display: flex; align-items: center; gap: 8px; padding: 9px 0; border-bottom: 1px solid #f6f7f9;}
#mgmtRoot .ccfg-card:last-child { border-bottom: 0;}
#mgmtRoot .ccfg-cn { font-size: 14px; color: #1f2329;}
#mgmtRoot .ccfg-manual { font-style: normal; font-size: 11px; color: #ad6800; background: #fff7e6; border: 1px solid #ffe0a3; border-radius: 4px; padding: 0 4px; margin-left: 6px; vertical-align: 1px;}
#mgmtRoot .ccfg-ops { display: flex; align-items: center; gap: 5px; flex-shrink: 0;}
#mgmtRoot /* ⚠️ 跟 V2 那套对齐：描边 #e3e6ec / 主色藏蓝 #3f5a8a / 圆角 8px （原来用的是老的高饱和蓝 #3f5a8a + #e3e6ec + 6px —— 跟页面整体不是一套，奇威 2026-10-13 提的） */ .ccfg-btn { font-size: 12px; padding: 4px 11px; border: 1px solid #e3e6ec; background: #fff; color: #646a73; border-radius: 8px; cursor: pointer;}
#mgmtRoot .ccfg-btn.cur { background: #3f5a8a; border-color: #3f5a8a; color: #fff; font-weight: 600;}
#mgmtRoot .ccfg-card.is-basic .ccfg-cn { color: #b0b6c0;}
#mgmtRoot /* 主状态：绿=已开 / 灰=未开（2026-10-14 修「看不出开了哪些」） */ /* 状态列【定宽】—— 竖着对齐全靠它。宽 = 12px 内边距 + 2 个字（11.5px 字） */ .ccfg-state { flex: 0 0 46px; text-align: center; font-size: 11.5px; font-weight: 600;
                padding: 3px 0; border-radius: 6px; box-sizing: border-box;}
#mgmtRoot .ccfg-card .ccfg-cn { flex: 1; min-width: 0;}
#mgmtRoot /* 名字吃掉中间，把右边缘顶过去 */ .ccfg-card .ccfg-note { display: block; margin-left: 0;}
#mgmtRoot /* 「开通 = …」自己一行，别挤名字 */ .ccfg-state.on { background: #f0f9eb; color: #389e0d;}
#mgmtRoot .ccfg-state.off { background: #f2f3f5; color: #a3abb8;}
#mgmtRoot /* 没开的整行淡下去 —— 扫一眼就知道哪些是开的 */ .ccfg-card.is-off .ccfg-cn { color: #949aa6;}
#mgmtRoot .ccfg-card.is-basic.is-off .ccfg-cn { color: #c2c7d0;}
#mgmtRoot .ccfg-cnt b { font-weight: 700;}
#mgmtRoot .ccfg-hint b.ok { color: #389e0d; font-weight: 600;}
#mgmtRoot .ccfg-hint b.off { color: #a3abb8; font-weight: 600;}
#mgmtRoot .ccfg-lock { font-size: 11px; color: #b0b6c0; flex-shrink: 0; margin-left: auto;}
#mgmtRoot .ccfg-note { font-style: normal; font-size: 10.5px; color: #a3abb8; margin-left: 6px;}
#mgmtRoot /* ══ 异常货位（2026-10-17 奇威）══ 补货员到货位发现 空/货不对/堵住 → 点源货位旁的 ⚠ 标一下 → 推仓管 → 仓管处理完解除。 解除前：这个货位的【这款货】不再被列为取货源（后端 plan.py 排除，调度器同一套）。 */ .i-bad { flex: none; cursor: pointer; text-align: center; font-size: 12px; color: #c9ced8;}
#mgmtRoot .i-bad.on { color: #d4380d; font-weight: 700;}
#mgmtRoot .i-badp { margin: 5px 0 2px 26px; padding: 8px 10px; background: #fff7f5;
          border: 1px solid #ffd8cc; border-radius: 8px;}
#mgmtRoot .i-badp .ttl { font-size: 11.5px; color: #a13b1c; line-height: 1.55; margin-bottom: 7px;}
#mgmtRoot .i-badp .ttl code { font-family: ui-monospace, Consolas, Menlo, monospace; font-weight: 600;}
#mgmtRoot .i-badp .rs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 7px;}
#mgmtRoot .i-badp .rchip { padding: 4px 13px; border: 1px solid #ffd8cc; border-radius: 14px;
                 background: #fff; color: #a13b1c; font-size: 12.5px; cursor: pointer;}
#mgmtRoot .i-badp .rchip.sel { background: #d4380d; border-color: #d4380d; color: #fff; font-weight: 600;}
#mgmtRoot .i-badp .rnote { width: 100%; box-sizing: border-box; padding: 6px 8px; font-size: 12.5px;
                 border: 1px solid #ffd8cc; border-radius: 7px;}
#mgmtRoot .i-badp .rbtns { display: flex; gap: 8px; margin-top: 7px;}
#mgmtRoot .i-badp .rbtns button { flex: 1; padding: 8px; border: none; border-radius: 8px;
                        font-size: 13px; cursor: pointer;}
#mgmtRoot .i-badp .rok { background: #d4380d; color: #fff; font-weight: 600;}
#mgmtRoot .i-badp .rno { background: #f0f1f4; color: #5c6470;}
#mgmtRoot .i-slots .sl.bad em { color: #d4380d;}
#mgmtRoot .i-slots .sl .bi { font-style: normal; color: #d4380d; margin-left: 3px;}
#mgmtRoot .badrow { display: flex; align-items: baseline; gap: 8px; padding: 9px 0;
          border-top: 1px solid #f4f5f8; font-size: 12.5px;}
#mgmtRoot .badrow:first-of-type { border-top: 0;}
#mgmtRoot .badrow .bp { font-family: ui-monospace, Consolas, Menlo, monospace; font-weight: 600;
              color: #d4380d; white-space: nowrap;}
#mgmtRoot .badrow .br { padding: 0 7px; border-radius: 5px; background: #ffece8; color: #d4380d;
              font-size: 11.5px; white-space: nowrap;}
#mgmtRoot .badrow .bn { flex: 1; min-width: 0; color: #5c6470; overflow: hidden;
              text-overflow: ellipsis; white-space: nowrap;}
#mgmtRoot .badrow .bd { color: #9aa1ad; font-size: 11px; white-space: nowrap;}
#mgmtRoot .badrow .bx { padding: 4px 11px; border: 1px solid #0a8f4d; border-radius: 7px;
              background: #fff; color: #0a8f4d; font-size: 12px; cursor: pointer; white-space: nowrap;}
#mgmtRoot .badrow .bx:disabled { border-color: #c9ced8; color: #9aa1ad;}