/* ============================================================
   design-v8.css · 视觉系统 v8（2026-09-23）
   ------------------------------------------------------------
   本文件只做三件事，不动 v1–v7 的任何业务语义：
     1) 界面配置面板（顶栏身份名旁的「界面配置」按钮打开）；
     2) 需求提交入口（顶栏「提需求」按钮 + 浮动入口 + 「链路」页需求列表）；
     3) 显示密度三档（简洁 / 标准 / 详细）——只调行高与留白，
        并配合 JS 调整各区块的默认展开程度。
   约束：不改鉴权、不改客户只读隔离、不动任何数据与接口；
        客户只读端这两块 UI 完全不创建（CSS 这里再兜一层底）。
   ============================================================ */

/* ---------- 1 · 界面配置面板 ---------- */
.uicfg{
  position:fixed;z-index:95;top:calc(var(--top-h,44px) + var(--nav-h,44px) + 6px);right:12px;
  width:min(680px,calc(100vw - 24px));max-height:min(78vh,720px);
  display:flex;flex-direction:column;
  background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);
  box-shadow:var(--sh-3);overflow:hidden;
}
.uicfg.hidden{display:none}
.uicfg-hd{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  padding:8px 10px;border-bottom:1px solid var(--line);background:var(--brand-wash);
}
.uicfg-hd b{font-size:13px;color:var(--brand-deep)}
.uicfg-hd .muted{font-size:10.5px;flex:1 1 auto;min-width:0}
.uicfg-meta{padding:6px 10px;font-size:11px;color:var(--fg2);border-bottom:1px solid var(--line);background:var(--bg2,rgba(0,0,0,.02))}
.uicfg-meta b{color:var(--brand-deep)}
.uicfg-bar{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  padding:8px 10px;border-bottom:1px solid var(--line);
}
.uicfg-bar .seg{display:inline-flex;border:1px solid var(--line);border-radius:var(--r-ctl);overflow:hidden}
.uicfg-bar .seg button{border:0;border-radius:0;padding:5px 10px;font-size:12px;background:transparent}
.uicfg-bar .seg button.on{background:var(--brand-strong,#8E2BB8);color:#fff;font-weight:700}
.uicfg-list{flex:1 1 auto;overflow:auto;-webkit-overflow-scrolling:touch;padding:4px 0}
.uicfg-row{
  display:flex;align-items:center;gap:6px;flex-wrap:wrap;
  padding:5px 10px;font-size:11.5px;border-bottom:1px dashed var(--line);
}
.uicfg-row.is-hidden{opacity:.55}
.uicfg-row .cfg-idx{flex:0 0 20px;color:var(--fg2);font-variant-numeric:tabular-nums;font-size:10.5px}
.uicfg-row .cfg-mv{display:inline-flex;gap:2px}
.uicfg-row .cfg-mv button{padding:2px 6px;font-size:11px;line-height:1.2;min-height:0;height:auto}
.uicfg-row .cfg-name{flex:1 1 150px;min-width:110px;font-weight:700;color:var(--fg);overflow-wrap:anywhere}
.uicfg-row .cfg-name i{font-weight:400;color:var(--fg2);font-style:normal;font-size:10.5px}
.uicfg-row input[type="text"]{flex:1 1 180px;min-width:120px;padding:3px 6px;font-size:11.5px;min-height:0;height:auto}
.uicfg-row label.chk{display:inline-flex;align-items:center;gap:3px;font-size:11px;color:var(--fg2);white-space:nowrap}
.uicfg-ft{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:8px 10px;border-top:1px solid var(--line);background:var(--brand-wash)}
.uicfg-ft .hint{font-size:11px;color:var(--fg2)}
.uicfg-unsaved{color:var(--bad);font-weight:700}
body.is-mobile .uicfg{top:calc(var(--top-h,44px) + var(--nav-h,44px) + 4px);right:8px;left:8px;width:auto;max-height:72vh}
body.is-mobile .uicfg-row{font-size:12px}

/* ---------- 2 · 需求提交入口 ---------- */
.reqbox{margin:8px 0 10px}
.req-toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:6px 0}
.req-toolbar .hint{font-size:11px;color:var(--fg2)}
.req-table td.rt{font-size:11.5px;vertical-align:top}
.req-badge{display:inline-block;padding:1px 7px;border-radius:999px;font-size:11px;font-weight:700;white-space:nowrap}
.req-badge.p-high{background:#FDE8E8;color:#B91C1C}
.req-badge.p-mid{background:#FFF4E0;color:#B45309}
.req-badge.p-low{background:#EEF1F5;color:#4B5563}
.req-badge.s-pending{background:#EEF1F5;color:#4B5563}
.req-badge.s-doing{background:#E7EEFB;color:#1D4ED8}
.req-badge.s-done{background:#E7F6EC;color:#15803D}
.req-badge.s-hold{background:#F3F0FF;color:#6E1F91}
.req-save{padding:2px 8px;font-size:11px;min-height:0;height:auto}
.req-hist{display:block;margin-top:2px;font-size:10.5px;color:var(--fg2);line-height:1.45}
.req-float{
  position:fixed;z-index:90;right:14px;bottom:16px;
  box-shadow:var(--sh-3);border-radius:var(--r-pill);
  padding:9px 15px;font-size:13px;font-weight:700;
}
.req-modal{
  position:fixed;z-index:120;inset:0;display:flex;align-items:flex-start;justify-content:center;
  background:rgba(20,22,26,.42);padding:6vh 12px;
}
.req-modal.hidden{display:none}
.req-card{
  width:min(560px,100%);max-height:88vh;overflow:auto;
  background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);box-shadow:var(--sh-3);
}
.req-card h3{margin:0;padding:10px 12px;border-bottom:1px solid var(--line);background:var(--brand-wash);font-size:13.5px;color:var(--brand-deep)}
.req-form{padding:10px 12px;display:flex;flex-direction:column;gap:8px}
.req-form label{font-size:11.5px;color:var(--fg2);display:flex;flex-direction:column;gap:3px}
.req-form textarea,.req-form input,.req-form select{font-size:13px;padding:6px 8px}
.req-form .pri{display:flex;gap:12px;font-size:12px;color:var(--fg)}
.req-form .pri label{flex-direction:row;align-items:center;gap:4px;font-size:12px;color:var(--fg)}
.req-foot{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:8px 12px;border-top:1px solid var(--line)}
.req-foot .hint{font-size:11px;color:var(--fg2)}

/* 截图投递区（2026-10-08 碧涵需求 rq_muz9bsyag0qu：不再"保存图片→选文件"，直接粘贴/拖拽） */
.rq-drop{
  position:relative;border:1.5px dashed var(--line,#d5d9e0);border-radius:var(--r-card,10px);
  background:var(--brand-wash,#faf7fd);padding:14px 12px;text-align:center;cursor:pointer;
  transition:border-color .15s ease,background .15s ease;
}
.rq-drop:hover{border-color:var(--brand,#8b5cf6)}
.rq-drop:focus-visible{outline:2px solid var(--brand,#8b5cf6);outline-offset:1px}
.rq-drop.is-over{border-color:var(--brand,#8b5cf6);background:rgba(139,92,246,.09)}
.rq-drop-flash{border-color:var(--brand,#8b5cf6)!important;background:rgba(139,92,246,.13)!important}
.rq-drop-inner b{display:block;font-size:12.5px;color:var(--brand-deep,#4c1d95);font-weight:700;letter-spacing:.2px}
.rq-drop-inner span{display:block;margin-top:4px;font-size:11.5px;color:var(--fg2,#6b7280);line-height:1.6}
.rq-drop-inner u{text-decoration:none;border-bottom:1px solid currentColor;color:var(--brand,#8b5cf6);font-weight:600}
.rq-drop.has-img{background:var(--card,#fff)}
body.is-mobile .req-float{right:10px;bottom:12px}
body.skin-client .uicfg,body.skin-client .req-float,body.skin-client .req-modal,body.skin-client .reqbox{display:none!important}

/* ---------- 3 · 显示密度三档（只调留白与行高，不动数据） ---------- */
html[data-density="concise"] main table td,
html[data-density="concise"] main table th{padding:3px 7px;font-size:12.5px;line-height:1.32}
html[data-density="concise"] main .concl{padding:12px 14px}
html[data-density="concise"] main .kpi{padding:10px 12px}
html[data-density="concise"] main .kpi .v{font-size:26px}
html[data-density="concise"] main ul.gaps li,
html[data-density="concise"] main .theme-item,
html[data-density="concise"] main .dim-card{padding:6px 9px}
html[data-density="concise"] main .tblnote{display:none}
html[data-density="concise"] main .std-card li{line-height:1.45}

html[data-density="detailed"] main table td,
html[data-density="detailed"] main table th{padding:10px 12px;font-size:13.5px;line-height:1.75}
html[data-density="detailed"] main .concl{padding:22px 24px}
html[data-density="detailed"] main .kpi{padding:18px 18px}
html[data-density="detailed"] main ul.gaps li,
html[data-density="detailed"] main .theme-item,
html[data-density="detailed"] main .dim-card{padding:12px 14px}
html[data-density="detailed"] main .std-card li{line-height:1.8}

/* 界面配置注入的区块标题（非标题块自定义文案时出现） */
main h2.blk-title{font-size:13.5px;font-weight:700;color:var(--brand-deep);margin:10px 0 6px}
/* 被界面配置隐藏的区块：只隐藏展示，不删数据（DOM 保留，随时可恢复） */
main .blk-hidden{display:none!important}
