/* ============================================================
   印记账房 · 组件规范层（base.css）
   ------------------------------------------------------------
   全站唯一的「组件几何规范」：按钮 / 表单控件 / 卡片 / 表格 / 弹窗。
   只定义 尺寸 · 圆角 · 间距 · 字号 · 层级；颜色一律引用 tokens.css
   的语义变量（--cmp-* 是组件几何令牌，--admin-* 是皮肤颜色令牌）。

   引入位置：所有页面模块样式之后的最后一个样式表（保证规范生效）。

   维护约定：
   · 需要新造型请加语义变体（.btn-lg / .btn-sm），不要改基础几何；
   · 页面模块 CSS 只负责「布局 + 本页特有配色」，不要再写
     height / padding / border-radius / font-size 这类基础几何；
   · 本文件零 !important：§4 表格内距曾用 !important 压制历史覆写，现已
     逐页清理掉那些 padding / font-size 覆写，几何在此唯一收口。
     控件与表格均做到「零 !important、零钳制」——所有会压过本文件的
     id 级 / !important 覆写均已清理。
   ============================================================ */

/* ---------- 0. 基础 ---------- */
.btn,.btn-primary,.btn-secondary,.btn-danger,.btn-income,.btn-expense,
.btn-new,.btn-query,.light-tool,
.card,.panel,.dialog,.badge,.tag,
input,select,textarea{box-sizing:border-box}

/* 原生 <small> 默认按 0.8333× 父级缩放，会算出 10.83 / 13.33 这类非阶梯字号；
   固定到 --fs-sm（与当前主流计算值 ~11px 基本一致，消除离群值）。 */
small{font-size:var(--fs-sm)}

/* 表单控件默认不继承字体：UA 会给裸 <button> 13.3333px，脱离阶梯；
   统一回 --fs-md（控件字号，与 .btn 一致；.btn 等类规则优先级更高，不受影响）。 */
button{font-size:var(--fs-md)}

/* ============================================================
   1. 按钮 —— 统一三档尺寸
   ------------------------------------------------------------
   默认档 34px / 圆角 8px
   大档   40px / 圆角 10px   （弹窗底部主操作 .form-actions）
   小档   30px / 圆角 8px    （分页与密集工具条）
   ============================================================ */
.btn,.btn-primary,.btn-secondary,.btn-danger,.btn-income,.btn-expense,
.btn-new,.btn-query,.light-tool{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  height:var(--cmp-btn-h);
  padding:0 14px;
  border-radius:var(--ui-radius,12px);
  font-size:var(--cmp-font);
  font-weight:600;
  line-height:1;
  white-space:nowrap;
  cursor:pointer;
  text-decoration:none;
  transition:transform .16s var(--ease),box-shadow .16s var(--ease),
             background-color .16s var(--ease),border-color .16s var(--ease),
             color .16s var(--ease);
}
.btn:disabled,.btn[disabled],.btn.is-disabled{opacity:.55;cursor:not-allowed;transform:none}

/* 大档：弹窗底部主操作 */
.form-actions .btn,.dialog-footer .btn,.order-builder-actions .btn{
  height:var(--cmp-btn-h-lg);
  padding:0 22px;
  border-radius:var(--ui-radius,12px);
  font-size:var(--fs-lg);
}

/* 小档：分页 / 密集工具条 */
.pagination .btn,.invoice-pagination .btn,.quotation-pagination .btn,
.statement-pagination .btn,.orders-pagination .btn{
  height:var(--cmp-btn-h-sm);
  padding:0 12px;
  font-size:var(--fs-base);
  font-weight:500;
}

/* ============================================================
   2. 表单控件 —— 统一高度 36px / 圆角 8px / 1.5px 边框
   ------------------------------------------------------------
   排除 checkbox / radio / file / range / color / 按钮类 input，
   避免破坏原生控件；textarea 用 min-height 自适应。
   ============================================================ */
input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=range]):not([type=color]):not([type=hidden]):not([type=submit]):not([type=button]):not([type=reset]),
select:not([multiple]),
textarea{
  height:var(--cmp-control-h);
  min-height:var(--cmp-control-h);
  padding:0 11px;
  border:1.5px solid var(--admin-border);
  border-radius:var(--ui-radius,12px);
  background:var(--admin-surface);
  color:var(--admin-text);
  font-size:var(--cmp-font);
  font-family:inherit;
  outline:none;
  transition:border-color .16s var(--ease),box-shadow .16s var(--ease);
}
textarea{height:auto;min-height:80px;padding:9px 11px;line-height:var(--lh-relaxed);resize:vertical}

/* ============================================================
   3. 卡片 —— 圆角唯一来源
   ------------------------------------------------------------
   表面 / 边框 / 阴影由 admin 语义令牌决定（admin-cyber.css §5），
   这里只保证「所有卡片圆角同值」，并兜底非 .card 的卡片容器。
   ============================================================ */
.card,.panel,.metric-card,.stat-card,.section-card,
.payment-panel,.statement-filter,.supplier-card,
.order-metric,.customer-metric-card,
.customer-chart-card,.head-stat-card,.head-ranking-card,
.mat-stat,.invoice-metric,.kpi-cell{
  border-radius:var(--ui-radius,12px);
}

/* ============================================================
   4. 表格 —— 统一内距与字号
   ------------------------------------------------------------
   全站表格统一为 表头 10px 16px / 11.5px，单元格 13px 16px / 13px。
   历史页面里那些 th/td 的 padding / font-size 覆写已逐页删除，
   本处不再需要 !important。有意保留的例外（自带 !important 的打印
   样式 statement-print.css）另计，不受本规则约束。
   ============================================================ */
th{padding:10px 16px;font-size:var(--fs-sm)}
td{padding:13px 16px;font-size:var(--fs-md)}

/* ============================================================
   5. 弹窗 —— 面板圆角唯一来源
   ------------------------------------------------------------
   遮罩 / 背景 / 边框 / 阴影见 admin-cyber.css §9；这里统一面板圆角。
   ============================================================ */
.dialog{border-radius:var(--ui-radius,12px)}

/* ============================================================
   6. 原子件 —— 徽章 / 标签 / 空状态 / 分页条 / 提示条 / 标签页
   ------------------------------------------------------------
   只统一「尺寸 · 圆角 · 间距 · 字号」；颜色由各皮肤（tokens/admin 令牌）
   负责。取值均对齐现有实现中占多数的一方，尽量不改变观感。
   有意保留的例外：弹窗标题上的微型标签（#generic-modal .dialog-title .tag）
   与状态标签（.tag-income/.tag-expense），它们各有语义、自成一体。
   ============================================================ */

/* 6.1 徽章与标签（胶囊） */
.badge,.tag,.invoice-badge,.order-status-pill{
  display:inline-flex;align-items:center;gap:4px;
  padding:5px 9px;
  border-radius:var(--ui-radius,12px);
  font-size:var(--fs-sm);
  font-weight:600;
  line-height:var(--lh-normal);
  white-space:nowrap;
}

/* 6.2 空状态 */
.empty{
  padding:38px 20px;
  text-align:center;
}
.empty-state{
  padding:60px 24px;
  border-radius:var(--ui-radius,12px);
  text-align:center;
}
.empty-state-icon{height:80px}
.empty-state h3{font-size:var(--fs-xl);font-weight:600;margin:0 0 6px}
.empty-state p{font-size:var(--fs-md);line-height:var(--lh-relaxed);margin:0}

/* 6.3 分页条 */
.pagination,.invoice-pagination,.orders-pagination,
.statement-pagination,.quotation-pagination{
  display:flex;align-items:center;
  gap:12px;
  padding:12px 18px;
  font-size:var(--fs-base);
}
.pagination-total{font-weight:600}
.pagination-size{display:inline-flex;align-items:center;gap:6px}
.pagination-size select{padding:0 6px}

/* 6.4 提示条 */
#toast{
  padding:12px 18px;
  border-radius:var(--ui-radius,12px);
}

/* 6.5 标签页 —— 筛选 chip 档（页面内的过滤/视图切换） */
.filter-tab,.accounting-tabs .tab{
  display:inline-flex;align-items:center;gap:6px;
  padding:8px 16px;
  border-radius:var(--ui-radius,12px);
  font-size:var(--fs-md);
  font-weight:500;
}
.filter-tab svg,.accounting-tabs .tab svg{flex:none}

/* ============================================================
   7. 图标 —— 统一内联 SVG 规范
   ------------------------------------------------------------
   全站功能性图标统一为内联 SVG：viewBox 0 0 24 24、stroke 1.8、
   颜色随 currentColor（跟随文字色），与侧栏 NAV_ICONS 同一套语言。
   默认 16px，配 .icon 类使用；
   需要更小 / 更大时用 .icon-sm（13px）/ .icon-lg（20px）。
   与文字并排时由按钮的 inline-flex + gap 负责对齐，行内使用时用
   vertical-align 微调基线，避免图标顶高行盒。

   不在本规范内的「有意例外」：
   · 侧栏导航字形（▦ ▤ ▥，来自 modules.py 与官方模板）；
   · 装饰 / 状态字符（● ★ → × ⚠ ✓ −）；
   · CSS 生成的箭头（如 .order-category-btn:after 的 "▾"）。
   ============================================================ */
.icon{
  width:16px;height:16px;flex:none;
  display:inline-block;vertical-align:-3px;
  fill:none;stroke:currentColor;
}
.icon-sm{width:13px;height:13px;vertical-align:-2px}
.icon-lg{width:20px;height:20px;vertical-align:-4px}