/**
 * 汉典会员系统设计令牌
 * 基于汉典前端开发规范 v1.0
 * 所有视觉属性通过 CSS 自定义属性统一管理
 */

:root {
  /* ─── 品牌色 ─── */
  --c-primary:        #8b411c;
  --c-primary-light:  #A65D3F;
  --c-primary-dark:   #6B2F10;
  --c-accent:         #C9A96E;
  --c-accent-light:   #E0CCA0;

  /* ─── 背景层级 ─── */
  --c-bg:             #F5F0EB;
  --c-topbg:          #eee4da;
  --c-surface:        #FFFFFF;
  --c-surface-alt:    #FAF7F3;

  /* ─── 文字颜色 ─── */
  --c-text:           #2C2520;
  --c-text-secondary: #8C7E72;

  /* ─── 边框 & 阴影 ─── */
  --c-border:         #D6CEC6;
  --c-border-light:   #EAE4DD;
  --c-shadow:         rgba(44,37,32,0.08);

  /* ─── 状态色 ─── */
  --c-success:        #3a7c52;
  --c-warning:        #b07820;
  --c-danger:         #c0392b;
  --c-danger-dark:    #a93226;
  --c-info:           #2980b9;

  /* ─── 语义背景色（徽章、提示框）─── */
  --c-success-bg:     rgba(58, 124, 82, 0.1);
  --c-warning-bg:     rgba(176, 120, 32, 0.1);
  --c-danger-bg:      rgba(192, 57, 43, 0.1);
  --c-info-bg:        rgba(41, 128, 185, 0.1);

  /* ─── 通用白色 ─── */
  --c-white:          #ffffff;
  --c-white-90:       rgba(255, 255, 255, 0.9);

  /* ─── 代码背景 ─── */
  --c-code-bg:        #F0EBE5;

  /* ─── 字体栈 ─── */
  --ff-sans:  "PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC",system-ui,sans-serif;
  --ff-serif: "Noto Serif SC","Source Han Serif SC","Songti SC","SimSun",serif;
  --ff-mono:  "JetBrains Mono","Fira Code","SF Mono","Consolas",monospace;

  /* ─── 字号体系 ─── */
  --fs-xs:    0.75rem;
  --fs-sm:    0.875rem;
  --fs-base:  1rem;
  --fs-lg:    1.125rem;
  --fs-xl:    1.25rem;
  --fs-2xl:   1.5rem;
  --fs-3xl:   2rem;

  /* ─── 间距体系 ─── */
  --sp-xs:  4px;
  --sp-sm:  8px;
  --sp-md:  16px;
  --sp-lg:  24px;
  --sp-xl:  32px;
  --sp-2xl: 48px;

  /* ─── 焦点 & 悬停阴影 ─── */
  --shadow-focus:       0 0 0 3px rgba(139, 65, 28, 0.10);
  --shadow-focus-btn:   0 0 0 3px rgba(139, 65, 28, 0.15);
  --shadow-focus-danger: 0 0 0 3px rgba(192, 57, 43, 0.10);
  --shadow-btn-hover:   0 4px 12px rgba(139, 65, 28, 0.25);

  /* ─── 圆角 ─── */
  --radius-sm:  4px;
  --radius-md:  8px;
  --radius-lg:  12px;

  /* ─── 过渡 ─── */
  --transition-fast: 0.15s ease;
  --transition-base: 0.25s ease;

  /* ─── 布局 ─── */
  --content-max: 1200px;
  --header-h:    52px;
}

/* ─── 深色模式 ─── */
[data-theme="dark"] {
  --c-bg:             #1A1614;
  --c-topbg:          #1A1614;
  --c-surface:        #252120;
  --c-surface-alt:    #2E2926;
  --c-text:           #E8E0D8;
  --c-text-secondary: #A09488;
  --c-border:         #3E3832;
  --c-border-light:   #332E28;
  --c-shadow:         rgba(0,0,0,0.25);
  --c-primary:        #C9845A;
  --c-primary-light:  #D4A070;
  --c-primary-dark:   #A06B40;
  --c-code-bg:        #2A2420;
}

/* ─── 基础重置 ─── */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  font-size: 16px;
  scroll-behavior: smooth;
}

body {
  font-family: var(--ff-sans);
  font-size: var(--fs-base);
  line-height: 1.7;
  color: var(--c-text);
  background: var(--c-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a {
  color: var(--c-primary);
  text-decoration: none;
  transition: color var(--transition-fast);
}

a:hover {
  color: var(--c-primary-dark);
  text-decoration: underline;
}

img, svg {
  display: block;
  max-width: 100%;
}

ul, ol {
  list-style: none;
}

code {
  font-family: var(--ff-mono);
}

/* ─── 会员系统特定基础样式 ─── */
.zd-member-body {
  font-family: var(--ff-sans);
  font-size: var(--fs-base);
  line-height: 1.7;
  color: var(--c-text);
  background: var(--c-bg);
}

.zd-member-content {
  max-width: var(--content-max);
  margin: 0 auto;
  padding: var(--sp-xl) var(--sp-lg);
}