/* =============================================================================
 * 大管家 · 五类页面骨架模板（阶段A P0-5）
 * 规范：概览 Overview / 详情 Detail / 列表 List / 表单 Form / 异常 Exception
 * 纪律：全量走 design_tokens 变量，禁止硬编码色值；筛选栏左、主操作右、每页至多 1 红钮
 * 独立文件，不改动 dgj-components.css / dgj-skeletons.css（避免 CI 行号基线位移）
 * ========================================================================== */

/* ---- 通用：骨架块（复用 design_tokens 的表面色） ---- */
.dgj-sk{background:var(--surface-2);border-radius:var(--radius-sm);position:relative;overflow:hidden}
.dgj-sk::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,var(--surface),transparent);animation:dgj-sk-shimmer 1.4s ease infinite}
@keyframes dgj-sk-shimmer{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}

/* 页头：标题左、主操作右（每页至多 1 个红钮） */
.dgj-page-hd{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);padding:var(--space-4) var(--space-5);border-bottom:1px solid var(--border);background:var(--surface)}
.dgj-page-hd__title{font-size:16px;font-weight:600;color:var(--text-strong);margin:0}
.dgj-page-hd__sub{font-size:12px;color:var(--text-muted);margin-top:2px}
.dgj-page-hd__actions{display:flex;gap:var(--space-2);align-items:center}
.dgj-page-bd{padding:var(--space-5)}

/* ---- 骨架1：概览 Overview（顶部指标卡 + 中部图表 + 底部列表） ---- */
.dgj-pg-overview{display:flex;flex-direction:column;gap:var(--space-4)}
.dgj-pg-overview__kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-4)}
.dgj-pg-overview__kpi{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:var(--space-4)}
.dgj-pg-overview__kpi .dgj-sk{height:28px;margin-bottom:var(--space-2)}
.dgj-pg-overview__kpi .dgj-sk:last-child{height:14px;width:60%}
.dgj-pg-overview__chart{height:240px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius)}
.dgj-pg-overview__list{height:180px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius)}

/* ---- 骨架2：详情 Detail（左信息 + 右时间线） ---- */
.dgj-pg-detail{display:grid;grid-template-columns:2fr 1fr;gap:var(--space-4)}
.dgj-pg-detail__main{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:var(--space-5)}
.dgj-pg-detail__row{display:flex;gap:var(--space-4);margin-bottom:var(--space-4)}
.dgj-pg-detail__label{width:88px;height:14px;flex:none}
.dgj-pg-detail__value{flex:1;height:14px}
.dgj-pg-detail__side{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:var(--space-5)}
.dgj-pg-detail__tl{height:16px;margin-bottom:var(--space-3)}

/* ---- 骨架3：列表 List（筛选栏左 + 主操作右 + 表格 + 分页） ---- */
.dgj-pg-list{display:flex;flex-direction:column;gap:var(--space-4)}
.dgj-pg-list__bar{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3)}
.dgj-pg-list__filters{display:flex;gap:var(--space-2);align-items:center;flex-wrap:wrap}
.dgj-pg-list__filter{width:150px;height:32px}
.dgj-pg-list__ops{display:flex;gap:var(--space-2)}
.dgj-pg-list__table{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
.dgj-pg-list__thead{height:40px;background:var(--surface-3);border-bottom:1px solid var(--border)}
.dgj-pg-list__tr{height:48px;border-bottom:1px solid var(--divider)}
.dgj-pg-list__tr:last-child{border-bottom:none}
.dgj-pg-list__foot{display:flex;justify-content:flex-end;padding:var(--space-3)}

/* ---- 骨架4：表单 Form（单列/双列 + 底部操作区） ---- */
.dgj-pg-form{max-width:720px;margin:0 auto;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:var(--space-6)}
.dgj-pg-form__item{margin-bottom:var(--space-5)}
.dgj-pg-form__label{width:96px;height:14px;margin-bottom:var(--space-2)}
.dgj-pg-form__ctrl{height:36px;border-radius:var(--radius-sm)}
.dgj-pg-form__ctrl--lg{height:96px}
.dgj-pg-form__foot{display:flex;justify-content:flex-end;gap:var(--space-3);padding-top:var(--space-4);border-top:1px solid var(--divider)}

/* ---- 骨架5：异常 Exception（图标 + 标题 + 说明 + 操作） ---- */
.dgj-pg-exception{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:64px 20px;text-align:center}
.dgj-pg-exception__ico{width:72px;height:72px;border-radius:50%;margin-bottom:var(--space-4)}
.dgj-pg-exception__title{width:220px;height:20px;margin-bottom:var(--space-3)}
.dgj-pg-exception__desc{width:320px;height:14px;margin-bottom:var(--space-2)}
.dgj-pg-exception__desc--short{width:240px}
.dgj-pg-exception__ops{display:flex;gap:var(--space-3);margin-top:var(--space-5)}