/* ============================================================================
   甬标MES+ 数据链版 —— 设计系统
   工业风配色，沿用既有系统色板（--ind-*），零外部依赖（无 CDN / 无框架）
   ========================================================================== */
:root{
  --ind-steel:#16324f; --ind-steel-2:#1d4266; --ind-blue:#0b5fbf; --ind-blue-2:#0a4f9e;
  --ind-green:#157f45; --ind-red:#b42318; --ind-amber:#b45309; --ind-purple:#6d28d9;
  --ind-cyan:#0e7490; --ind-bg:#eef1f6; --ind-line:#dbe2ea; --ind-ink:#1f2a37;
  --ind-head:#f2f5f9; --ind-hover:#eef6ff; --ind-muted:#64748b; --ind-white:#fff;
  --ok:#157f45; --warn:#b45309; --err:#b42318; --info:#0b5fbf;
  --r:4px; --sh:0 1px 3px rgba(23,43,77,.08); --sh2:0 6px 24px rgba(23,43,77,.18);
  --hdr-h:46px; --tabs-h:34px; --foot-h:26px; --side-w:206px;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font-family:"Microsoft YaHei","Segoe UI",-apple-system,"PingFang SC",sans-serif;
  font-size:13px;color:var(--ind-ink);background:var(--ind-bg);-webkit-font-smoothing:antialiased}
a{color:var(--ind-blue);text-decoration:none}
a:hover{text-decoration:underline}
.hidden{display:none!important}
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-thumb{background:#c3ccd8;border-radius:5px}
::-webkit-scrollbar-thumb:hover{background:#a9b4c2}
::-webkit-scrollbar-track{background:transparent}

/* ---------------------------------------------------------------- 登录页 */
/* 登录页背景：工业钢材质感 + 紧固件工程蓝图（矢量 SVG，零依赖、离线可用） */
.login-wrap{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;
  background:url('/img/login-bg.svg') center center / cover no-repeat, #0a141d;z-index:50;padding:16px}
/* 中心压暗一点，保证白色登录卡片的对比度与可读性 */
.login-wrap::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse at 50% 46%, rgba(0,0,0,0) 30%, rgba(3,10,16,.55) 100%)}
.login-card{position:relative;z-index:1;width:400px;max-width:100%;background:#fff;border-radius:8px;border-top:3px solid #2f6f9e;
  box-shadow:0 18px 50px rgba(0,0,0,.32);padding:26px 28px 18px}
.login-brand{display:flex;gap:12px;align-items:center;margin-bottom:20px}
.login-brand h1{font-size:17px;margin:0 0 5px;color:var(--ind-steel)}
.login-brand .sub{font-size:11.5px;color:var(--ind-muted);margin:0;line-height:1.5}
.logo{width:46px;height:46px;border-radius:7px;background:var(--ind-steel);color:#fff;display:flex;
  align-items:center;justify-content:center;font-weight:700;font-size:17px;letter-spacing:.5px;flex:none}
.logo-sm{width:28px;height:28px;font-size:12px;border-radius:5px}
.tag-ver{font-size:10.5px;font-weight:400;color:#fff;background:var(--ind-blue);border-radius:3px;
  padding:1px 5px;margin-left:6px;vertical-align:middle}
.fld{display:block;margin-bottom:13px}
.fld>span{display:block;font-size:12px;color:var(--ind-muted);margin-bottom:5px}
.fld>span.req::after{content:" *";color:var(--err)}
input,select,textarea{width:100%;font-family:inherit;font-size:13px;color:var(--ind-ink);
  border:1px solid var(--ind-line);border-radius:var(--r);padding:7px 9px;background:#fff;outline:none;transition:.15s}
input:focus,select:focus,textarea:focus{border-color:var(--ind-blue);box-shadow:0 0 0 2px rgba(11,95,191,.14)}
input:disabled,select:disabled,textarea:disabled{background:#f6f8fa;color:#94a3b8;cursor:not-allowed}
textarea{resize:vertical;min-height:60px;line-height:1.6}
select{cursor:pointer}
.btn{font-family:inherit;font-size:13px;border:1px solid var(--ind-line);background:#fff;color:var(--ind-ink);
  border-radius:var(--r);padding:6px 14px;cursor:pointer;transition:.15s;white-space:nowrap}
.btn:hover{border-color:var(--ind-blue);color:var(--ind-blue);background:var(--ind-hover)}
.btn-primary{background:var(--ind-blue);border-color:var(--ind-blue);color:#fff}
.btn-primary:hover{background:var(--ind-blue-2);border-color:var(--ind-blue-2);color:#fff}
.btn-danger{color:var(--err);border-color:#f0c4c0}
.btn-danger:hover{background:#fdf2f1;border-color:var(--err);color:var(--err)}
.btn-ok{background:var(--ok);border-color:var(--ok);color:#fff}
.btn-ok:hover{background:#0f6234;border-color:#0f6234;color:#fff}
.btn-ghost{background:transparent;border-color:transparent;color:var(--ind-blue)}
.btn-ghost:hover{background:var(--ind-hover)}
.btn-sm{padding:3px 9px;font-size:12px}
.btn-xs{padding:1px 7px;font-size:11.5px;border-radius:3px}
.btn-block{width:100%;padding:9px;font-size:14px}
.btn:disabled{opacity:.55;cursor:not-allowed}
.login-err{color:var(--err);font-size:12px;min-height:17px;margin:-4px 0 8px}
.login-demo{margin-top:16px;border-top:1px dashed var(--ind-line);padding-top:11px}
.login-demo-title{font-size:11.5px;color:var(--ind-muted);margin-bottom:7px}
.login-demo-list{display:flex;flex-wrap:wrap;gap:5px}
.chip{font-size:11.5px;border:1px solid var(--ind-line);background:#f8fafc;border-radius:11px;
  padding:3px 9px;cursor:pointer;color:#475569;font-family:inherit;transition:.15s}
.chip:hover{border-color:var(--ind-blue);color:var(--ind-blue);background:var(--ind-hover)}
.login-foot{margin-top:14px;font-size:11px;color:#94a3b8;text-align:center}

/* ---------------------------------------------------------------- 布局 */
.app{display:flex;flex-direction:column;height:100vh;overflow:hidden}
.hdr{height:var(--hdr-h);background:var(--ind-steel);color:#fff;display:flex;align-items:center;
  padding:0 12px;gap:14px;flex:none;box-shadow:0 1px 4px rgba(0,0,0,.2);z-index:20}
.hdr-brand{display:flex;align-items:center;gap:8px;cursor:pointer;flex:none}
.hdr-name{font-size:14.5px;font-weight:600;letter-spacing:.3px;white-space:nowrap}
.hdr-nav{display:flex;gap:2px;flex:1;overflow-x:auto;scrollbar-width:none}
.hdr-nav::-webkit-scrollbar{display:none}
.hdr-nav button{font-family:inherit;font-size:13px;color:#c9d6e4;background:transparent;border:0;
  padding:6px 12px;border-radius:var(--r);cursor:pointer;white-space:nowrap;transition:.15s}
.hdr-nav button:hover{color:#fff;background:rgba(255,255,255,.1)}
.hdr-nav button.active{color:#fff;background:var(--ind-blue);font-weight:600}
.hdr-right{display:flex;align-items:center;gap:9px;flex:none}
.hdr-btn{font-family:inherit;font-size:12.5px;color:#c9d6e4;background:rgba(255,255,255,.08);border:0;
  padding:5px 10px;border-radius:var(--r);cursor:pointer;white-space:nowrap}
.hdr-btn:hover{background:rgba(255,255,255,.2);color:#fff}
.hdr-clock{font-size:12px;color:#9fb3c8;font-variant-numeric:tabular-nums;white-space:nowrap}
.hdr-user{display:flex;align-items:center;gap:7px;cursor:pointer;padding:4px 8px;border-radius:var(--r);
  background:rgba(255,255,255,.08);white-space:nowrap;position:relative}
.hdr-user:hover{background:rgba(255,255,255,.18)}
.hdr-user .av{width:21px;height:21px;border-radius:50%;background:var(--ind-blue);display:flex;
  align-items:center;justify-content:center;font-size:11px;font-weight:700;flex:none}
.hdr-user .nm{font-size:12.5px}
.tabsbar{height:var(--tabs-h);background:#fff;border-bottom:1px solid var(--ind-line);display:flex;
  align-items:flex-end;gap:2px;padding:0 10px;overflow-x:auto;scrollbar-width:none;flex:none}
.tabsbar::-webkit-scrollbar{display:none}
.tabsbar button{font-family:inherit;font-size:12.5px;color:#475569;background:transparent;border:0;
  border-bottom:2px solid transparent;padding:7px 12px 6px;cursor:pointer;white-space:nowrap}
.tabsbar button:hover{color:var(--ind-blue);background:var(--ind-hover)}
.tabsbar button.active{color:var(--ind-blue);border-bottom-color:var(--ind-blue);font-weight:600}
.main{flex:1;display:flex;min-height:0}
.side{width:var(--side-w);background:#fff;border-right:1px solid var(--ind-line);overflow-y:auto;
  flex:none;padding:8px 0}
.side-group{font-size:11px;color:#94a3b8;padding:9px 14px 5px;letter-spacing:.5px}
.side-item{display:flex;align-items:center;gap:8px;padding:7px 14px;font-size:13px;color:#334155;
  cursor:pointer;border-left:3px solid transparent;transition:.12s}
.side-item:hover{background:var(--ind-hover);color:var(--ind-blue)}
.side-item.active{background:var(--ind-hover);color:var(--ind-blue);border-left-color:var(--ind-blue);font-weight:600}
.side-item .ic{width:15px;text-align:center;font-size:13px;flex:none;opacity:.85}
.side-item .cnt{margin-left:auto;font-size:11px;background:#e2e8f0;color:#475569;border-radius:9px;padding:0 6px}
.content{flex:1;overflow-y:auto;padding:12px;min-width:0}
.foot{height:var(--foot-h);background:#fff;border-top:1px solid var(--ind-line);display:flex;
  align-items:center;justify-content:space-between;padding:0 12px;font-size:11px;color:#94a3b8;flex:none}

/* ---------------------------------------------------------------- 卡片/容器 */
.card{background:#fff;border:1px solid var(--ind-line);border-radius:var(--r);box-shadow:var(--sh);margin-bottom:12px}
.card-hd{display:flex;align-items:center;gap:9px;padding:9px 13px;border-bottom:1px solid var(--ind-line);
  background:linear-gradient(#fbfcfe,#f6f8fb);border-radius:var(--r) var(--r) 0 0;min-height:40px}
.card-hd h3{margin:0;font-size:13.5px;font-weight:600;color:var(--ind-steel);display:flex;align-items:center;gap:7px}
.card-hd h3::before{content:"";width:3px;height:13px;background:var(--ind-blue);border-radius:2px;flex:none}
.card-hd .sp{flex:1}
.card-bd{padding:12px 13px}
.card-bd.p0{padding:0}
.card-ft{padding:9px 13px;border-top:1px solid var(--ind-line);background:#fbfcfe}
.grid{display:grid;gap:12px}
.grid2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid4{grid-template-columns:repeat(4,minmax(0,1fr))}
/* grid5：5 个 KPI 一排铺满（附件包计划等页面用）。
   ⚠ 别漏定义：没有 grid-template-columns 时 .grid 只是 display:grid 的**单列**，
   卡片会竖着堆成 5 行，把下面的表格挤出屏幕。 */
.grid5{grid-template-columns:repeat(5,minmax(0,1fr))}
.grid6{grid-template-columns:repeat(6,minmax(0,1fr))}
@media(max-width:1400px){.grid6{grid-template-columns:repeat(4,minmax(0,1fr))}
  .grid5{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:1200px){.grid4,.grid3,.grid5{grid-template-columns:repeat(2,minmax(0,1fr))}
  .side{width:52px}.side-item span.tx,.side-group{display:none}.side-item{justify-content:center;padding:9px 0}}
@media(max-width:820px){.grid6,.grid5,.grid4,.grid3,.grid2{grid-template-columns:1fr}.content{padding:8px}}

/* ---------------------------------------------------------------- KPI */
.tile{background:#fff;border:1px solid var(--ind-line);border-radius:var(--r);padding:11px 13px;
  box-shadow:var(--sh);position:relative;overflow:hidden;min-width:0}
.tile::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--ind-blue)}
.tile.g::before{background:var(--ok)} .tile.r::before{background:var(--err)}
.tile.a::before{background:var(--ind-amber)} .tile.p::before{background:var(--ind-purple)}
.tile.c::before{background:var(--ind-cyan)} .tile.n::before{background:#94a3b8}
.tile .t-lb{font-size:11.5px;color:var(--ind-muted);margin-bottom:6px;display:flex;align-items:center;gap:5px}
.tile .t-v{font-size:23px;font-weight:700;color:var(--ind-steel);font-variant-numeric:tabular-nums;line-height:1.15;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tile .t-v small{font-size:11.5px;font-weight:400;color:var(--ind-muted);margin-left:3px}
.tile .t-s{font-size:11px;color:#94a3b8;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tile .t-v.g{color:var(--ok)} .tile .t-v.r{color:var(--err)} .tile .t-v.a{color:var(--ind-amber)}

/* ---------------------------------------------------------------- 表格 */
.tb-wrap{overflow:auto;max-width:100%;min-height:80px}
/* ★订单编辑器（销售订单 / 采购订单共用）的明细行区域：
   用户口径「明细行高度要增加」。做法不是写死一个高度（那样窗口一矮就把
   「合计 / ＋添加明细行 / 导入明细」挤出可视区，反而更难用），而是让明细行**吃掉弹窗的剩余高度**：
     · .oe-body 加在弹窗内容区上，竖向 flex 排列；
     · 表头 / 备注 保持自身高度，明细行 flex:1 撑满余下空间；
     · 行多时滚动发生在明细行**内部**（.tb-wrap 自带 overflow:auto），弹窗整体不滚，
       合计与按钮始终留在视野里。
   窗口特别矮时（如笔记本 150% 缩放）保留 220px 下限，超出部分由弹窗内容区自己滚。 */
.oe-body{display:flex;flex-direction:column}
.oe-lines{min-height:220px}
.oe-body>.oe-lines{flex:1 1 auto}
table.tb{width:100%;border-collapse:separate;border-spacing:0;font-size:12.5px}
table.tb th{background:var(--ind-head);color:#475569;font-weight:600;text-align:left;padding:7px 9px;
  border-bottom:1px solid var(--ind-line);white-space:nowrap;position:sticky;top:0;z-index:2}
table.tb th.sortable{cursor:pointer;user-select:none}
table.tb th.sortable:hover{color:var(--ind-blue);background:var(--ind-hover)}
table.tb th .ar{font-size:9px;color:var(--ind-blue);margin-left:3px}

/* 列宽拖拽手柄：贴在表头右边缘
 * 平时显示淡淡的竖线（让人看得出"这里能拖"），悬停/拖动时变蓝加粗 */
table.tb th.has-rs{position:relative}
table.tb th .col-rs{position:absolute;top:0;right:-4px;width:9px;height:100%;cursor:col-resize;z-index:4;
  background:transparent;border-radius:2px}
table.tb th .col-rs:hover{background:rgba(37,99,235,.10)}
table.tb th .col-rs::after{content:'';position:absolute;left:4px;top:20%;width:2px;height:60%;
  background:#dbe3ee;border-radius:1px;transition:background .12s,width .12s}
table.tb th .col-rs:hover::after{background:var(--ind-blue);width:3px}
body.col-resizing table.tb th .col-rs::after{background:var(--ind-blue);width:3px}
body.col-resizing{cursor:col-resize!important;user-select:none}
body.col-resizing *{cursor:col-resize!important}
/* 列表高度拖拽条 */
.tb-grip{height:9px;margin:2px 0 0;cursor:row-resize;display:flex;align-items:center;justify-content:center;
  border-radius:4px}
.tb-grip span{display:block;width:46px;height:4px;border-radius:2px;background:#dbe3ec;transition:.15s}
.tb-grip:hover span{background:var(--ind-blue);width:76px}
body.row-resizing{cursor:row-resize!important;user-select:none}
body.row-resizing *{cursor:row-resize!important}

/* 物料编码：蓝色可点，点击查看图纸 */
a.code-link{color:var(--ind-blue);font-weight:600;text-decoration:none;cursor:pointer;border-radius:3px;padding:1px 2px}
a.code-link:hover{text-decoration:underline;background:#eef6ff}
.dwg-flag{margin-left:4px;font-size:11px;opacity:.9;cursor:help}
.link-blue{color:var(--ind-blue)}
/* 图纸弹窗里的预览区 */
.dwg-box{background:#f8fafc;border:1px solid var(--ind-line);border-radius:6px;padding:22px 12px;text-align:center;color:#64748b}

/* 列设置面板：勾选显隐 + 拖动排序 */
.colset{margin:0 0 8px;border:1px solid var(--ind-line);border-radius:8px;background:#fff;box-shadow:var(--sh)}
/* ★表头允许整行换行，但「列设置」标题与提示文字各自不折行（原来 340px 宽时标题被拆成「列设/置」） */
.colset-hd{display:flex;align-items:center;flex-wrap:wrap;row-gap:4px;gap:4px;padding:7px 10px;border-bottom:1px solid var(--ind-line);
  white-space:nowrap;
  background:var(--ind-head);border-radius:8px 8px 0 0;font-size:12.5px}
.colset-bd{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:3px 10px;
  padding:9px 10px;max-height:262px;overflow:auto}
/* ★列设置项用**显式网格**：拖柄 | 序号 | 复选框 | 列名 各占一格。
   原来用 flex，压缩语义不稳 —— 会出现"列名跑到上一项、左列没名字、行高异常"的错位。 */
.colset-it{display:grid;grid-template-columns:14px 16px 16px minmax(0,1fr) auto auto;align-items:center;
  column-gap:6px;padding:3px 6px;border-radius:5px;cursor:pointer;
  font-size:12.5px;border:1px dashed transparent;min-width:0}
/* ★↑ ↓ 按钮：平时很淡，悬停该项时才明显，不抢视线 */
.colset-it .cs-mv{padding:0 4px;line-height:1.5;opacity:.35}
.colset-it:hover .cs-mv{opacity:1}
.colset-it:hover{background:var(--ind-hover)}
.colset-it.dragging{opacity:.4}
.colset-it.over{border-color:var(--ind-blue);background:#eef6ff}
.cs-grip{cursor:grab;color:#b6c2d1;font-size:11px;letter-spacing:-1px;user-select:none}
.cs-grip:active{cursor:grabbing}
/* ★带「⚙ 列」按钮的表格：顶部预留 21px 按钮带，按钮浮在带子里、不压表头文字。
   （原先是直接浮在表格右上角，列一多就盖住最右边的列名 —— 比如销售订单的「采购数」） */
/* ★「⚙ 列」按钮改成表格上方的右对齐小条（不在滚动容器里，横向滚动也不会跑位/压表头） */
.tb-colbar{display:flex;justify-content:flex-end;margin:0 0 2px}
/* 每张表的「⚙ 列」按钮：放在表格上方小条里，默认半透明，悬停才明显（不抢视线） */
.tb-colbtn{font-size:11px;line-height:1;
  padding:3px 7px;border:1px solid var(--ind-line);border-radius:5px;background:rgba(255,255,255,.92);
  color:#64748b;cursor:pointer;opacity:.35;transition:opacity .12s,color .12s}
.tb-colbar:hover .tb-colbtn,.tb-colbtn:hover,.tb-colbtn:focus{opacity:1;color:var(--ind-blue)}
/* ★列名占满剩余宽度（原来没有 flex:1，标签被挤到最右、早早被截断） */
/* 列名：占最后一格，放不下自己省略（不再参与 flex 压缩） */
.cs-lb{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.colset-it>input[type=checkbox]{margin:0;justify-self:center}
.colset-it>.cs-grip{justify-self:start}
table.tb td{padding:6px 9px;border-bottom:1px solid #eef2f7;vertical-align:middle}
/* 操作单元格：给一个下限宽度，避免被压得过窄；超出则换行，不横向溢出 */
table.tb td:has(> .ops){min-width:120px}
table.tb tbody tr:nth-child(even){background:#fafcfe}
table.tb tbody tr:hover{background:var(--ind-hover)}
table.tb td.tr,table.tb th.tr{text-align:right;font-variant-numeric:tabular-nums}
table.tb td.tc,table.tb th.tc{text-align:center}
/* 催货/紧急行：整行淡红（原来手写表格里是内联 style，改 MES.table 后用类） */
table.tb tbody tr.row-urgent{background:#fff5f5}
table.tb tbody tr.row-urgent:hover{background:#ffecec}
table.tb td.nm,table.tb th.nm{font-variant-numeric:tabular-nums}
table.tb tfoot td{background:#f6f8fb;font-weight:600;border-top:1px solid var(--ind-line)}
table.tb.compact td{padding:3px 7px;font-size:12px}
/* ★操作列：按钮多了**允许换行**（有些表的操作列有 8 个按钮位、含隐藏占位）。
   绝不能让它横向溢出 —— 溢出会向两侧撑出去，盖住相邻列、也让表头与数据行看起来错位。 */
table.tb .ops{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;row-gap:4px;min-width:0}
.row-sel{background:#e8f2ff!important}
.empty{padding:32px 12px;text-align:center;color:#94a3b8;font-size:13px}
.empty .ic{font-size:26px;display:block;margin-bottom:7px;opacity:.5}
.loading-box{padding:40px;text-align:center;color:var(--ind-muted)}
.spinner{width:26px;height:26px;border:3px solid var(--ind-line);border-top-color:var(--ind-blue);
  border-radius:50%;animation:spin .7s linear infinite;margin:0 auto 10px}
@keyframes spin{to{transform:rotate(360deg)}}
.sk{background:linear-gradient(90deg,#eef2f7 25%,#f7f9fc 50%,#eef2f7 75%);background-size:200% 100%;
  animation:sk 1.2s infinite;border-radius:3px;height:12px}
@keyframes sk{0%{background-position:200% 0}100%{background-position:-200% 0}}

/* ---------------------------------------------------------------- 徽标 */
.badge{display:inline-block;font-size:11px;line-height:17px;padding:0 7px;border-radius:9px;
  border:1px solid transparent;white-space:nowrap;vertical-align:middle}
.b-green{background:#e7f6ed;color:#0f6234;border-color:#b9e3cb}
.b-blue{background:#e8f2ff;color:#0a4f9e;border-color:#bcd9f7}
.b-orange{background:#fdf3e3;color:#8a4708;border-color:#f5d9a8}
.b-red{background:#fdecea;color:#9b1c13;border-color:#f6c9c4}
.b-gray{background:#f1f5f9;color:#475569;border-color:#dde4ec}
.b-purple{background:#f3e8ff;color:#5b21b6;border-color:#ddd0fb}
.b-cyan{background:#e0f2fe;color:#0e7490;border-color:#b6e3f0}
.dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:4px;vertical-align:middle}
.d-green{background:var(--ok)} .d-red{background:var(--err)} .d-orange{background:var(--ind-amber)}
.d-gray{background:#94a3b8} .d-blue{background:var(--ind-blue)}
@keyframes blink{50%{opacity:.25}}
.blink{animation:blink 1s infinite}

/* ---------------------------------------------------------------- 工具栏 / 分页 */
.toolbar{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:10px}
.toolbar .sp{flex:1}
.toolbar input,.toolbar select{width:auto;min-width:118px;padding:5px 8px;font-size:12.5px}
.toolbar input.search{min-width:210px}
.pg{display:flex;align-items:center;gap:6px;padding:9px 12px;font-size:12.5px;color:var(--ind-muted);
  border-top:1px solid var(--ind-line);background:#fbfcfe;flex-wrap:wrap}
.pg .sp{flex:1}
.pg button{min-width:28px;height:26px;border:1px solid var(--ind-line);background:#fff;border-radius:3px;
  cursor:pointer;font-size:12px;color:#475569;padding:0 7px;font-family:inherit}
.pg button:hover:not(:disabled){border-color:var(--ind-blue);color:var(--ind-blue)}
.pg button.active{background:var(--ind-blue);border-color:var(--ind-blue);color:#fff;font-weight:600}
.pg button:disabled{opacity:.45;cursor:not-allowed}

/* ---------------------------------------------------------------- 表单 */
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px}
.form-grid.c1{grid-template-columns:1fr}
.form-grid.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
/* ★6 格细网格（订单编辑器表头用）：字段按 span 数字占 2/3/4 格，一行能拼出不等宽的字段组合 */
.form-grid.c6{grid-template-columns:repeat(6,minmax(0,1fr))}
.form-grid .full{grid-column:1/-1}
.form-grid .s2{grid-column:span 2}
.form-grid .s3{grid-column:span 3}
.form-grid .s4{grid-column:span 4}
.form-grid .s5{grid-column:span 5}
/* 窄屏退化成 1 列：**必须把 span 一起复位**（grid-column:span 3 在单列网格里会生成隐式列，字段会挤出容器） */
@media(max-width:900px){
  .form-grid,.form-grid.c3,.form-grid.c6{grid-template-columns:1fr}
  .form-grid .s2,.form-grid .s3,.form-grid .s4,.form-grid .s5{grid-column:auto}
}
.sec-title{font-size:12.5px;font-weight:600;color:var(--ind-steel);margin:4px 0 10px;padding-left:8px;
  border-left:3px solid var(--ind-blue)}
.hint{font-size:11px;color:#94a3b8;margin-top:4px}
.err-txt{font-size:11.5px;color:var(--err);margin-top:4px}
.inline{display:flex;gap:6px;align-items:center}
.inline>input{flex:1}
.readonly-kv{display:grid;grid-template-columns:auto 1fr;gap:5px 12px;font-size:12.5px}
.readonly-kv .k{color:var(--ind-muted)}
.readonly-kv .v{font-weight:600;font-variant-numeric:tabular-nums}
.switch{position:relative;display:inline-block;width:38px;height:20px;flex:none}
.switch input{opacity:0;width:0;height:0}
.switch .sl{position:absolute;inset:0;background:#cbd5e1;border-radius:10px;cursor:pointer;transition:.2s}
.switch .sl::before{content:"";position:absolute;width:16px;height:16px;left:2px;top:2px;background:#fff;
  border-radius:50%;transition:.2s}
.switch input:checked+.sl{background:var(--ind-blue)}
.switch input:checked+.sl::before{transform:translateX(18px)}
.chk{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;cursor:pointer;user-select:none}
.chk input{width:auto;margin:0}

/* ---------------------------------------------------------------- 弹窗 */
.mask{position:fixed;inset:0;background:rgba(22,50,79,.45);z-index:100;display:flex;align-items:center;
  justify-content:center;padding:18px;animation:fade .13s}
@keyframes fade{from{opacity:0}}
.dlg{background:#fff;border-radius:6px;box-shadow:var(--sh2);width:640px;max-width:100%;max-height:92vh;
  display:flex;flex-direction:column;animation:pop .15s}
@keyframes pop{from{transform:translateY(-8px) scale(.99);opacity:.6}}
.dlg.w720{width:720px} .dlg.w860{width:860px} .dlg.w960{width:960px} .dlg.w1120{width:1120px} .dlg.w420{width:420px}
.dlg.w1360{width:1360px} .dlg.w1600{width:1600px}
.dlg.w420{width:420px} .dlg.w520{width:520px} .dlg.w560{width:560px} .dlg.w580{width:580px} .dlg.w620{width:620px} .dlg.w640{width:640px} .dlg.w680{width:680px} .dlg.w720{width:720px} .dlg.w760{width:760px} .dlg.w780{width:780px} .dlg.w860{width:860px} .dlg.w900{width:900px} .dlg.w940{width:940px} .dlg.w960{width:960px} .dlg.w980{width:980px} .dlg.w1000{width:1000px} .dlg.w1040{width:1040px} .dlg.w1100{width:1100px} .dlg.w1120{width:1120px} .dlg.w1360{width:1360px} .dlg.w1600{width:1600px}
/* 明细行里的物料信息列（只读，由选择的物料自动带出） */
.ln-mi{font-size:12px;color:#475569;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:220px}

/* ---------- 可搜索下拉（物料选择器 MES.picker） ---------- */
.pk{position:relative;display:flex;align-items:center;width:100%}
.pk-inp{width:100%;padding-right:20px}
.pk-caret{position:absolute;right:6px;color:#94a3b8;pointer-events:none;font-size:11px}
.pk-panel{position:fixed;z-index:3000;display:flex;flex-direction:column;background:#fff;
  border:1px solid #cbd5e1;border-radius:8px;box-shadow:0 14px 38px rgba(15,23,42,.18);overflow:hidden}
.pk-head{display:flex;justify-content:space-between;gap:12px;padding:5px 10px;background:#f8fafc;
  border-bottom:1px solid #eef2f6;font-size:11px;color:#64748b}
.pk-tip{white-space:nowrap}
.pk-list{overflow:auto;min-height:60px}
.pk-it{display:grid;grid-template-columns:126px minmax(120px,1fr) 78px 128px 88px 82px;gap:8px;
  padding:5px 10px;font-size:12px;cursor:pointer;border-bottom:1px solid #f6f8fa;align-items:center}
/* ★附加列（core.js MES.picker 的 extraCol，订单里选物料时显示「商品类型」）：网格多一列。
   加在末尾 —— 前 6 列与订单明细行的 名称/规格/型号/材质/表面处理 保持同一顺序，位置不乱。 */
.pk-extra-col .pk-it{grid-template-columns:126px minmax(120px,1fr) 78px 128px 88px 82px 60px}
.pk-it:last-child{border-bottom:0}
.pk-it:hover{background:#f1f5f9}
.pk-it.on{background:#e0edff;box-shadow:inset 2px 0 0 #2563eb}
.pk-code{font-family:ui-monospace,Consolas,Menlo,monospace;font-weight:600;color:#1e293b}
.pk-name{color:#334155;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pk-dim{color:#64748b;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pk-hl{background:#fff3bf;border-radius:2px}
.pk-empty{padding:18px;text-align:center;color:#94a3b8;font-size:12px}
/* ★「还有 N 项没显示」的提示条（物料 3000+ 条时只渲染前 200 条，避免输入发顿） */
.pk-more{padding:8px 14px;text-align:center;color:#64748b;font-size:12px;
  background:#f8fafc;border-top:1px dashed var(--ind-line);position:sticky;bottom:0}
.pk-grip{position:absolute;right:0;bottom:0;width:16px;height:16px;cursor:nwse-resize;
  background:linear-gradient(135deg,transparent 46%,#94a3b8 46%,#94a3b8 56%,transparent 56%,transparent 70%,#94a3b8 70%,#94a3b8 80%,transparent 80%)}
body.pk-resizing,body.pk-resizing *{cursor:nwse-resize !important;user-select:none}

.dlg-hd{display:flex;align-items:center;padding:11px 14px;border-bottom:1px solid var(--ind-line);
  background:linear-gradient(#fbfcfe,#f4f7fb);border-radius:6px 6px 0 0;flex:none}
.dlg-hd h3{margin:0;font-size:14px;color:var(--ind-steel);font-weight:600}
.dlg-hd .x{margin-left:auto;border:0;background:transparent;font-size:19px;line-height:1;color:#94a3b8;
  cursor:pointer;padding:0 3px}
.dlg-hd .x:hover{color:var(--err)}
.dlg-bd{padding:14px;overflow:auto;flex:1;min-height:0}
.dlg-bd.p0{padding:0}
.dlg-ft{display:flex;justify-content:flex-end;gap:8px;padding:10px 14px;border-top:1px solid var(--ind-line);
  background:#fbfcfe;border-radius:0 0 6px 6px;flex:none;position:sticky;bottom:0}
.dlg-ft .left{margin-right:auto;display:flex;gap:8px}
.drawer{position:fixed;top:0;right:0;bottom:0;width:1100px;max-width:96vw;background:#fff;z-index:101;
  box-shadow:-6px 0 24px rgba(23,43,77,.18);display:flex;flex-direction:column;animation:slide .18s}
.drawer.w760{width:760px} .drawer.w960{width:960px}
@keyframes slide{from{transform:translateX(100%)}}

/* ---------------------------------------------------------------- 标签页 / 树 / 步骤 */
.tabs{display:flex;gap:2px;border-bottom:1px solid var(--ind-line);margin-bottom:12px;overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tabs button{font-family:inherit;font-size:12.5px;border:0;background:transparent;padding:7px 12px 6px;
  border-bottom:2px solid transparent;cursor:pointer;color:#475569;white-space:nowrap}
.tabs button:hover{color:var(--ind-blue);background:var(--ind-hover)}
.tabs button.active{color:var(--ind-blue);border-bottom-color:var(--ind-blue);font-weight:600}
.tree{font-size:13px;user-select:none}
.tree-node{padding:4px 6px;border-radius:3px;cursor:pointer;display:flex;align-items:center;gap:6px}
.tree-node:hover{background:var(--ind-hover)}
.tree-node.active{background:var(--ind-hover);color:var(--ind-blue);font-weight:600}
.tree-children{margin-left:15px;border-left:1px dashed var(--ind-line);padding-left:6px}
.steps{display:flex;gap:0;flex-wrap:wrap}
.step{flex:1;min-width:112px;position:relative;padding:0 6px 0 16px;font-size:12px}
.step::before{content:"";position:absolute;left:0;top:4px;width:9px;height:9px;border-radius:50%;
  background:#fff;border:2px solid #cbd5e1}
.step::after{content:"";position:absolute;left:9px;top:8px;right:0;height:2px;background:#e2e8f0}
.step:last-child::after{display:none}
.step.done::before{background:var(--ok);border-color:var(--ok)}
.step.done::after{background:var(--ok)}
.step.cur::before{background:var(--ind-blue);border-color:var(--ind-blue);box-shadow:0 0 0 3px rgba(11,95,191,.18)}
.step .st{font-weight:600;color:#334155;font-size:12px;margin-bottom:2px}
.step .ss{color:#94a3b8;font-size:11px}

/* ---------------------------------------------------------------- 进度/时间线/告警 */
.progress{height:7px;background:#eef2f7;border-radius:4px;overflow:hidden;min-width:52px}
.progress>i{display:block;height:100%;background:var(--ind-blue);border-radius:4px;transition:width .3s}
.progress.g>i{background:var(--ok)} .progress.r>i{background:var(--err)} .progress.a>i{background:var(--ind-amber)}
.timeline{position:relative;padding-left:18px}
.timeline::before{content:"";position:absolute;left:5px;top:5px;bottom:5px;width:2px;background:var(--ind-line)}
.tl-item{position:relative;padding:0 0 13px 6px;font-size:12.5px}
.tl-item::before{content:"";position:absolute;left:-16px;top:4px;width:9px;height:9px;border-radius:50%;
  background:#fff;border:2px solid var(--ind-blue)}
.tl-item.ok::before{background:var(--ok);border-color:var(--ok)}
.tl-item.ng::before{background:var(--err);border-color:var(--err)}
.tl-item.warn::before{background:var(--ind-amber);border-color:var(--ind-amber)}
.tl-item .tt{color:#94a3b8;font-size:11px;font-variant-numeric:tabular-nums}
.tl-item .tc{color:var(--ind-ink);line-height:1.65}
.alert{border-radius:var(--r);padding:9px 12px;font-size:12.5px;border:1px solid;margin-bottom:10px;line-height:1.7}
.alert-info{background:#eff6ff;border-color:#bfdbfe;color:#1e40af}
.alert-warn{background:#fffbeb;border-color:#fde68a;color:#92400e}
.alert-err{background:#fef2f2;border-color:#fecaca;color:#991b1b}
.alert-ok{background:#f0fdf4;border-color:#bbf7d0;color:#166534}

/* 服务断开提示条（服务停了/重启中时显示一条，恢复后自动消失；避免控制台被重连日志刷屏） */
.srv-down{position:sticky;top:0;z-index:200;background:#fef2f2;color:#991b1b;border-bottom:1px solid #fecaca;
  padding:8px 14px;font-size:12.5px;font-weight:600;text-align:center}

/* ---------------------------------------------------------------- 看板 / 图表 */
.chart{width:100%;display:block;overflow:visible}
.chart text{font-size:10px;fill:#64748b;font-family:inherit}
.chart .axis{stroke:#e2e8f0;stroke-width:1}
.chart .grid-line{stroke:#f1f5f9;stroke-width:1}
.chart .bar{transition:.2s}
.chart .bar:hover{opacity:.82}
.legend{display:flex;gap:12px;flex-wrap:wrap;font-size:11.5px;color:#475569;margin-top:7px}
.legend i{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:4px}
.kanban{display:flex;gap:10px;overflow-x:auto;padding-bottom:6px;align-items:flex-start}
.kb-col{background:#f6f8fb;border:1px solid var(--ind-line);border-radius:var(--r);min-width:212px;flex:1;
  display:flex;flex-direction:column;max-height:calc(100vh - 250px)}
.kb-hd{padding:7px 11px;font-size:12.5px;font-weight:600;color:#334155;border-bottom:1px solid var(--ind-line);
  display:flex;align-items:center;gap:6px;background:#fff;border-radius:var(--r) var(--r) 0 0}
.kb-hd .cnt{background:#e2e8f0;border-radius:9px;padding:0 6px;font-size:11px;color:#475569;margin-left:auto}
.kb-bd{padding:8px;overflow-y:auto;display:flex;flex-direction:column;gap:7px;flex:1}
.kb-card{background:#fff;border:1px solid var(--ind-line);border-left:3px solid var(--ind-blue);border-radius:3px;
  padding:8px 9px;font-size:12px;box-shadow:var(--sh);cursor:pointer}
.kb-card:hover{border-color:var(--ind-blue);box-shadow:0 3px 10px rgba(11,95,191,.14)}
.kb-card .kt{font-weight:600;color:var(--ind-steel);margin-bottom:4px;display:flex;gap:6px;align-items:center}
.kb-card .km{color:#64748b;font-size:11.5px;line-height:1.65}
.kb-card.pri-h{border-left-color:var(--ind-amber)} .kb-card.pri-u{border-left-color:var(--err)}
.gauge-wrap{display:flex;flex-direction:column;align-items:center;gap:2px}

/* ---------------------------------------------------------------- 提示 */
.toast-root{position:fixed;top:14px;right:14px;z-index:300;display:flex;flex-direction:column;gap:8px;pointer-events:none}
.toast{background:#fff;border-left:4px solid var(--ind-blue);border-radius:var(--r);box-shadow:var(--sh2);
  padding:10px 14px;font-size:13px;min-width:218px;max-width:380px;animation:tin .18s;pointer-events:auto}
@keyframes tin{from{transform:translateX(30px);opacity:0}}
.toast.ok{border-left-color:var(--ok)} .toast.err{border-left-color:var(--err)}
.toast.warn{border-left-color:var(--ind-amber)}
.toast .tt{font-weight:600;margin-bottom:2px;font-size:12.5px}
.toast .tm{color:#475569;line-height:1.6;word-break:break-all}
.tip{position:relative;cursor:help;border-bottom:1px dotted #94a3b8}

/* ---------------------------------------------------------------- 工具类 */
.flex{display:flex}.between{display:flex;align-items:center;justify-content:space-between}
.center{display:flex;align-items:center;justify-content:center}
.wrap{flex-wrap:wrap}.col{flex-direction:column}
.gap4{gap:4px}.gap6{gap:6px}.gap8{gap:8px}.gap12{gap:12px}.gap16{gap:16px}
.mt4{margin-top:4px}.mt8{margin-top:8px}.mt12{margin-top:12px}.mt16{margin-top:16px}
.mb0{margin-bottom:0}.mb4{margin-bottom:4px}.mb8{margin-bottom:8px}.mb12{margin-bottom:12px}
.ml4{margin-left:4px}.ml8{margin-left:8px}.mlauto{margin-left:auto}
.muted{color:var(--ind-muted)}.faint{color:#94a3b8}
.small{font-size:11.5px}.tiny{font-size:11px}.big{font-size:15px}.b{font-weight:600}
.ok{color:var(--ok)}.warn{color:var(--ind-amber)}.err{color:var(--err)}.info{color:var(--ind-blue)}
.mono{font-family:Consolas,"Courier New",monospace}

/* BOM 展开清单：父级物料（成品/半成品）蓝色加粗，子级用料保持黑色 —— 一眼看出哪些是要做的、哪些是备料的 */
.bom-lv0{color:var(--ind-blue);font-weight:600}
.bom-lv0 .mono,.bom-lv0 .faint{color:inherit}
.bom-lvn{color:var(--ind-ink)}
.num{font-variant-numeric:tabular-nums}
.nowrap{white-space:nowrap}
.ellip{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.scroll-y{overflow-y:auto}
.pre{white-space:pre-wrap;word-break:break-word;font-family:Consolas,monospace;font-size:12px;line-height:1.65}
.hr{height:1px;background:var(--ind-line);margin:10px 0;border:0}
.pill{display:inline-flex;align-items:center;gap:4px;background:#f1f5f9;border-radius:11px;padding:2px 9px;font-size:11.5px;color:#475569}
.barcode{font-family:Consolas,monospace;letter-spacing:1px;font-size:11.5px;background:#f8fafc;
  border:1px dashed var(--ind-line);border-radius:3px;padding:2px 6px}
@media print{.hdr,.tabsbar,.side,.foot,.toolbar,.card-hd .btn{display:none!important}
  body{background:#fff}.content{padding:0;overflow:visible}.app{height:auto;overflow:visible}}

/* 「数据来源」说明条：把每个字段的来路写清楚，避免"这数从哪来的"要靠猜 */
.src-note{background:#f7f9fc;border:1px solid var(--ind-line);border-left:3px solid var(--ind-blue);
  border-radius:5px;padding:7px 11px;font-size:12px;color:var(--ind-muted);line-height:1.9}
.src-note b{color:var(--ind-ink)}
.src-note span{display:inline-block;margin-right:14px;white-space:nowrap}
.src-note i{font-style:normal;color:var(--ind-blue);font-weight:600}

/* ============ 打印 / 导出 PDF（对账单等单据） ============
   点「导出 PDF」时 body 加 .printing → 只显示 #printRoot 里的 .print-area，
   浏览器打印对话框选「另存为 PDF」即可（零依赖，不装 PDF 库）。 */
#printRoot{display:none}
@media print{
  body.printing>*{display:none !important}
  body.printing #printRoot{display:block !important}
  body.printing{background:#fff}
  /* ★默认纸张 = A4 横向（送货单/采购单）。
     标签打印时 setPrintPaper() 会插一条更靠后的 @page{size:Wmm Hmm} 覆盖它 ——
     两条同名规则按"后出现者优先"，所以不能删这里，只能靠后来居上。 */
  @page{size:A4 landscape;margin:10mm}
}
.print-area{background:#fff;color:#000;font-size:12px;padding:6px 4px;line-height:1.5}
.print-area .pa-head{display:flex;align-items:flex-start;gap:16px;border-bottom:2px solid #000;padding-bottom:8px;margin-bottom:10px}
.print-area .pa-co{font-size:13px;line-height:1.4}
.print-area .pa-title{flex:1;text-align:center;font-size:20px;font-weight:700;letter-spacing:6px;padding-top:4px}
.print-area .pa-meta{font-size:11px;text-align:right;line-height:1.6;min-width:210px}
.print-area table.pa-kv{width:100%;border-collapse:collapse;margin-bottom:10px}
.print-area table.pa-kv th{width:88px;text-align:left;font-weight:400;background:#f2f2f2;border:1px solid #999;padding:4px 6px;font-size:11px}
.print-area table.pa-kv td{border:1px solid #999;padding:4px 6px}
.print-area table.pa-tb{width:100%;border-collapse:collapse}
.print-area table.pa-tb th{border:1px solid #666;background:#eaeaea;padding:4px 5px;font-size:11px;font-weight:600;text-align:left}
.print-area table.pa-tb td{border:1px solid #666;padding:3px 5px;font-size:11px}
.print-area table.pa-tb .tr{text-align:right} .print-area table.pa-tb .tc{text-align:center}
.print-area table.pa-tb .mono{font-family:Consolas,"Courier New",monospace}
.print-area table.pa-tb tfoot td{font-weight:700;background:#f7f7f7}
.print-area .pa-sign{display:flex;justify-content:space-between;gap:20px;margin-top:26px;padding-top:8px;font-size:12px}
.print-area .pa-foot{margin-top:14px;color:#444;text-align:center;font-size:10px}
.print-area .small{font-size:10px;color:#555}
/* 一次打印多张单据时的分页符（如：发货计划 → 打印送货单，一张一页） */
.print-brk{page-break-after:always;break-after:page}
@media print{ .print-area:last-of-type .pa-foot{margin-bottom:0} }

/* ============================================================================
 * 标签打印（得力 DL-888B / TSC-TSPL 等市面热敏标签机）
 *   尺寸一律用毫米、1:1 出图；打印时由 setPrintPaper() 把 @page 改成标签实际尺寸。
 *   热敏机是单色，所以只用黑白、不用灰底 —— 灰底会打出脏点。
 * ========================================================================== */
.label-area{background:#fff;color:#000;box-sizing:border-box;overflow:hidden;
  display:flex;flex-direction:column;line-height:1.25;font-family:"Microsoft YaHei",SimSun,sans-serif}
.label-area .lbl-hd{text-align:center;font-weight:700;letter-spacing:1px;border-bottom:0.2mm solid #000;
  padding-bottom:0.4mm;margin-bottom:0.6mm;white-space:nowrap;overflow:hidden}
.label-area .lbl-bd{flex:1;min-height:0;overflow:hidden}
/* ★标签内容要「显示完整」（用户口径 2026-10：按 80*60 显示完整）——
   原来是单行 nowrap + ellipsis：物料名称稍长就被截成"碳钢4.8级GB845F…" ✗。
   现在允许值折行（最多 2 行），长名称完整看得见；盒子本身仍 overflow:hidden 兜底。 */
.label-area .lbl-f{display:flex;gap:1mm;align-items:baseline;white-space:normal;overflow:hidden}
.label-area .lbl-k{color:#000;opacity:.72;flex:0 0 auto}
.label-area .lbl-k::after{content:":"}
.label-area .lbl-v{font-weight:600;flex:1;min-width:0;overflow:hidden;word-break:break-word;
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2}
.label-area .lbl-code{margin-top:0.6mm;flex:0 0 auto;text-align:center}
.label-area .lbl-bc{display:flex;align-items:stretch;width:100%;background:#fff}
.label-area .lbl-bc i{display:block}
.label-area .lbl-bct{font-family:Consolas,monospace;letter-spacing:.3px;text-align:center;padding-top:0.2mm}
.label-area .lbl-qr{border:0.2mm solid #000;display:flex;align-items:center;justify-content:center;
  text-align:center;font-size:5pt;padding:0.5mm;box-sizing:border-box;overflow:hidden;margin:0 auto}
/* 一张标签一页：标签机必须一张一停，否则会连续走纸（最后一张不分页，避免空走） */
.label-brk{page-break-after:always;break-after:page}
@media print{ .label-brk:last-child{page-break-after:auto;break-after:auto} }

/* ============================================================================
 * 站内即时沟通（类微信）—— 入口图标 + 悬浮面板
 * ========================================================================== */
.hdr-btn { position: relative; }
.im-dot {
  position: absolute; top: -6px; right: -6px; min-width: 16px; height: 16px; padding: 0 4px;
  border-radius: 9px; background: #e5484d; color: #fff; font-size: 11px; line-height: 16px;
  text-align: center; font-style: normal; box-shadow: 0 0 0 2px var(--bg, #fff);
}
/* ⚠ 层级：必须低于弹窗(.mask=100)与抽屉(.drawer=101)，否则从面板里弹出的对话框会被面板压住 */
.im-root { position: fixed; right: 18px; bottom: 18px; z-index: 90; }
.im-root.hidden { display: none; }
.im-panel {
  width: 780px; max-width: 94vw; height: 540px; max-height: 78vh; display: flex; flex-direction: column;
  background: var(--panel, #fff); border: 1px solid var(--line, #e3e6ea); border-radius: 10px;
  box-shadow: 0 12px 40px rgba(15, 23, 42, .18); overflow: hidden;
}
.im-head {
  display: flex; align-items: center; gap: 8px; padding: 8px 12px;
  border-bottom: 1px solid var(--line, #e3e6ea); background: #f7f9fb;
}
.im-body { flex: 1; display: flex; min-height: 0; }
.im-side { width: 270px; border-right: 1px solid var(--line, #e3e6ea); display: flex; flex-direction: column; min-height: 0; }
.im-tabs { display: flex; border-bottom: 1px solid var(--line, #e3e6ea); }
.im-tab {
  flex: 1; padding: 7px 0; border: 0; background: transparent; cursor: pointer;
  font-size: 13px; color: var(--muted, #6b7280);
}
.im-tab.active { color: var(--blue, #2563eb); font-weight: 600; box-shadow: inset 0 -2px 0 var(--blue, #2563eb); }
.im-list { flex: 1; overflow-y: auto; min-height: 0; }
.im-empty { padding: 24px 16px; text-align: center; color: var(--muted, #9aa4b2); font-size: 13px; }
.im-dept { padding: 6px 12px; font-size: 12px; color: var(--muted, #6b7280); background: #fafbfc; }
.im-conv { display: flex; gap: 8px; padding: 8px 12px; cursor: pointer; border-bottom: 1px solid #f1f3f5; }
.im-conv:hover { background: #f7f9fb; }
.im-conv.active { background: #eef4ff; }
.im-conv-bd { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.im-conv-name { font-size: 13px; }
.im-conv-last { font-size: 12px; color: var(--muted, #6b7280); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.im-avatar {
  position: relative; width: 34px; height: 34px; flex: 0 0 34px; border-radius: 8px; background: #dbe6ff;
  color: #1f4bd8; display: flex; align-items: center; justify-content: center; font-weight: 600; font-size: 14px;
}
.im-avatar.grp { background: #e6f6ec; color: #16794c; }
.im-avatar.sm { width: 28px; height: 28px; flex: 0 0 28px; font-size: 12px; border-radius: 6px; }
.im-od { position: absolute; right: -2px; bottom: -2px; width: 9px; height: 9px; border-radius: 50%; background: #cbd5e1; box-shadow: 0 0 0 2px #fff; }
.im-od.on { background: #22c55e; }
.im-badge {
  min-width: 16px; height: 16px; padding: 0 4px; border-radius: 9px; background: #e5484d; color: #fff;
  font-size: 11px; line-height: 16px; text-align: center; font-style: normal;
}
.im-main { flex: 1; display: flex; flex-direction: column; min-width: 0; min-height: 0; }
.im-title { padding: 8px 12px; border-bottom: 1px solid var(--line, #e3e6ea); font-size: 13px; background: #fcfdfe; }
.im-msgs { flex: 1; overflow-y: auto; padding: 12px; background: #f7f9fb; min-height: 0; }
.im-sys { text-align: center; margin: 8px 0; font-size: 12px; color: var(--muted, #9aa4b2); }
.im-row { display: flex; gap: 8px; margin-bottom: 12px; }
.im-row.me { flex-direction: row-reverse; }
.im-bubble-wrap { max-width: 74%; }
.im-who { font-size: 12px; color: var(--muted, #6b7280); margin-bottom: 2px; }
.im-row.me .im-who { text-align: right; }
.im-bubble {
  background: #fff; border: 1px solid var(--line, #e6e9ee); border-radius: 8px; padding: 7px 10px;
  font-size: 13px; line-height: 1.55; word-break: break-word; white-space: pre-wrap;
}
.im-row.me .im-bubble { background: #d9f7be; border-color: #b7eb8f; }
.im-at { background: #fff1f0; color: #cf1322; font-size: 11px; font-style: normal; padding: 0 4px; border-radius: 4px; margin-left: 4px; }
.im-card {
  margin-top: 6px; border: 1px solid var(--blue, #bfd3ff); background: #f5f8ff; border-radius: 6px;
  padding: 8px 10px; cursor: pointer; min-width: 200px;
}
.im-card:hover { background: #eaf1ff; }
.im-card-h { display: flex; justify-content: space-between; font-size: 12px; color: var(--muted, #4b5563); }
.im-card-t { font-size: 13px; font-weight: 600; margin: 2px 0; }
.im-card-go { color: var(--blue, #2563eb); }
.im-compose { border-top: 1px solid var(--line, #e3e6ea); padding: 8px 12px; background: #fff; }
.im-compose textarea {
  width: 100%; resize: vertical; border: 1px solid var(--line, #d9dee5); border-radius: 6px;
  padding: 6px 8px; font-size: 13px; font-family: inherit;
}
.im-compose textarea:focus { outline: none; border-color: var(--blue, #2563eb); }

/* ---- AI 助手在会话里的样式 ---- */
.im-avatar.ai { background: #ede9fe; color: #6d28d9; font-size: 15px; }
.im-bubble.bot { background: #f6f4ff; border-color: #ddd6fe; }
.im-bot { background: #ede9fe; color: #6d28d9; font-size: 11px; font-style: normal; padding: 0 4px; border-radius: 4px; margin-left: 4px; }
.im-sugg { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 0 10px 0; }
.im-sugg .btn { background: #fff; border: 1px dashed #c7d2fe; color: #3b5bdb; }
.im-sugg .btn:hover { background: #eef2ff; }

/* ---- 沟通里的图片与文件 ---- */
.im-imgwrap { display: flex; flex-direction: column; gap: 4px; }
.im-img {
  max-width: 260px; max-height: 200px; border-radius: 6px; border: 1px solid var(--line, #e3e6ea);
  cursor: zoom-in; background: #fff; display: block;
}
.im-img:hover { border-color: var(--blue, #2563eb); }
.im-file {
  display: flex; align-items: center; gap: 8px; text-decoration: none; color: inherit;
  border: 1px solid var(--line, #e3e6ea); border-radius: 6px; padding: 8px 10px; background: #fff; min-width: 190px;
}
.im-file:hover { border-color: var(--blue, #2563eb); background: #f8faff; }
.im-file-ico { font-size: 20px; line-height: 1; }
.im-file-bd { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.im-file-bd b { font-size: 13px; word-break: break-all; }

/* 工作台 · 全局数字化中心：模块卡片内的指标网格 */
.ct-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px;margin-top:10px}
.ct-it{border-left:3px solid var(--ind-line);padding-left:8px}
.ct-lb{font-size:12px;color:var(--ind-muted)}
.ct-v{font-size:17px;font-weight:600;line-height:1.3}
.ct-card{transition:box-shadow .15s,transform .15s}
.ct-card:hover{box-shadow:0 4px 14px rgba(0,0,0,.08);transform:translateY(-1px)}
.grid7{display:grid;grid-template-columns:repeat(7,1fr);gap:10px}
@media(max-width:1500px){.grid7{grid-template-columns:repeat(4,1fr)}}

/* 数字化看板中心：页签 / 排行条 / 两栏 */
.kb-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px;border-bottom:1px solid var(--ind-line);padding-bottom:8px}
.kb-tab{border:1px solid transparent;background:transparent;color:var(--ind-muted);font-size:13.5px;padding:6px 14px;border-radius:16px;cursor:pointer}
.kb-tab:hover{background:#eef6ff;color:var(--ind-steel)}
.kb-tab.on{background:#1d9bf0;color:#fff;font-weight:600}
.kb-two{display:grid;grid-template-columns:1.15fr 1fr;gap:12px;margin-top:12px}
@media(max-width:1200px){.kb-two{grid-template-columns:1fr}}
.kb-top{margin-bottom:10px}
.kb-top-h{display:flex;justify-content:space-between;font-size:12.5px;margin-bottom:4px}
.kb-bar{height:10px;background:#eef2f6;border-radius:5px;overflow:hidden}
.kb-bar i{display:block;height:100%;background:linear-gradient(90deg,#38bdf8,#0ea5e9);border-radius:5px}

/* ★合并派单：与已选物料不同的行，复选框标个淡红底 —— 提示"这行不能跟已选的合并"。
   注意**不禁用**它：禁用后用户点了没反应也不知道原因，保持可点、由脚本当场提示。 */
input.wo-mk-bad{outline:1px solid #fca5a5;background:#fef2f2;border-radius:3px}
input.wo-mk-bad:hover{outline-color:#ef4444}

/* ★勾选框旁边的飘屏提示：0.5 秒漂一下就没（用户口径：显示在勾选框那里，别放在按钮旁边） */
.merge-float-tip{position:fixed;z-index:9999;pointer-events:none;white-space:nowrap;
  background:#ef4444;color:#fff;font-size:12px;line-height:1.6;padding:2px 8px;border-radius:4px;
  box-shadow:0 2px 8px rgba(239,68,68,.35);animation:mergeFloatUp .5s ease-out forwards}
@keyframes mergeFloatUp{
  0%{opacity:0;transform:translateY(5px) scale(.96)}
  25%{opacity:1;transform:translateY(0) scale(1)}
  100%{opacity:0;transform:translateY(-16px) scale(1)}
}