/* =============================================================================
 * 大管家 · 四角色密度适配层（规范 3.4 密度 / 3.5 角色）
 * 文件：src/css/dgj-density.css
 * 设计原则（最高优先级）：
 *   1. 密度「只改尺寸 Token，不改色板与组件结构」（规范 3.4 原话）。
 *   2. 本文件【不改动】dgj-components.css 任何既有规则，只用「后代选择器 + Token 覆盖」，
 *      因此不会触发 CI 关卡7 行号基线位移误报。
 *   3. 所有尺寸取自本层定义的 --dgj-* Token；颜色一律走 design-tokens 变量。
 *   4. 一线员工(worker)/业主(owner) 触控目标 = 56px（规范 7.19 / P0 触控基线）。
 *
 * 用法：在任意容器上加 .dgj-density-compact|default|loose 或 .dgj-role-admin|butler|worker|owner，
 *      其内部所有组件即按该密度/角色呈现。角色类自带默认密度（见下表）。
 *      密度档位   fontSize/行高   表格行高  卡片内边距  按钮高   适用
 *      compact    13 / 1.45       40       12         28      管理员 PC（信息密度优先）
 *      default    14 / 1.5        48       16         32      管理员平板 / 管家 PC
 *      loose      16 / 1.6        64       20         48(触控56) 一线移动 / 业主端（强制）
 * ============================================================================= */

:root {
  /* 默认密度 = default；各档/角色覆盖下列 Token */
  --dgj-control-h: 32px;
  --dgj-row-h: 48px;
  --dgj-card-pad: 16px;
  --dgj-font-size: 14px;
  --dgj-gap: 8px;
  --dgj-tap: 44px;
  --dgj-label-fs: 14px;
}

/* —— 三档密度预设（直接改 Token，组件读 Token 自动变） —— */
.dgj-density-compact {
  --dgj-control-h: 28px;
  --dgj-row-h: 40px;
  --dgj-card-pad: 12px;
  --dgj-font-size: 13px;
  --dgj-gap: 6px;
  --dgj-label-fs: 13px;
}
.dgj-density-default { /* 等同 :root 默认，显式声明便于切换 */ }
.dgj-density-loose {
  --dgj-control-h: 48px;
  --dgj-row-h: 64px;
  --dgj-card-pad: 20px;
  --dgj-font-size: 16px;
  --dgj-gap: 12px;
  --dgj-tap: 56px;
  --dgj-label-fs: 16px;
}

/* —— 四类角色预设（自带默认密度，规范 3.5） —— */
.dgj-role-admin  { /* 管理员：compact|default 折中 */ --dgj-control-h: 30px; --dgj-row-h: 44px; --dgj-card-pad: 14px; --dgj-font-size: 14px; --dgj-gap: 8px; --dgj-label-fs: 14px; }
.dgj-role-butler { /* 管家：default */ --dgj-control-h: 32px; --dgj-row-h: 48px; --dgj-card-pad: 16px; --dgj-font-size: 14px; --dgj-gap: 8px; --dgj-label-fs: 14px; }
.dgj-role-worker { /* 一线：loose + 触控56 */ --dgj-control-h: 48px; --dgj-row-h: 64px; --dgj-card-pad: 20px; --dgj-font-size: 16px; --dgj-gap: 12px; --dgj-tap: 56px; --dgj-label-fs: 16px; }
.dgj-role-owner  { /* 业主：loose + 触控56 */ --dgj-control-h: 48px; --dgj-row-h: 64px; --dgj-card-pad: 20px; --dgj-font-size: 16px; --dgj-gap: 12px; --dgj-tap: 56px; --dgj-label-fs: 16px; }

/* =============================================================================
 * 组件密度覆盖（后代选择器：容器内所有组件随 Token 变尺寸；颜色不变）
 * 用 [class*="dgj-density-"] / [class*="dgj-role-"] 通配任意密度/角色容器
 * ============================================================================= */

/* 按钮 / 文字按钮：控制高度 + 字号 + 横向内边距 */
[class*="dgj-density-"] .dgj-btn,
[class*="dgj-role-"] .dgj-btn {
  height: var(--dgj-control-h);
  font-size: var(--dgj-font-size);
  padding-inline: var(--dgj-gap);
}
/* 一线/业主：触控目标不小于 56（规范 7.19） */
.dgj-role-worker .dgj-btn,
.dgj-role-owner .dgj-btn { min-height: var(--dgj-tap); min-width: var(--dgj-tap); }

/* 表单控件：控制高度 + 字号 */
[class*="dgj-density-"] .dgj-input,
[class*="dgj-role-"] .dgj-input,
[class*="dgj-density-"] .dgj-form input,
[class*="dgj-role-"] .dgj-form input,
[class*="dgj-density-"] .dgj-form select,
[class*="dgj-role-"] .dgj-form select,
[class*="dgj-density-"] .dgj-form textarea,
[class*="dgj-role-"] .dgj-form textarea {
  height: var(--dgj-control-h);
  font-size: var(--dgj-font-size);
}
[class*="dgj-density-"] .dgj-form textarea,
[class*="dgj-role-"] .dgj-form textarea { height: auto; }

/* 标签 / 状态：字号随密度微调 */
[class*="dgj-density-"] .dgj-tag,
[class*="dgj-role-"] .dgj-tag { font-size: calc(var(--dgj-font-size) - 2px); }

/* 表格：字号 + 单元格行高（用 Token 行高） */
[class*="dgj-density-"] .dgj-table,
[class*="dgj-role-"] .dgj-table { font-size: var(--dgj-font-size); }
[class*="dgj-density-"] .dgj-table th,
[class*="dgj-role-"] .dgj-table th,
[class*="dgj-density-"] .dgj-table td,
[class*="dgj-role-"] .dgj-table td {
  padding-block: calc((var(--dgj-row-h) - var(--dgj-font-size) * 1.4) / 2);
  padding-inline: var(--dgj-gap);
}
[class*="dgj-density-"] .dgj-table thead th,
[class*="dgj-role-"] .dgj-table thead th { font-size: var(--dgj-font-size); }

/* 卡片：内边距随密度 */
[class*="dgj-density-"] .dgj-card,
[class*="dgj-role-"] .dgj-card { padding: var(--dgj-card-pad); }
[class*="dgj-density-"] .dgj-card-title,
[class*="dgj-role-"] .dgj-card-title { font-size: calc(var(--dgj-font-size) + 1px); }

/* 分页 / 面包屑 / 操作栏：字号随密度 */
[class*="dgj-density-"] .dgj-pager,
[class*="dgj-role-"] .dgj-pager,
[class*="dgj-density-"] .dgj-breadcrumb,
[class*="dgj-role-"] .dgj-breadcrumb { font-size: var(--dgj-font-size); }

/* 标签页：点击区高度随按钮高 */
[class*="dgj-density-"] .dgj-tab,
[class*="dgj-role-"] .dgj-tab { font-size: var(--dgj-font-size); }
.dgj-role-worker .dgj-tab,
.dgj-role-owner .dgj-tab { min-height: var(--dgj-tap); }

/* 搜索框：控制高度随密度 */
[class*="dgj-density-"] .dgj-search,
[class*="dgj-role-"] .dgj-search { height: var(--dgj-control-h); }
[class*="dgj-density-"] .dgj-search input,
[class*="dgj-role-"] .dgj-search input { font-size: var(--dgj-font-size); }

/* 表单标签字号随密度 */
[class*="dgj-density-"] .dgj-form__label,
[class*="dgj-role-"] .dgj-form__label,
[class*="dgj-density-"] .dgj-form label,
[class*="dgj-role-"] .dgj-form label { font-size: var(--dgj-label-fs); }

/* 步骤条点尺寸随密度略放大（一线/业主更醒目） */
.dgj-role-worker .dgj-steps__dot,
.dgj-role-owner .dgj-steps__dot { width: 34px; height: 34px; font-size: 15px; }

/* 尊重无障碍：减少动效时关闭过渡（规范 7.19） */
@media (prefers-reduced-motion: reduce) {
  [class*="dgj-density-"] *, [class*="dgj-role-"] * { transition: none !important; animation: none !important; }
}
