/* ============================================
   typography.css — 排版与字体层级
   遵循企业级 SaaS 设计规范
   ============================================ */

/* ---- 字体族 ---- */
:root {
  --font-family-base:  "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
  --font-family-mono:  "SF Mono", "Menlo", "Consolas", "Courier New", monospace;
  --font-family-number: "DIN Alternate", "Arial", sans-serif;

  /* 字号 */
  --font-size-xs:   12px;
  --font-size-sm:   13px;
  --font-size-base: 14px;
  --font-size-md:   16px;
  --font-size-lg:   18px;
  --font-size-xl:   20px;
  --font-size-xxl:  24px;

  /* 行高 */
  --line-height-tight:  1.2;
  --line-height-base:   1.5;
  --line-height-loose:  1.8;

  /* 字重 */
  --font-weight-regular: 400;
  --font-weight-medium:  500;
  --font-weight-semibold: 600;
  --font-weight-bold:    700;
}

/* ---- 标题分类 ---- */

/* 页面主标题 */
.page-title {
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-primary);
  line-height: var(--line-height-tight);
}

/* 模块标题 / 卡片标题 */
.section-title {
  font-size: var(--font-size-md);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-primary);
  line-height: var(--line-height-base);
}

/* 小标题 */
.sub-title {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-regular);
  line-height: var(--line-height-base);
}

/* ---- 正文分类 ---- */

/* 正文 - 主要 */
.text-body {
  font-size: var(--font-size-base);
  color: var(--color-text-primary);
  line-height: var(--line-height-base);
}

/* 正文 - 辅助说明 */
.text-secondary {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  line-height: var(--line-height-base);
}

/* 正文 - 占位符 / 禁用 */
.text-placeholder {
  font-size: var(--font-size-base);
  color: var(--color-text-placeholder);
  line-height: var(--line-height-base);
}

/* 正文 - 反色（深色背景用） */
.text-inverse {
  color: var(--color-text-inverse);
}

/* ---- 链接 ---- */
a.text-link {
  color: var(--color-primary);
  cursor: pointer;
}
a.text-link:hover {
  color: var(--color-primary-hover);
  text-decoration: underline;
}

/* ---- 数值 / 金额（等宽数字） ---- */
.text-number {
  font-family: var(--font-family-number);
  color: var(--color-text-primary);
}

/* ---- 状态标签文本 ---- */
.text-success { color: var(--color-success); }
.text-warning { color: var(--color-warning); }
.text-danger  { color: var(--color-danger); }
.text-info    { color: var(--color-info); }

/* ---- 单行省略 ---- */
.text-ellipsis {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
