/* 报表模块样式
 * 设计稿：设计稿/工作台-20260929/15~18-桌面-*.png
 * 只做桌面端；手机端整页替换成一句提示（.rp-mobile）。
 * 颜色统一走 app.css 的变量，不在这里另起一套。
 */

/* ⚠️ 2026-10-17：本页原有 `max-width: 1240px` 已删除 —— 宽度上界统一由
   `app.css` 的 `--page-max`（1440）接管。🔴 不要再加回来（会造成切页跳宽）。 */
.rp-mobile { display: none; }

/* ---------------- 列表页 ---------------- */

.rp-group-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  margin: 18px 0 10px;
}
.rp-group-head:first-of-type { margin-top: 4px; }
.rp-group-name { font-size: var(--fs-base); font-weight: 600; color: var(--text); }
.rp-group-note { font-size: var(--fs-sm); color: var(--text-3); }

.rp-row {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 18px;
  margin-bottom: 10px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
}
.rp-row.off { background: #FCFCFD; }
.rp-ico { display: flex; flex: 0 0 auto; }
.rp-txt { flex: 1; min-width: 0; }
.rp-name { font-size: var(--fs-md); font-weight: 600; color: var(--text); }
.rp-desc { font-size: var(--fs-base); color: var(--text-3); margin-top: 4px; }
.rp-acts { display: flex; gap: 8px; flex: 0 0 auto; }
.rp-noperm { font-size: var(--fs-sm); color: var(--text-3); }

.rp-tip {
  margin-top: 14px;
  padding: 12px 14px;
  background: #FAFBFC;
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  font-size: var(--fs-sm);
  color: var(--text-3);
  line-height: 1.7;
}

/* ---------------- 工具条 ---------------- */

.rp-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 14px;
}
.rp-bar-l, .rp-bar-r { display: flex; align-items: center; gap: 10px; }
.rp-lab { font-size: var(--fs-sm); color: var(--text-3); }
.rp-fixed { font-size: var(--fs-base); color: var(--text-2); }
.rp-note { font-size: var(--fs-sm); color: var(--text-3); }

.rp-select {
  padding: 9px 14px;
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  background: var(--card);
  color: var(--text);
  font-size: var(--fs-base);
  font-weight: 500;
  font-family: inherit;
  cursor: pointer;
}
.rp-select:focus { border-color: var(--brand); }

/* ---------------- 表格 ---------------- */

/* P1-2 收口（2026-10-18）：`.rp-table` 那一族整块删除 —— 它承担的每一样现在都有容器表达：
     表头/单元格 padding·边框·字号 → `.ui-table thead th` / `tbody td`
     首列加重（`td:first-child` 500）→ `cls:"is-strong"`（report.js 逐列挂）
     右对齐（`.th.r/.td.r`）→ `align:"right"` ⇒ `is-num`
     居中（`.th.c/.td.c`）→ `align:"center"` ⇒ `is-center`（后端从不产出 center，本就是死代码）
     合计行（`tr.rp-total td`）→ `tfoot td`
   ⚠️ `report.js` 里 `cls:"rp-table"` / `footer.cls:"rp-total"` 仍保留：没有规则命中它们，
   留着是给冒烟断言的选择器当锚点，删了要连断言一起改。 */

/* 并排的分布卡（连续 span=half 的表格） */
.rp-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; align-items: start; }

/* 指标卡：app.css 的默认 .stats 写死 4 列，而报表的指标常有 5 个
   （月度盘点/离职分析/人员结构都是 5 个）→ 第 5 个会被挤到第二行，与设计稿不符。
   这里按容器宽度自适应列数：宽屏 5 个一行，窄屏自动回落。
   ⚠️ 只在 ≥768px 生效，手机端沿用 app.css 的 2 列规则。 */
@media (min-width: 768px) {
  .rp-wrap .stats { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
}

/* ---------------- 柱状图 ---------------- */

.rp-chart { padding-top: 4px; }
.rp-bars {
  display: flex;
  align-items: flex-end;
  gap: 10px;
  height: 100px;
}
.rp-bar-col { flex: 1; display: flex; align-items: flex-end; justify-content: center; }
.rp-bar-fill {
  width: 100%;
  border-radius: 4px 4px 0 0;
  background: var(--chart-fill);
}
.rp-bar-fill.on { background: var(--brand); }
.rp-bar-labs { display: flex; gap: 10px; margin-top: 8px; }
.rp-bar-lab {
  flex: 1;
  text-align: center;
  font-size: var(--fs-xs);
  color: var(--text-3);
  white-space: nowrap;
}

/* ---------------- 说明条 ---------------- */

.rp-notes { display: flex; flex-direction: column; gap: 6px; margin-top: 4px; }
.rp-note-line {
  padding: 10px 14px;
  background: var(--warn-weak);
  border: 1px solid #F3E3C8;
  border-radius: var(--r-md);
  font-size: var(--fs-sm);
  color: #8A6D1F;
  line-height: 1.7;
}

/* ---------------- 轻提示 ---------------- */


/* ---------------- 手机端：整页替换 ---------------- */

@media (max-width: 768px) {
  .rp-desktop { display: none; }
  .rp-mobile { display: block; }
}

/* ---------------- S11 下钻明细卡 ---------------- */

/* 明细导出按钮单独一行右对齐：放在表头上方，不挤进表格的合计行 */
.rp-drill-acts { display: flex; justify-content: flex-end; margin-bottom: 8px; }