/* ============================================================================
 * 老板看板（重做版）样式 · 配合 boss-dashboard.js
 * 日常形态遵循 DESIGN.md：白卡、圆角 10px、阴影 1 档、间距 4 的倍数、
 * 图表色序 #1890ff → #52c41a → #fa8c16 → #7265e6 → #13c2c2 → #f5222d。
 * 大屏形态（.bd-screen）为深色全屏：底取侧栏深蓝系 #0f1f33/#16283f，
 * 信息密度与字号按大屏重排，不是浅色反色。
 * 类名一律 bd- 前缀，不与 styles.css 冲突。
 * ==========================================================================*/

/* ---------- 骨架 ---------- */
.bd-wrap{font-size:14px;color:#262626}
.bd-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:16px}
.bd-title{font-size:20px;font-weight:600;line-height:1.4}
.bd-subtitle{margin-left:12px;font-size:12px;color:#8c8c8c}
.bd-head-actions{display:flex;gap:8px;flex-shrink:0}
.bd-muted{color:#8c8c8c;font-size:12px}
.bd-red{color:#f5222d}

/* ---------- KPI 指标带 ---------- */
.bd-kpis{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;margin-bottom:16px}
.bd-kpi{background:#fff;border-radius:10px;box-shadow:0 1px 2px rgba(16,24,40,.05);padding:16px 20px}
.bd-kpi-label{font-size:13px;color:#595959;font-weight:500}
.bd-kpi-num{font-size:32px;font-weight:700;line-height:1.25;font-variant-numeric:tabular-nums;margin:2px 0}
.bd-kpi-sub{font-size:12px;color:#8c8c8c;line-height:1.5}

/* ---------- 面板网格 ---------- */
.bd-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
.bd-panel{background:#fff;border-radius:10px;box-shadow:0 1px 2px rgba(16,24,40,.05);padding:16px 20px;min-width:0}
.bd-panel-title{font-size:16px;font-weight:600;color:#262626;margin-bottom:12px;line-height:1.4}
.bd-span-4{grid-column:span 4}.bd-span-5{grid-column:span 5}
.bd-span-7{grid-column:span 7}.bd-span-12{grid-column:span 12}
.bd-empty{color:#8c8c8c;font-size:13px;text-align:center;padding:34px 12px;line-height:1.6}

/* ---------- SVG 图表 ---------- */
.bd-svg{display:block;width:100%;height:auto}
.bd-svg-label{font-size:12px;fill:#595959}
.bd-svg-val{font-size:12px;font-weight:600;fill:#262626;font-variant-numeric:tabular-nums}
.bd-svg-axis{font-size:12px;fill:#8c8c8c;font-variant-numeric:tabular-nums}
.bd-grid-line{stroke:#f0f0f0;stroke-width:1}
.bd-legend{display:flex;gap:16px;font-size:12px;color:#595959;margin-top:8px}
.bd-legend i{display:inline-block;width:14px;height:3px;border-radius:2px;margin-right:6px;vertical-align:middle}

/* ---------- 条形（产能 / SLA / 服务分共用） ---------- */
.bd-bar-row{display:flex;align-items:center;gap:12px;padding:5px 0}
.bd-bar-label{width:150px;flex-shrink:0;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bd-bar-track{flex:1;background:#f0f0f0;border-radius:4px;height:8px;overflow:hidden}
.bd-bar-fill{height:100%;border-radius:4px;transition:width .25s}
.bd-bar-val{width:64px;flex-shrink:0;text-align:right;font-size:13px;font-weight:600;font-variant-numeric:tabular-nums}
.bd-bar-lg{height:10px}
.bd-bar-sm{display:inline-block;width:110px;flex:none;height:7px;vertical-align:middle;margin-right:8px}
.bd-bar-sm .bd-bar-fill{display:block}
.bd-sub-row{padding:0 0 6px 162px;margin-top:-2px}

/* ---------- 网格产能 ---------- */
.bd-gridcap{padding:8px 0 10px;border-bottom:1px solid #f0f0f0}
.bd-gridcap:last-child{border-bottom:none;padding-bottom:2px}
.bd-gridcap-head{display:flex;align-items:baseline;gap:8px;margin-bottom:6px}
.bd-gridcap-head b{font-size:14px}
.bd-gridcap-head .bd-muted{flex:1}
.bd-gridcap-util{font-size:20px;font-weight:700;font-variant-numeric:tabular-nums}
.bd-gridcap-sub{margin-top:5px}

/* ---------- 师傅 Top 榜 ---------- */
.bd-tech-row{display:flex;align-items:center;gap:10px;padding:7px 0;border-bottom:1px solid #f0f0f0}
.bd-tech-row:last-child{border-bottom:none}
.bd-avatar{width:34px;height:34px;border-radius:50%;color:#fff;font-size:14px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.bd-tech-main{flex:1;min-width:0;font-size:13px;line-height:1.5}
.bd-tag{display:inline-block;font-size:12px;line-height:1;padding:2px 6px;border:1px solid;border-radius:6px;vertical-align:1px}
.bd-tag-grey{color:#8c8c8c;border-color:#e8e8e8}
.bd-tech-score{display:flex;align-items:center;flex-shrink:0}
.bd-tech-score b{font-size:16px;font-variant-numeric:tabular-nums}

/* ---------- 预警榜 ---------- */
.bd-alert-row{display:flex;align-items:center;gap:10px;padding:8px 8px;border-radius:6px;font-size:13px;line-height:1.5}
.bd-alert-row[data-bd-locate]{cursor:pointer}
.bd-alert-row[data-bd-locate]:hover{background:#f5f9ff}
.bd-sev-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.bd-alert-kind{font-weight:600;flex-shrink:0;width:56px}
.bd-alert-text{flex:1;min-width:0}
.bd-alert-go{color:#8c8c8c;font-size:12px;flex-shrink:0}

/* ---------- 动态流 ---------- */
.bd-stream{position:relative}
.bd-stream-row{display:flex;gap:10px;padding:5px 0;font-size:13px;line-height:1.5;align-items:baseline}
.bd-stream-row[data-bd-locate]{cursor:pointer}
.bd-stream-time{width:86px;flex-shrink:0;color:#8c8c8c;font-size:12px;font-variant-numeric:tabular-nums}
.bd-stream-dot{width:7px;height:7px;border-radius:50%;background:#1890ff;flex-shrink:0;position:relative;top:-1px}
.bd-stream-text{flex:1;min-width:0}

/* ---------- 焦点 ---------- */
.bd-wrap [data-bd-locate]:focus-visible,.bd-wrap button:focus-visible{outline:none;box-shadow:0 0 0 2px rgba(24,144,255,.35)}

/* ---------- 响应式 ---------- */
@media (max-width:1500px){
  .bd-kpis{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:1180px){
  .bd-span-5,.bd-span-7{grid-column:span 12}
  .bd-span-4{grid-column:span 6}
  .bd-tech-score .bd-bar-sm{width:70px}
}
@media (max-width:760px){
  .bd-kpis{grid-template-columns:repeat(2,1fr)}
  .bd-span-4{grid-column:span 12}
  .bd-bar-label{width:104px}
  .bd-sub-row{padding-left:116px}
  .bd-head{flex-direction:column;align-items:flex-start}
}

/* ============================================================================
 * 大屏形态（深色全屏 · 按大屏信息密度重排）
 * ==========================================================================*/
.bd-wrap.bd-screen{
  position:fixed;inset:0;z-index:60;overflow:auto;
  background:linear-gradient(160deg,#081527 0%,#0f1f33 55%,#16283f 100%);
  color:#dcebfb;padding:24px 32px;
}
.bd-screen .bd-title{font-size:24px;color:#fff}
.bd-screen .bd-subtitle{color:#8fb0d8}
.bd-screen .bd-kpis{grid-template-columns:repeat(6,1fr);gap:16px}
.bd-screen .bd-kpi{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09);box-shadow:none;padding:16px 20px}
.bd-screen .bd-kpi-label{color:#a9c6e8;font-size:14px}
.bd-screen .bd-kpi-num{font-size:46px;color:#fff;text-shadow:0 0 18px rgba(24,144,255,.35)}
.bd-screen .bd-kpi-sub{color:#8fb0d8;font-size:12px}
.bd-screen .bd-panel{background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.09);box-shadow:none;padding:20px 24px}
.bd-screen .bd-panel-title{color:#fff;font-size:16px}
.bd-screen .bd-span-5{grid-column:span 4}
.bd-screen .bd-span-7{grid-column:span 8}
.bd-screen .bd-panel-alerts{grid-column:span 8}
.bd-screen .bd-span-5:last-child{grid-column:span 4}
.bd-screen .bd-svg-label{fill:#a9c6e8}
.bd-screen .bd-svg-val{fill:#fff}
.bd-screen .bd-svg-axis{fill:#7d9cc4}
.bd-screen .bd-grid-line{stroke:rgba(255,255,255,.08)}
.bd-screen .bd-svg polyline[data-series="created"]{filter:drop-shadow(0 0 5px rgba(24,144,255,.45))}
.bd-screen .bd-svg polyline[data-series="done"]{filter:drop-shadow(0 0 5px rgba(82,196,26,.35))}
.bd-screen .bd-legend{color:#a9c6e8}
.bd-screen .bd-bar-track{background:rgba(255,255,255,.12)}
.bd-screen .bd-bar-label{color:#dcebfb}
.bd-screen .bd-bar-val{color:#fff}
.bd-screen .bd-muted{color:#8fb0d8}
.bd-screen .bd-gridcap{border-bottom-color:rgba(255,255,255,.08)}
.bd-screen .bd-gridcap-head b{color:#fff}
.bd-screen .bd-tech-row{border-bottom-color:rgba(255,255,255,.08)}
.bd-screen .bd-tech-main{color:#dcebfb}
.bd-screen .bd-tech-main b{color:#fff}
.bd-screen .bd-tag-grey{color:#8fb0d8;border-color:rgba(255,255,255,.22)}
.bd-screen .bd-alert-row{color:#dcebfb}
.bd-screen .bd-alert-row[data-bd-locate]:hover{background:rgba(24,144,255,.12)}
.bd-screen .bd-stream-text{color:#dcebfb}
.bd-screen .bd-stream-time{color:#7d9cc4}
.bd-screen .bd-empty{color:#7d9cc4}
.bd-screen .bd-head-actions .btn{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.25);color:#dcebfb}
@media (max-width:1500px){
  .bd-screen .bd-kpis{grid-template-columns:repeat(3,1fr)}
}

/* N 组：报价转化 / 积压三卡 / 周期对比 */
.bd-backlog-row{display:flex;gap:12px;flex-wrap:wrap}
.bd-backlog{flex:1;min-width:140px;border:1px solid #e8e8e8;border-radius:8px;padding:10px 12px}
.bd-backlog-t{font-size:13px;color:#595959}
.bd-backlog-n{font-size:24px;font-weight:700;line-height:1.3;font-variant-numeric:tabular-nums}
.bd-prow{display:flex;gap:10px;align-items:baseline;padding:6px 0;border-bottom:1px dashed #f0f0f0;flex-wrap:wrap}
.bd-prow:last-child{border-bottom:none}
.bd-prow-label{width:76px;color:#595959}
.bd-range-bar{display:flex;gap:8px;align-items:center;margin-bottom:8px;flex-wrap:wrap}
.bd-screen .bd-backlog{border-color:#2b3a4a}
.bd-screen .bd-prow{border-color:#2b3a4a}
