/* /Pages/Batches/BatchDetail.razor.rz.scp.css */
/* ===== 批次详情页专用样式 =====
   注意：「批次执行进度」卡片已抽为 Shared/BatchProgressCard.razor（批次详情页 + 批次计划/成检计划弹窗三处复用），
   其 .detail-* 样式（进度条/摘要条/工段卡片等）因 Blazor scoped CSS 无法跨组件复用，已上提到 wwwroot/css/app.css。 */

/* 标签文字颜色（用于字段名 label） */
.detail-label[b-gj66unucrs] {
    color: #37474F !important;
}

/* 子标题颜色（如"基本信息""工艺参数"等分组标题） */
.detail-subsection[b-gj66unucrs] {
    color: #78909C !important;
}

/* 链接颜色 */
.detail-link[b-gj66unucrs] {
    cursor: pointer;
    color: #1976d2;
}

/* 卡片容器——无背景 */
.detail-card[b-gj66unucrs] {
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 8px;
}

/* 卡片容器——浅灰背景 */
.detail-card-bg[b-gj66unucrs] {
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 8px;
    background: #fafafa;
}

/* 表格滚动容器 */
.detail-table-scroll[b-gj66unucrs] {
    overflow-x: auto;
}
/* /Shared/OrderProgressTree.razor.rz.scp.css */
/* ===== 订单进度树（OrderProgressTree.razor scoped）纵向层级树 =====
   2026-09-14 自 Pages/Orders/OrderProgress.razor.css 整文件迁移（组件抽出后 scoped CSS 不能跨组件复用）。
   本文件为树本体专用，页面级打印样式仍在 Pages/Orders/OrderProgress.razor 的 <style> 块内。 */

/* ===== 一级：订单号树根（两行头） ===== */
.op-root[b-c9vd7ch8hx] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    margin-bottom: 6px;
    background: linear-gradient(90deg, #eef4fb, #f8fafc);
    border: 1px solid #d7e0ea;
    border-radius: 8px;
}

.op-root-icon[b-c9vd7ch8hx] {
    color: #1e6fbf;
    flex-shrink: 0;
}

.op-root-meta[b-c9vd7ch8hx] {
    min-width: 0;
    flex: 1;
}

.op-root-no[b-c9vd7ch8hx] {
    color: #0d3b66;
    margin-bottom: 2px !important;
}

.op-root-line2[b-c9vd7ch8hx] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    column-gap: 6px;
    row-gap: 2px;
    color: #5c6b7a;
}

/* 键值对 token：标签 + 值 */
.op-kv[b-c9vd7ch8hx] {
    display: inline-flex;
    align-items: baseline;
    white-space: nowrap;
}

.op-kv .op-kv-l[b-c9vd7ch8hx] {
    color: #90a0af;
    font-size: 14px;
    margin-right: 4px;
}

.op-kv .op-kv-v[b-c9vd7ch8hx] {
    color: #0d3b66;
    font-size: 16px;
    font-weight: 600;
}

/* ===== 树体：每主号一个节点 ===== */
.op-main-node[b-c9vd7ch8hx] {
    margin: 0 0 6px;
}

/* 二级：主号标题（两行头，整块可点击折叠） */
.op-main-head[b-c9vd7ch8hx] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 8px 12px;
    background: #f0f3f7;
    border: 1px solid #dde3ea;
    border-radius: 6px;
    cursor: pointer;
    user-select: none;
}

.op-main-head:hover[b-c9vd7ch8hx] {
    background: #e7edf4;
}

.op-main-line1[b-c9vd7ch8hx] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px 6px;
}

.op-toggle-icon[b-c9vd7ch8hx] {
    color: #90a0b0;
    margin-right: -2px;
}

.op-main-icon[b-c9vd7ch8hx] {
    color: #3f6aa3;
}

.op-main-no[b-c9vd7ch8hx] {
    min-width: 90px;
    color: #1c3a57;
    font-weight: 700;
    font-size: 15px;
    margin-right: 2px;
}

/* 行1 规格要素 token（白底深字小片，最小 15px） */
.op-spec-token[b-c9vd7ch8hx] {
    font-size: 15px;
    color: #2d3a47;
    background: #ffffff;
    border: 1px solid #c3cdd6;
    border-radius: 4px;
    padding: 0 8px;
    height: 23px;
    line-height: 21px;
    white-space: nowrap;
}

.op-spec-token.op-grade[b-c9vd7ch8hx] {
    color: #1565c0;
    border-color: #bcd4ee;
    background: #f2f7fd;
}

.op-spec-token.op-wt[b-c9vd7ch8hx] {
    font-weight: 600;
    color: #1c3a57;
}

.op-spec-token.op-standard[b-c9vd7ch8hx] {
    color: #37474f;
}

/* 完结主号灰显 */
.op-main-completed .op-main-head[b-c9vd7ch8hx] {
    background: #f2f2f2;
    border-color: #dedede;
}

.op-main-completed .op-main-no[b-c9vd7ch8hx],
.op-main-completed .op-main-icon[b-c9vd7ch8hx] {
    color: #8a8a8a;
}

.op-main-completed .op-spec-token[b-c9vd7ch8hx] {
    background: #f5f5f5;
    border-color: #dbdbdb;
    color: #5f5f5f;
}

.op-main-completed .op-l2-val[b-c9vd7ch8hx],
.op-main-completed .op-l2-lbl[b-c9vd7ch8hx] {
    color: #636363;
    font-weight: 500;
}

/* 行2：执行关注 / 紧急性 / 预计完成（改显眼：标签加粗上色，档位/紧急度淡色胶囊粗体） */
.op-main-line2[b-c9vd7ch8hx] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    column-gap: 8px;
    row-gap: 4px;
    margin-left: 26px;
}

/* 行3：已完结主号「投料产出」汇总（置于「执行关注：已完结」下方，主号折叠时亦可见）
   用 flex 承载分段，段间不产生换行空白；自动在段边界折行 */
.op-main-line3[b-c9vd7ch8hx] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    margin: 4px 0 0 26px;
    color: #37474f;
    font-size: 14px;
    line-height: 1.6;
}

/* 订单级「总投料产出」行（订单号块第三行，主号全完结时才出现） */
.op-root-line3[b-c9vd7ch8hx] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    margin-top: 4px;
    color: #37474f;
    font-size: 14px;
    line-height: 1.6;
}

/* 汇总中的两项比率（投料产出率 / 产出成品比）高亮 */
.op-sum-hl[b-c9vd7ch8hx] {
    color: #c62828;
    font-weight: 700;
}

.op-l2-lbl[b-c9vd7ch8hx] {
    color: #3d4d5e;
    font-size: 15px;
    font-weight: 600;
    margin-right: 2px;
}

.op-l2-val[b-c9vd7ch8hx] {
    color: #33475b;
    font-size: 15px;
    font-weight: 700;
}

/* 执行关注档位胶囊：暂停红/原料锁橙/生产蓝/成检靛（语义沿用原 chip 配色） */
.op-l2-val.op-v-pause[b-c9vd7ch8hx] {
    padding: 1px 10px;
    border-radius: 11px;
    background: #fdecea;
    color: #c62828;
}
.op-l2-val.op-v-lock[b-c9vd7ch8hx] {
    padding: 1px 10px;
    border-radius: 11px;
    background: #fff3e0;
    color: #ef6c00;
}
.op-l2-val.op-v-prod[b-c9vd7ch8hx] {
    padding: 1px 10px;
    border-radius: 11px;
    background: #e1f3fd;
    color: #0288d1;
}
.op-l2-val.op-v-inspect[b-c9vd7ch8hx] {
    padding: 1px 10px;
    border-radius: 11px;
    background: #e8eafd;
    color: #3949ab;
}

/* 紧急性胶囊：A+红/A橙/B蓝 */
.op-l2-val.op-v-u-aplus[b-c9vd7ch8hx] {
    padding: 1px 10px;
    border-radius: 11px;
    background: #fdecea;
    color: #c62828;
}
.op-l2-val.op-v-u-a[b-c9vd7ch8hx] {
    padding: 1px 10px;
    border-radius: 11px;
    background: #fff3e0;
    color: #ef6c00;
}
.op-l2-val.op-v-u-b[b-c9vd7ch8hx] {
    padding: 1px 10px;
    border-radius: 11px;
    background: #e1f3fd;
    color: #0277bd;
}

/* 预计完成：加粗深蓝胶囊（无紧急度亦醒目） */
.op-l2-date[b-c9vd7ch8hx] {
    font-size: 15px;
    font-weight: 700;
    color: #0d3b66;
    padding: 1px 10px;
    border-radius: 11px;
    background: #eef4fb;
}

/* ===== 三级：阶段分支标题（缩进一级，色点） ===== */
.op-stage[b-c9vd7ch8hx] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 4px 0 2px 22px;
    padding: 3px 8px 3px 0;
}

.op-stage-dot[b-c9vd7ch8hx] {
    flex-shrink: 0;
    width: 9px;
    height: 9px;
    border-radius: 50%;
}

.op-stage-title[b-c9vd7ch8hx] {
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 1px;
}

.op-stage-dot.op-stage-RawMaterialLock[b-c9vd7ch8hx] { background: #ef6c00; }      /* 原料锁定 · 橙 */
.op-stage-title.op-stage-RawMaterialLock[b-c9vd7ch8hx] { color: #c25d04; }
.op-stage-dot.op-stage-Production[b-c9vd7ch8hx] { background: #0288d1; }           /* 生产执行 · 蓝 */
.op-stage-title.op-stage-Production[b-c9vd7ch8hx] { color: #0277bd; }
.op-stage-dot.op-stage-FinalInspection[b-c9vd7ch8hx] { background: #3949ab; }      /* 成品检验 · 靛 */
.op-stage-title.op-stage-FinalInspection[b-c9vd7ch8hx] { color: #303f9f; }
.op-stage-dot.op-stage-Warehousing[b-c9vd7ch8hx] { background: #2e7d32; }          /* 成品入库 · 绿 */
.op-stage-title.op-stage-Warehousing[b-c9vd7ch8hx] { color: #2e7d32; }
/* 完结主号专属 4 分支（生产投料/在制品入库/次品入库/备料成品）+ 订单成品入库 */
.op-stage-dot.op-stage-ProductionInput[b-c9vd7ch8hx] { background: #5d4037; }      /* 生产投料 · 棕 */
.op-stage-title.op-stage-ProductionInput[b-c9vd7ch8hx] { color: #4e342e; }
.op-stage-dot.op-stage-SurplusInbound[b-c9vd7ch8hx] { background: #00695c; }        /* 在制品入库 · 深青 */
.op-stage-title.op-stage-SurplusInbound[b-c9vd7ch8hx] { color: #00695c; }
.op-stage-dot.op-stage-DefectInbound[b-c9vd7ch8hx] { background: #c62828; }         /* 次品入库 · 红 */
.op-stage-title.op-stage-DefectInbound[b-c9vd7ch8hx] { color: #b71c1c; }
.op-stage-dot.op-stage-FinishedStockInbound[b-c9vd7ch8hx] { background: #1565c0; }  /* 备料成品 · 蓝 */
.op-stage-title.op-stage-FinishedStockInbound[b-c9vd7ch8hx] { color: #0d47a1; }

/* 阶段下叶子所在的一列（再缩进一级，竖线贯穿） */
.op-stage-children[b-c9vd7ch8hx] {
    margin: 0 0 6px 34px;
    padding: 2px 0 2px 10px;
    border-left: 2px dotted #cdd6de;
}

/* ===== 四级：叶子行 ===== */
.op-leaf-row[b-c9vd7ch8hx] {
    display: flex;
    align-items: baseline;
    gap: 10px;
    padding: 2px 6px;
    font-size: 16px;
    position: relative;
}

/* 行前水平短线，把叶子接到左侧阶段竖线上（树枝感） */
.op-leaf-row[b-c9vd7ch8hx]::before {
    content: '';
    position: absolute;
    left: -10px;
    top: 50%;
    width: 8px;
    border-top: 1px solid #cdd6de;
}

.op-leaf-text[b-c9vd7ch8hx] {
    color: #37474f;
    font-weight: 500;
}

.op-leaf-kg[b-c9vd7ch8hx] {
    color: #4f6476;
    font-size: 16px;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

/* 同叶退货出库量（仅次品入库叶有值；与左侧入库量并列对照） */
.op-leaf-return[b-c9vd7ch8hx] {
    color: #b71c1c;
    font-size: 16px;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

/* ===== 五级：叶子下的批次名单（默认折叠；展开后按段列出批次号胶囊，点击批号弹批次执行进度） ===== */
/* 左缩进对齐叶子文本起点（.op-stage-children 34px margin + 10px padding），使名单明显从属于该叶 */
.op-leaf-batches[b-c9vd7ch8hx] {
    margin: 0 0 4px 44px;
}

.op-batch-toggle[b-c9vd7ch8hx] {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    cursor: pointer;
    color: #546e7a;
    font-size: 15px;
    line-height: 1.4;
}

.op-batch-toggle:hover .op-batch-summary[b-c9vd7ch8hx] {
    color: #1565c0;
    text-decoration: underline;
}

.op-batch-summary[b-c9vd7ch8hx] {
    font-variant-numeric: tabular-nums;
}

.op-batch-segs[b-c9vd7ch8hx] {
    margin: 2px 0 4px;
}

.op-batch-seg[b-c9vd7ch8hx] {
    display: flex;
    align-items: baseline;
    gap: 6px;
    margin-bottom: 2px;
}

.op-batch-seg-label[b-c9vd7ch8hx] {
    flex: 0 0 auto;
    color: #78909c;
    font-size: 15px;
    white-space: nowrap;
}

/* 长名单必须换行（展开后可能十余批），故 flex-wrap */
.op-batch-list[b-c9vd7ch8hx] {
    display: flex;
    flex-wrap: wrap;
    column-gap: 10px;
    row-gap: 2px;
    min-width: 0;
}

.op-batch-no[b-c9vd7ch8hx] {
    color: #1565c0;
    font-size: 15px;
    font-variant-numeric: tabular-nums;
    cursor: pointer;
    overflow-wrap: anywhere;
}

.op-batch-no:hover[b-c9vd7ch8hx] {
    text-decoration: underline;
}

/* ===== 手机壳内防横向溢出（2026-09-15）=====
   手机 360px 逐层实算：视口 −.mh-shell .mud-container 左右 12px = 336，−.mh-card.pa-3 12px = 卡内容 312；
   .op-root 左右 padding 14px 并减图标 24px + gap 10px → .op-root-meta ≈ 250px；叶子列再扣缩进 44px → ≈ 256px。
   树内三处「不可断行」内容会超过上述宽度：
     ① .op-kv 标签+值整体 nowrap（父 .op-root-line2 只在 token 边界换行）——「订单总重量 123456.78 kg」≈266px；
     ② .op-leaf-row 无 flex-wrap，次品入库叶「文本 + 入库量 + 退货量」三段同排 ≈365px；
     ③ .op-spec-token 固定 height:23px/line-height:21px 且 nowrap，长规格号单 token 即越界。
   越界后果不是被裁掉：.home-query-result 的 overflow-y:auto 按 CSS 规范把 overflow-x 计算为 auto，
   结果区自动变成横向滚动容器（观感「宽度超出卡片」，且纵向滑列表易被横向滚动劫持）。
   ⚠️ 只挂 .mh-shell（移动壳自身类，非 .mh-container 祖先）：桌面 /orders/progress 页宽裕，规则不命中、行为不变。 */
.mh-shell .op-kv[b-c9vd7ch8hx] {
    flex-wrap: wrap;
    white-space: normal;
    max-width: 100%;
}

.mh-shell .op-kv .op-kv-v[b-c9vd7ch8hx] {
    min-width: 0;
    overflow-wrap: anywhere;
}

.mh-shell .op-spec-token[b-c9vd7ch8hx] {
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
    height: auto;
    line-height: 1.35;
}

.mh-shell .op-leaf-row[b-c9vd7ch8hx] {
    flex-wrap: wrap;
    row-gap: 2px;
}

/* 叶子列缩进 34 → 24px，给 nowrap 的重量值多留 10px 余量 */
.mh-shell .op-stage-children[b-c9vd7ch8hx] {
    margin-left: 24px;
}

/* 批次名单：缩进同步收窄；段「标签 + 批号列」在窄屏改为上下排（标签独占一行，批号列整行换行） */
.mh-shell .op-leaf-batches[b-c9vd7ch8hx] {
    margin-left: 34px;
}

.mh-shell .op-batch-seg[b-c9vd7ch8hx] {
    flex-wrap: wrap;
    row-gap: 2px;
}

.mh-shell .op-batch-summary[b-c9vd7ch8hx] {
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
}