/**
 * SP低空履约平台 - 字体排版系统
 * 基于 Google Material Design 字体规范
 * 
 * Requirements: 1.4, 16.2
 */

/* ========================================
 * 标题样式 - Headings
 * ======================================== */

/* 超大标题 - 用于页面主标题 */
.heading-display {
  font-family: var(--font-family);
  font-size: var(--font-size-4xl);
  font-weight: var(--font-weight-normal);
  line-height: var(--line-height-tight);
  letter-spacing: var(--letter-spacing-tight);
  color: var(--color-text-primary);
}

/* H1 - 页面标题 */
h1,
.heading-1 {
  font-family: var(--font-family);
  font-size: var(--font-size-3xl);
  font-weight: var(--font-weight-normal);
  line-height: var(--line-height-tight);
  letter-spacing: var(--letter-spacing-tight);
  color: var(--color-text-primary);
}

/* H2 - 区块标题 */
h2,
.heading-2 {
  font-family: var(--font-family);
  font-size: var(--font-size-2xl);
  font-weight: var(--font-weight-normal);
  line-height: var(--line-height-tight);
  letter-spacing: var(--letter-spacing-normal);
  color: var(--color-text-primary);
}

/* H3 - 卡片标题 (24px) */
h3,
.heading-3 {
  font-family: var(--font-family);
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-medium);
  line-height: var(--line-height-snug);
  letter-spacing: var(--letter-spacing-normal);
  color: var(--color-text-primary);
}

/* H4 - 副标题 (18px) */
h4,
.heading-4 {
  font-family: var(--font-family);
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-medium);
  line-height: var(--line-height-snug);
  letter-spacing: var(--letter-spacing-normal);
  color: var(--color-text-primary);
}

/* H5 - 小标题 (16px) */
h5,
.heading-5 {
  font-family: var(--font-family);
  font-size: var(--font-size-md);
  font-weight: var(--font-weight-medium);
  line-height: var(--line-height-normal);
  letter-spacing: var(--letter-spacing-normal);
  color: var(--color-text-primary);
}

/* H6 - 最小标题 (14px) */
h6,
.heading-6 {
  font-family: var(--font-family);
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-medium);
  line-height: var(--line-height-normal);
  letter-spacing: var(--letter-spacing-wide);
  color: var(--color-text-primary);
  text-transform: uppercase;
}

/* ========================================
 * 正文样式 - Body Text
 * ======================================== */

/* 大号正文 (16px) */
.body-large {
  font-family: var(--font-family);
  font-size: var(--font-size-md);
  font-weight: var(--font-weight-normal);
  line-height: var(--line-height-relaxed);
  letter-spacing: var(--letter-spacing-normal);
  color: var(--color-text-primary);
}

/* 标准正文 (14px) */
p,
.body,
.body-medium {
  font-family: var(--font-family);
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-normal);
  line-height: var(--line-height-normal);
  letter-spacing: var(--letter-spacing-normal);
  color: var(--color-text-primary);
}

/* 小号正文 (12px) */
.body-small {
  font-family: var(--font-family);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-normal);
  line-height: var(--line-height-normal);
  letter-spacing: var(--letter-spacing-normal);
  color: var(--color-text-secondary);
}

/* ========================================
 * 辅助文字样式 - Supporting Text
 * ======================================== */

/* 标签文字 - 用于表单标签、按钮等 */
.label-large {
  font-family: var(--font-family);
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-medium);
  line-height: var(--line-height-normal);
  letter-spacing: var(--letter-spacing-normal);
  color: var(--color-text-primary);
}

.label-medium {
  font-family: var(--font-family);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  line-height: var(--line-height-normal);
  letter-spacing: var(--letter-spacing-wide);
  color: var(--color-text-primary);
}

.label-small {
  font-family: var(--font-family);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  line-height: var(--line-height-normal);
  letter-spacing: var(--letter-spacing-wide);
  color: var(--color-text-secondary);
}

/* 说明文字 - 用于帮助文本、提示等 */
.caption {
  font-family: var(--font-family);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-normal);
  line-height: var(--line-height-normal);
  letter-spacing: var(--letter-spacing-normal);
  color: var(--color-text-secondary);
}

/* 超小文字 - 用于徽章、时间戳等 */
.overline {
  font-family: var(--font-family);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  line-height: var(--line-height-normal);
  letter-spacing: var(--letter-spacing-wider);
  color: var(--color-text-secondary);
  text-transform: uppercase;
}

/* ========================================
 * 代码字体样式 - Code Typography
 * ======================================== */

/* 行内代码 */
code,
.code {
  font-family: var(--font-family-mono);
  font-size: 0.875em;
  font-weight: var(--font-weight-normal);
  line-height: var(--line-height-normal);
  color: var(--color-text-primary);
  background-color: var(--color-bg-tertiary);
  padding: 0.125em 0.375em;
  border-radius: var(--radius-sm);
}

/* 代码块 */
pre,
.code-block {
  font-family: var(--font-family-mono);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-normal);
  line-height: var(--line-height-relaxed);
  color: var(--color-text-primary);
  background-color: var(--color-bg-tertiary);
  padding: var(--spacing-4);
  border-radius: var(--radius-md);
  overflow-x: auto;
  white-space: pre;
}

pre code,
.code-block code {
  background: none;
  padding: 0;
  border-radius: 0;
}

/* 键盘按键 */
kbd {
  font-family: var(--font-family-mono);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  line-height: 1;
  color: var(--color-text-secondary);
  background-color: var(--color-bg-tertiary);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  padding: 0.125em 0.375em;
  box-shadow: 0 1px 0 var(--color-border);
}

/* ========================================
 * 特殊文字样式 - Special Text Styles
 * ======================================== */

/* 数值显示 - 用于统计卡片 */
.stat-value {
  font-family: var(--font-family);
  font-size: var(--font-size-3xl);
  font-weight: var(--font-weight-medium);
  line-height: 1;
  letter-spacing: var(--letter-spacing-tight);
  color: var(--color-text-primary);
}

.stat-value-large {
  font-size: var(--font-size-4xl);
}

.stat-value-small {
  font-size: var(--font-size-xl);
}

/* 链接样式 */
.link {
  color: var(--color-primary);
  text-decoration: none;
  transition: var(--transition-color);
}

.link:hover {
  color: var(--color-primary-dark);
  text-decoration: underline;
}

.link:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}

/* ========================================
 * 文字颜色工具类 - Text Color Utilities
 * ======================================== */

.text-primary {
  color: var(--color-text-primary);
}

.text-secondary {
  color: var(--color-text-secondary);
}

.text-disabled {
  color: var(--color-text-disabled);
}

.text-hint {
  color: var(--color-text-hint);
}

.text-inverse {
  color: var(--color-text-inverse);
}

/* 语义颜色 */
.text-success {
  color: var(--color-success);
}

.text-warning {
  color: var(--color-warning-dark);
}

.text-error {
  color: var(--color-error);
}

.text-info {
  color: var(--color-info);
}

/* 品牌颜色 */
.text-brand {
  color: var(--color-primary);
}

/* ========================================
 * 文字对齐工具类 - Text Alignment Utilities
 * ======================================== */

.text-left {
  text-align: left;
}

.text-center {
  text-align: center;
}

.text-right {
  text-align: right;
}

.text-justify {
  text-align: justify;
}

/* ========================================
 * 文字装饰工具类 - Text Decoration Utilities
 * ======================================== */

.text-underline {
  text-decoration: underline;
}

.text-line-through {
  text-decoration: line-through;
}

.text-no-underline {
  text-decoration: none;
}

/* ========================================
 * 文字转换工具类 - Text Transform Utilities
 * ======================================== */

.text-uppercase {
  text-transform: uppercase;
}

.text-lowercase {
  text-transform: lowercase;
}

.text-capitalize {
  text-transform: capitalize;
}

.text-normal-case {
  text-transform: none;
}

/* ========================================
 * 文字截断工具类 - Text Truncation Utilities
 * ======================================== */

/* 单行截断 */
.text-truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* 多行截断 */
.text-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.text-clamp-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ========================================
 * 字重工具类 - Font Weight Utilities
 * ======================================== */

.font-light {
  font-weight: var(--font-weight-light);
}

.font-normal {
  font-weight: var(--font-weight-normal);
}

.font-medium {
  font-weight: var(--font-weight-medium);
}

.font-semibold {
  font-weight: var(--font-weight-semibold);
}

.font-bold {
  font-weight: var(--font-weight-bold);
}

/* ========================================
 * 字体家族工具类 - Font Family Utilities
 * ======================================== */

.font-sans {
  font-family: var(--font-family);
}

.font-mono {
  font-family: var(--font-family-mono);
}
