/* ==========================================================================
   尚书 · 工作台补充组件（建立在 workbench.css = template erp 设计系统之上）
   真实功能页（发票审核/配置/skill-sync/doc-gen/仪表盘/待审批 等）所需组件。
   ========================================================================== */
.tabbar { display:flex; gap:2px; border-bottom:1px solid var(--line); margin-bottom:16px; }
.tab { padding:8px 14px; font-size:13px; font-weight:bold; color:var(--fg3); border:none; background:none; border-bottom:2px solid transparent; margin-bottom:-1px; cursor:pointer; transition:all .18s var(--ease); }
.tab:hover { color:var(--fg); }
.tab.on { color:var(--green); border-bottom-color:var(--acc); }
.tab .bdg { font-size:10px; background:var(--redd); color:var(--red); border-radius:var(--r); padding:1px 6px; margin-left:5px; font-weight:bold; }
.fld { margin-bottom:12px; }
.fld label { display:block; font-size:11px; color:var(--fg3); margin-bottom:4px; letter-spacing:.3px; }
.fld input, .fld select, .fld textarea { width:100%; font-family:inherit; font-size:13px; padding:7px 9px; border:1px solid var(--line2); border-radius:var(--r); background:var(--card); color:var(--fg); transition:border-color .18s; }
.fld input:focus, .fld select:focus, .fld textarea:focus { outline:none; border-color:var(--acc); }
.fld .hint, .hint { font-size:11px; color:var(--amber); margin-top:3px; }
.fgrid { display:grid; grid-template-columns:1fr 1fr; gap:0 14px; }
.grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.seg { display:inline-flex; gap:2px; border:1px solid var(--line2); border-radius:var(--r); padding:2px; }
.seg button { font-size:12px; font-weight:bold; color:var(--fg3); padding:5px 11px; border-radius:var(--r); transition:all .15s; }
.seg button.on { background:var(--green); color:#fff; }
.freq { display:flex; flex-wrap:wrap; gap:6px; }
.freq button { font-size:12px; font-weight:bold; color:var(--fg3); padding:6px 12px; border:1px solid var(--line2); border-radius:var(--r); background:var(--card); transition:all .15s; }
.freq button:hover { color:var(--fg); border-color:var(--fg3); }
.freq button.on { background:var(--green); color:#fff; border-color:var(--green); }
.preview { border:1px solid var(--line); border-radius:var(--r); background:var(--bg-alt); min-height:320px; display:flex; align-items:center; justify-content:center; overflow:auto; }
.preview img, .preview embed { max-width:100%; }
/* 甘特图（mock 骨架页） */
.gantt-mock { font-size:12px; }
.gantt-row { display:grid; grid-template-columns:220px 1fr; align-items:center; border-bottom:1px solid var(--line); }
.gantt-row > .lbl { padding:7px 10px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.gantt-track { position:relative; height:26px; background:repeating-linear-gradient(90deg,var(--line) 0 1px,transparent 1px 10%); }
.gantt-bar { position:absolute; top:5px; height:16px; border-radius:4px; background:var(--line2); overflow:hidden; }
.gantt-bar > i { display:block; height:100%; background:var(--green); }
.gantt-bar.late > i { background:var(--red); }
.gantt-today { position:absolute; top:0; bottom:0; width:2px; background:var(--amber); }
/* AI 对话（mock 骨架页） */
.chat-box { display:flex; flex-direction:column; gap:10px; padding:4px 2px; }
.chat-msg { max-width:78%; padding:9px 12px; border-radius:var(--r); font-size:13px; line-height:1.6; }
.chat-msg.ai { background:var(--bg-alt); align-self:flex-start; }
.chat-msg.me { background:var(--green); color:#fff; align-self:flex-end; }
.mock-note { font-size:11.5px; color:var(--fg3); border:1px dashed var(--line2); border-radius:var(--r); padding:8px 10px; margin-bottom:12px; animation:rise .4s var(--ease) both; }
.testr { font-size:11.5px; margin-left:8px; }

/* ── dashboard 仪表盘 ── */
.dash { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.dash .span2 { grid-column:span 2; }
.dash .card { margin-bottom:0; }
.wsub { font-size:11.5px; color:var(--fg3); margin:-8px 16px 0; }
.dash svg { width:100%; display:block; margin:0 auto; }
.dash svg text { font-family:var(--sans); }

.statrow { display:grid; grid-template-columns:repeat(5,1fr); }
.stat { padding:16px 18px 14px; border-right:1px solid var(--line); animation:rise .4s var(--ease) both; }
.stat:last-child { border-right:none; }
.stat .lb { font-size:11px; color:var(--fg3); letter-spacing:.5px; margin-bottom:6px; }
.stat .v { font-size:26px; font-weight:bold; color:var(--fg); line-height:1.1; }
.stat .v em { font-style:normal; font-size:12px; color:var(--fg3); font-weight:normal; margin-left:3px; }
.stat .dl { font-size:11px; margin-top:4px; color:var(--green2); }
.stat .dl.down { color:var(--red); }

.wfail { padding:28px 16px; text-align:center; color:var(--fg3); font-size:12.5px; }

.pop { transform-box:fill-box; transform-origin:center; animation:pop .5s cubic-bezier(.2,.7,.3,1.3) both; }
.fade { animation:fade .9s ease both; }
.draw { stroke-dasharray:1; stroke-dashoffset:1; animation:draw 1s cubic-bezier(.4,0,.2,1) both; }
@keyframes fade { from { opacity:0 } }
@keyframes draw { to { stroke-dashoffset:0 } }
@media (prefers-reduced-motion:reduce) { .pop,.fade,.draw,.stat,.appr { animation:none !important; } }

.dash .card { transition:box-shadow .25s var(--ease), transform .25s var(--ease); }
.dash .card:hover { box-shadow:0 4px 18px rgba(30,32,26,.1); transform:translateY(-2px); }
.stat { transition:background .2s; }
.stat:hover { background:var(--bg-alt); }
.stat .v { transition:color .2s; }
.stat:hover .v { color:var(--green2); }
.dash svg circle, .dash svg line { transition:opacity .18s; }
.card-hd .t { transition:color .2s; }
.dash .card:hover .card-hd .t { color:var(--green); }

/* ── 图表微交互：hover 聚焦，其余淡出 ── */
.hg-stage, .dn-seg, .rg-col { transition:opacity .25s var(--ease); }
.dash svg:hover .hg-stage { opacity:.22; } .dash svg .hg-stage:hover { opacity:1; }
.dash svg:hover .dn-seg { opacity:.3; }  .dash svg .dn-seg:hover { opacity:1; }
.dash svg:hover .rg-col { opacity:.3; }      .dash svg .rg-col:hover { opacity:1; }
.dl-dot { transition:transform .18s var(--spring); transform-box:fill-box; transform-origin:center; }
.dl-dot:hover { transform:scale(2); }

/* ── 待审批列表 ── */
.appr { display:flex; align-items:center; gap:10px; padding:11px 16px; border-bottom:1px solid var(--line); transition:opacity .3s, transform .3s; animation:rise .4s var(--ease) both; }
.appr:last-child { border-bottom:none; }
.appr.gone { opacity:0; transform:translateX(14px); }
.appr .tt { font-size:13px; color:var(--fg); }
.appr .mt { font-size:11px; color:var(--fg3); margin-top:2px; }
.appr .ops { margin-left:auto; display:flex; gap:6px; flex-shrink:0; }
.appr .ops button { font-size:11.5px; font-weight:bold; padding:5px 12px; border-radius:var(--r); transition:transform .15s var(--spring), filter .15s; }
.appr .ops button:active { transform:scale(.94); }
.appr .ok { background:var(--green); color:#fff; } .appr .ok:hover { filter:brightness(1.15); }
.appr .no { border:1px solid var(--line2); color:var(--fg2); } .appr .no:hover { color:var(--red); border-color:var(--red); }

/* —— 角色预设侧栏（2026-08-10）：主区 + 「更多模块」折叠（复用原折叠动效） —— */
.side-main { padding-top: 8px; }
.side-more { padding-top: 8px; }
.side-more .workspace-body { max-height: 0; opacity: 0; overflow: hidden; transition: max-height .4s var(--ease), opacity .2s ease; }
.side-more.open .workspace-body { max-height: 2400px; opacity: 1; }