/* ==========================================================================
   view.css —— 图表 / 报告 / 阅读态页面 / 内嵌系统页 的样式
   全部走 CSS 变量，深色主题自动跟随，不用写两套
   ========================================================================== */

.views{margin-top:12px;display:flex;flex-direction:column;gap:12px}

.vw{
  background:var(--card);border:1px solid var(--bd);border-radius:var(--r-lg);
  overflow:hidden;box-shadow:var(--sh);position:relative;
}
.vw-head-gap{height:0}

/* ---------- 卡片头部 ---------- */
.vw-h{display:flex;align-items:flex-start;gap:10px;padding:12px 14px 8px}
.vw-hl{flex:1;min-width:0}
.vw-t{font-size:13.5px;font-weight:600;color:var(--t1);display:flex;align-items:center;gap:7px;line-height:1.5}
.vw-sub{font-size:11.5px;color:var(--t3);margin-top:2px}
.vw-tag{
  font-size:10px;font-weight:500;color:var(--p-strong);background:var(--p-soft);
  padding:1px 6px;border-radius:4px;flex:0 0 auto;letter-spacing:.2px;
}
.vw-tools{display:flex;gap:4px;flex:0 0 auto;align-items:center}
.vw-btn{
  height:24px;padding:0 8px;border-radius:6px;font-size:11.5px;color:var(--t2);
  border:1px solid var(--bd);background:var(--card);display:inline-flex;align-items:center;
  text-decoration:none;transition:.12s;white-space:nowrap;cursor:pointer;
}
.vw-btn:hover{color:var(--p);border-color:var(--p-bd);background:var(--p-soft2)}
.vw-btn.pri{background:var(--p);border-color:var(--p);color:#fff}
.vw-btn.pri:hover{background:var(--p-strong);color:#fff}
/* 图标按钮：正方形、无内边距，高度与文字按钮一致（24px），换成图标后卡片头高度不变。
   宽度写死是为了让"放大 ↔ 缩小"换图标时不产生横向跳动。 */
.vw-btn.ico{width:24px;padding:0;justify-content:center}
.vw-btn.ico svg{width:14px;height:14px;display:block}
.vw-btn.ico:hover{background:var(--p-soft2)}

/* ---------- 图表 ---------- */
.vw-canvas{width:100%;padding:0 6px}
.vw-tbwrap{padding:0 12px 12px;max-height:420px;overflow:auto}
.vw-insight{
  margin:0 14px 8px;padding:8px 11px;border-radius:8px;background:var(--p-soft2);
  font-size:12.5px;color:var(--t1);line-height:1.7;border-left:2px solid var(--p);
}
.vw-src{font-size:11px;color:var(--t3);padding:0 14px 11px;line-height:1.6}
.vw-err{padding:30px;text-align:center;color:var(--err);font-size:12.5px}

/* ---------- 成稿文件（智能体导出的 xlsx / docx / pptx） ---------- */
.vw-file{padding:0}
.vw-filerow{display:flex;align-items:center;gap:12px;padding:13px 14px}
.vw-fico{
  flex:0 0 auto;width:44px;height:44px;border-radius:10px;overflow:hidden;
  display:flex;align-items:center;justify-content:center;
  /* 兜底色跟皮肤走（SVG 没画出来时露这个底），不再硬编码各类型品牌色 */
  background:var(--p);
}
/* 图标本体是 Office 风格 SVG（皮肤色块 + 白纸折角 + 首字母），svg 撑满容器 */
.vw-fico svg{display:block;width:100%;height:100%}
.vw-fmeta{flex:1;min-width:0}
.vw-fname{font-size:13px;font-weight:600;color:var(--t1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vw-fsub{font-size:11.5px;color:var(--t3);margin-top:2px}
.vw-big{padding:6px 14px 18px;display:flex;flex-direction:column;align-items:flex-start;gap:2px}
.vw-bigv{font-size:40px;font-weight:700;color:var(--p);line-height:1.15;letter-spacing:-1px;font-variant-numeric:tabular-nums}
.vw-bigv i{font-size:14px;font-weight:400;color:var(--t2);font-style:normal;margin-left:5px;letter-spacing:0}
.vw-bigs{font-size:12px;color:var(--t3)}

/* ---------- 表格（图/表切换、报告、报表共用） ---------- */
.vw-tb{width:100%;border-collapse:collapse;font-size:12.5px}
.vw-tb th{
  text-align:left;font-weight:600;color:var(--t2);background:var(--p-soft2);
  padding:7px 10px;border-bottom:1px solid var(--bd);white-space:nowrap;font-size:12px;
}
.vw-tb td{padding:7px 10px;border-bottom:1px solid var(--bd2);color:var(--t1)}
.vw-tb tr:last-child td{border-bottom:none}
.vw-tb tbody tr:hover td{background:var(--p-soft2)}
.vw-tb .num,.vw-tb th.num{text-align:right;font-variant-numeric:tabular-nums}
.vw-tbscroll{overflow:auto;max-height:460px}

/* ---------- 指标卡行 ---------- */
.vw-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px;padding:4px 14px 12px}
.vw-kpi{
  border:1px solid var(--bd);border-radius:10px;padding:10px 12px;background:var(--p-soft2);
  min-width:0;
}
.vw-kl{font-size:11.5px;color:var(--t2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vw-kv{font-size:21px;font-weight:700;color:var(--t1);line-height:1.35;font-variant-numeric:tabular-nums;word-break:break-all}
.vw-kv i{font-size:11.5px;font-weight:400;color:var(--t2);font-style:normal;margin-left:3px}
.vw-kt{font-size:11px;color:var(--t3);margin-top:1px}
.vw-kd{font-size:10.5px;color:var(--t3);margin-top:3px;line-height:1.5}
.vw-kpi.up .vw-kv{color:#C4314B}
.vw-kpi.down .vw-kv{color:var(--ok)}
.vw-kpi.warn .vw-kv{color:var(--warn)}
.vw-kpi.good .vw-kv{color:var(--ok)}
.vw-kpi.bad .vw-kv{color:var(--err)}

/* ---------- 报告：像一份公文 ---------- */
.vw-report{padding:0 0 6px}
.vw-h.doc{display:block;text-align:center;padding:22px 22px 12px;border-bottom:1px solid var(--bd2)}
.vw-h.doc .vw-hl{width:100%}
.vw-h.doc .vw-tools{justify-content:center;margin-top:10px}
.vw-dt{font-size:19px;font-weight:700;color:var(--t1);letter-spacing:.6px;line-height:1.5}
.vw-ds{font-size:12.5px;color:var(--t2);margin-top:3px}
.vw-dm{font-size:11.5px;color:var(--t3);margin-top:5px}
.vw-abs{
  margin:14px 18px 4px;padding:11px 14px;background:var(--p-soft2);
  border-left:3px solid var(--p);border-radius:0 8px 8px 0;
  font-size:13px;color:var(--t1);line-height:1.85;
}
.vw-abs b{color:var(--p-strong);margin-right:7px;font-weight:600}
.vw-blks{padding:4px 18px 0}
.vw-blk{margin:14px 0}
.vw-bh{
  font-size:13.5px;font-weight:600;color:var(--t1);margin-bottom:7px;
  border-left:3px solid var(--p);padding-left:8px;line-height:1.4;
}
.vw-text{font-size:13.5px;color:var(--t1);line-height:1.95;text-align:justify}
.vw-tbn{font-size:11px;color:var(--t3);margin-top:5px}
.vw-list{margin:0;padding-left:20px;font-size:13.5px;line-height:1.9;color:var(--t1)}
.vw-list li{margin-bottom:3px;text-align:justify}
.vw-note{
  margin:12px 0;padding:10px 13px;border-radius:8px;font-size:12.5px;line-height:1.8;
  background:var(--warn-soft);color:var(--t1);border-left:3px solid var(--warn);
}
.vw-hr{border:none;border-top:1px solid var(--bd2);margin:16px 0}
.vw-foot{font-size:10.5px;color:var(--t3);text-align:right;padding:10px 18px 4px}

/* ---------- 阅读态页面 ---------- */
.vw-page{padding:0 0 4px}
.vw-h.pg{padding:15px 16px 12px;border-bottom:1px solid var(--bd2);background:var(--p-soft2)}
.vw-pk{font-size:10.5px;color:var(--p-strong);font-weight:600;letter-spacing:1.2px;margin-bottom:3px}
.vw-badge{
  font-size:11px;font-weight:500;padding:1.5px 8px;border-radius:20px;margin-left:8px;
  background:var(--p-soft);color:var(--p-strong);border:1px solid var(--p-bd);vertical-align:2px;
}
.vw-act{
  display:inline-block;margin:6px 8px 2px;padding:6px 14px;border-radius:7px;
  background:var(--p);color:#fff;font-size:12.5px;text-decoration:none;
}

/* 键值对 */
.vw-fields{display:grid;gap:0;border-top:1px solid var(--bd2)}
.vw-fields.c1{grid-template-columns:1fr}
.vw-fields.c2{grid-template-columns:1fr 1fr}
.vw-fields.c3{grid-template-columns:1fr 1fr 1fr}
.vw-f{display:flex;gap:8px;padding:8px 2px;border-bottom:1px solid var(--bd2);min-width:0}
.vw-f.span2{grid-column:1/-1}
.vw-fl{flex:0 0 92px;font-size:12.5px;color:var(--t3);line-height:1.7}
.vw-fv{flex:1;font-size:12.5px;color:var(--t1);line-height:1.7;word-break:break-word}
.vw-fv .nul{color:var(--t3)}

/* 时间轴 */
.vw-tl{border-left:1px solid var(--bd);padding-left:0;margin-left:6px}
.vw-tli{position:relative;padding:0 0 14px 18px}
.vw-tli:last-child{padding-bottom:2px}
.vw-tldot{
  position:absolute;left:-4.5px;top:5px;width:9px;height:9px;border-radius:50%;
  background:var(--card);border:2px solid var(--t3);
}
.vw-tli.done .vw-tldot{background:var(--ok);border-color:var(--ok)}
.vw-tlt{font-size:13px;font-weight:550;color:var(--t1);display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.vw-tlm{font-size:11px;color:var(--t3);margin-top:1px}
.vw-tlx{font-size:12.5px;color:var(--t2);line-height:1.75;margin-top:4px}
.vw-chip{
  font-size:10px;padding:0 6px;border-radius:4px;background:var(--p-soft);
  color:var(--p-strong);font-weight:500;line-height:1.7;
}
.vw-chip.ok{background:var(--ok-soft);color:var(--ok)}

/* 办理进度：横向步骤条 */
.vw-prog{display:flex;gap:0;overflow-x:auto;padding:6px 2px 2px}
.vw-pstep{
  flex:1;min-width:96px;position:relative;text-align:center;padding:0 4px;
}
.vw-pstep::before{
  content:'';position:absolute;top:13px;left:0;right:0;height:2px;background:var(--bd);
}
.vw-pstep:first-child::before{left:50%}
.vw-pstep:last-child::before{right:50%}
.vw-pstep.done::before,.vw-pstep.doing::before{background:var(--ok)}
.vw-pdot{
  position:relative;width:27px;height:27px;border-radius:50%;margin:0 auto 6px;
  background:var(--card);border:2px solid var(--bd);color:var(--t3);
  display:grid;place-items:center;font-size:11.5px;font-weight:600;z-index:1;
}
.vw-pstep.done .vw-pdot{background:var(--ok);border-color:var(--ok);color:#fff}
.vw-pstep.doing .vw-pdot{border-color:var(--p);color:var(--p);box-shadow:0 0 0 4px var(--p-soft)}
.vw-pname{font-size:12px;color:var(--t1);font-weight:500;line-height:1.5}
.vw-pstep.done .vw-pname{color:var(--ok)}
.vw-pstep.doing .vw-pname{color:var(--p-strong)}
.vw-pmeta{font-size:10.5px;color:var(--t3);line-height:1.55;margin-top:1px}

/* 承办单位 */
.vw-people{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:8px}
.vw-person{display:flex;gap:9px;align-items:center;border:1px solid var(--bd);border-radius:9px;padding:8px 10px;min-width:0}
.vw-pav{
  width:29px;height:29px;border-radius:50%;flex:0 0 auto;display:grid;place-items:center;
  background:var(--p-soft);color:var(--p-strong);font-size:12.5px;font-weight:600;
}
.vw-pinfo{min-width:0;flex:1}
.vw-pn{font-size:12.5px;font-weight:550;color:var(--t1);display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.vw-pr{font-size:11px;color:var(--t3);margin-top:1px}

/* 附件 */
.vw-files{display:flex;flex-direction:column;gap:5px}
.vw-file{
  display:flex;align-items:center;gap:8px;padding:7px 10px;border:1px solid var(--bd);
  border-radius:8px;text-decoration:none;color:var(--t1);transition:.12s;min-width:0;
}
.vw-file:hover{border-color:var(--p-bd);background:var(--p-soft2)}
.vw-fico{color:var(--p);flex:0 0 auto;display:grid;place-items:center}
.vw-fname{flex:1;font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vw-fsize{font-size:11px;color:var(--t3);flex:0 0 auto}

/* ---------- 内嵌系统页面 ---------- */
.vw-frame{position:relative;height:380px;background:var(--p-soft2);border-top:1px solid var(--bd2)}
.vw-frame iframe{width:100%;height:100%;border:none;display:block;background:#fff}
/* 加载提示：盖在 iframe 上，等多久都等，load 触发才撤（不设超时判失败） */
.vw-load{
  position:absolute;inset:0;z-index:2;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
  padding:20px;text-align:center;
  background:var(--p-soft2);color:var(--t3);font-size:12.5px;line-height:1.7;
}
.vw-load-i{
  width:18px;height:18px;border-radius:50%;
  border:2px solid var(--p-bd);border-top-color:var(--p);
  animation:vwspin .9s linear infinite;
}
.vw-load-t a{color:var(--p);text-decoration:underline}
@keyframes vwspin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion: reduce){.vw-load-i{animation:none}}
.vw-fmask{position:absolute;inset:0;display:none;place-items:center;padding:20px;background:rgba(244,247,251,.94)}
html[data-theme="dark"] .vw-fmask{background:rgba(12,21,34,.94)}
.vw-fmask.on{display:grid}
.vw-fmask.sleep{display:grid;cursor:pointer}
.vwo{text-align:center;max-width:400px}
.vwo-t{font-size:14.5px;font-weight:600;color:var(--t1)}
.vwo-d{font-size:12.5px;color:var(--t2);line-height:1.8;margin:6px 0 14px}
.vwo-b{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.vwo-b a,.vwo-b button{
  padding:7px 16px;border-radius:8px;font-size:12.5px;text-decoration:none;
  background:var(--p);color:#fff;border:none;cursor:pointer;
}
.vwo-b button{background:var(--card);color:var(--p);border:1px solid var(--p-bd)}
.vw-hint{
  font-size:11.5px;color:var(--t2);line-height:1.75;padding:9px 14px;
  background:var(--warn-soft);border-top:1px solid var(--bd2);
}
.vw-hint code{background:rgba(120,145,175,.14);padding:1px 4px;border-radius:3px;font-size:11px}

/* ---------- 全屏 ---------- */
.vw-full{
  position:fixed!important;inset:16px;z-index:9999;margin:0;
  box-shadow:0 30px 90px rgba(0,0,0,.42);display:flex;flex-direction:column;
}
.vw-full .vw-canvas{flex:1;height:auto!important}
.vw-full .vw-frame{flex:1;height:auto!important}
.vw-full .vw-blks{overflow:auto}
body.vw-lock{overflow:hidden}

/* ---------- 侧栏打开 ---------- */
.pside{display:flex;flex-direction:column;height:100%}
.psideh{
  display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:550;color:var(--t1);
  padding:2px 0 9px;border-bottom:1px solid var(--bd);margin-bottom:9px;
}
.psideh a{margin-left:auto;font-size:11.5px;color:var(--p);text-decoration:none;font-weight:400}
.pside iframe{flex:1;width:100%;border:1px solid var(--bd);border-radius:8px;background:#fff}

/* ---------- 深色主题微调 ----------
   2026-10-27：这里原来写死 rgba(27,110,243,…) 的蓝，深色下一换肤就冒出几块蓝底，
   和浅色完全是两套色系。深色下的"主色雾"直接用 --p 混合，跟着皮肤走。 */
html[data-theme="dark"] .vw-tb th{background:color-mix(in srgb,var(--p) 10%,transparent)}
html[data-theme="dark"] .vw-kpi{background:color-mix(in srgb,var(--p) 7%,transparent)}
html[data-theme="dark"] .vw-h.pg{background:color-mix(in srgb,var(--p) 8%,transparent)}
html[data-theme="dark"] .vw-person{background:rgba(255,255,255,.02)}
html[data-theme="dark"] .vw-frame{background:#0A1220}
html[data-theme="dark"] .vw-abs{background:color-mix(in srgb,var(--p) 9%,transparent)}

/* ---------- 窄屏 ---------- */
@media (max-width:760px){
  .vw-kpis{grid-template-columns:repeat(2,1fr);gap:6px;padding:4px 10px 10px}
  .vw-kv{font-size:18px}
  .vw-fields.c2,.vw-fields.c3{grid-template-columns:1fr}
  .vw-f{flex-direction:column;gap:1px}
  .vw-fl{flex:none}
  .vw-blks{padding:4px 12px 0}
  .vw-h{padding:11px 12px 7px;flex-wrap:wrap}
  .vw-dt{font-size:16px}
  .vw-canvas{height:220px!important}
  /* 窄屏里内嵌的是 away 的移动页（列表/详情/录入），整屏是竖排布局，
     300px 只能露两行半，给到 62vh 才像回事 */
  .vw-frame{height:62vh;min-height:360px;max-height:600px}
  .vw-bigv{font-size:32px}
}


/* ---------- 候选卡（第六类视图）：定位到多条/多个业务时让人点 ---------- */
.vw-choices{border-radius:12px}
.vch{padding:2px 10px 10px;display:flex;flex-direction:column;gap:6px}
.vch-i{display:flex;align-items:center;gap:10px;padding:9px 11px;border:1px solid var(--line2,rgba(0,0,0,.08));
  border-radius:10px;background:var(--card);cursor:pointer;transition:border-color .12s,background .12s}
.vch-i:hover{border-color:var(--p);background:var(--p-soft,rgba(64,120,255,.06))}
.vch-i.off{opacity:.55;cursor:not-allowed;background:transparent}
.vch-i.off:hover{border-color:var(--line2,rgba(0,0,0,.08));background:transparent}
.vch-m{flex:1;min-width:0}
.vch-l{font-size:13px;color:var(--t1);font-weight:600;line-height:1.45;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vch-s{font-size:11.5px;color:var(--t3);margin-top:2px;line-height:1.5;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vch-h{font-size:11px;color:var(--warn,#c8871a);margin-top:3px}
.vch-go{flex:none;font-size:11.5px;color:var(--p);font-weight:600}
.vch-no{flex:none;font-size:11px;color:var(--t3)}
@media (max-width:900px){
  .vch-l,.vch-s{white-space:normal}
}

/* ---------- 打印：只留内容 ---------- */
@media print{
  .side,.top,.composer,.panel,.wb,.vw-tools,.ptabs,.dragmask,.banner{display:none!important}
  .app{display:block!important;height:auto!important}
  .body,.stage,.msgs{display:block!important;height:auto!important;overflow:visible!important;padding:0!important}
  .vw{box-shadow:none;border:none;break-inside:avoid}
  .msg{break-inside:avoid}
}

/* ---------- 表单卡：先问"怎么填"的两个按钮 ----------
   2026-10-25 二次调整（用户：太丑、两个按钮各占一整行、要"推荐智能填表"）：
   · 两个并排一行，不再各占一整行；
   · 智能填表带「推荐」小徽章，视觉上主动作；
   · 副标题压到一行放得下（"在云起work 里填 / 进业务系统填"）。
   2026-10-27 三次调整（用户手机截图：提示语挤在左列、按钮半边空着、字还换行）：
   · 原来用 grid + `.fcf-q{grid-column:1/-1}`，在某些窄容器里跨列没生效，
     提示语掉进第 1 格、白色按钮掉进第 2 行左格 —— 看起来像"排歪了"。
     改成 flex-wrap：提示语 `flex:1 0 100%` 强制独占一行，不依赖 grid 跨列；
   · 断点 520 → 640，手机横屏 / 小平板也走竖排；
   · 竖排时按钮整宽、副标题不省略（space 够就别截字）。
   2026-10-27 四次调整（用户：「填表界面一个一行什么意思呀 多丑呀」）：
   · 直接定死**纵向每项一行**，不再切两列又切回来。理由：卡片最宽也就 500 来 px，
     两个选项并排时每个只有 240px，「推荐在云起work 里填，我能一路帮你核对」这种
     提示语和副标题都放不下，一挤就换行、右半边还空着，怎么调都难看；
   · 竖排之后每个选项整宽，手指点起来也更大（移动端本来就要这个）；
   · 只保留 gap/padding 这些外皮在 agent-ui.css，**排列方向只在这里写**。
   2026-10-27 五次调整（用户：「太丑了 做小一点按钮行吗 一行可以吗」
                        +「这排小字体不要可以吗 这样是不是就可以排版了」）：
   · **那行提示语整句删掉**（"推荐在云起work 里填，我能一路帮你核对"）——
     它就是撑成两行的元凶，而"推荐"这个信息按钮里的徽标已经表达过了；
   · 副标题（在云起work 里填 / 进业务系统填）也一起去掉，两个词本身够清楚；
   · 两个按钮改成**并排一行、等分、34px 高的小按钮**：图标 + 文字，居中。
     这才是用户一直想要的形态 —— 前面几轮在"两列/整行"之间来回改，
     根子是内容太多放不下；把多出来的字删掉，一行自然排得开。 */
.fc-f{display:flex;gap:8px;padding:9px 12px 11px}
.fc-f .fcf-b{flex:1 1 0;min-width:0}
.vw-btn.fcf-b{
  height:34px;min-height:34px;padding:0 10px;border-radius:8px;
  flex-direction:row;align-items:center;justify-content:center;gap:6px;
  line-height:1;white-space:nowrap;text-align:center;font-size:12.5px;
}
.vw-btn.fcf-b>svg{flex:0 0 auto;opacity:.92;width:14px;height:14px}
.vw-btn.fcf-b .fcf-t{font-size:12.5px;font-weight:500;display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.fcf-rec{
  font-style:normal;font-weight:400;font-size:9.5px;line-height:1;
  padding:2px 5px;border-radius:4px;background:rgba(255,255,255,.22);color:#fff;
  flex:0 0 auto;
}

/* 「换一种填法」的样式不写在这里 —— 它在 design.css 里（那一份后加载，写这里会被盖）。
   view.css 只管填表卡的内容排版。 */

.fcf-done{display:flex;flex-direction:column;gap:3px;padding:9px 11px;border-radius:9px;  background:var(--p-soft2);border:.5px solid var(--p-bd)}
.fcf-done b{font-size:12.5px;font-weight:500;color:var(--p-strong)}
.fcf-done span{font-size:11.5px;color:var(--t3);line-height:1.5}
/* 另开页签这条路写不进值，要说实话（别让人以为上面填好的会跟着过去） */
.fcf-done .fcf-warn{color:var(--warn,#A8681A)}