:root {
  --primary: #EA580C;
  --primary-2: #F97316;
  --primary-light: #FFF7ED;
  --sidebar-from: #1F2937;
  --sidebar-to: #4B5563;
  --bg: #F3F4F6;
  --card: rgba(255,255,255,0.92);
  --card-solid: #FFFFFF;
  --text: #111827;
  --text-2: #4B5563;
  --border: #E5E7EB;
  --danger: #DC2626;
  --danger-light: #FEF2F2;
  --success: #059669;
  --success-light: #ECFDF5;
  --warn: #D97706;
  --shadow: 0 10px 25px -5px rgba(0,0,0,0.08), 0 8px 10px -6px rgba(0,0,0,0.05);
  /* v3.50 轻量化：卡片用极淡描边 + 很轻的阴影（弹窗/提示仍用 --shadow，保证浮层有层次） */
  --shadow-card: 0 1px 2px rgba(16,24,40,0.04), 0 1px 3px rgba(16,24,40,0.05);
  --shadow-card-hover: 0 4px 14px -2px rgba(16,24,40,0.08);
  /* 背景极淡的主题色晕染（4% 透明度，只为去掉"死平"，几乎看不出来） */
  --bg-tint: rgba(234,88,12,0.040);
  /* v3.57 与 --primary-light 配套的描边色（原来写死橙色，换蓝/青/灰主题时浅底配橙边，很不协调） */
  --primary-border: #FED7AA;
  --radius: 14px;
  --sidebar-w: 220px;
}
[data-theme="blue"] { --primary: #2563EB; --primary-2: #3B82F6; --primary-light: #EFF6FF; --bg-tint: rgba(37,99,235,0.040); --primary-border: #BFDBFE; }
[data-theme="cyan"] { --primary: #0891B2; --primary-2: #06B6D4; --primary-light: #ECFEFF; --bg-tint: rgba(8,145,178,0.040); --primary-border: #A5F3FC; }
[data-theme="gray"] { --primary: #4B5563; --primary-2: #6B7280; --primary-light: #F9FAFB; --bg-tint: rgba(75,85,99,0.035); --primary-border: #D1D5DB; }
* { box-sizing: border-box; }
html, body { height: 100%; }
body {
  margin: 0; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "PingFang SC", "Microsoft YaHei", sans-serif;
  color: var(--text); font-size: 14px;
  background-color: var(--bg);
  /* 极淡主题色晕染（顶部偏左），去掉纯色底的"死平"感；固定不随滚动 */
  background-image: radial-gradient(1180px 340px at 14% -10%, var(--bg-tint), transparent 62%);
  background-attachment: fixed;
}
.app { display: flex; height: 100vh; overflow: hidden; }
.sidebar {
  width: var(--sidebar-w); flex-shrink: 0;
  background: linear-gradient(180deg, var(--sidebar-from), var(--sidebar-to));
  color: #fff; display: flex; flex-direction: column; position: fixed; height: 100vh; left: 0; top: 0; z-index: 100;
  box-shadow: 4px 0 20px rgba(0,0,0,0.15);
}
.brand { padding: 17px 16px; border-bottom: 1px solid rgba(255,255,255,0.08); display: flex; align-items: center; gap: 10px; }
.brand-title { font-size: 17px; font-weight: 700; letter-spacing: 1.6px; line-height: 1; }
/* v3.50 方案 A：矢量标识，26px，与文字同一行 */
.brand-mark { width: 26px; height: 26px; flex-shrink: 0; display: block; }
.logo-img { display: block; }
.logo-img-sidebar { width: 160px; height: auto; align-self: flex-start; }
.nav { flex: 1; overflow-y: auto; padding: 10px 0; }
.nav-item { display: flex; align-items: center; gap: 12px; padding: 13px 18px; margin: 2px 10px; border-radius: 10px; cursor: pointer; opacity: 0.82; transition: all .15s; position: relative; }
.nav-item:hover { background: rgba(255,255,255,0.08); opacity: 1; }
.nav-item.active { background: rgba(255,255,255,0.14); opacity: 1; }
.nav-item.active::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 3px; height: 18px; background: var(--primary-2); border-radius: 0 3px 3px 0; }
.nav-icon { width: 22px; height: 22px; fill: currentColor; flex-shrink: 0; }
.nav-text { font-weight: 500; }
.sidebar-footer { padding: 14px; border-top: 1px solid rgba(255,255,255,0.08); font-size: 11px; opacity: 0.55; text-align: center; line-height: 1.6; }
.sidebar-footer a { color: inherit; text-decoration: none; }
.sidebar-footer a:hover { text-decoration: underline; }
/* 备案号（登录页底部）：工信部要求网站底部必须展示并链接到 beian.miit.gov.cn */
.icp-line { position: absolute; left: 0; right: 0; bottom: 14px; text-align: center; font-size: 12px; z-index: 2; }
.icp-line a { color: rgba(255,255,255,0.72); text-decoration: none; letter-spacing: 0.3px; }
.icp-line a:hover { color: #fff; text-decoration: underline; }
.main { margin-left: var(--sidebar-w); flex: 1; display: flex; flex-direction: column; min-width: 0; }
.topbar { height: 64px; background: var(--card); backdrop-filter: blur(12px); border-bottom: 1px solid var(--border); display: flex; align-items: center; justify-content: space-between; padding: 0 24px; position: sticky; top: 0; z-index: 50; }
.page-title { font-size: 18px; font-weight: 700; color: var(--text); display: flex; align-items: center; gap: 10px; }
/* v3.50 标题左侧主题色小竖条：让眼睛有落点，避免顶栏"空飘" */
.page-title::before { content: ""; width: 3px; height: 17px; border-radius: 2px; background: var(--primary); flex-shrink: 0; }
.topbar-right { display: flex; align-items: center; gap: 16px; }
.theme-switch { display: flex; gap: 8px; }
.theme-dot { width: 22px; height: 22px; border-radius: 50%; cursor: pointer; border: 2px solid transparent; box-shadow: inset 0 0 0 1px rgba(0,0,0,0.08); }
.theme-dot.active { border-color: var(--text); transform: scale(1.1); }
.theme-dot.orange { background: linear-gradient(135deg, #EA580C, #F97316); }
.theme-dot.blue { background: linear-gradient(135deg, #2563EB, #3B82F6); }
.theme-dot.cyan { background: linear-gradient(135deg, #0891B2, #06B6D4); }
.theme-dot.gray { background: linear-gradient(135deg, #4B5563, #9CA3AF); }
.content { flex: 1; overflow-y: auto; padding: 22px 24px; }
.page { display: none; animation: fade .2s ease; }
.page.active { display: block; }
@keyframes fade { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
.grid { display: grid; gap: 22px; }
.grid-4 { grid-template-columns: repeat(4, 1fr); }
/* v3.46 5 个统计卡（看板单仓概览：库存数量/金额/今日出库/今日退货/低库存） */
.grid-5 { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-2 { grid-template-columns: repeat(2, 1fr); }
.card { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-card); padding: 18px; transition: box-shadow .18s ease, border-color .18s ease; }
/* v3.50 轻量化：阴影只在鼠标移上来时微微加深，静态时很平 */
.card:hover { box-shadow: var(--shadow-card-hover); border-color: #DDE1E7; }
.card-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.card-title { font-size: 15px; font-weight: 700; color: var(--text); display: flex; align-items: center; gap: 8px; }
.card-title svg { width: 18px; height: 18px; fill: var(--primary); }
.stat-value { font-size: 28px; font-weight: 800; color: var(--primary); margin-top: 4px; }
.stat-label { font-size: 12px; color: var(--text-2); margin-top: 4px; }
.stat-value.danger { color: var(--danger); }
.kpi-sub { font-size: 12px; color: var(--text-2); margin-top: 6px; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 8px 14px; border-radius: 8px; border: none; font-size: 13px; font-weight: 600; cursor: pointer; transition: all .12s; background: var(--primary); color: #fff; }
.btn:hover { filter: brightness(1.08); transform: translateY(-1px); }
.btn:active { transform: translateY(0); }
.btn:disabled { opacity: .45; cursor: not-allowed; transform: none; filter: none; }
/* v3.50 轻量化：次要按钮改成"浅底 + 细描边"，hover 才染主题色（主按钮保持橙色实心不变） */
.btn-secondary { background: var(--card-solid); color: var(--text); border: 1px solid var(--border); }
.btn-secondary:hover { background: var(--primary-light); border-color: var(--primary); color: var(--primary); }
/* v3.50 轻量化：危险按钮改成"浅红底 + 红字"，一列下来不再是一排实心红块；hover 才变实心 */
.btn-danger { background: var(--danger-light); color: var(--danger); border: 1px solid #FECACA; }
.btn-danger:hover { background: var(--danger); color: #fff; border-color: var(--danger); }
.btn-success { background: var(--success); }
.btn-sm { padding: 5px 10px; font-size: 12px; }
.btn-group { display: flex; gap: 8px; flex-wrap: wrap; }
.toolbar { display: flex; gap: 10px; align-items: center; justify-content: space-between; margin-bottom: 14px; flex-wrap: wrap; }
.toolbar-left, .toolbar-right { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.seg { display: inline-flex; background: var(--bg); border: 1px solid var(--border); border-radius: 8px; padding: 3px; }
.seg-btn { border: none; background: transparent; padding: 6px 14px; border-radius: 6px; font-size: 13px; font-weight: 600; cursor: pointer; color: var(--text-2); transition: all .12s; }
.seg-btn.active { background: var(--card-solid); color: var(--primary); box-shadow: var(--shadow); }
.input-inline[type="date"] { padding: 6px 10px; border-radius: 8px; border: 1px solid var(--border); background: var(--card-solid); font-size: 13px; }
/* 「日期+时刻」输入框的宽度、以及「工具栏里的控件不铺满整行」，统一在文件后段 v3.68 区块定义 */
.search-box { position: relative; }
.search-box input { padding: 8px 12px 8px 32px; border-radius: 8px; border: 1px solid var(--border); background: var(--card-solid); min-width: 220px; font-size: 13px; }
.search-box svg { position: absolute; left: 9px; top: 50%; transform: translateY(-50%); width: 16px; height: 16px; fill: var(--text-2); }
table { width: 100%; border-collapse: collapse; font-size: 13px; }
th, td { padding: 11px 14px; text-align: left; border-bottom: 1px solid var(--border); }
th { background: var(--bg); color: var(--text-2); font-weight: 600; font-size: 12px; position: sticky; top: 0; letter-spacing: .3px; }
tbody tr:last-child td { border-bottom: none; }
tr:hover td { background: rgba(0,0,0,0.022); }
.table-wrap { max-height: 55vh; overflow: auto; border-radius: 10px; border: 1px solid var(--border); background: var(--card-solid); }
/* v4.15 物料库「全部归属」视图：三仓含义不同的编码类字段并排 → 列多（15 列）。
   给表格一个最小宽度 + 禁止换行，否则归属名会被压成三行、操作按钮会竖排。
   宽度超出时由 .table-wrap 的 overflow:auto 横向滚动。 */
table.mat-allwh { min-width: 1180px; }
table.mat-allwh th, table.mat-allwh td { white-space: nowrap; }
/* v4.16c 看板「消耗预估 · 补货建议」：同一面板里有多张分档表（已耗尽/即将见底/偏紧），
   它们必须列宽一致，否则上下两表的同名列会错开（赞哥截图圈的就是这个）。
   → 固定 table-layout，让 <colgroup> 的百分比真正生效；长名称允许折行，不撑破列。 */
table.est-tbl { table-layout: fixed; }
table.est-tbl th, table.est-tbl td { overflow-wrap: anywhere; }
table.est-tbl td .est-hide-btn { white-space: nowrap; }
.row-actions { white-space: nowrap; }
.row-actions .btn { margin-right: 6px; }
.row-actions .btn:last-child { margin-right: 0; }
.tag { display: inline-flex; align-items: center; padding: 3px 8px; border-radius: 12px; font-size: 11px; font-weight: 700; }
.tag-out { background: #FFF7ED; color: #C2410C; border: 1px solid #FED7AA; }
.tag-in { background: #ECFDF5; color: #047857; border: 1px solid #A7F3D0; }
.tag-inbound { background: #EFF6FF; color: #1D4ED8; border: 1px solid #BFDBFE; }
/* v3.46 退货出库：红色（退回供应商 / 异常退回），与出库(橙)、退料(绿)、入库(蓝)区分 */
.tag-reject { background: #FEF2F2; color: #B91C1C; border: 1px solid #FECACA; }
.tag-warn { background: var(--danger-light); color: var(--danger); border: 1px solid #FECACA; }
.tag-cat { background: var(--primary-light); color: var(--primary); border: 1px solid var(--primary-border); }
.low-stock { color: var(--danger); font-weight: 700; }
.in-qty { color: #047857; font-weight: 700; }
.admin-area { display: flex; align-items: center; }
.admin-btn { display: inline-flex; align-items: center; gap: 6px; background: rgba(255,255,255,0.12); color: #fff; border: 1px solid rgba(255,255,255,0.25); border-radius: 8px; padding: 6px 12px; font-size: 13px; cursor: pointer; transition: background .15s; }
.admin-btn:hover { background: rgba(255,255,255,0.22); }
.admin-badge { display: inline-flex; align-items: center; gap: 6px; background: #16A34A; color: #fff; border-radius: 8px; padding: 6px 10px; font-size: 13px; font-weight: 600; }
.admin-badge .exit { background: rgba(255,255,255,0.2); border: none; color: #fff; border-radius: 6px; padding: 2px 8px; cursor: pointer; margin-left: 4px; }
.admin-badge .exit:hover { background: rgba(255,255,255,0.35); }
.shield-ico { font-size: 14px; }
.form-row { display: grid; gap: 14px; margin-bottom: 14px; }
/* v4.15 美化：原来 repeat(2, 1fr) 里 1fr 的 min-content 会被长提示文字顶宽 → 两列不等宽、
   输入框左右错位。改成 minmax(0, 1fr) 才是真正一半一半。 */
.form-row.col-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.form-row.col-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

/* v4.18 入库登记排版收紧（赞哥 2026-10-19 选方案 A）
   目标：一屏放得下「确认入库」，不用滚鼠标。
   - col-2a：2:1，把单位/数量/时间这类窄字段收窄，宽度让给长字段
   - col-1a：单列整行（备注用）
   - 行距 14→10、label 下间距 5→4、输入框内边距略收
   - .ib-foot：账号提示与提交按钮并排（原来各占一行，白吃 50px） */
.form-row.col-2a { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
.form-row.col-3a { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); }
/* v4.18n 入库登记：表单卡比「说明」卡宽一点（1.55:1），字段不至于挤、右侧说明也不空一大片 */
.grid.ib-grid { grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); }
/* 窄屏回退：小屏等宽、超小屏单列（.grid.ib-grid 是两个类，权重比 .grid-2 高，必须显式声明） */
@media (max-width: 900px) { .grid.ib-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .grid.ib-grid { grid-template-columns: 1fr; } }

.ib-form .form-row { gap: 12px; margin-bottom: 10px; }
.ib-form .form-row:last-child { margin-bottom: 0; }
.ib-form .form-group label { margin-bottom: 4px; }
.ib-form .form-group input, .ib-form .form-group select { padding: 8px 10px; }
/* v4.18n 脚注区（账号 + 提交）用一条细线与表单分开，避免按钮贴着最后一行 */
.ib-foot { display: flex; align-items: center; gap: 14px; margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--border); }
.ib-foot .audit-bar { margin: 0; padding: 0; background: none; border: 0; flex: 0 0 auto; font-size: 12.5px; }
.ib-foot .ib-submit { margin-left: auto; width: 220px; flex: 0 0 auto; }
.form-group label { display: block; font-size: 12px; font-weight: 600; color: var(--text-2); margin-bottom: 5px; }
.form-group input, .form-group select, .form-group textarea { width: 100%; padding: 9px 11px; border-radius: 8px; border: 1px solid var(--border); background: var(--card-solid); font-size: 13px; }
.form-group input:focus, .form-group select:focus, .form-group textarea:focus { outline: 2px solid var(--primary-2); outline-offset: -1px; }
.form-hint { font-size: 11px; color: var(--text-2); margin-top: 4px; }
.modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.45); z-index: 200; display: none; align-items: center; justify-content: center; backdrop-filter: blur(2px); }
.modal-overlay.active { display: flex; }
.modal { background: var(--card-solid); border-radius: var(--radius); box-shadow: var(--shadow); width: 92%; max-width: 520px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; }
/* v4.15：物料编辑弹窗字段多（图片区 + 3 列），520px 挤得字段错位 → 单独一款宽版 */
.modal.modal-lg { max-width: 760px; }
.modal-header { padding: 16px 20px; border-bottom: 1px solid var(--border); display: flex; justify-content: space-between; align-items: center; }
.modal-title { font-size: 16px; font-weight: 700; }
.modal-body { padding: 20px; overflow-y: auto; }
.modal-footer { padding: 14px 20px; border-top: 1px solid var(--border); display: flex; justify-content: flex-end; gap: 10px; }
.close-btn { background: none; border: none; font-size: 22px; cursor: pointer; color: var(--text-2); line-height: 1; }
.empty-state { text-align: center; padding: 40px; color: var(--text-2); }
.empty-state svg { width: 64px; height: 64px; fill: var(--border); margin-bottom: 12px; }
.list { display: flex; flex-direction: column; }
.list-item { display: flex; justify-content: space-between; align-items: center; padding: 9px 4px; border-bottom: 1px solid var(--border); font-size: 13px; }
.list-item:last-child { border-bottom: none; }
.chart-bar { display: flex; align-items: center; gap: 10px; margin: 8px 0; }
.chart-label { width: 80px; font-size: 12px; color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.chart-track { flex: 1; height: 10px; background: var(--bg); border-radius: 5px; overflow: hidden; }
.chart-fill { height: 100%; background: linear-gradient(90deg, var(--primary), var(--primary-2)); border-radius: 5px; }
.chart-value { width: 36px; text-align: right; font-size: 12px; font-weight: 700; }
.rank-item { display: flex; align-items: center; justify-content: space-between; padding: 8px 0; border-bottom: 1px solid var(--border); }
.rank-item:last-child { border-bottom: none; }
.rank-name { display: flex; align-items: center; gap: 8px; }
.rank-num { width: 20px; height: 20px; border-radius: 50%; background: var(--bg); display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; }
.rank-num.top { background: var(--primary); color: #fff; }
.warning-strip { background: var(--danger-light); color: var(--danger); border: 1px solid #FECACA; border-radius: 10px; padding: 12px 16px; margin-bottom: 16px; display: flex; align-items: center; gap: 10px; }
.warning-strip svg { width: 20px; height: 20px; fill: currentColor; flex-shrink: 0; }
.toast { position: fixed; top: 18px; right: 18px; z-index: 300; background: var(--text); color: #fff; padding: 12px 16px; border-radius: 10px; box-shadow: var(--shadow); transform: translateX(140%); transition: transform .25s ease; display: flex; align-items: center; gap: 10px; font-size: 13px; max-width: 320px; }
.toast.show { transform: translateX(0); }
.toast.success { background: var(--success); }
.toast.error { background: var(--danger); }
/* v3.94：不是失败、但要他多看一眼的那种提示（如「有 3 个新加的行请核对」） */
.toast.warn { background: var(--warning, #d97706); }
.mobile-menu { display: none; position: fixed; bottom: 0; left: 0; right: 0; height: 60px; background: linear-gradient(90deg, var(--sidebar-from), var(--sidebar-to)); z-index: 120; justify-content: space-around; align-items: center; color: #fff; }
.mobile-menu .m-item { display: flex; flex-direction: column; align-items: center; gap: 3px; font-size: 10px; opacity: 0.7; cursor: pointer; }
.mobile-menu .m-item.active { opacity: 1; }
.mobile-menu svg { width: 22px; height: 22px; fill: currentColor; }
@media (max-width: 760px) {
  :root { --sidebar-w: 60px; }
  .nav-text, .brand-title, .sidebar-footer { display: none; }
  .brand { padding: 16px 8px; align-items: center; }
  .logo-img-sidebar { width: 40px; align-self: center; }
  .nav-item { justify-content: center; padding: 14px 8px; margin: 2px 6px; }
  .nav-icon { width: 24px; height: 24px; }
  .topbar { padding: 0 14px; }
  .page-title { font-size: 15px; }
  .content { padding: 14px; }
  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .grid-3 { grid-template-columns: 1fr; }
  .grid-2 { grid-template-columns: 1fr; }
  .form-row.col-2, .form-row.col-3 { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  :root { --sidebar-w: 0px; }
  .sidebar { display: none; }
  .main { margin-left: 0; padding-bottom: 60px; }
  .mobile-menu { display: flex; }
  .grid-4 { grid-template-columns: 1fr; }
}
.confirm-mask { position: fixed; inset: 0; background: rgba(0,0,0,0.35); z-index: 250; display: none; align-items: center; justify-content: center; }
.confirm-mask.active { display: flex; }
.confirm-box { background: var(--card-solid); padding: 20px; border-radius: var(--radius); box-shadow: var(--shadow); width: 90%; max-width: 360px; }
.confirm-title { font-weight: 700; margin-bottom: 10px; }
.confirm-btns { display: flex; justify-content: flex-end; gap: 10px; margin-top: 18px; }
.section-title { font-size: 13px; font-weight: 700; color: var(--text-2); margin: 18px 0 10px; padding-bottom: 6px; border-bottom: 1px solid var(--border); }

/* ---------- v3.58/v3.59 打印单据（领料单等）---------- */
/* v3.59 修：改成「固定顶栏 + 可滚动单据」的结构 —— 原来按钮栏跟着页面滚，
   内容一长按钮就滚出视野，用户找不到"返回"（踩过）。现在顶栏永远钉在最上面。 */
#printArea { display: none; position: fixed; inset: 0; z-index: 400; background: #EFF1F4; flex-direction: column; }
#printArea.active { display: flex; }
.print-bar { flex: 0 0 auto; display: flex; align-items: center; gap: 10px; justify-content: flex-end; padding: 11px 18px; background: var(--card-solid); border-bottom: 1px solid var(--border); box-shadow: 0 1px 6px rgba(0,0,0,.06); }
.print-bar .print-hint { margin-right: auto; font-size: 12.5px; color: var(--text-2); display: flex; align-items: center; gap: 6px; }
.print-close-x { width: 34px; height: 34px; flex: 0 0 auto; border-radius: 9px; border: 1px solid var(--border); background: var(--card-solid); color: var(--text-2); font-size: 20px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: all .15s; }
.print-close-x:hover { background: var(--danger-light); color: var(--danger); border-color: #FECACA; }
.print-scroll { flex: 1; overflow: auto; padding: 20px 22px 40px; }
.print-foot-bar { max-width: 720px; margin: 18px auto 0; display: flex; justify-content: center; }
.print-sheet { background: #fff; max-width: 720px; margin: 0 auto; padding: 30px 34px 40px; color: #111827; box-shadow: 0 6px 24px rgba(0,0,0,.12); border-radius: 8px; }
.print-head { display: flex; align-items: flex-end; justify-content: space-between; border-bottom: 2px solid #111827; padding-bottom: 10px; margin-bottom: 18px; }
.print-brand { font-size: 18px; font-weight: 800; letter-spacing: 1px; }
.print-title { font-size: 20px; font-weight: 800; letter-spacing: 4px; }
.print-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.print-table th, .print-table td { border: 1px solid #9CA3AF; padding: 9px 11px; text-align: left; }
.print-table th { background: #F3F4F6; width: 96px; font-weight: 600; color: #374151; }
.print-table td b { font-size: 17px; }
.print-sign { display: flex; justify-content: space-between; gap: 16px; margin-top: 34px; font-size: 14px; }
.print-foot { margin-top: 16px; font-size: 12px; color: #6B7280; }
@media print {
  body > *:not(#printArea) { display: none !important; }
  #printArea { position: static; display: block; background: #fff; }
  #printArea .print-scroll { overflow: visible; padding: 0; }
  #printArea .print-sheet { box-shadow: none; border-radius: 0; max-width: none; padding: 0; }
  .no-print { display: none !important; }
  @page { margin: 16mm; }
}
/* 首页"最近动态"整行可点击 */
.home-recent-row { cursor: pointer; }
.home-recent-row:hover td { background: var(--primary-light); }

/* ---------- v3.51/v3.54 首页（工作台）---------- */
.home-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 6px 0 18px; }
.home-head h2 { font-size: 19px; font-weight: 700; margin: 0; color: var(--text); }
.home-date { font-size: 13px; color: var(--text-2); }
/* v3.54 一行 6 等宽铺满；标题行与卡片同网格，所以分组标题能跟各自的组对齐 */
.home-grid6 { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); column-gap: 12px; row-gap: 10px; }
.home-group-label { display: flex; align-items: baseline; gap: 8px; font-size: 12.5px; font-weight: 600; color: var(--text); }
.home-group-label span { font-weight: 400; font-size: 11.5px; color: var(--text-2); }
.home-action { display: flex; align-items: center; justify-content: center; gap: 9px; padding: 13px 10px; background: var(--card-solid); border: 1px solid var(--border); border-radius: 10px; cursor: pointer; transition: border-color .15s, box-shadow .15s, transform .15s; }
.home-action:hover { border-color: var(--primary); box-shadow: var(--shadow-card-hover); transform: translateY(-1px); }
.home-action svg { width: 20px; height: 20px; flex: 0 0 auto; fill: none; stroke: var(--primary); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.home-action.is-danger svg { stroke: var(--danger); }
/* "查看"类用灰色图标，与"仓库操作"（主题色）一眼区分 */
.home-action.view-only svg { stroke: var(--text-2); }
.home-action span { font-size: 13px; white-space: nowrap; }
@media (max-width: 1024px) {
  .home-grid6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .home-grid6 .home-group-label { grid-column: span 3 !important; }
}
@media (max-width: 620px) {
  .home-grid6 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-grid6 .home-group-label { grid-column: span 2 !important; }
}
/* ---------- v3.56 界面动效（可一键关闭，见 body.no-anim） ---------- */
@keyframes homeRise { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.home-anim > .card, .home-anim .home-action { animation: homeRise .34s ease-out both; }
/* 「门」：body 上挂 no-anim 即可全部停掉（顶栏/设置里的开关控制） */
body.no-anim *, body.no-anim *::before, body.no-anim *::after {
  animation-duration: .001s !important; animation-delay: 0s !important; animation-iteration-count: 1 !important;
  transition-duration: .001s !important; transition-delay: 0s !important;
}
@media (prefers-reduced-motion: reduce) {
  html:not(.force-anim) .home-anim > .card, html:not(.force-anim) .home-anim .home-action { animation: none; }
}
/* 设置页的开关行。
   注意：必须写成 .form-group .anim-row —— 因为 .form-group label（0,1,1）优先级高于 .anim-row（0,1,0），
   否则会被强制成 display:block，两个文字挤在一起、margin-left:auto 失效。 */
.form-group .anim-row { display: flex; align-items: center; gap: 9px; font-size: 13px; font-weight: 400; color: var(--text); cursor: pointer; padding: 9px 12px; margin-bottom: 0; background: var(--card-solid); border: 1px solid var(--border); border-radius: 10px; }
.anim-row input { width: 16px; height: 16px; accent-color: var(--primary); cursor: pointer; flex: 0 0 auto; }
.anim-row span.hint { color: var(--text-2); font-size: 12px; font-weight: 400; margin-left: auto; padding-left: 10px; }
.wh-pick { display: grid; grid-template-columns: repeat(auto-fit, minmax(132px, 1fr)); gap: 10px; }
.wh-pick-btn { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; padding: 12px 14px; text-align: left; height: auto; }
.wh-pick-btn b { font-size: 14px; font-weight: 700; }
.wh-pick-btn span { font-size: 11.5px; font-weight: 400; color: var(--text-2); }
/* v3.51 快捷入口图标用描边风格（fill:none + stroke），避免被填成色块 */
.home-action svg { width: 22px; height: 22px; fill: none; stroke: var(--primary); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.home-action.is-danger svg { stroke: var(--danger); }
.home-action span { font-size: 12.5px; color: var(--text); }
.home-more { margin-top: 8px; font-size: 12px; color: var(--text-2); text-align: center; }
/* v4.11b 消耗预估「已隐藏」折叠区 */
.est-hidden { margin-top: 10px; border-top: 1px dashed var(--border); padding-top: 8px; }
.est-hidden > summary { cursor: pointer; font-size: 12.5px; color: var(--text-2); list-style: none; user-select: none; }
.est-hidden > summary::-webkit-details-marker { display: none; }
.est-hidden > summary::before { content: "▸ "; }
.est-hidden[open] > summary::before { content: "▾ "; }
.est-hidden > summary:hover { color: var(--primary); }
.est-hidden .table-wrap { margin-top: 8px; }
.est-hide-btn { padding: 3px 10px; font-size: 12px; }
.inline-list { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 20px; background: var(--bg); border: 1px solid var(--border); font-size: 12px; }
.chip button { background: none; border: none; cursor: pointer; padding: 0; display: flex; color: var(--text-2); }
.chip button:hover { color: var(--danger); }
.input-inline { padding: 5px 10px; border-radius: 20px; border: 1px solid var(--border); background: var(--card-solid); font-size: 12px; width: 120px; }
.iss-mat-filter { display: flex; gap: 8px; align-items: center; margin-bottom: 8px; flex-wrap: wrap; }
.iss-mat-filter input.input-inline { flex: 2 1 160px; width: auto; }
.iss-mat-filter select.input-inline { flex: 0 1 auto; width: auto; }
.iss-mat-count { font-size: 11px; color: var(--text-2); white-space: nowrap; margin-left: auto; }
.hint-warn { color: var(--warn); font-size: 12px; margin-top: 6px; display: none; }
.hint-warn.show { display: flex; align-items: center; gap: 6px; }
.loading { text-align: center; padding: 60px; color: var(--text-2); }

/* ---------- 部门栏目树 ---------- */
/* v3.51 修：侧栏是深色的，原来用 --text-2（给浅底设计的灰）几乎看不见，改成低透明度白 */
.nav-group-title { display: flex; align-items: center; gap: 6px; padding: 16px 16px 6px; font-size: 11px; letter-spacing: 1.4px; color: rgba(255,255,255,0.45); }
.nav-group-title svg { width: 14px; height: 14px; }
.nav-item.col-root { font-weight: 600; }
.nav-item.col-child { padding-left: 38px; font-weight: 600; }
.col-toggle { margin-left: auto; transition: transform .15s, color .15s, background .15s; cursor: pointer; color: var(--text-2); font-size: 12px; padding: 0 4px; }
.col-toggle.open { transform: rotate(90deg); }
/* v4.14f ⚠️ 侧栏是**深色**（#1F2937→#4B5563），但部门根节点（物流部/人事部…）的箭头沿用了
   --text-2（浅色主题的深灰）→ 普通行勉强看得见，**被选中那一行（背景提亮）里几乎完全隐形**。
   赞哥因此报「物流部展不开、4 个仓不见了」—— 箭头其实一直在，只是看不见、点不到。
   这里换成浅白 + 加大点击区 + hover 高亮；仓库分组头（.nav-group-head）本来就是白的，不动。 */
.nav-item.col-root .col-toggle { color: rgba(255,255,255,0.55); font-size: 13px; padding: 2px 9px; margin-right: -5px; border-radius: 7px; }
.nav-item.col-root .col-toggle:hover { color: #fff; background: rgba(255,255,255,0.16); }
.nav-item.col-root.active .col-toggle { color: rgba(255,255,255,0.9); }
.col-add, .col-del { width: 20px; height: 20px; border: none; border-radius: 6px; background: var(--bg); color: var(--text-2); cursor: pointer; font-size: 14px; line-height: 1; margin-left: 4px; display: inline-flex; align-items: center; justify-content: center; }
.col-add:hover { background: var(--primary); color: #fff; }
.col-del:hover { background: var(--danger); color: #fff; }
.col-content { padding: 6px 4px 0; }
.col-textarea { width: 100%; min-height: 220px; resize: vertical; padding: 14px; border: 1px solid var(--border); border-radius: 12px; background: var(--card-solid); color: var(--text); font-size: 14px; line-height: 1.7; font-family: inherit; box-sizing: border-box; }

/* ===== v3.81「待开发」栏目（财务部/质量部这类还没做的栏目）=====
   判定在前端按规则自动算（isTodoColumn）：没绑功能页 + 没写内容 + 无子栏目。
   只是界面标注，不写数据库；将来做了功能或写上内容，标记自动消失。 */
.todo-badge {
  display: inline-block; margin-left: 6px; padding: 1px 7px; font-size: 11px; font-weight: 400;
  line-height: 16px; border-radius: 5px; vertical-align: 1px; white-space: nowrap;
}
/* 左侧导航是深色底 → 半透明白；v3.82 标再收窄一档，保证「栏目名 + 待开发」挤在一行里不折行 */
.nav-item .todo-badge { background: rgba(255,255,255,0.10); color: rgba(255,255,255,0.62); border: 1px solid rgba(255,255,255,0.14); margin-left: 5px; padding: 1px 5px; font-size: 10px; line-height: 15px; }
/* 内容区是浅色卡片 → 淡灰（用主题变量，4 套主题都协调） */
.card-title .todo-badge { background: var(--bg); color: var(--text-2); border: 1px solid var(--border); }
.todo-note {
  display: flex; flex-direction: column; gap: 5px;
  padding: 20px 22px;
  border: 1px dashed var(--border); border-radius: 12px; background: var(--bg);
}
/* 只在「提示条 + 编辑框」并排时留间距；单独出现（只读用户）时不带多余空白 */
.col-content .todo-note { margin-bottom: 14px; }
.todo-note-t { font-weight: 500; color: var(--text); }
.todo-note-d { font-size: 13px; color: var(--text-2); }
.crumb { color: var(--primary); cursor: pointer; }
.crumb:hover { text-decoration: underline; }

/* ---------- 登录界面（月夜松鹤 · 纯内联 SVG/CSS，不引用外部资源） ---------- */
.login-screen {
  --lgn-cy: 46%;
  position: fixed; inset: 0; z-index: 400; display: flex; align-items: center; justify-content: center;
  padding: 24px; overflow: hidden;
  background: linear-gradient(180deg, #121a25 0%, #1e2833 24%, #3b4652 48%, #6d6754 70%, #9d8357 86%, #c9aa6c 100%);
}
.login-sky { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.login-stars { position: absolute; inset: 0; width: 100%; height: 42%; display: block; }
.login-glow {
  position: absolute; left: 50%; top: var(--lgn-cy); transform: translate(-50%, -50%);
  width: 168vmin; height: 168vmin; border-radius: 50%;
  background: radial-gradient(circle, rgba(255,234,181,0.30) 0%, rgba(232,200,130,0.12) 40%, rgba(232,200,130,0) 68%);
}
.login-ring { position: absolute; left: 50%; top: var(--lgn-cy); transform: translate(-50%, -50%); width: min(78vh, 64vw); height: min(78vh, 64vw); display: block; }
.login-hills { position: absolute; left: 0; right: 0; bottom: 0; width: 100%; height: 45%; display: block; }
.login-pine { position: absolute; display: block; }
.login-pine-tl { top: 0; left: 0; width: min(32vw, 300px); }
.login-pine-br { right: 0; bottom: 0; width: min(32vw, 300px); }
.login-seal {
  position: absolute; left: 26px; bottom: 26px; width: 42px; height: 42px; border-radius: 5px; background: #b23a2e;
  color: #fdf2e6; font-size: 11px; line-height: 1.12; letter-spacing: 1px;
  display: flex; align-items: center; justify-content: center; text-align: center;
}

.login-card {
  position: relative; z-index: 1; width: 340px; max-width: 100%; background: #fffdf8;
  border-radius: 10px; border: 1px solid #c9a558; padding: 32px 28px;
  box-shadow: 0 24px 70px rgba(0,0,0,0.45);
}
.login-card::before { content: ""; position: absolute; inset: 5px; border: 1px solid #e0cfa4; border-radius: 6px; pointer-events: none; }
.login-brand { display: flex; align-items: center; gap: 14px; }
.login-brand-title { font-size: 20px; font-weight: 800; letter-spacing: 1px; line-height: 1.15; white-space: nowrap; color: #3a3226; }
.login-brand .logo-img { width: 64px; height: auto; }
.login-sub { font-size: 12.5px; color: #8d8778; margin: 8px 0 0; padding-bottom: 16px; border-bottom: 1px solid #ece0c4; }
.login-card .form-group { margin-bottom: 15px; }
.login-sub + .form-group { margin-top: 18px; }
.login-card .form-group label { font-size: 12px; color: #726c5e; }
.login-card .form-group input { background: #fdfaf3; border: 1px solid #e3dcc9; border-radius: 6px; color: #3a3226; }
.login-card .form-group input::placeholder { color: #b8b1a0; }
.login-card .form-group input:focus { outline: 2px solid #cfa049; outline-offset: -1px; }
.login-btn {
  width: 100%; padding: 11px; font-size: 15px; margin-top: 6px; border: none; border-radius: 4px;
  background: linear-gradient(135deg, #f7e6bb, #c19240); color: #3d2a06; font-weight: 700; letter-spacing: 3px;
}
.login-hint { margin-top: 16px; font-size: 12px; color: #a49a88; line-height: 1.6; text-align: center; }
/* 无提示内容时不占位（登录失败时由 app.js 写入错误文案，此时才显示） */
#loginHint:empty { display: none; }

/* ---------- 用户徽标 ---------- */
/* v4.14d：原配色为「深色顶栏」设计（白色半透明底 + 白字），而顶栏早已是浅色 →
   整条信息在浅色顶栏上隐形、只剩一个孤立的圆形字母。改为主题淡底 + 描边药丸，
   文字用 --text/--text-2，退出按钮用主题色实心，跟随 4 套主题自动换色。 */
.user-chip { display: inline-flex; align-items: center; gap: 10px; background: var(--primary-light); border: 1px solid var(--primary-border); border-radius: 20px; padding: 4px 5px 4px 14px; }
.user-meta { display: flex; flex-direction: column; line-height: 1.15; max-width: 140px; }
.user-meta b { font-size: 13px; font-weight: 700; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.user-meta i { font-style: normal; font-size: 11px; color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.user-btn { background: var(--primary); border: none; color: #fff; border-radius: 16px; padding: 5px 13px; font-size: 12px; font-weight: 600; cursor: pointer; transition: background .15s; flex-shrink: 0; }
.user-btn:hover { background: var(--primary-2); }
@media (max-width: 760px) {
  .user-chip { padding: 3px 4px 3px 10px; gap: 8px; }
  .user-meta { max-width: 84px; }
  .user-meta i { display: none; }
}

/* ---------- 角色/状态标签 ---------- */
.role-badge { display: inline-flex; padding: 3px 10px; border-radius: 12px; font-size: 12px; font-weight: 700; }
.role-badge.admin { background: #ECFDF5; color: #047857; border: 1px solid #A7F3D0; }
.role-badge.viewer { background: var(--bg); color: var(--text-2); border: 1px solid var(--border); }
.dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 5px; vertical-align: middle; }
.dot.ok { background: var(--success); }
.dot.off { background: #C4C4C4; }

/* ---------- 权限开关网格 ---------- */
.perm-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px 14px; background: var(--bg); border: 1px solid var(--border); border-radius: 10px; padding: 14px; transition: opacity .15s; }
.perm-row { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--text); cursor: pointer; }
.perm-row input { width: 16px; height: 16px; accent-color: var(--primary); }

/* ---------- 移动端登录适配（圆相上移当门，卡片近满宽，按钮加大） ---------- */
@media (max-width: 767px) {
  .login-screen { --lgn-cy: 26%; padding: 18px 18px calc(18px + env(safe-area-inset-bottom)); }
  .login-ring { width: min(62vh, 74vw); height: min(62vh, 74vw); }
  .login-hills { height: 38%; }
  .login-pine-tl, .login-pine-br { width: 44vw; }
  .login-seal { left: 16px; bottom: calc(16px + env(safe-area-inset-bottom)); width: 38px; height: 38px; }
  .login-card { width: 100%; max-width: 420px; padding: 24px 20px; }
  .login-brand .logo-img { width: 56px; }
  .login-brand-title { font-size: 21px; }
  .login-card .form-group input { font-size: 16px; }
  .login-btn { padding: 14px; font-size: 16px; }
}
@media (max-width: 480px) {
  .perm-grid { grid-template-columns: 1fr; }
}

/* ---------- 物料仓（导航子项 + 仓库看板） ---------- */
.nav-item.nav-deep { padding-left: 56px; padding-top: 9px; padding-bottom: 9px; font-weight: 500; font-size: 14px; color: rgba(255,255,255,0.92); }
.nav-item.nav-deep::after { content: ""; position: absolute; left: 44px; top: 0; bottom: 0; width: 1px; background: rgba(255,255,255,0.08); }
/* 仓库分组（可收起展开 + 改名） */
.nav-group-head { display: flex; align-items: center; gap: 8px; padding: 11px 18px 11px 24px; margin: 4px 10px 0; border-radius: 10px; font-size: 14px; font-weight: 600; color: rgba(255,255,255,0.95); cursor: pointer; user-select: none; position: relative; }
.nav-group-head:hover { background: rgba(255,255,255,0.08); }
.nav-group-head.active { color: var(--primary-2); }
.nav-group-head .col-toggle { margin-left: 0; font-size: 11px; color: rgba(255,255,255,0.7); padding: 0 2px; }
.nav-group-head .nav-text { flex: 1; font-weight: 600; }
.nav-group-body { overflow: hidden; max-height: 360px; transition: max-height .22s ease; }
.nav-group-body.collapsed { max-height: 0; }
.wh-rename { margin-left: auto; font-size: 13px; line-height: 1; opacity: .55; cursor: pointer; padding: 2px 6px; border-radius: 6px; }
.wh-rename:hover { opacity: 1; background: rgba(255,255,255,0.12); }
.wh-banner { display: flex; align-items: center; justify-content: space-between; gap: 16px; background: var(--primary-light); border: 1px solid var(--primary-2); border-radius: var(--radius); padding: 16px 20px; }
.wh-banner-title { font-size: 18px; font-weight: 800; color: var(--primary); }
.wh-banner-sub { font-size: 12px; color: var(--text-2); margin-top: 4px; }
.wh-banner .btn { white-space: nowrap; }
.wh-section { margin-top: 16px; }
.wh-section-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.wh-section-head h3 { margin: 0; font-size: 16px; font-weight: 800; display: flex; align-items: center; gap: 8px; }
.wh-badge { font-size: 12px; font-weight: 500; color: var(--text-2); background: var(--bg); border: 1px solid var(--border); padding: 3px 10px; border-radius: 20px; }
.ok-strip { background: #EAFBF0; border: 1px solid #C6ECD3; color: #1A7F43; border-radius: 10px; padding: 10px 14px; margin-bottom: 12px; display: flex; align-items: center; gap: 8px; font-size: 13px; }
.ok-strip svg { width: 18px; height: 18px; fill: currentColor; flex-shrink: 0; }

/* ---------- 计划员工作台 ---------- */
.plan-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 14px; }
.plan-card { background: var(--bg); border: 1px solid var(--border); border-radius: var(--radius); padding: 18px 16px; text-align: center; }
.plan-card-val { font-size: 30px; font-weight: 800; color: var(--primary); line-height: 1.1; }
.plan-card-label { font-size: 13px; color: var(--text-2); margin-top: 8px; }
.plan-card.danger { background: #FFF1F0; border-color: #FFCCC7; }
.plan-card.danger .plan-card-val { color: #D4380D; }
.plan-card.warn { background: #FFFBE6; border-color: #FFE58F; }
.plan-card.warn .plan-card-val { color: #D48806; }
.row-delayed { background: #FFF1F0 !important; }
.row-delayed td { color: #D4380D; }
.row-soon { background: #FFFBE6 !important; }
.row-soon td { color: #AD6800; }
.input-inline { width: 100%; padding: 6px 8px; border: 1px solid var(--border); border-radius: 8px; font-size: 13px; background: var(--bg); color: var(--text); }
/* v3.68 工具栏 / 分页条里的控件不该铺满整行。
   上面这条 .input-inline{width:100%} 本意只服务表单内部，但工具栏里的下拉
   （物料库「全部仓库/全部分类」、出入库记录「全部类型/全部仓库」）与分页条「每页条数」
   也吃到了它 —— 各自占满一整行，把工具栏挤成四行。这里按区域收成行内自适应宽度。
   注意：表单内（.form-row 等）的 .input-inline 仍是 100%，不受影响。 */
.toolbar .input-inline,
.tf-pager .input-inline { width: auto; min-width: 104px; max-width: 190px; flex: 0 0 auto; }
.tf-pager .input-inline { min-width: 92px; max-width: 132px; padding: 5px 8px; font-size: 12px; }
/* 「日期+时刻」输入框必须给固定宽度，否则「2026/09/27 13:40」会被截断 */
.toolbar .input-inline[type="datetime-local"] { width: 186px; min-width: 186px; max-width: 186px; }
/* 加工流转筛选栏：下拉再收一点、按钮与间距一并压紧，保证 1600 宽下一行放得下 */
.tf-filter { gap: 7px; }
.tf-filter select.input-inline { max-width: 172px; }
.tf-filter .btn-sm { padding: 5px 7px; }
.card-title-sub { font-size: 12px; color: var(--text-2); font-weight: 400; margin-top: 2px; }
.tag-ok { background: #EAFBF0; color: #1A7F43; border: 1px solid #C6ECD3; padding: 2px 8px; border-radius: 20px; font-size: 12px; }

/* ---------- 生产仓：品名状态管理 ---------- */
.ok-strip { background: var(--success-light); color: var(--success); border: 1px solid #A7F3D0; border-radius: 10px; padding: 12px 16px; margin-bottom: 16px; display: flex; align-items: center; gap: 10px; }
.ok-strip svg { width: 20px; height: 20px; fill: currentColor; flex-shrink: 0; }

.prod-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 16px; }
.prod-card { padding: 16px; }
.prod-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.prod-title { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 15px; }
.prod-total { font-size: 24px; font-weight: 800; color: var(--primary); line-height: 1; font-variant-numeric: tabular-nums; }
/* v3.63 卡片上的使用率小字（近 90 天笔数 + 最近使用），让"为什么它排第一"一眼可见 */
.prod-usage { font-size: 12px; color: var(--text-2); margin: -6px 0 10px; }

/* BOM 项目清单表卡片：更大尺寸的网格 */
.prod-grid.project-grid { grid-template-columns: repeat(auto-fill, minmax(680px, 1fr)); gap: 18px; }
.prod-card.project-card { padding: 0; overflow: hidden; }

/* 项目级卡片头：扁平 8 列 grid，与表格 8 列 1:1 对齐 */
.project-head { display: grid; grid-template-columns: 12% 20% 14% 8% 13% 13% 12% 8%; gap: 0; padding: 16px 22px; background: linear-gradient(180deg, var(--bg-2) 0%, transparent 100%); border-bottom: 1px solid var(--border); align-items: center; min-height: 56px; }
.project-cell { display: flex; align-items: center; min-width: 0; padding: 0 10px; min-height: 32px; }
/* 对齐方向与表格数据行 text-align 一致：数字列右对齐、左对齐列左对齐、居中列居中 */
/* 横向 padding 与 .bom-table thead th/tbody td 一致(8px 10px / 9px 10px 横向 10px)，
   保证卡片头单元格内的文字与表格列内容在同一条竖线上 */
.project-cell.col-1 { grid-column: 1; justify-content: flex-start; padding-left: 0; }
.project-cell.col-2 { grid-column: 2; justify-content: flex-start; padding-left: 6px; }
.project-cell.col-3 { grid-column: 3; justify-content: center; }
.project-cell.col-4 { grid-column: 4; justify-content: flex-end; }
.project-cell.col-5 { grid-column: 5; justify-content: flex-end; gap: 6px; flex-wrap: wrap; }
.project-cell.col-6 { grid-column: 6; justify-content: flex-end; }
.project-cell.col-7 { grid-column: 7; justify-content: flex-start; }
.project-cell.col-8 { grid-column: 8; justify-content: center; padding-right: 0; }
/* 列虚线分隔：让卡片头看上去就是表格的"表头行"，与下方 8 列 1:1 对应 */
.project-cell.col-2,
.project-cell.col-3,
.project-cell.col-4,
.project-cell.col-5,
.project-cell.col-6,
.project-cell.col-7,
.project-cell.col-8 { border-left: 1px dashed var(--border); }

.project-code { display: inline-flex; align-items: center; padding: 4px 12px; background: var(--text); color: #fff; border-radius: 6px; font-size: 14px; font-weight: 700; letter-spacing: 0.5px; font-variant-numeric: tabular-nums; flex-shrink: 0; }
.project-name { font-size: 18px; font-weight: 700; color: var(--text); cursor: pointer; padding: 4px 8px; border-radius: 6px; transition: background 0.15s; border: 1px dashed transparent; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.project-name:hover { background: rgba(0,0,0,0.04); border-color: var(--border); }
.project-name.placeholder { color: var(--text-2); font-style: italic; font-weight: 500; cursor: pointer; font-size: 14px; }
.project-name-edit-icon { display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px; color: var(--text-2); margin-left: 6px; flex-shrink: 0; }
.project-meta-count { font-size: 13px; font-weight: 600; color: var(--text-2); }
.project-total-big { font-size: 24px; font-weight: 800; color: var(--primary); line-height: 1; font-variant-numeric: tabular-nums; }
.project-total-label { font-size: 11px; color: var(--text-2); margin-top: 2px; }
.project-body { padding: 14px 22px 16px; }
.project-empty { padding: 24px 22px; color: var(--text-2); font-size: 13px; text-align: center; }
.project-actions { padding: 12px 22px; border-top: 1px solid var(--border); display: flex; gap: 8px; flex-wrap: wrap; background: var(--bg-2); }

.stack-bar { display: flex; height: 10px; border-radius: 5px; overflow: hidden; background: var(--border); margin-bottom: 12px; }
.stack-seg { height: 100%; min-width: 2px; transition: width .2s ease; }

.state-list { display: flex; flex-direction: column; gap: 6px; }
.state-row { display: flex; align-items: center; font-size: 13px; }
.state-name { flex: 1; color: var(--text-2); }
.state-qty { font-weight: 700; color: var(--text); font-variant-numeric: tabular-nums; }

.prod-actions { display: flex; gap: 8px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--border); flex-wrap: wrap; }

/* BOM 清单表（辅料仓专用）：卡片内嵌的"该项目辅料清单"表 */
.bom-table-wrap { margin-bottom: 4px; overflow-x: auto; }
.bom-table { width: 100%; border-collapse: collapse; font-size: 13px; table-layout: fixed; }
.bom-table colgroup col:nth-child(1) { width: 12%; }   /* 编码 */
.bom-table colgroup col:nth-child(2) { width: 20%; }   /* 辅料名称 */
.bom-table colgroup col:nth-child(3) { width: 14%; }   /* 规格 */
.bom-table colgroup col:nth-child(4) { width: 8%;  }   /* 单位 */
.bom-table colgroup col:nth-child(5) { width: 13%; }   /* 当前库存 */
.bom-table colgroup col:nth-child(6) { width: 13%; }   /* 单台用量 */
.bom-table colgroup col:nth-child(7) { width: 12%; }   /* 备注 */
.bom-table colgroup col:nth-child(8) { width: 8%;  }   /* 操作 */
.bom-table thead th { text-align: left; padding: 8px 10px; border-bottom: 1px solid var(--border); color: var(--text-2); font-weight: 600; font-size: 12px; background: var(--bg-2); white-space: nowrap; }
/* 关键修复：thead <th> 上的 td-right/td-num/td-center 类必须真正生效；
   否则 <th class="td-right">单位</th> 会被上面那条"text-align: left"覆盖为左对齐，
   与卡片头(.project-cell.col-4 右对齐)和 tbody td(右对齐)都不在一条竖线上。 */
.bom-table thead th.td-right { text-align: right; }
.bom-table thead th.td-num { text-align: right; }
.bom-table thead th.td-center { text-align: center; }
.bom-table tbody td { padding: 9px 10px; border-bottom: 1px solid var(--border); vertical-align: middle; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bom-table tbody td.td-num { text-align: right; font-variant-numeric: tabular-nums; }
.bom-table tbody td.td-ellipsis { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bom-table tbody td.td-center { text-align: center; }
.bom-table tbody td.td-right { text-align: right; }
.bom-table tbody tr:last-child td { border-bottom: none; }
.bom-table tbody td.low-stock { color: var(--danger); font-weight: 600; }
.bom-table tbody td.qty-cell { font-weight: 700; font-variant-numeric: tabular-nums; color: var(--primary); text-align: right; }
.bom-table tbody td .cell-full { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.state-edit-row { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.state-edit-row .st-name { flex: 1; }
.state-edit-row .st-qty { width: 96px; }
.state-sum { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border); font-size: 14px; color: var(--text-2); text-align: right; }
.state-sum strong { color: var(--primary); font-size: 18px; margin-left: 4px; }

.row-flex { display: flex; gap: 8px; align-items: center; }
.row-flex select { flex: 1; }

.tpl-row { display: flex; gap: 8px; align-items: center; margin-bottom: 10px; }
.tpl-row .tpl-name { width: 130px; }
.tpl-row .tpl-states { flex: 1; }

.btn-icon { width: 14px; height: 14px; fill: currentColor; margin-right: 4px; vertical-align: -2px; }
.form-note { font-size: 12px; color: var(--text-2); background: var(--bg); border-radius: 8px; padding: 10px 12px; line-height: 1.6; }

/* v3.15 加工流转单 */
/* ---------- v3.64 可搜索物料选择器（加工流转·物料）---------- */
/* 原生 select 换成「输入即筛选」的下拉：候选最多 5 条，更多的靠继续输入缩小范围 */
.ac-wrap { position: relative; }
/* v4.20 联想输入框右侧「收起/展开」小三角（赞哥 2026-10-31）：录新规格时可把候选弹层收起来 */
.ac-wrap .ac-input { padding-right: 30px; }
.ac-tri {
  position: absolute; right: 8px; top: 50%; transform: translateY(-50%);
  width: 22px; height: 22px; padding: 0; border: none; background: transparent;
  color: var(--text-2, #888); font-size: 11px; line-height: 1; cursor: pointer;
  z-index: 61; border-radius: 6px; display: flex; align-items: center; justify-content: center;
}
.ac-tri:hover { background: rgba(127, 127, 127, 0.15); color: var(--text-1, #333); }
.ac-wrap .ac-input { width: 100%; }
.ac-pop {
  position: absolute; left: 0; right: 0; top: calc(100% + 4px);
  z-index: 60; padding: 4px; max-height: 320px; overflow-y: auto;
  background: var(--card-solid); border: 1px solid var(--border);
  border-radius: 10px; box-shadow: var(--shadow);
  /* v4.12 弹层空白区不拦截鼠标：弹层盖住下方字段（如入库页的「规格型号」正好在名称框正下方）时，
     点一下就直接落到那个字段上，不用「先点空白关掉、再点一次」。候选项单独恢复可点（见 .ac-item）。
     ⚠️ 候选项上限 5 行（MAT_PICK_MAX）→ 弹层不会超过 max-height，禁掉滚动不影响使用。 */
  pointer-events: none;
}
.ac-item { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 7px; cursor: pointer; pointer-events: auto; }
.ac-item.active, .ac-item:hover { background: var(--primary-light); }
.ac-item .ac-name { font-size: 13px; font-weight: 600; color: var(--text); }
.ac-item .ac-spec { font-size: 12px; color: var(--text-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ac-item .ac-meta { margin-left: auto; font-size: 12px; color: var(--text-2); font-variant-numeric: tabular-nums; white-space: nowrap; }
.ac-item.active .ac-meta, .ac-item:hover .ac-meta { color: var(--primary); }
.ac-more, .ac-empty { padding: 7px 10px; font-size: 12px; color: var(--text-2); }
.ac-more { border-top: 1px solid var(--border); margin-top: 2px; }
.tf-out-row { display: flex; gap: 8px; align-items: center; margin-bottom: 8px; }
.tf-out-row .tf-out-state { flex: 2 1 0; min-width: 0; }
.tf-out-row .tf-out-qty { flex: 1 1 0; min-width: 90px; }
.tf-out-row button { flex: 0 0 auto; padding: 6px 10px; line-height: 1; }
.tf-calc { font-size: 13px; color: var(--text-2); background: var(--bg-2); border-radius: 8px; padding: 10px 12px; margin: 4px 0 12px; line-height: 1.6; }
.tf-pager { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 12px; }
.tf-pager button[disabled] { opacity: .45; cursor: not-allowed; }
.tf-pager .muted { font-size: 13px; }

/* v3.28 工具栏内联开关（仅看低库存等） */
.inline-toggle { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--text-2); cursor: pointer; user-select: none; padding: 6px 10px; border-radius: 20px; border: 1px solid var(--border); background: var(--card-solid); }
.inline-toggle:hover { color: var(--text); border-color: var(--primary); }
.inline-toggle input { margin: 0; cursor: pointer; }
.inline-toggle input:checked + span,
.inline-toggle:has(input:checked) { color: var(--warn, #c97a00); border-color: var(--warn, #c97a00); }

/* v3.28 报表日期快捷按钮组 */
.quick-range { display: inline-flex; gap: 4px; flex-wrap: wrap; }
.quick-range button { padding: 4px 10px; font-size: 12px; border-radius: 16px; border: 1px solid var(--border); background: var(--card-solid); color: var(--text-2); cursor: pointer; }
.quick-range button:hover { color: var(--text); border-color: var(--primary); }
.quick-range button.active { background: var(--primary); color: #fff; border-color: var(--primary); }

/* ---------- v3.25 统计报表：三页签 + 统计卡 ---------- */
/* v4.10b：页签变紧凑 —— 原来 `flex:1 1 250px; min-width:220px`，5 个页签要 1250px，
   而他顶栏可用宽只有约 788px → **第 5 个必然换行**，留一条空荡荡的横带（赞哥截图吐槽"太丑"）。
   改成等分紧凑：小屏两行也整齐，宽屏一行放得下 5 个，不再有突兀的空行。 */
.rep-tabs { display: flex; gap: 10px; margin-bottom: 14px; flex-wrap: wrap; }
.rep-tab {
  flex: 1 1 0; min-width: 148px; display: flex; align-items: center; gap: 10px;
  padding: 10px 12px; border-radius: var(--radius); border: 1px solid var(--border);
  background: var(--card); box-shadow: var(--shadow-card); cursor: pointer; text-align: left;
  transition: transform .15s, border-color .15s, background .15s; position: relative; overflow: hidden;
}
.rep-tab:hover { transform: translateY(-2px); border-color: var(--primary-2); }
.rep-tab-icon {
  width: 34px; height: 34px; flex: 0 0 34px; border-radius: 10px; display: grid; place-items: center;
  background: var(--bg); color: var(--text-2); transition: background .15s, color .15s;
}
.rep-tab-icon svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.rep-tab-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.rep-tab-txt b { font-size: 13.5px; font-weight: 700; color: var(--text); white-space: nowrap; }
.rep-tab-txt i { font-style: normal; font-size: 11.5px; color: var(--text-2); line-height: 1.3;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.rep-tab.active { border-color: var(--primary); background: var(--card-solid); box-shadow: var(--shadow-card-hover); }
.rep-tab.active::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: linear-gradient(90deg, var(--primary), var(--primary-2)); }
.rep-tab.active .rep-tab-icon { background: var(--primary-light); color: var(--primary); }
.rep-tab.active .rep-tab-txt b { color: var(--primary); }
.rep-panel { padding: 14px 14px 12px; }
.rep-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid var(--border); }
.rep-panel-head .card-title { margin: 0; }
.rep-panel-head .card-title svg { fill: none; stroke: var(--primary); stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.toolbar-tip { color: var(--text-2); font-size: 12px; }
/* v3.42 出入库记录「合计条」 */
.rec-summary {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px;
  padding: 10px 14px; margin-bottom: 12px;
  background: var(--primary-light); border: 1px solid var(--primary-border); border-radius: 10px;
  font-size: 13px; color: var(--text-2);
}
.rec-summary .rec-sum-title { font-weight: 700; color: var(--text); letter-spacing: 1px; }
.rec-summary .rec-sum-item { display: inline-flex; align-items: baseline; gap: 4px; white-space: nowrap; }
.rec-summary .rec-sum-item b { font-size: 16px; font-weight: 800; font-variant-numeric: tabular-nums; }
.rec-summary .rec-sum-item i { font-style: normal; font-size: 12px; opacity: 0.75; }
.rec-sum-out b { color: var(--danger); }
.rec-sum-reject b { color: #B91C1C; }
.rec-sum-in b { color: var(--success); }
.rec-sum-inbound b { color: var(--primary); }
.rec-sum-net b { color: var(--warn); }
/* v3.55 实收（净入库）：只在筛选到单一物料时出现，用底色+描边强调"这是净数" */
.rec-summary .rec-sum-netin { background: var(--card-solid); border: 1px solid var(--primary); border-radius: 8px; padding: 4px 10px; }
.rec-sum-netin b { color: var(--primary); }
/* v3.55 口径标记：一眼区分"单个物料"还是"整个库" */
.rec-summary .rec-sum-scope { margin-left: auto; font-size: 11.5px; padding: 3px 10px; border-radius: 20px; white-space: nowrap; }
.rec-summary .rec-sum-scope.single { background: var(--primary); color: #fff; border: 1px solid var(--primary); }
.rec-summary .rec-sum-scope.multi { background: var(--card-solid); color: var(--text-2); border: 1px solid var(--border); }
.rep-range-tip { margin: 2px 0 12px; color: var(--text-2); font-size: 12px; }
.stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(148px, 1fr)); gap: 14px; margin-bottom: 14px; }
.stat-card {
  position: relative; padding: 13px 16px; border-radius: 12px; background: var(--card-solid);
  border: 1px solid var(--border); box-shadow: var(--shadow); overflow: hidden;
}
.stat-card::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--sc, var(--primary)); }
.stat-card-label { font-size: 12px; color: var(--text-2); }
.stat-card-value { font-size: 26px; font-weight: 800; line-height: 1.25; margin-top: 4px; color: var(--sc, var(--primary)); font-variant-numeric: tabular-nums; word-break: break-all; }
.stat-card-sub { font-size: 11px; color: var(--text-2); margin-top: 4px; }
.stat-card.blue { --sc: #2563EB; }
.stat-card.green { --sc: #059669; }
.stat-card.orange { --sc: var(--primary); }
.stat-card.purple { --sc: #7C3AED; }
.stat-card.red { --sc: var(--danger); }
.stat-card.gray { --sc: #6B7280; }
.tf-calc b { color: var(--text); font-weight: 500; }

/* v3.21 物料图片：编辑弹窗图片区 + 状态管理卡片缩略图 + 物料库列表缩略图 */
/* v4.15 物料弹窗美化：左侧图片卡 + 右侧分区字段；提示统一落到输入框下方(.fhint)，
   这样每行 label 都是单行等高，输入框顶部自然对齐。 */
.mat-form { display: flex; gap: 20px; align-items: flex-start; }
.mat-form-fields { flex: 1; min-width: 0; }
.form-section + .form-section { margin-top: 16px; }
.fs-title { display: flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 700; color: var(--text-2); margin: 0 0 10px; }
.fs-title::after { content: ""; flex: 1; height: 1px; background: var(--border); }
.form-section .form-row:last-child { margin-bottom: 0; }
.fhint { margin-top: 5px; font-size: 11.5px; line-height: 1.45; color: var(--text-2); }
.mat-wh-note { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 16px; padding: 9px 12px; border-radius: 8px; background: var(--bg-2); border-left: 3px solid var(--primary-2); font-size: 12px; line-height: 1.6; color: var(--text-2); }
.mat-wh-note .mwn-txt { flex: 1; min-width: 0; }
.mat-wh-note .mwn-txt b { color: var(--text); }
.mat-wh-note .btn { flex-shrink: 0; }

/* v4.16 改归属小弹窗 */
.cw-box { display: flex; flex-direction: column; gap: 12px; }
.cw-mat { font-size: 15px; font-weight: 700; color: var(--text); padding-bottom: 2px; }
.cw-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 13px; }
.cw-row > label { width: 62px; flex-shrink: 0; font-size: 12px; font-weight: 600; color: var(--text-2); }
.cw-row > b { font-weight: 700; color: var(--text); }
.cw-row > select { flex: 1; min-width: 140px; padding: 8px 10px; border-radius: 8px; border: 1px solid var(--border); background: var(--card-solid); font-size: 13px; }
.cw-arrow { color: var(--primary-2); font-weight: 700; }
.cw-hint { width: 100%; padding-left: 70px; margin-top: -4px; font-size: 11.5px; color: var(--text-2); }
.cw-note { font-size: 12px; line-height: 1.65; color: var(--text-2); background: var(--bg-2); border-radius: 8px; padding: 8px 11px; }
.cw-note:empty { display: none; }
.cw-note-safe { border-left: 3px solid var(--primary-2); }
/* 编辑弹窗图片区 */
.mat-img-box {
  width: 156px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 12px;
  background: var(--bg-2);
  border-radius: 12px;
  border: 1px dashed var(--border, #e5e7eb);
}
.mat-img-preview {
  width: 132px;
  height: 132px;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 6px rgba(0,0,0,0.08);
}
.mat-img-preview img { width: 100%; height: 100%; object-fit: cover; }
.mat-img-preview.img-error { background: #fee2e2; }
.mat-img-placeholder {
  width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 48px; font-weight: 600; letter-spacing: 0;
  text-shadow: 0 2px 6px rgba(0,0,0,0.15);
  user-select: none;
}
.mat-img-actions {
  display: flex; gap: 6px; align-items: center; flex-wrap: wrap; justify-content: center;
}
.mat-img-hint { width: 100%; text-align: center; font-size: 12px; color: var(--text-2); }
.btn.btn-mini {
  padding: 4px 10px; font-size: 12px; line-height: 1.4; cursor: pointer;
  border-radius: 6px; border: 1px solid var(--border, #e5e7eb);
  background: var(--bg, #fff); color: var(--text);
}
/* v4.15 窄屏：图片区不要挤在字段左侧 */
@media (max-width: 760px) {
  .mat-form { flex-direction: column; }
  .mat-img-box { width: 100%; }
}
.btn.btn-mini:hover { background: var(--bg-2); border-color: var(--primary, #f97316); color: var(--primary, #f97316); }

/* 状态管理卡片缩略图：头部右侧 56×56 圆角，hover 放大；三列布局防重叠 */
.prod-head { position: relative; display: grid; grid-template-columns: 1fr auto auto; gap: 10px; align-items: flex-start; }
.prod-title { min-width: 0; } /* 防止长物料名撑破 */
.prod-total { padding-top: 4px; }
.prod-thumb-wrap {
  width: 56px; height: 56px;
  border-radius: 8px; overflow: hidden;
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
  cursor: pointer; transition: transform .15s ease, box-shadow .15s ease;
  position: relative; /* 不再 absolute */
}
.prod-thumb-wrap:hover { transform: scale(1.08); box-shadow: 0 4px 12px rgba(0,0,0,0.16); }
.prod-thumb {
  width: 100%; height: 100%; object-fit: cover; display: block;
}
.prod-thumb-ph {
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 24px; font-weight: 600; text-shadow: 0 1px 3px rgba(0,0,0,0.15);
  user-select: none;
}

/* 物料库列表缩略图 */
.mat-thumb {
  width: 40px; height: 40px;
  border-radius: 6px; object-fit: cover; display: block;
  box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}
.mat-thumb-ph {
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 16px; font-weight: 600;
  text-shadow: 0 1px 2px rgba(0,0,0,0.15);
}

/* ===== v3.71 出入库记录「导出整页图片」 ===== */
/* 离屏舞台：fixed 定位不撑页面滚动条，遮罩盖在其上，用户看不到中间过程 */
#imgExportStage { position: fixed; left: 0; top: 0; z-index: 200; background: #fff; }
.img-export-mask { position: fixed; inset: 0; z-index: 320; background: rgba(17,24,39,0.45); display: flex; align-items: center; justify-content: center; }
.img-export-box { background: #fff; border-radius: 14px; padding: 26px 32px; text-align: center; min-width: 280px; box-shadow: 0 20px 50px -12px rgba(0,0,0,0.35); }
.img-export-spin { width: 34px; height: 34px; margin: 0 auto 14px; border-radius: 50%; border: 3px solid #FED7AA; border-top-color: #EA580C; animation: imgSpin .8s linear infinite; }
@keyframes imgSpin { to { transform: rotate(360deg); } }
.img-export-text { font-size: 14px; font-weight: 700; color: #111827; }
.img-export-sub { margin-top: 6px; font-size: 12px; color: #6B7280; }

/* 成图版式：固定浅色、与主题无关（发给别人/打印时始终白底黑字） */
.img-export-root {
  width: 1240px; box-sizing: border-box; padding: 26px 28px 18px;
  background: #FFFFFF; color: #111827; font-size: 13px;
  font-family: "Microsoft YaHei", "PingFang SC", -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}
.img-export-root .img-head { display: flex; align-items: flex-end; justify-content: space-between; border-bottom: 2px solid #EA580C; padding-bottom: 10px; }
.img-export-root .img-title { font-size: 22px; font-weight: 800; letter-spacing: 1.5px; color: #111827; }
.img-export-root .img-brand { font-size: 12px; color: #6B7280; }
.img-export-root .img-meta { margin-top: 10px; font-size: 12.5px; color: #374151; line-height: 1.7; }
.img-export-root .img-sub { margin-top: 2px; font-size: 12px; color: #9CA3AF; }
.img-export-root .img-summary { margin: 12px 0 10px; }
.img-export-root .rec-summary { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; padding: 9px 12px; background: #FFF7ED; border: 1px solid #FED7AA; border-radius: 10px; font-size: 13px; color: #111827; }
.img-export-root .rec-sum-title { font-weight: 700; color: #374151; letter-spacing: 1px; }
.img-export-root .rec-sum-item { display: inline-flex; align-items: baseline; gap: 4px; white-space: nowrap; }
.img-export-root .rec-sum-item b { font-size: 16px; font-weight: 800; font-variant-numeric: tabular-nums; }
.img-export-root .rec-sum-item i { font-style: normal; font-size: 12px; color: #6B7280; }
.img-export-root .rec-sum-out b { color: #DC2626; }
.img-export-root .rec-sum-reject b { color: #B91C1C; }
.img-export-root .rec-sum-in b { color: #059669; }
.img-export-root .rec-sum-inbound b { color: #EA580C; }
.img-export-root .rec-sum-net b { color: #D97706; }
.img-export-root .rec-sum-netin { background: #fff; border: 1px solid #EA580C; border-radius: 8px; padding: 4px 10px; }
.img-export-root .rec-sum-netin b { color: #EA580C; }
.img-export-root .rec-sum-scope { margin-left: auto; font-size: 11.5px; padding: 3px 10px; border-radius: 20px; white-space: nowrap; }
.img-export-root .rec-sum-scope.single { background: #EA580C; color: #fff; }
.img-export-root .rec-sum-scope.multi { background: #fff; color: #4B5563; border: 1px solid #E5E7EB; }
.img-export-root table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 12.5px; }
.img-export-root th, .img-export-root td { padding: 7px 9px; text-align: left; border-bottom: 1px solid #E5E7EB; vertical-align: top; overflow-wrap: anywhere; }
.img-export-root th { background: #F3F4F6; color: #4B5563; font-weight: 700; font-size: 12px; border-bottom: 1px solid #D1D5DB; white-space: nowrap; }
.img-export-root tbody tr:nth-child(even) td { background: #FAFAFA; }
.img-export-root .c-time { white-space: nowrap; color: #374151; font-variant-numeric: tabular-nums; }
.img-export-root .c-qty { text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; }
.img-export-root .c-name { font-weight: 600; }
.img-export-root .tag { display: inline-block; padding: 2px 8px; border-radius: 11px; font-size: 11px; font-weight: 700; white-space: nowrap; }
.img-export-root .tag-out { background: #FFF7ED; color: #C2410C; border: 1px solid #FED7AA; }
.img-export-root .tag-reject { background: #FEF2F2; color: #B91C1C; border: 1px solid #FECACA; }
.img-export-root .tag-in { background: #ECFDF5; color: #047857; border: 1px solid #A7F3D0; }
.img-export-root .tag-inbound { background: #EFF6FF; color: #1D4ED8; border: 1px solid #BFDBFE; }
.img-export-root .tag-cat { background: #FFF7ED; color: #EA580C; border: 1px solid #FED7AA; }
.img-export-root .img-foot { margin-top: 10px; display: flex; justify-content: space-between; font-size: 11.5px; color: #9CA3AF; border-top: 1px solid #E5E7EB; padding-top: 8px; }
.toolbar-right .btn + .btn { margin-left: 8px; }

/* ===== v3.72 通用「导出整页图片」：其余四页共用（消耗统计 / 产品明细 / 加工流转 / 物料库） ===== */
/* 关键数字卡（图片版，固定浅色、与主题无关） */
.img-export-root .img-cards { display: flex; flex-wrap: wrap; gap: 10px; margin: 14px 0 4px; }
.img-export-root .img-card { flex: 1 1 150px; min-width: 128px; background: #FAFAFA; border: 1px solid #E5E7EB; border-left: 4px solid #EA580C; border-radius: 8px; padding: 8px 12px; box-sizing: border-box; }
.img-export-root .img-card .ic-label { font-size: 11.5px; color: #6B7280; letter-spacing: 0.5px; }
.img-export-root .img-card .ic-value { margin-top: 3px; font-size: 19px; font-weight: 800; color: #111827; font-variant-numeric: tabular-nums; }
.img-export-root .img-card .ic-sub { margin-top: 2px; font-size: 11.5px; color: #6B7280; font-variant-numeric: tabular-nums; }
/* 占比条（排行用，不依赖页面 chart-* 样式） */
.img-export-root .c-bar { padding-top: 10px; }
.img-export-root .img-bar { height: 9px; background: #F3F4F6; border-radius: 6px; overflow: hidden; }
.img-export-root .img-bar > i { display: block; height: 9px; border-radius: 6px; }
.img-export-root .c-sub { margin-top: 2px; font-size: 11.5px; color: #6B7280; }
.img-export-root .c-loss { color: #DC2626; font-weight: 700; }
.img-export-root th.c-qty, .img-export-root td.c-qty { text-align: right; }
.img-export-root tr.img-total td { background: #F9FAFB; font-weight: 800; border-top: 1px solid #D1D5DB; }
.img-export-root tr.img-low td { background: #FEF6F6; }

/* ===== v3.73/v3.74 列表页「填满可用高度」，消除卡片底下的大片留白 =====
   背景：列表区高度是写死的（.table-wrap 的 55vh），与屏幕高低无关；而内容区是撑满视口的
        弹性块 → 屏幕一高，卡片底下就露出一整块页面背景色，看着"空了一截"。
   做法：内容区加 .content-fill（纵向弹性），由 JS（syncContentFill）把「表格容器 → 内容区」
        这条链逐层标上 .fill-pass（吸收剩余高度）、表格容器标 .fill-list（自适应滚动区）。
   注意：只对白名单页面启用（物料库 / 出入库记录 / 统计报表）；状态管理、看板、首页这类
        多卡片长页面**不能**启用 —— 强行压到一屏会把里面内容挤坏。
   下方规则顺序不能乱：.fill-pass 的值要能盖过 `.fill-pass > *`，.fill-list 要能盖过两者。 */
.content.content-fill { display: flex; flex-direction: column; }
.content.content-fill > * { flex: 0 0 auto; }
.content.content-fill .fill-pass > * { flex: 0 0 auto; }
.content.content-fill .fill-pass { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
.content.content-fill .fill-list { flex: 1 1 auto; min-height: 220px; max-height: none; }
/* v3.74 补充：没有表格的填满区（"输入产品名称后点查询"这类空状态）内容垂直居中，别顶在最上面 */
.content.content-fill .fill-list.fill-center { display: flex; flex-direction: column; }
.content.content-fill .fill-list.fill-center > .empty-state { margin: auto 0; }

/* ===== v3.76 审计账号（v3.79 起界面上叫「账号」）提示条 =====
   四类录单页（出库/退货/退料/入库）统一放在提交按钮上方，
   让人在提交前清楚「这笔操作会记在谁名下」。纯只读展示，不可编辑。 */
.audit-bar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 14px; padding: 9px 12px; background: var(--bg-2); border: 1px solid var(--border); border-radius: 8px; font-size: 13px; }
.audit-bar .audit-bar-k { color: var(--text-2); }
.audit-bar b { color: var(--primary); font-weight: 600; }
.audit-bar .audit-bar-t { color: var(--text-2); font-size: 12px; opacity: 0.75; }

/* ===== v3.83 单据模块 · 报价单（财务部「单据模块」栏目）=====
   上面填写（跟随主题配色），下面 A4 预览复用 .print-sheet（始终白底黑字，与打印/导出图片一致）。 */
.quote-wrap { display: flex; flex-direction: column; gap: 16px; }
.quote-form { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px 14px; padding: 2px 0 14px; }
.quote-form .qf { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.quote-form .qf.span2 { grid-column: span 2; }
.quote-form .qf.span3 { grid-column: span 3; }
.quote-form .qf label { font-size: 12.5px; color: var(--text-2); font-weight: 500; }
.quote-form .qf.span4 { grid-column: span 4; }
.quote-form .qf input, .quote-form .qf textarea { width: 100%; padding: 9px 11px; border: 1px solid var(--border); border-radius: 9px; background: var(--card-solid); color: var(--text); font-size: 13.5px; font-family: inherit; }
.quote-form .qf textarea { resize: vertical; line-height: 1.75; }
.quote-form .qf input:focus, .quote-form .qf textarea:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-light); }
.quote-items-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 6px 0 8px; }
.quote-items-head span { font-size: 13.5px; font-weight: 600; color: var(--text); }
/* 明细填写表格：输入框贴在格子里，看着就是"在单据表格上打字" */
.quote-input-box { overflow-x: auto; }
.quote-input-table { width: 100%; border-collapse: collapse; font-size: 12.5px; min-width: 1180px; }
.quote-input-table th, .quote-input-table td { border: 1px solid var(--border); padding: 2px 3px; }
.quote-input-table th { background: var(--bg); color: var(--text-2); font-weight: 600; font-size: 12px; text-align: left; white-space: nowrap; line-height: 1.35; }
.quote-input-table input { width: 100%; border: none; background: transparent; color: var(--text); font-size: 12.5px; padding: 6px 3px; font-family: inherit; }
.quote-input-table input:focus { outline: none; background: var(--primary-light); border-radius: 4px; }
.quote-input-table .qi-idx { text-align: center; color: var(--text-2); }
.quote-input-table .qi-amt { text-align: right; font-weight: 600; white-space: nowrap; font-variant-numeric: tabular-nums; font-size: 12.5px; }
.qi-del { border: none; background: transparent; color: var(--text-2); cursor: pointer; font-size: 17px; line-height: 1; padding: 2px 4px; border-radius: 5px; }
.qi-del:hover { color: var(--danger); background: var(--danger-light); }
.quote-preview { overflow-x: auto; }
.quote-preview-hint { font-size: 12.5px; color: var(--text-2); margin-bottom: 8px; }
/* ---------- A4 单据预览：v3.88 起用「正式单据」版式 ----------
   .print-sheet 自带白底黑字；下面只调报价单专属细节。
   配色刻意写死成中性黑灰（单据是给客户看/打印的，不跟随系统主题换色）。 */
/* 1000px ≈ 表格 932px 内容宽 + 左右 padding 34×2：与打印时 A4 横向的排布基本一致 */
.quote-sheet { max-width: 1000px; }
.quote-sheet .qb-head { text-align: center; margin-bottom: 10px; }
.quote-sheet .qb-co { font-size: 17px; font-weight: 700; letter-spacing: 3px; }
.quote-sheet .qb-title { font-size: 20px; font-weight: 700; letter-spacing: 10px; margin-top: 4px; }
.quote-sheet .qb-info, .quote-sheet .qb-grid { width: 100%; border-collapse: collapse; }
.quote-sheet .qb-info td { border: 1px solid #9aa1ab; padding: 5px 7px; font-size: 12px; color: #111827; vertical-align: middle; }
.quote-sheet .qb-info td.k { background: #f2f4f7; width: 62px; text-align: center; color: #4b5563; white-space: nowrap; }
/* v3.90 抬头信息表（.qb-fields）：固定列宽 → 左「客户信息」右「单据信息」各由「标签 + 值」两列组成，
   两个值列等宽，四行严格对齐；与导出 Word / Excel 的同一张抬头表版式一致。 */
.quote-sheet .qb-info.qb-fields { table-layout: fixed; }
.quote-sheet .qb-info.qb-fields td { padding: 6px 9px; line-height: 1.5; overflow-wrap: anywhere; }
/* v3.91 标签两端对齐：「客户 / 电话 / 地址」这类两字标签拉开到跟「联系人 / 有效期」三字同宽，
   四行标签的首字、末字分别落在同一条竖线上（原来居中 → 3 字比 2 字宽半个字，看着毛糙）。
   ⚠️ 拉伸幅度取决于 td.k 的内容宽 = width(60px) − 左右 padding(10px) = 40px（≈ 三个 12px 汉字）：
      四行都是 2~3 字，这个宽度下 3 字几乎满、2 字只多空一个字，观感最稳。
      改 width 或 padding 要成对看，否则不是把 2 字拉散成「客　　户」，就是让 3 字挤到贴边。 */
.quote-sheet .qb-info.qb-fields td.k {
  width: 60px; padding: 6px 10px;
  text-align: justify; text-align-last: justify;
}
.quote-sheet .qb-grid { margin-top: 8px; table-layout: fixed; }
.quote-sheet .qb-grid th, .quote-sheet .qb-grid td { border: 1px solid #9aa1ab; padding: 3px; font-size: 11px; color: #111827; word-break: break-all; }
.quote-sheet .qb-grid thead th { background: #eef1f5; font-weight: 600; text-align: center; line-height: 1.3; }
.quote-sheet .qb-grid td.num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.quote-sheet .qb-grid td.ctr { text-align: center; }
.quote-sheet .qb-grid tfoot td { background: #f7f9fc; font-weight: 700; }
.quote-sheet .qb-grid tfoot .sum-lbl { text-align: right; letter-spacing: 2px; }
.quote-sheet .qb-upper { margin-top: 7px; font-size: 12px; color: #111827; }
.quote-sheet .qb-taxnote { margin-top: 4px; font-size: 11px; color: #4b5563; }
.quote-sheet .qb-terms { margin-top: 9px; font-size: 11px; color: #374151; line-height: 1.8; }
.quote-sheet .qb-sign { margin-top: 10px; }
.quote-sheet .qb-foot { margin-top: 10px; text-align: center; font-size: 10px; color: #6b7280; border-top: 1px solid #e8ebef; padding-top: 6px; }
@media (max-width: 1200px) { .quote-form { grid-template-columns: repeat(2, minmax(0, 1fr)); } .quote-form .qf.span3 { grid-column: span 2; } .quote-form .qf.span4 { grid-column: span 2; } }
@media (max-width: 700px) { .quote-form { grid-template-columns: 1fr; } .quote-form .qf.span2, .quote-form .qf.span3, .quote-form .qf.span4 { grid-column: span 1; } }

/* ===== v3.92 单据模块 · 送货单（照桌面《送货单模板.xlsx》1:1 复刻） =====
   版式数据（列宽/行高/168 个合并区 + 逐格「边框·字体·对齐·底色」）来自 public/delivery_layout.js，
   由 _v392_extract_layout.js 从模板自动提取。下面只是**表格骨架**的通用规则；
   具体某一格长什么样，全部由注入的 .dv-sheet .dvSn 规则决定（模板里大半格子本来就没边框）。 */
/* 页签：报价单 / 送货单（只在页内切换，不改数据库、不动左侧栏目名） */
.doc-tabs { display: flex; gap: 4px; margin: 2px 0 16px; border-bottom: 1px solid var(--border); }
.doc-tab { border: 1px solid transparent; border-bottom: none; background: transparent; color: var(--text-2); font-size: 13.5px; font-weight: 600; padding: 9px 20px; border-radius: 9px 9px 0 0; cursor: pointer; margin-bottom: -1px; font-family: inherit; transition: color .15s, background .15s; }
.doc-tab:hover { color: var(--text); background: var(--bg-tint); }
.doc-tab.active { color: var(--primary); background: var(--card-solid); border-color: var(--border); position: relative; }
.doc-tab.active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--card-solid); }
/* 交货单 / 退货单 切换 */
.dv-kind { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 0 0 14px; }
.dv-kind-btn { border: 1px solid var(--border); background: var(--card-solid); color: var(--text-2); font-size: 13.5px; font-weight: 600; padding: 8px 22px; border-radius: 9px; cursor: pointer; font-family: inherit; letter-spacing: 1px; }
.dv-kind-btn:hover { color: var(--text); }
.dv-kind-btn.active { background: var(--primary); border-color: var(--primary); color: #fff; }
.dv-kind-hint { font-size: 12.5px; color: var(--text-2); margin-left: 4px; }
/* 明细录入表（14 行，和模板行数一致） */
.dv-items-box { overflow-x: auto; }
.dv-items { width: 100%; border-collapse: collapse; font-size: 12.5px; min-width: 1120px; }
.dv-items th, .dv-items td { border: 1px solid var(--border); padding: 2px 3px; }
.dv-items th { background: var(--bg); color: var(--text-2); font-weight: 600; font-size: 11.5px; white-space: nowrap; line-height: 1.35; }
.dv-items input { width: 100%; border: none; background: transparent; color: var(--text); font-size: 12.5px; padding: 6px 3px; font-family: inherit; }
.dv-items input:focus { outline: none; background: var(--primary-light); border-radius: 4px; }
.dv-items td.ctr { text-align: center; color: var(--text-2); }
/* 单据底纸：946.47 × 1478.23 px 就是模板的真实尺寸（33 列 × 39 行），一分不差 */
.dv-sheet-box { width: 946.47px; }
.dv-sheet { width: 946.47px; table-layout: fixed; border-collapse: collapse; background: #fff; color: #000; }
/* 骨架默认无边框无内边距 —— 有没有框、什么字，全看 .dvSn（与模板逐格对齐） */
.dv-sheet td { border: none; padding: 0 2px; font-size: 14.67px; line-height: 1.15; overflow: hidden; vertical-align: middle; }
/* 打印：与模板同一套打印设置（A4 纵向 · 64% 缩放 · 页边距 0.7in / 0.75in） */
.dv-print-sheet { width: 946.47px; max-width: none; padding: 0; }
@media (max-width: 1240px) { .dv-sheet-box, .dv-sheet { width: 100%; } }

/* ===== v3.94 单据模块 · 对账单（汇总表「采购对帐单」+ 明细表「对账数量明细」，照桌面模板复刻）
   与送货单同理：上面是录入区（跟随主题配色），下面是 A4 预览（白底黑字，与打印/导出图片一致）。 ===== */
.st-toolrow { display: flex; gap: 18px; align-items: flex-end; flex-wrap: wrap; margin: 0 0 14px; }
.st-toolrow .qf { display: flex; flex-direction: column; gap: 5px; margin: 0; }
.st-toolrow label { font-size: 12.5px; color: var(--text-2); font-weight: 600; }
.st-toolrow input[type="text"], .st-toolrow input[type="month"] { height: 36px; border: 1px solid var(--border); border-radius: 8px; padding: 0 10px; font-size: 13.5px; background: var(--card-solid); color: var(--text); font-family: inherit; box-sizing: border-box; }
.st-monthf { flex: 0 0 auto; width: 168px; }
.st-sellerf { flex: 0 0 auto; width: 268px; }
.st-import { display: flex; align-items: center; gap: 10px; padding-bottom: 2px; flex-wrap: wrap; }
.st-import-hint { font-size: 12px; color: var(--text-2); }
.st-import-hint b { color: var(--primary); }
/* 台账读进来后的月份选择条 */
.st-ledger { margin: 0 0 14px; padding: 12px 14px; border-radius: 10px; background: var(--primary-light); border: 1px solid var(--border); }
.st-ledger-head { font-size: 13px; color: var(--text); margin-bottom: 9px; }
.st-ledger-head b { color: var(--primary); }
.st-ledger-months { display: flex; gap: 8px; flex-wrap: wrap; }
.st-ledger-m { display: flex; flex-direction: column; gap: 2px; align-items: flex-start; padding: 7px 14px; }
.st-ledger-m span { font-size: 11px; color: var(--text-2); font-weight: 400; }
.st-ledger-tip { font-size: 12px; color: var(--text-2); margin-top: 9px; line-height: 1.6; }
.st-count { font-size: 12.5px; color: var(--text-2); margin: 2px 0 10px; }
.st-count b { color: var(--text); }
.st-rowbtns { display: flex; align-items: center; gap: 8px; }
.st-keepzero { display: flex; align-items: center; gap: 5px; font-size: 12.5px; font-weight: 400; color: var(--text-2); white-space: nowrap; cursor: pointer; }
/* 零件清单录入表 */
.st-items-box { overflow-x: auto; }
.st-items { width: 100%; border-collapse: collapse; font-size: 12.5px; min-width: 1180px; }
.st-items th, .st-items td { border: 1px solid var(--border); padding: 2px 3px; }
.st-items th { background: var(--bg); color: var(--text-2); font-weight: 600; font-size: 11.5px; white-space: nowrap; line-height: 1.35; }
.st-items input { width: 100%; border: none; background: transparent; color: var(--text); font-size: 12.5px; padding: 6px 3px; font-family: inherit; box-sizing: border-box; }
.st-items input:focus { outline: none; background: var(--primary-light); border-radius: 4px; }
.st-items td.ctr { text-align: center; color: var(--text-2); }
.st-items td.rt { text-align: right; color: var(--text-2); font-variant-numeric: tabular-nums; }
.st-items tr.st-new td { background: #fff7d6; }
.st-del { border: none; background: transparent; color: var(--text-2); font-size: 16px; line-height: 1; cursor: pointer; padding: 3px 7px; border-radius: 5px; font-family: inherit; }
.st-del:hover { background: var(--danger-light, #fdecec); color: var(--danger, #c0392b); }
/* 逐日数量（可折叠） */
.st-daily-head { display: flex; align-items: center; gap: 10px; margin: 14px 0 8px; flex-wrap: wrap; }
.st-daily-hint { font-size: 12px; color: var(--text-2); }
.st-daily-box { overflow-x: auto; }
.st-daily { border-collapse: collapse; font-size: 12px; }
.st-daily th, .st-daily td { border: 1px solid var(--border); padding: 0; min-width: 40px; }
.st-daily th { background: var(--bg); color: var(--text-2); font-weight: 600; padding: 4px 3px; font-size: 11px; }
.st-daily input { width: 46px; border: none; background: transparent; color: var(--text); font-size: 12px; padding: 5px 3px; text-align: center; font-family: inherit; box-sizing: border-box; }
.st-daily input:focus { outline: none; background: var(--primary-light); }
.st-daily td.st-daily-name { padding: 5px 8px; color: var(--text); white-space: nowrap; }
.st-daily td.st-daily-sum { color: var(--text-2); padding: 5px 6px; font-variant-numeric: tabular-nums; }
/* ===== 两张表的「纸」——始终白底黑字（要打印/导出图片，不受主题影响） ===== */
.st-sheet-title { font-size: 13px; font-weight: 700; color: var(--text); margin: 0 0 8px; }
.st-sheet-box { width: max-content; margin-bottom: 22px; }
.st-sheet { table-layout: fixed; border-collapse: collapse; background: #fff; color: #000; font-family: "Microsoft YaHei", "微软雅黑", SimSun, sans-serif; }
.st-sheet td { border: 1px solid #333; padding: 2px 4px; font-size: 11.5px; line-height: 1.32; overflow: hidden; vertical-align: middle; word-break: break-all; }
.st-sheet .rt { text-align: right; font-variant-numeric: tabular-nums; }
.st-sheet .ctr { text-align: center; }
.st-sheet .st-rTitle td { text-align: center; font-size: 15px; font-weight: 700; line-height: 1.5; padding: 7px 4px; letter-spacing: .5px; }
.st-sheet .st-lbl { font-weight: 700; }
.st-sheet .st-brand td { text-align: center; font-weight: 700; letter-spacing: 6px; font-size: 12.5px; }
.st-sheet .st-th td { text-align: center; font-weight: 700; background: #f2f2f2; white-space: pre-wrap; }
.st-sheet .st-sumrow td { font-weight: 700; background: #fafafa; }
.st-sheet .st-dtl-cust td { font-weight: 700; }
.st-sheet .st-dtl-title td { font-weight: 700; }
.st-sheet .st-thnote { font-weight: 400; color: #444; font-size: 10px; }
/* 打印：汇总表 A4 纵向缩一点；明细表是宽表，横向缩 */
.st-print-sum, .st-print-dtl { max-width: none; padding: 0; width: max-content; margin: 0 auto 16px; }
@media (max-width: 1240px) { .st-sheet-box { max-width: 100%; overflow-x: auto; } }

/* ===== v3.85 统计报表：部门/人员「领用明细」行内展开（每月盘点看「都有哪些料」） ===== */
/* 配色一律走主题变量，切换主题时自动跟随，不写死颜色 */
.table-wrap td.c-main { color: var(--text-2); font-size: 12px; max-width: 340px; }
.table-wrap td.c-act { white-space: nowrap; text-align: right; }
.rep-detail-btn { white-space: nowrap; font-variant-numeric: tabular-nums; }
tr.rep-row-open > td { background: var(--primary-light); }
tr.rep-detail-row > td { background: var(--bg-tint); padding: 0; }
.rep-detail-box { margin: 6px 10px 10px 24px; padding: 12px 14px; border-left: 3px solid var(--primary); background: var(--card-solid); border-radius: 10px; }
.rep-detail-title { font-size: 13px; font-weight: 700; color: var(--text); margin-bottom: 8px; }
.rep-detail-empty { padding: 12px 16px; color: var(--text-2); font-size: 12px; }
.rep-detail-table { font-size: 12px; }
.rep-detail-table th, .rep-detail-table td { padding: 6px 8px; }
.rep-detail-table thead th { color: var(--text-2); font-weight: 600; }
@media (max-width: 900px) { .table-wrap td.c-main { max-width: 160px; } .rep-detail-box { margin-left: 8px; } }

/* ===== v3.89 报价单留档：历史报价单查询弹窗 ===== */
/* 配色走主题变量；只影响这个弹窗，不动任何既有页面 */
.qh-box { max-width: 1060px; width: 94%; max-height: 86vh; overflow: auto; padding: 16px 18px; }
.qh-head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.qh-head b { font-size: 15px; color: var(--text); }
.qh-tip { font-size: 12px; color: var(--text-2); }
/* v3.98 关闭按钮右对齐（qh-head 是 flex，auto 外边距把它推到行尾） */
.qh-close { margin-left: auto; flex: 0 0 auto; }
.qh-toolbar { display: flex; gap: 8px; align-items: center; margin-bottom: 10px; flex-wrap: wrap; }
/* ⚠️ 工具栏里的输入框绝不能铺满整行（与全站工具栏一致） */
.qh-toolbar .input-inline { width: 280px; flex: 0 0 auto; }
.qh-table { max-height: 58vh; overflow: auto; }
.qh-table table { width: 100%; font-size: 13px; }
.qh-table th, .qh-table td { padding: 7px 8px; white-space: nowrap; }
.qh-table th.num, .qh-table td.num { text-align: right; font-variant-numeric: tabular-nums; }
.qh-table th.ctr, .qh-table td.ctr { text-align: center; }
.qh-foot { margin-top: 8px; font-size: 12px; }

/* ===== v3.89 辅料仓小条码：编码旁的小条形码（JsBarcode 出的矢量 SVG） ===== */
.mat-bc { display: inline-block; vertical-align: middle; margin-left: 7px; max-height: 26px; opacity: .9; }
.mat-bc-fail { display: none; }


/* ===== v3.95 单据模块 · 合同（国家合同示范文本：工业品买卖合同 GF—2000—0101 / 加工合同 GF—2000—0301）
   条款文字与版式取自国家市场监管总局「全国合同示范文本库」官方原件（public/contract_data.js）。
   上面是录入区（跟随主题配色），下面是 A4 纵向的「纸」（白底黑字，与打印/导出图片一致）。 ===== */
.ct-src { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 2px 0 12px; font-size: 12.5px; color: var(--text-2); }
.ct-src a { color: var(--primary); text-decoration: none; }
.ct-src a:hover { text-decoration: underline; }
.ct-chip { display: inline-block; padding: 2px 10px; border-radius: 999px; background: var(--primary-light); color: var(--primary); font-weight: 700; font-size: 12px; letter-spacing: .3px; }
/* 分区（native <details>，零 JS） */
.ct-sec { border: 1px solid var(--border); border-radius: 10px; padding: 0 14px; margin: 0 0 12px; background: var(--card-solid); }
.ct-sec > summary { cursor: pointer; padding: 11px 2px; font-size: 13.5px; font-weight: 700; color: var(--text); list-style: none; }
.ct-sec > summary::-webkit-details-marker { display: none; }
.ct-sec > summary::before { content: "▸ "; color: var(--text-2); }
.ct-sec[open] > summary::before { content: "▾ "; }
.ct-sec > *:not(summary) { margin-bottom: 12px; }
/* 双方信息 */
.ct-parties { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 14px; }
.ct-party { border: 1px solid var(--border); border-radius: 10px; padding: 10px 12px; background: var(--bg-tint); }
.ct-party-h { font-size: 13px; font-weight: 700; color: var(--primary); margin-bottom: 8px; }
.ct-f { display: flex; align-items: center; gap: 8px; margin: 0 0 6px; font-size: 12.5px; color: var(--text-2); }
.ct-f > span { flex: 0 0 auto; min-width: 92px; text-align: right; }
.ct-f input { flex: 1 1 auto; height: 30px; border: 1px solid var(--border); border-radius: 7px; padding: 0 8px; font-size: 12.5px; background: var(--card-solid); color: var(--text); font-family: inherit; box-sizing: border-box; }
.ct-f input:focus { outline: none; border-color: var(--primary); }
.ct-blanks { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 2px 16px; }
.ct-grp { grid-column: 1 / -1; margin: 8px 0 4px; font-size: 12.5px; font-weight: 700; color: var(--primary); border-bottom: 1px dashed var(--border); padding-bottom: 4px; }
.ct-f-wide > span { min-width: 168px; }
/* 明细录入表（和报价单/对账单同一套骨架） */
.ct-items-box { overflow-x: auto; }
.ct-items { width: 100%; border-collapse: collapse; font-size: 12.5px; min-width: 900px; }
.ct-items th, .ct-items td { border: 1px solid var(--border); padding: 2px 3px; }
.ct-items th { background: var(--bg); color: var(--text-2); font-weight: 600; font-size: 11.5px; white-space: nowrap; line-height: 1.35; }
.ct-items input { width: 100%; border: none; background: transparent; color: var(--text); font-size: 12.5px; padding: 6px 3px; font-family: inherit; box-sizing: border-box; }
.ct-items input:focus { outline: none; background: var(--primary-light); border-radius: 4px; }
.ct-items input[readonly] { color: var(--text-2); font-variant-numeric: tabular-nums; }
.ct-items td.ctr { text-align: center; color: var(--text-2); }
.ct-del { border: none; background: transparent; color: var(--text-2); font-size: 16px; line-height: 1; cursor: pointer; padding: 3px 7px; border-radius: 5px; font-family: inherit; }
.ct-del:hover { background: var(--danger-light, #fdecec); color: var(--danger, #c0392b); }
.ct-rowbtns { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; font-size: 12.5px; }
.ct-rowbtns b { color: var(--text); }
/* ===== 「纸」：A4 纵向（794px），白底黑字，宋体，与官方原件观感一致 ===== */
.ct-prev-wrap { margin-top: 4px; }
.ct-sheet-title { font-size: 13px; font-weight: 700; color: var(--text); margin: 0 0 8px; }
.ct-sheet-box { width: max-content; margin-bottom: 22px; }
.ct-sheet { width: 794px; box-sizing: border-box; padding: 54px 52px 46px; background: #fff; color: #000;
  font-family: SimSun, "宋体", "Songti SC", serif; font-size: 12px; line-height: 1.75; }
.ct-code { font-family: "Times New Roman", SimSun, serif; font-size: 13px; letter-spacing: .5px; }
.ct-title { text-align: center; font-size: 22px; font-weight: 700; letter-spacing: 6px; margin: 10px 0 2px; font-family: SimHei, "黑体", SimSun, sans-serif; }
.ct-sub { text-align: center; font-size: 12px; margin-bottom: 14px; letter-spacing: 2px; }
.ct-head { margin: 0 0 12px; }
.ct-hrow { display: flex; align-items: baseline; gap: 2px; margin: 3px 0; white-space: nowrap; }
.ct-hl { flex: 0 0 auto; white-space: nowrap; }
.ct-head .ct-fill { min-width: 150px; }
.ct-head .ct-fill:last-child { margin-left: 6px; }
/* 留空：填了就写上去并带下划线；没填就只留一条空线（与官方原件一样给手写留位） */
.ct-fill { display: inline-block; min-width: 6em; border-bottom: 1px solid #000; text-align: center; padding: 0 4px; vertical-align: baseline; }
.ct-fill-lg { min-width: 13em; }
.ct-clause { margin: 0 0 2px; text-align: justify; }
.ct-num { font-family: SimHei, "黑体", SimSun, sans-serif; font-weight: 400; }
.ct-note { margin: 0 0 6px; color: #333; }
/* 明细表 / 签章表 */
.ct-tbl { width: 100%; border-collapse: collapse; margin: 6px 0 8px; table-layout: fixed; }
.ct-tbl th, .ct-tbl td { border: 1px solid #000; padding: 2px 3px; font-size: 10.5px; line-height: 1.35; word-break: break-all; vertical-align: middle; }
.ct-tbl th { text-align: center; font-weight: 400; }
.ct-tbl tbody td { height: 20px; }
.ct-tbl tfoot td { font-size: 11px; padding: 4px 5px; }
/* v3.95 材料表：官方原件里是**满页宽**的 7 列等宽表（不是缩到 66%）——
   列宽走 colgroup（与服务端 Word/Excel 同一份 contract_data.js 的 materialWidths）。 */
.ct-tbl-sm { width: 100%; }
.ct-sign { margin-top: 10px; }
.ct-sign > tbody > tr > td { vertical-align: top; padding: 6px 8px; width: 33.33%; }
.ct-sign-in { font-size: 10.5px; line-height: 1.5; }
.ct-sign-h { text-align: center; font-weight: 700; margin-bottom: 4px; }
.ct-sign-r { display: flex; align-items: baseline; gap: 2px; white-space: nowrap; }
.ct-sign-r .ct-fill { flex: 1 1 auto; min-width: 0; }
.ct-sign-date { justify-content: flex-end; margin-top: 6px; }
.ct-foot { margin-top: 10px; font-size: 11px; }
.ct-tip { margin-top: 10px; padding-top: 6px; border-top: 1px dashed #999; font-size: 9.5px; color: #444; font-family: "Microsoft YaHei", sans-serif; line-height: 1.5; }
/* 打印：A4 纵向（官方原件就是 A4 纵向），整张等比缩到纸宽内 */
.ct-print-sheet { width: 794px; max-width: none; padding: 0; }
@media (max-width: 1240px) { .ct-sheet-box { max-width: 100%; overflow-x: auto; } }

/* ---------- v4.19 合同 模板③：加工合同（涂装代加工） ---------- */
/* 录入区：甲方/乙方信息表、13 列价格清单 */
.cg-party-t { min-width: 0; }
.cg-party-t .cg-lab { background: var(--bg); color: var(--text-2); font-size: 12px; white-space: nowrap; width: 1%; }
.cg-price-t { min-width: 0; }
.cg-price-t input { font-size: 12px; }
.cg-price-t th { font-size: 11px; white-space: normal; }
/* 预览：双方信息表 */
.ct-tbl.cg-party-tbl { margin: 8px 0 6px; }
.ct-tbl.cg-party-tbl td { font-size: 10.5px; height: auto; line-height: 1.35; }
.ct-tbl.cg-party-tbl .cg-lab { white-space: nowrap; }
/* 价格清单上方那条「产品类别 / 更新日期 / 版本 / 阶段」横带 */
.cg-meta { display: flex; justify-content: space-between; gap: 8px; border: 1px solid #000; border-bottom: 0; padding: 2px 4px; font-size: 9px; line-height: 1.35; }
.cg-meta span:nth-child(2) { margin-left: auto; margin-right: 16px; }
/* 预览：附件A 价格清单（13 列，字号压小才装得下 A4 纵向） */
.ct-tbl.cg-price { table-layout: fixed; margin: 4px 0 6px; }
.ct-tbl.cg-price th, .ct-tbl.cg-price td { font-size: 8.6px; line-height: 1.32; padding: 1.5px 2px; height: auto; }
.ct-tbl.cg-price th { font-weight: 700; }
.ct-tbl.cg-price .cg-lab { white-space: nowrap; }
.ct-tbl.cg-price .cg-sum { font-size: 9px; font-weight: 700; }
/* 预览：附件A 标题区 / 备注 / 结尾 */
.cg-pagebreak { break-before: page; page-break-before: always; margin-top: 22px; border-top: 1px dashed #ccc; height: 0; }
.cg-att-title { text-align: center; font-size: 20px; font-weight: 700; letter-spacing: 6px; margin: 18px 0 2px; font-family: SimHei, "黑体", SimSun, sans-serif; }
.cg-att-sub { text-align: center; font-size: 12px; letter-spacing: 3px; margin-bottom: 6px; }
.cg-att-sup { font-size: 11px; margin: 0 0 4px; }
.cg-rm-h { text-align: center; font-size: 13px; font-weight: 700; letter-spacing: 8px; margin: 12px 0 6px; }
.cg-rm { margin: 0 0 1px; font-size: 10.5px; text-align: justify; }
.cg-tail { margin: 8px 0 0; font-size: 10.5px; text-align: justify; text-indent: 2em; }
.ct-hrow.cg-no { justify-content: flex-end; }
.ct-hrow.cg-place { margin-top: 6px; }
@media print { .cg-pagebreak { border-top: none; } }

/* ---------- v3.99 生产日报（统计报表 · 第 4 页签） ---------- */
.pd-in { width: 100%; box-sizing: border-box; padding: 6px 8px; border: 1px solid var(--border); border-radius: 8px; background: var(--card, #fff); color: var(--text); font-size: 13px; }
.pd-in:focus { outline: none; border-color: var(--primary); }
.pd-in:disabled { background: var(--bg); color: var(--text-2); }
.pd-in.pd-num { text-align: right; }
.c-num { text-align: right; font-variant-numeric: tabular-nums; }
.pd-two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 6px; }
@media (max-width: 900px) { .pd-two-col { grid-template-columns: 1fr; } }
.pd-trend { display: flex; align-items: flex-end; gap: 10px; padding: 10px 4px 2px; }
.pd-trend-col { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 0; }
.pd-trend-rate { font-size: 11px; font-weight: 700; color: var(--text-2); min-height: 15px; }
.pd-trend-barbox { width: 100%; max-width: 46px; height: 90px; display: flex; align-items: flex-end; background: var(--bg); border-radius: 6px; overflow: hidden; }
.pd-trend-bar { width: 100%; background: linear-gradient(180deg, var(--primary), var(--primary-2)); border-radius: 6px 6px 0 0; transition: height .3s ease; }
.pd-trend-bar.sel { background: linear-gradient(180deg, var(--success), var(--primary)); }
.pd-trend-qty { font-size: 12px; font-weight: 700; }
.pd-trend-day { font-size: 11px; color: var(--text-2); }

/* ---------- v4.00e 生产日报「一屏截图版」：4 大卡 → 3 库存卡 → 本月累计/近7天 → 本月每日数据 ---------- */
.pd-cards-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 12px; }
.pd-cards-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 12px; }
.pd-kpi { position: relative; background: var(--card-solid); border: 1px solid var(--border); border-radius: 14px; padding: 14px 16px 12px; box-shadow: var(--shadow-card); }
.pd-kpi-label { font-size: 13px; color: var(--text-2); }
.pd-kpi-value { font-size: 28px; font-weight: 800; line-height: 1.12; margin-top: 6px; color: var(--text); font-variant-numeric: tabular-nums; word-break: break-all; }
.pd-kpi-unit { font-size: 15px; font-weight: 600; color: var(--text-2); margin-left: 5px; }
.pd-kpi-sub { font-size: 12px; color: var(--text-2); margin-top: 6px; min-height: 16px; }
/* v4.03 / v4.07 / v4.08「白件入库」卡右侧的「退货 / 实收」（配色一律走主题变量，不写死）
   v4.07 赞哥：字号再大点、实收一定要醒目 → 翻日历式：独立小面板 + 上下两格 + 中间分隔线。
   ★ v4.08 赞哥发图：「要这种效果，占整个框一半一半」→ ①卡片内层左右**各占一半**（50% / 50%）；
     ②右侧面板**贯穿整卡高度**（含标题行）→ 标题与主数字一起收进左栏，面板纵向撑满；
     ③上下两格均匀分布 → 就是"翻日历"那个样子。
   ★★ v4.08b 赞哥再发图（蓝框圈住「退货」「实收」两个**标签**）：「文字加粗调大，上下对齐」→
     ①标签 12px/常规 → **15px / 700 加粗**，单位「件」11px → 13px/700 一起跟上；
     ②两行改成**规整两列网格**（`grid-template-columns: auto 1fr`）：标签列右对齐、数字组贴着标签左对齐
        → 「退货」「实收」左右边缘各自成一条竖线，再也不会因为数字位数不同（8 / 17）而一左一右错开。
     ⚠️ 原来那行是 `display: flex; justify-content: flex-end`（整行靠右）→ 数字一变宽标签就被推着走，
        这正是"上下不对齐"的根因，别改回去。
   ★★ v4.08c 赞哥再发图（蓝框圈住两行的「件」）：「后面的字也要对齐，最好是中间留 4 个位置，
        因为最多应该不会超过 9999」→ 右边那列「件」必须永远落在同一条竖线上，且扛得住 4 位数：
     ① 行改成**三列网格** `auto 1fr auto`：标签 | 数字格 | 单位「件」→ 数字在中间那格里，
        格宽由 1fr 撑满（实测 ≈ 63px，正好等于「实收」26px 下 4 个数字的宽度）→ **不管 8 / 17 / 9999，
        「件」都钉死在最右列那条竖线上**（这正是赞哥要的"中间留 4 个位置"）；
     ② `.x-v` 用 `display: contents` 摊平 → 里面的「数字」和「件」直接落进第 2、3 列（**没动 HTML 结构**）；
     ③ ⚠️ 数字格 `min-width: 0` —— 网格项默认 `min-width: auto` 会被内容顶宽，
        4 位数一到就把「件」推走（v4.08b 就是这么坏的），必须显式归零；
     ④ 内边距左右 10px → 6px（可用宽 102 → 110px），给"4 位数字 + 件"腾地方；
     ⑤ 「实收」28px → 26px（仍明显大于退货 22px、仍是主题色醒目）—— 这是让 4 位数放得下的**必要**让步；
     ⑥ 这两行的数字**不带千分位**（见 app.js pdWhiteExtraHTML：`pdFmtNum`）：`9,999` 比 4 个数字还宽，
        会压到「件」上；≤999 本来就没有逗号，所以**日常显示一个字都没变**，只有真到 4 位数才看得出。
     ⚠️ 别把行改回两列/别把 `min-width` 删掉/别给这两行加回千分位 —— 三条里任意一条都会让「件」重新错位。 */
.pd-kpi-body { display: flex; align-items: stretch; gap: 10px; }
.pd-kpi-body .pd-kpi-main { flex: 1 1 50%; min-width: 0; display: flex; flex-direction: column; justify-content: center; }
/* ⚠️ 数字位数多时（如退货 1234 件）右栏空间有限 → 左侧小注允许省略，绝不挤压换行破版 */
.pd-kpi-body .pd-kpi-main .pd-kpi-sub { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pd-kpi-extra { flex: 1 1 50%; min-width: 0; overflow: hidden; align-self: stretch; display: flex; flex-direction: column; justify-content: space-evenly; background: var(--bg); border: 1px solid var(--border); border-radius: 10px; padding: 8px 6px; white-space: nowrap; }
/* ★ 三列网格：第 1 列=标签｜第 2 列=数字格（1fr 撑满，≈4 个数字的宽度）｜第 3 列=「件」→ 两行严格对齐 */
.pd-kpi-extra .pd-kpi-x { display: grid; grid-template-columns: auto 1fr auto; align-items: baseline; column-gap: 2px; }
.pd-kpi-extra .pd-kpi-x + .pd-kpi-x { border-top: 1px solid var(--border); margin-top: 4px; padding-top: 4px; }
.pd-kpi-extra .pd-kpi-x .x-l { font-size: 15px; font-weight: 700; color: var(--text-2); text-align: right; }
/* ⚠️ display:contents = 把包裹层"摊平"，让 <b>数字</b> 与 <i>件</i> 直接成为上面网格的第 2、3 列 */
.pd-kpi-extra .pd-kpi-x .x-v { display: contents; }
/* ★ v4.08d 赞哥：「这个数字看着好丑好别扭，可不可以让它保持在居中的位置」→
   数字在它那格（≈4 个数字宽）里**居中**：不再一列数字全挤在标签旁边、把「件」孤零零甩到最右。
   ⚠️ 仍是同一格、同一宽度 → 「件」那条竖线纹丝不动（v4.08c 的成果不破）。 */
.pd-kpi-extra .pd-kpi-x b { font-size: 22px; line-height: 1.1; font-weight: 800; color: var(--text); font-variant-numeric: tabular-nums; min-width: 0; text-align: center; }
.pd-kpi-extra .pd-kpi-x i { font-style: normal; font-size: 13px; font-weight: 700; color: var(--text-2); }
/* ★ 实收做到与主数字同级（v4.08c：28 → 26px，让 4 位数放得进「中间那 4 个位置」）+ 主题色 —— 赞哥：「实收才是最想看到的数据，一定要醒目」 */
.pd-kpi-extra .pd-kpi-x-net b { font-size: 26px; color: var(--primary); }
.pd-kpi-input { width: 100px; font-size: 28px; font-weight: 800; color: var(--text); background: transparent; border: none; border-bottom: 1px dashed var(--border); border-radius: 0; padding: 0 0 2px; font-variant-numeric: tabular-nums; }
.pd-kpi-input:focus { outline: none; border-bottom-color: var(--primary); }
.pd-kpi-input::placeholder { color: var(--text-2); opacity: .45; font-weight: 600; }
.pd-kpi-input::-webkit-outer-spin-button, .pd-kpi-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.pd-kpi-input[type="number"] { -moz-appearance: textfield; }
.pd-kpi-diff-up { color: var(--warn); font-weight: 600; }
.pd-kpi-diff-down { color: #2563EB; font-weight: 600; }
.pd-kpi-diff-flat, .pd-kpi-diff-empty { color: var(--text-2); }

.pd-block-title { font-size: 14px; font-weight: 700; color: var(--text); margin-bottom: 10px; }
/* ⚠️ v4.00o：原「本月累计」清单卡（.pd-month-col2 / .pd-sum-*）与「近 7 天」柱状图
   （.pd-bar-* / .pd-legend）已被下面的「生产曲线」整块取代，相关样式一并删除，别再写回来。 */

/* ---------- v4.00o 生产曲线（内联 SVG，替换原柱状图） ---------- */
.pd-chart-card { padding-bottom: 10px; margin-bottom: 12px; }
.pd-chart-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.pd-chart-head .pd-block-title { margin-bottom: 0; }
.pd-chart-tools { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
/* 区间切换：胶囊分段控件（本月 / 近 7 天 / 近 30 天） */
.pd-seg { display: inline-flex; background: var(--bg); border: 1px solid var(--border); border-radius: 10px; padding: 2px; }
.pd-seg-btn { border: none; background: transparent; color: var(--text-2); font-size: 12.5px; font-weight: 600; padding: 5px 11px; border-radius: 8px; cursor: pointer; font-family: inherit; }
.pd-seg-btn:hover { color: var(--text); }
.pd-seg-btn.active { background: var(--card-solid); color: var(--text); box-shadow: var(--shadow-card); }
/* 指标开关：点一下加 / 减这条曲线 */
.pd-chart-metrics { display: flex; gap: 8px; flex-wrap: wrap; margin: 10px 0; }
.pd-chip { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; color: var(--text-2); background: var(--bg); border: 1px solid var(--border); border-radius: 999px; padding: 4px 11px; cursor: pointer; font-family: inherit; }
.pd-chip:hover { border-color: var(--primary-2); }
.pd-chip > i { display: block; width: 13px; height: 3px; border-radius: 2px; opacity: .38; }
.pd-chip.active { color: var(--text); background: var(--card-solid); }
.pd-chip.active > i { opacity: 1; }
.pd-chart-body { position: relative; width: 100%; }
.pd-chart-svg { width: 100%; height: auto; display: block; }
/* 悬停浮层（跟着鼠标最近的那个数据点） */
.pd-chart-tip { position: absolute; z-index: 6; pointer-events: none; background: rgba(17,24,39,.93); color: #fff; border-radius: 10px; padding: 8px 10px; font-size: 12px; line-height: 1.55; box-shadow: 0 8px 22px -6px rgba(0,0,0,.35); min-width: 132px; }
.pd-tip-date { font-weight: 700; margin-bottom: 4px; }
.pd-tip-row { display: flex; align-items: center; gap: 6px; white-space: nowrap; }
.pd-tip-row > i { width: 9px; height: 9px; border-radius: 50%; flex: 0 0 auto; }
.pd-tip-row > span { opacity: .85; }
.pd-tip-row > b { margin-left: auto; padding-left: 12px; font-variant-numeric: tabular-nums; }
.pd-tip-rate { border-top: 1px solid rgba(255,255,255,.18); margin-top: 4px; padding-top: 4px; }
.pd-chart-foot { font-size: 11.5px; color: var(--text-2); margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--border); line-height: 1.6; }
.pd-chart-ov { color: var(--warn); }

.pd-mtable-card { padding-bottom: 8px; }
.pd-table-wrap { overflow-x: auto; }
.pd-mtable { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.pd-mtable th { position: static; background: transparent; text-align: right; font-weight: 600; color: var(--text-2); font-size: 12px; padding: 7px 10px; border-bottom: 1px solid var(--border); white-space: nowrap; }
.pd-mtable th:first-child, .pd-mtable td:first-child { text-align: left; }
.pd-mtable td { padding: 6px 10px; border-bottom: 1px solid var(--border); text-align: right; font-variant-numeric: tabular-nums; color: var(--text); }
.pd-mtable tr.today td { font-weight: 700; }
.pd-mtable tr.future td { color: var(--text-2); opacity: .55; }
.pd-mtable td.pd-ng { color: var(--danger); }
.pd-mtable td.pd-rate { color: var(--success); font-weight: 600; }
.pd-mtable tr.pd-mt-foot td { font-weight: 700; background: var(--bg); }
.pd-mtable tr:last-child td { border-bottom: none; }
.pd-today-tag { font-size: 11px; font-weight: 700; color: var(--primary); margin-left: 4px; }
@media (max-width: 900px) {
  .pd-cards-4, .pd-cards-3 { grid-template-columns: 1fr 1fr; }
  /* 窄屏：曲线卡的工具条换行，别把「导出」顶出屏幕 */
  .pd-chart-head { align-items: flex-start; }
  .pd-chart-tools { width: 100%; }
}

/* ---------- v4.00f/g 生产日报：顶部一行放齐 + 型号下拉 ---------- */
/* 搜索框放在标题行**最右**（margin-left:auto 把它顶到右边缘）。
   ⚠️ 全局 `.search-box input` 带 min-width:220px，不覆盖会顶出屏幕（赞哥截图反馈「右边搜索框已经过屏幕了」）。
   本规则写在最后、同权重覆盖，所以 190px 能生效；**别在别处再给这个 input 加 min-width**。 */
.pd-toolbar-search { margin-left: auto; }
.pd-toolbar-search input { min-width: 0; width: 190px; }
/* v4.00j：搜索框右边的「搜索」按钮（margin-left:auto 在搜索框上，按钮跟着一起被顶到右边缘）。
   ⚠️ flex:0 0 auto —— 别让它被压扁成一条；`.input-inline` 那套"不许铺满整行"的规则同理。 */
.pd-search-btn { margin-left: 6px; flex: 0 0 auto; }
/* 标题行 = 第 1 行「生产日报 + 导出/保存 + 右侧搜索」，第 2 行「日期段 + 快捷按钮」。
   ⚠️ 为什么拆两行：赞哥屏幕顶栏**可用宽度只有约 788px**（左侧导航占 259px），
   而「日期段+两个 186px 日期框+快捷+导出+保存+搜索」排开要约 **1260px** → 一行物理上放不下。
   所以按他的箭头把**按钮组 + 搜索**抬到第 1 行（与标题同排），日期段单独占第 2 行。
   `.pd-head-daterow` 用 flex-basis 100% 强制另起一行，保证窄屏/宽屏版式一致、不会忽上忽下。 */
.rep-panel-head.pd-head-left { justify-content: flex-start; gap: 8px 12px; }
.pd-head-daterow { flex: 1 1 100%; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.pd-model-bar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.pd-model-bar select { padding: 6px 10px; border-radius: 8px; border: 1px solid var(--border); background: var(--card-solid); color: var(--text); font-size: 13px; max-width: 260px; }
.pd-model-tip { font-size: 12px; color: var(--text-2); }
/* v4.00g 明细表默认只垫 3 行空白（不再铺满全部型号）→ 行高仍压紧一点更好看 */
#pdTable th, #pdTable td { padding: 7px 10px; }
#pdTable .pd-in { padding: 4px 8px; }

/* ---------- v4.00k 生产日报：顶部「类型」筛选行（框架 / 小件 / 底护板…） ---------- */
/* 类型 = 物料库里的「分类」；点一下，整页（4 张卡 / 型号下拉 / 本月 / 明细表）都只算它。
   ⚠️ 用 flex-wrap：类型以后会变多（加强件…），窄屏必须能换行，不能挤成一条。
   ⚠️ 配色一律走主题变量（--primary / --primary-light / --primary-border）—— 换蓝/青/灰主题不能串色。 */
.pd-cat-host { margin-bottom: 10px; }
/* ★★ v4.00l：类型 + 型号 改成两个联动下拉（原来类型是按钮排、型号下拉被库存卡隔开一行）。
   选一个类型 → 右边型号下拉立刻只剩该类型的型号，"框架里有 6 个型号"直接下拉就能挑。 */
.pd-cat-bar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pd-cat-sel { padding: 5px 10px; border-radius: 8px; border: 1px solid var(--border); background: var(--card-solid);
  color: var(--text); font: inherit; font-size: 13px; min-width: 132px; max-width: 220px; }
.pd-cat-sel:hover { border-color: var(--primary); }
.pd-cat-bar #pdModelSel { padding: 5px 10px; border-radius: 8px; border: 1px solid var(--border);
  background: var(--card-solid); color: var(--text); font-size: 13px; min-width: 190px; max-width: 300px; }
.pd-cat-bar #pdModelSel:hover { border-color: var(--primary); }
.pd-cat-tip { font-size: 12px; color: var(--text-2); }
/* 明细表首列「类型」：窄一点、灰一点，不跟「规格型号」抢视线 */
#pdTable th:first-child, .pd-cell-cat { font-size: 12px; color: var(--text-2); white-space: nowrap; }

/* ---------- v4.00h 生产日报：班次填报行 + 档案页 ---------- */
/* 第 3 行「填报：班次 + 日期」。与 .pd-head-daterow 同理用 flex-basis 100% 强制另起一行，
   保证宽屏/窄屏版式一致（赞哥屏幕上这一步不能忽上忽下）。 */
.pd-head-shiftrow { flex: 1 1 100%; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding-top: 2px; }
.pd-shift-sel { width: 206px; flex: 0 0 auto; }
/* v4.00i：顶栏不再有旁注文字（赞哥要求去掉）。这条小字样式留给**页面最下面**的状态行 */
.pd-shift-tip { font-size: 12px; color: var(--text-2); }
.pd-foot-tip { font-size: 12px; color: var(--text-2); padding: 6px 2px 0; }
/* 「本班合计」行里的手填格 = 普通表格输入框（与型号行一致），别另起样式 */
#pdFootRow .pd-total-input { text-align: right; }

/* ---------- v4.10 时段进出存（统计报表 · 第 5 个页签） ---------- */
/* v4.10b 重排（赞哥 10-09："太丑了，数据要简洁清晰，界面要美观整洁"）：
   · 头部拆两栏：左=标题+日期步进，右=类型/型号 + 导出 —— 不再挤成一行、也不再有突兀空行；
   · 概览条改成「期初 ＋ 进 － 出 ＝ 期末」一条流水线，加减关系肉眼可见；
   · 表格换专属紧凑样式（行高收窄、斑马纹、结存列主题色加粗）。 */
.yl-panel { padding: 16px 18px 14px; }

/* --- 头部 --- */
.yl-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; flex-wrap: wrap;
  padding-bottom: 12px; margin-bottom: 14px; border-bottom: 1px solid var(--border); }
.yl-head-l { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.yl-title { display: flex; align-items: center; gap: 8px; font-size: 16px; font-weight: 800; color: var(--text); }
.yl-title svg { width: 20px; height: 20px; fill: none; stroke: var(--primary); stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.yl-daterow { display: flex; align-items: center; gap: 6px; }
.yl-nav { width: 30px; height: 32px; border: 1px solid var(--border); background: var(--card-solid); color: var(--text-2);
  border-radius: 8px; font-size: 17px; line-height: 1; cursor: pointer; display: grid; place-items: center; transition: all .15s; }
.yl-nav:hover { border-color: var(--primary); color: var(--primary); background: var(--primary-light); }
.yl-date { height: 32px; border: 1px solid var(--border); background: var(--card-solid); color: var(--text);
  border-radius: 8px; padding: 0 10px; font: inherit; font-size: 13px; font-variant-numeric: tabular-nums; width: 150px; }
.yl-date:focus { outline: none; border-color: var(--primary); }
.yl-qtoday { height: 32px; border: 1px solid var(--border); background: var(--card-solid); color: var(--text-2);
  border-radius: 8px; padding: 0 12px; font: inherit; font-size: 13px; cursor: pointer; transition: all .15s; }
.yl-qtoday:hover { border-color: var(--primary); color: var(--primary); background: var(--primary-light); }
.yl-head-r { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.yl-sel { height: 32px; border: 1px solid var(--border); background: var(--card-solid); color: var(--text);
  border-radius: 8px; padding: 0 10px; font: inherit; font-size: 13px; min-width: 120px; max-width: 210px; cursor: pointer; }
.yl-sel:hover { border-color: var(--primary); }
.yl-sel:focus { outline: none; border-color: var(--primary); }
.yl-exp { height: 32px; padding: 0 14px; font-size: 13px; }

/* --- 概览：期初 ＋ 进 － 出 ＝ 期末 --- */
.yl-flow { display: flex; align-items: stretch; gap: 0; margin-bottom: 16px;
  background: var(--bg); border: 1px solid var(--border); border-radius: 12px; overflow: hidden; }
.yl-stat { flex: 1 1 0; min-width: 0; padding: 12px 14px; background: var(--card-solid); }
.yl-stat + .yl-op + .yl-stat { border-left: none; }
.yl-stat-k { font-size: 12px; color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.yl-stat-v { font-size: 26px; font-weight: 800; line-height: 1.15; margin: 4px 0 2px; color: var(--text);
  font-variant-numeric: tabular-nums; white-space: nowrap; }
.yl-stat-v i { font-style: normal; font-size: 13px; font-weight: 600; color: var(--text-2); margin-left: 4px; }
.yl-stat-s { font-size: 11.5px; color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-variant-numeric: tabular-nums; }
.yl-stat.yl-in .yl-stat-v { color: var(--success); }
.yl-stat.yl-out .yl-stat-v { color: var(--warn); }
.yl-stat.yl-end { background: var(--primary-light); }
.yl-stat.yl-end .yl-stat-v { color: var(--primary); }
.yl-stat.yl-end .yl-stat-k { color: var(--primary); font-weight: 700; }
.yl-op { flex: 0 0 34px; display: grid; place-items: center; background: var(--card-solid);
  color: var(--text-2); font-size: 17px; font-weight: 700; border-left: 1px dashed var(--border); border-right: 1px dashed var(--border); }

/* --- 表格 --- */
.yl-table-wrap { border: 1px solid var(--border); border-radius: 10px; overflow: hidden; }
.yl-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.yl-table th { position: static; background: var(--bg); text-align: right; font-weight: 600; color: var(--text-2);
  font-size: 12px; padding: 9px 14px; border-bottom: 1px solid var(--border); white-space: nowrap; }
.yl-table td { padding: 7px 14px; border-bottom: 1px solid var(--border); text-align: right;
  font-variant-numeric: tabular-nums; color: var(--text); }
.yl-table tbody tr:last-child td { border-bottom: none; }
.yl-table th.yl-shift, .yl-table td.yl-shift { text-align: left; white-space: nowrap; color: var(--text-2); }
.yl-table th.yl-t, .yl-table td.yl-t { text-align: left; white-space: nowrap; font-variant-numeric: tabular-nums; color: var(--text); }
.yl-table td.yl-dot { display: none; }
.yl-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; margin-right: 7px; vertical-align: middle; }
.yl-dot.d { background: var(--warn); }
.yl-dot.n { background: var(--primary); }
.yl-table tbody tr.yl-night { background: rgba(0,0,0,0.015); }
.yl-table tbody tr.yl-zero td { color: var(--text-2); opacity: .6; }
.yl-table td.yl-num-out { color: var(--warn); font-weight: 600; }
.yl-table tbody tr.yl-zero td.yl-num-out { color: var(--text-2); font-weight: 400; }
.yl-table td.yl-bal { font-weight: 700; color: var(--primary); }
.yl-table tfoot td { padding: 10px 14px; font-weight: 700; background: var(--bg); border-top: 2px solid var(--border); }
.yl-table tfoot td.yl-shift { color: var(--text); }
.yl-table tfoot td.yl-bal { color: var(--primary); font-size: 14px; }

@media (max-width: 900px) {
  .yl-flow { flex-wrap: wrap; }
  .yl-stat { flex: 1 1 40%; }
  .yl-op { flex: 0 0 100%; height: 22px; border: none; border-top: 1px dashed var(--border); border-bottom: 1px dashed var(--border); }
}
/* 档案表：列多、不折行 → 容器横向滚动；整行可点开型号明细 */
#pdArcTable { width: 100%; font-size: 13px; }
/* ★★ v4.00n 主表与「展开明细」表**共用同一套列宽**（赞哥：这两排要能对齐）：
     主表：日期|班次|白件入|电泳|喷粉|成品出|不良|返修|合格率|填报人|更新时间|操作
     明细：类型|规格型号|白件入|电泳|喷粉|成品出|不良|返修|备注
     ⚠️ 对齐的唯一硬条件：**明细的「类型+规格型号」两列宽度之和 == 主表的「日期+班次」之和**。
        左边差 1px，右边 6 个数量列就整体错开 1px（两表各自 `table-layout:fixed` 独立算）。
        下面是配好的值：类型 92 + 规格型号 168 = 260 == 日期 92 + 班次 168 = 260 ✓
        （规格型号要放得下 T1J-170 / 500111-00147，所以 168 给足；日期/班次跟着一起加宽）
     ⚠️ 改这里必须**同时改两组**（一改就错位）。宽度写成 CSS 变量，改一处两边同时变。 */
#pdArcTable { --pd-w-date: 92px; --pd-w-shift: 168px; --pd-w-num: 86px; --pd-w-rate: 68px;
  --pd-w-user: 82px; --pd-w-time: 132px; --pd-w-act: 68px; }
/* ⚠️ v4.00r：手机/窄屏时表格必须**保住这个最小宽度**（横向滚动），不能让列被压碎。
   原因：`col.c-act` 是 `width:auto`（负责吸收多余空间），容器不够宽时它会**塌缩成 0**，
   「删除」按钮就会溢出到表格外（实测 900px / 390px 视口下 actW=0、按钮 46px 悬在表外）。
   min-width 用 calc 从同一套变量算出来 → 以后改列宽不用再手动同步这个数。 */
#pdArcTable { min-width: calc(var(--pd-w-date) + var(--pd-w-shift) + var(--pd-w-num) * 6 + var(--pd-w-rate) + var(--pd-w-user) + var(--pd-w-time) + var(--pd-w-act)); }
.pd-mtable-det { --pd-w-cat: 92px; --pd-w-spec: 168px; --pd-w-num: 86px; }
#pdArcTable, .pd-mtable-det { table-layout: fixed; }
#pdArcTable col.c-date { width: var(--pd-w-date); }
#pdArcTable col.c-shift { width: var(--pd-w-shift); }
#pdArcTable col.c-num { width: var(--pd-w-num); }
#pdArcTable col.c-rate { width: var(--pd-w-rate); }
#pdArcTable col.c-user { width: var(--pd-w-user); }
#pdArcTable col.c-time { width: var(--pd-w-time); }
/* ⚠️ v4.00r：「操作」列必须 `width:auto` —— 让它一个人吸收表格 `width:100%` 多出来的空间。
   若这里也写死 px，Chrome 会把多余空间**平摊给前 11 列**（实测日期 92→106、数量列 86→99），
   主表的数量列就和展开明细表的数量列整体错开 40px（v4.00n 好不容易对齐的两排又散了）。 */
#pdArcTable col.c-act { width: auto; }
#pdArcTable th, #pdArcTable td { padding: 7px 8px; white-space: nowrap; }
/* ⚠️ v4.00r：这里必须用**子选择器**（`> thead > tr > th`）。
   写成 `#pdArcTable th` 会把**展开明细表的表头**一起左对齐（明细表就住在主表的 td 里，也是它的后代），
   而明细表的数字走 `.pd-mtable td { text-align:right }` 是**右对齐** → 表头与数字分居列的两端，赞哥说"看不懂数字对应哪列"。 */
#pdArcTable > thead > tr > th { text-align: left; }
tr.pd-arc-open { cursor: pointer; }
tr.pd-arc-open:hover { background: var(--color-background-secondary); }
.pd-arc-caret { color: var(--text-2); font-size: 11px; }
/* v4.00n 操作列：删除按钮
   ⚠️ v4.00r：这一列现在**吸收表格多出来的宽度**（见上 col.c-act），所以按钮改成**贴左**——
   与上一版（右侧原本就有一块空白）视觉一致；若仍居中，按钮会明显右移，赞哥会以为"按钮跑位了"。 */
#pdArcTable th.pd-act-th { text-align: left; }
#pdArcTable td.pd-act-cell { text-align: left; padding: 5px 6px; }
.pd-del-btn { cursor: pointer; font: inherit; font-size: 12px; padding: 3px 10px; border-radius: 6px;
  border: 1px solid var(--border); background: var(--card-solid); color: var(--text-2); }
.pd-del-btn:hover { border-color: var(--danger); color: var(--danger); background: var(--color-background-secondary); }
.pd-del-btn:disabled { opacity: .5; cursor: default; }
/* ★ v4.00m 档案「展开明细」表：
   ① 列宽用 <colgroup> 固定（见上，与主表共用 --pd-w-num）+ `table-layout:fixed`；
      原来靠内容自适应，"规格型号"列一会儿宽一会儿窄，表头和下面的数字**对不齐**。
   ② 文字列左对齐（.al-l）、数值列右对齐 + tabular-nums（等宽数字，竖着看也能比大小）。
   ③ 宽度合计 = 主表宽度 → 上下两排的 6 个数量列左右边界完全重合。 */
/* ⚠️ v4.00n：明细表要跟主表**逐列对齐** → 它必须**铺满与主表一样的宽度**。
   它住在主表的 `<td colspan=12>` 里，那格有 `padding:10px 12px`，可用宽度比主表窄 24px。
   修法：明细容器**负 margin 抵消 padding**（`margin:0 -12px`）+ 表格 `width:100%`。
   ⚠️ `overflow-x` 必须 visible：auto 会预留滚动条宽度（实测又多偏 12px）。 */
.pd-det-wrap { overflow-x: visible; margin: 0 -12px; }
.pd-mtable-det { width: 100%; }
.pd-mtable-det col.c-cat { width: var(--pd-w-cat); }
.pd-mtable-det col.c-spec { width: var(--pd-w-spec); }
.pd-mtable-det col.c-num { width: var(--pd-w-num); }
.pd-mtable-det col.c-note { width: auto; }
.pd-mtable-det th, .pd-mtable-det td { white-space: nowrap; padding: 6px 8px; }
.pd-mtable-det th.al-l, .pd-mtable-det td.al-l { text-align: left; }
.pd-mtable-det td { font-variant-numeric: tabular-nums; }
.pd-mtable-det tr.pd-mt-foot td { background: var(--bg); border-top: 1px solid var(--border); }
.pd-det-warn { margin-top: 8px; padding: 6px 10px; border-radius: 8px; font-size: 12px;
  color: var(--danger); background: var(--color-background-secondary); border: 1px solid var(--danger); }

/* ================= v4.14 公司首页（侧栏最顶部「首页」） ================= */
/* v4.14e：物流部下的「物流部首页」子项已移除（改由「物流部」这一行本身作为入口）→ 原 .nav-item.nav-dept-home 样式删除 */

/* ⚠️ v4.14n：新增「企业愿景 / 企业价值观」两张并排横幅、并把合作伙伴整块下移后，
   本页**不再是一屏看全**（赞哥明确要求下移）。max-width 1120 沿用（1440×900 窗口下观感一致）。
   改这一页请连着复测截图。
   ★ v4.14w 整页网页化重排（赞哥：「这个页面好丑，美化一下，文字排版弄一下，图片也换掉」）：
     原来三块内容都是「橙块压城市照片」的**同一套路重复**（文字烧死在图里、不可选中、不响应式）
     → 现改为**真 HTML 文字 + 统一卡片语言**。
   ★ v4.14y：企业文化卡右侧配图改为**照片集**（`public/culture/` 内的全部图片，≥2 张自动轮播 + 圆点），
     加/删/换照片**只动那个文件夹**，不用改代码或重启；`.ch-slide` 绝对定位 + `object-fit:cover`（避免撑高卡片）。
     设计参数（参照 2026 企业官网规范）：间距取 8 的模数（16/24/32）、卡片内边距 30~40px、
     圆角统一 16px、阴影两层且极轻、字号层级 12.5 / 15.5 / 34、全页主色只留橙 #E56A00。
     ⚠️ 旧图 ch-vision.jpg / ch-values.jpg / ch-culture.jpg **仍留在 public/ 未删** →
     要回退：把本段 CSS 与 renderCompanyHome() 换回 `_archive/backup_v414w/` 的版本即可（图不用重做）。 */
#content .ch-wrap { max-width: 1120px; margin: 0 auto; }

/* ① 企业精神横幅（品牌深蓝渐变 + 绿色光晕，写死颜色 = 企业身份，不跟主题走） */
#content .ch-hero { position: relative; overflow: hidden; border-radius: 18px; padding: 34px 26px 32px;
  text-align: center; color: #fff; box-shadow: var(--shadow);
  background: linear-gradient(115deg, #16283D 0%, #1E3A56 45%, #25506B 100%); }
#content .ch-hero::after { content: ""; position: absolute; right: -70px; top: -110px; width: 340px; height: 340px;
  border-radius: 50%; background: radial-gradient(circle, rgba(140, 198, 62, 0.40), rgba(140, 198, 62, 0) 68%); }
#content .ch-hero::before { content: ""; position: absolute; left: -80px; bottom: -130px; width: 300px; height: 300px;
  border-radius: 50%; background: radial-gradient(circle, rgba(74, 144, 194, 0.38), rgba(74, 144, 194, 0) 70%); }
#content .ch-kicker { position: relative; z-index: 1; display: inline-block; font-size: 12px; letter-spacing: 4px;
  font-weight: 700; color: #12261A; background: #B6E06A; padding: 4px 15px; border-radius: 999px; }
#content .ch-hero h1 { position: relative; z-index: 1; margin-top: 15px; font-size: 30px; line-height: 1.45;
  font-weight: 800; letter-spacing: 5px; text-shadow: 0 3px 18px rgba(0, 0, 0, 0.35); }
#content .ch-hero h1 em { font-style: normal; color: #B6E06A; }
#content .ch-sub { position: relative; z-index: 1; margin-top: 9px; font-size: 15px; letter-spacing: 5px; color: #CFE0EE; }

/* ② 企业愿景 / 企业价值观：两张**白底信息卡**（v4.14w 由「橙块压照片」改为纯排版） */
#content .ch-duo { margin-top: 24px; display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
#content .ch-duo-item { position: relative; overflow: hidden; border-radius: 16px; background: #FFFFFF;
  border: 1px solid var(--border); padding: 30px 30px 34px;
  box-shadow: 0 1px 2px rgba(16, 28, 45, 0.04), 0 8px 24px rgba(16, 28, 45, 0.07); }
#content .ch-info-bar { position: absolute; left: 0; top: 0; width: 100%; height: 4px;
  background: linear-gradient(90deg, #E56A00 0%, #F5A34A 55%, rgba(245, 163, 74, 0) 100%); }
#content .ch-info-tag { font-size: 12.5px; font-weight: 700; letter-spacing: 2px; color: #E56A00; }
#content .ch-info-txt { margin: 14px 0 0; font-size: 15.5px; line-height: 1.95; color: #3A4553; letter-spacing: 0.3px; }
#content .ch-info-no { position: absolute; right: 20px; bottom: 6px; font-size: 46px; font-weight: 800;
  letter-spacing: 1px; color: rgba(229, 106, 0, 0.08); pointer-events: none; }

/* ③ 企业文化：通栏卡（左橙块文字 + 右城市照），文字全部为真 HTML */
#content .ch-culture { margin-top: 24px; }
#content .ch-culture-item { display: grid; grid-template-columns: 1.06fr 1fr; overflow: hidden; border-radius: 16px;
  background: #FFFFFF; border: 1px solid var(--border);
  box-shadow: 0 1px 2px rgba(16, 28, 45, 0.04), 0 8px 24px rgba(16, 28, 45, 0.07); }
#content .ch-culture-body { padding: 34px 42px; color: #FFFFFF;
  display: flex; flex-direction: column; justify-content: center;
  background: linear-gradient(160deg, #ED7412 0%, #E56A00 55%, #D36200 100%); }
#content .ch-culture-kicker { display: block; font-size: 13px; font-weight: 700; letter-spacing: 6px; color: rgba(255, 255, 255, 0.86); }
#content .ch-culture-title { margin: 2px 0 0; font-size: 34px; font-weight: 800; letter-spacing: 5px; line-height: 1.3; }
#content .ch-culture-lines { margin-top: 24px; font-size: 15.5px; line-height: 1.9; }
#content .ch-culture-lines p { position: relative; margin: 0 0 16px; padding-left: 20px; }
#content .ch-culture-lines p:last-child { margin-bottom: 0; }
#content .ch-culture-lines p::before { content: ""; position: absolute; left: 1px; top: 9px; width: 8px; height: 8px;
  background: #FFFFFF; transform: rotate(45deg); }
#content .ch-wx { font-weight: 700; white-space: nowrap; }
#content .ch-culture-photo { position: relative; min-height: 300px; overflow: hidden; background: #E9EDF2; }
/* ⚠️ 每张配图必须**脱离文档流**（absolute）—— 否则竖构图照片会按自身比例把卡片撑高（曾由 414 撑到 677） */
#content .ch-culture-photo .ch-slide { position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; object-position: center 60%; }
/* v4.14y 照片集：≥2 张时淡入轮播 + 右下角圆点（点圆点可手动切；只有 1 张时不出现圆点） */
#content .ch-culture-photo.is-multi .ch-slide { opacity: 0; transition: opacity 0.9s ease; }
#content .ch-culture-photo.is-multi .ch-slide.is-active { opacity: 1; }
#content .ch-dots { position: absolute; right: 14px; bottom: 12px; z-index: 2; display: flex; gap: 6px; }
#content .ch-dot { width: 7px; height: 7px; border-radius: 50%; cursor: pointer;
  background: rgba(255, 255, 255, 0.5); box-shadow: 0 0 0 1px rgba(16, 28, 45, 0.18); transition: all 0.25s; }
#content .ch-dot.is-active { width: 20px; border-radius: 4px; background: #FFFFFF; }

/* ④ 合作伙伴：白色卡片 + 去掉绿框的 logo 墙 + 中性标签 */
#content .ch-partners { margin-top: 24px; }
#content .ch-card { padding: 14px; border-radius: 16px; }
#content .ch-card img { display: block; width: 100%; height: auto; border-radius: 10px; }
#content .ch-key { margin-top: 14px; display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; align-items: center; }
#content .ch-key-lb { font-size: 12.5px; color: var(--text-2); }
#content .ch-pt { font-size: 12.5px; font-weight: 600; color: var(--text-2); padding: 6px 13px; border-radius: 8px;
  border: 1px solid var(--border); background: var(--surface-2, rgba(16, 28, 45, 0.03)); }

@media (max-width: 900px) {
  #content .ch-hero { padding: 28px 18px 26px; }
  #content .ch-hero h1 { font-size: 22px; letter-spacing: 3px; }
  #content .ch-sub { font-size: 14px; letter-spacing: 3px; }
  /* 窄屏放不下两张并排 → 竖着叠成一列 */
  #content .ch-duo { grid-template-columns: 1fr; gap: 12px; }
  #content .ch-duo-item { padding: 24px 22px 26px; }
  /* 企业文化：改成上文案下照片 */
  #content .ch-culture-item { grid-template-columns: 1fr; }
  #content .ch-culture-body { padding: 28px 24px 26px; }
  #content .ch-culture-title { font-size: 27px; letter-spacing: 3px; }
  #content .ch-culture-photo { min-height: 210px; }
}

/* ================= v4.14z 员工「在职 / 离职」 ================= */
/* 离职行灰显 + 状态标签；顶部「显示离职（N）」勾选开关 */
.emp-off td { color: var(--text-2); }
.emp-off td:first-child { text-decoration: line-through; text-decoration-color: rgba(0, 0, 0, 0.28); }
.emp-tag { display: inline-block; font-size: 12px; line-height: 1; padding: 4px 9px; border-radius: 999px; font-weight: 600; white-space: nowrap; }
.emp-tag.on { color: #1F6D3A; background: rgba(46, 160, 88, 0.12); border: 1px solid rgba(46, 160, 88, 0.30); }
.emp-tag.off { color: var(--text-2); background: rgba(122, 128, 138, 0.14); border: 1px solid rgba(122, 128, 138, 0.28); }
.emp-off-toggle { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--text-2); cursor: pointer; user-select: none; }
.emp-off-toggle input { cursor: pointer; }
/* 表头不折行（否则「手机号」被挤成两行）；操作列按钮紧凑排一行 */
.emp-table thead th { white-space: nowrap; }
.emp-table td:last-child { white-space: nowrap; }
.emp-table td:last-child .btn { padding-left: 9px; padding-right: 9px; }


/* ================= v4.16b 入库「归属」默认空白 ================= */
/* 未选归属时：下面不渲染输入项，只给这块提示；确认按钮置灰 */
.ib-lock {
  margin: 18px 0 4px; padding: 26px 22px; border-radius: 12px;
  border: 1px dashed var(--border); background: var(--surface-2, rgba(0,0,0,0.02));
  text-align: center;
}
.ib-lock-t { font-size: 15px; font-weight: 700; color: var(--text); }
.ib-lock-s { margin-top: 8px; font-size: 12.5px; line-height: 1.85; color: var(--text-2); max-width: 460px; margin-left: auto; margin-right: auto; }
.btn[disabled], .btn:disabled { opacity: .55; cursor: not-allowed; }

/* v4.18k 记录页「备注」列（赞哥 2026-10-21）：只读展示；文本已由 JS 截断，这里兜一层不换行 */
.c-note { white-space: nowrap; color: var(--text-2); }
.img-export-root td.c-note { overflow: hidden; text-overflow: ellipsis; }