/* ==========================================================================
   接入层补充样式（M3）
   --------------------------------------------------------------------------
   style.css 是从已评审原型原样提取的，不得手改；本文件只补充"接入后端后才需要"
   的布局与状态样式，并复用原型定义的 CSS 变量（主题色、圆角、阴影）。
   命名一律用原型没有的新类名，避免覆盖原型样式。
   ========================================================================== */

/* ---------- 登录 ---------- */
.login-err{margin:0 0 14px;padding:10px 12px;border-radius:10px;font-size:13px;
  background:rgba(185,28,28,.08);color:var(--danger-text);
  border:1px solid rgba(185,28,28,.22)}
.alert-err{margin:10px 0;padding:10px 12px;border-radius:10px;font-size:13px;
  background:rgba(185,28,28,.08);color:var(--danger-text);
  border:1px solid rgba(185,28,28,.22);white-space:pre-wrap}
.alert-ok{margin:10px 0;padding:10px 12px;border-radius:10px;font-size:13px;
  background:rgba(21,128,61,.08);color:var(--ok-text);
  border:1px solid rgba(21,128,61,.22)}

/* ---------- 顶栏 ---------- */
.who{line-height:1.25;margin-left:2px}
.who b{display:block;font-size:13px;color:var(--text-strong)}
.who span{font-size:11px}
.ident-select{min-width:210px}
.topbar{gap:10px}

/* ---------- 布局工具 ---------- */
.pad{padding:14px 16px 18px}
.row-2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.col-2{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}
@media (max-width:1100px){.col-2,.row-2{grid-template-columns:1fr}}
.kpi-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  gap:12px;margin-bottom:16px}
.kpi-row .kpi{background:var(--panel);border:1px solid var(--stroke);
  border-radius:var(--radius-sm,12px);padding:14px 16px}
.kpi-row .kpi .label{font-size:12px;color:var(--muted)}
.kpi-row .kpi .val{font-size:22px;font-weight:600;color:var(--text-strong);margin-top:6px}
.kpi-row .kpi .sub{font-size:11px;color:var(--dim);margin-top:4px}

/* ---------- 表单 ---------- */
.checklist{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.checklist label{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;
  border:1px solid var(--stroke);border-radius:999px;font-size:13px;cursor:pointer;
  background:var(--surface-soft)}
.checklist label:hover{background:var(--hover)}
.checklist input{width:auto;margin:0}
.qty-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;
  margin-top:6px}
.qty-cell{border:1px solid var(--stroke);border-radius:var(--radius-sm,12px);padding:10px 12px}
.qty-cell .qt-name{font-size:13px;color:var(--text-strong)}
.qty-cell .qt-meta{font-size:11px;color:var(--dim);margin:2px 0 8px}
.qty-cell input{width:100%}
.shots{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}
.shot{width:110px;border:1px solid var(--stroke);border-radius:10px;overflow:hidden;
  background:var(--surface-soft)}
.shot img{width:100%;height:74px;object-fit:cover;display:block}
.shot span{display:block;font-size:10px;color:var(--dim);padding:4px 6px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.shot.hist{opacity:.62;border-style:dashed}
.mini-select,.mini-input{padding:6px 10px;font-size:13px;width:auto}
.mini-select{min-width:120px}

/* ---------- 列表与表格 ---------- */
table.list{width:100%;border-collapse:collapse;font-size:13px}
table.list th,table.list td{padding:9px 10px;border-bottom:1px solid var(--line);
  text-align:left;vertical-align:middle}
table.list th{font-size:12px;color:var(--muted);font-weight:500;
  background:var(--surface-soft);position:sticky;top:0}
table.list tbody tr:hover{background:var(--row-hover)}
table.list td.num{text-align:right;font-variant-numeric:tabular-nums}
.empty{padding:26px 14px;text-align:center;color:var(--dim);font-size:13px}
.loading{padding:22px 14px;text-align:center;color:var(--dim);font-size:13px}

.order-row{display:flex;align-items:center;gap:12px;padding:11px 4px;
  border-bottom:1px solid var(--line);cursor:pointer}
.order-row:last-child{border-bottom:0}
.order-row:hover{background:var(--row-hover)}
.order-row .grow{flex:1;min-width:0}
.order-row .code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:13px;
  color:var(--text-strong)}
.order-row .meta{font-size:11.5px;color:var(--dim);margin-top:2px}
.order-row .amt{font-variant-numeric:tabular-nums;font-size:13px;color:var(--text-strong)}
.mini-btn{padding:5px 10px;font-size:12px}

/* 身份列表（工作台） */
.id-row{display:flex;align-items:center;gap:10px;padding:9px 2px;
  border-bottom:1px solid var(--line)}
.id-row:last-child{border-bottom:0}
.id-row .grow{flex:1}
.id-row .pname{font-size:13px;color:var(--text-strong)}
.id-row .rname{font-size:11.5px;color:var(--dim);margin-top:2px}

/* 通知 */
.nt-row{padding:9px 2px;border-bottom:1px solid var(--line)}
.nt-row:last-child{border-bottom:0}
.nt-row .t{font-size:13px;color:var(--text-strong);
  display:flex;align-items:center;gap:8px}
.nt-row .c{font-size:12px;color:var(--muted);margin-top:3px;white-space:pre-wrap}
.nt-row.unread .t::before{content:"";width:6px;height:6px;border-radius:50%;
  background:var(--glow-ring);box-shadow:0 0 0 3px var(--glow-ring)}

/* 审核详情 */
.rv-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:18px}
@media (max-width:1100px){.rv-grid{grid-template-columns:1fr}}
.rv-block{border:1px solid var(--stroke);border-radius:var(--radius-sm,12px);
  padding:12px 14px;margin-bottom:12px}
.rv-block h3{margin:0 0 8px;font-size:13px;color:var(--text-strong)}
.kv{display:flex;justify-content:space-between;font-size:13px;padding:4px 0}
.kv .k{color:var(--muted)}
.kv .v{font-variant-numeric:tabular-nums}
.approve-row{display:grid;grid-template-columns:1fr 110px 110px;gap:10px;
  align-items:center;padding:7px 0;font-size:13px}
.approve-row .num{text-align:right;font-variant-numeric:tabular-nums}
.reject-box{margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}

/* ---------- 截图灯箱（点击缩略图原地放大） ---------- */
.lightbox{position:fixed;inset:0;z-index:9999;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:10px;padding:24px;
  background:rgba(18,16,12,.90);cursor:zoom-out}
.lightbox[hidden]{display:none}
.lightbox img{max-width:92vw;max-height:88vh;border-radius:8px;background:#fff;
  box-shadow:0 18px 60px rgba(0,0,0,.55)}
.lightbox-tip{color:#e8e2d6;font-size:12.5px;letter-spacing:.5px;opacity:.85}
.shot[data-shot-full]{cursor:zoom-in}

/* ---------- 首次登录强制修改密码 ---------- */
.pwd-modal{position:fixed;inset:0;z-index:10000;display:flex;align-items:center;
  justify-content:center;background:rgba(18,16,12,.90);padding:24px}
.pwd-modal[hidden]{display:none}
.pwd-card{width:100%;max-width:430px;background:var(--card);color:var(--ink);
  border-radius:12px;padding:24px;box-shadow:0 24px 70px rgba(0,0,0,.5)}
.pwd-card h3{margin:0 0 8px;font-size:17px}
.pwd-hint{margin:0 0 6px;font-size:12.5px;color:var(--dim);line-height:1.65}
.pwd-card label{display:block;font-size:12.5px;color:var(--dim);margin:12px 0 4px}
.pwd-card input{width:100%;padding:10px 12px;border:1px solid var(--line);
  border-radius:6px;font-size:14px;font-family:inherit;background:#fff;color:var(--ink)}
.pwd-card input:focus{outline:none;border-color:#9dc4ae;box-shadow:0 0 0 3px #e7f1ea}
.pwd-err{margin-top:12px;padding:8px 10px;border-radius:6px;background:#fdecea;
  color:#a3342c;font-size:12.5px}
.pwd-card .btn{margin-top:16px;width:100%;justify-content:center}

/* ---------- 工单列表列宽（避免前几列吃满宽度、数字列挤在右侧） ---------- */
.order-list{table-layout:fixed;min-width:1180px}
.order-list th,.order-list td{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  vertical-align:middle}
.order-list th:nth-child(1),.order-list td:nth-child(1){width:150px}   /* 工单号 */
.order-list th:nth-child(2),.order-list td:nth-child(2){width:120px}   /* 批次ID */
.order-list th:nth-child(3),.order-list td:nth-child(3){width:170px}   /* 题包ID */
.order-list th:nth-child(4),.order-list td:nth-child(4){width:170px}   /* 项目 */
.order-list th:nth-child(5),.order-list td:nth-child(5){width:90px}    /* 提交人 */
.order-list th:nth-child(6),.order-list td:nth-child(6){width:110px}   /* 当前环节 */
.order-list th:nth-child(7),.order-list td:nth-child(7){width:120px}   /* 负责人 */
.order-list th:nth-child(8),.order-list td:nth-child(8){width:66px}    /* 轮次 */
.order-list th:nth-child(9),.order-list td:nth-child(9){width:66px}    /* 驳回 */
.order-list th:nth-child(10),.order-list td:nth-child(10){width:100px} /* 核准金额 */
.order-list th:last-child,.order-list td:last-child{width:96px;text-align:right}
.order-list td:nth-child(8),.order-list td:nth-child(9),
.order-list td:nth-child(10){text-align:right}
/* 小屏横向滚动，不压缩内容 */
.table-scroll{overflow-x:auto}
/* 数字列：表头与数据都右对齐，否则"数字贴右、标题贴左"看起来像错位 */
.order-list th:nth-child(8),.order-list th:nth-child(9),
.order-list th:nth-child(10){text-align:right}
.order-list th:last-child{text-align:right}
.order-list td:nth-child(8),.order-list td:nth-child(9),
.order-list td:nth-child(10){text-align:right}

/* ---------- 提交工单：左右分栏 ---------- */
/* 之前 1.25fr/.95fr 且子项 min-width:auto，「我的工单」里的 .order-list
   (table-layout:fixed; min-width:1180px) 会把右列撑爆，右卡片被裁到屏幕外。
   这里：允许列收缩、右列保底 320px、表格在卡片内横向滚动。 */
.form-grid{grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr)}
.form-grid>*{min-width:0}
.form-grid .card{overflow:hidden}
.form-grid .table-scroll{overflow-x:auto}
.form-grid .order-list{min-width:640px}
@media (max-width:1100px){.form-grid{grid-template-columns:1fr}}