/* =====================================================================
   Design Tokens — 绑定到本项目 design-system/tokens/（base + marketing + admin）
   颜色/圆角/阴影/间距/字体均来自 Figma 设计稿，是本 change 的唯一视觉真相来源。
   严禁在页面中新增 hex；所有视觉值只在此文件定义。
   ===================================================================== */

:root {
  /* ---- 1. 品牌色 ---- */
  --color-brand-blue: #0085D0;
  --color-brand-green: #8EC31E;
  --color-brand-yellow: #FDD000;
  --color-brand-purple: #A6165F;
  --color-brand-cyan: #0098AD;

  /* ---- 2. 功能色 — 文本 ---- */
  --color-text-primary: #303133;
  --color-text-secondary: #4E5969;
  --color-text-tertiary: #86909C;
  --color-text-disabled: #A8ABB2;
  --color-text-placeholder: #A8ABB2;
  --color-text-inverse: #FFFFFF;

  /* ---- 3. 功能色 — 填充 ---- */
  --color-fill-dark: #2E2E2E;
  --color-fill-normal: #F4F7F9;
  --color-fill-light: #F7F8FA;

  /* ---- 4. 语义色 ---- */
  --color-info: #0085D0;
  --color-success: #8EC31E;
  --color-warning: #F49800;
  --color-error: #D53574;

  --color-info-container: #ECF5FF;
  --color-success-container: #F4F9EB;
  --color-warning-container: #FFF9E8;
  --color-error-container: #FFEEF5;
  --color-neutral-container: #EBEEF5;

  /* ---- 5. 语义别名 ---- */
  --color-primary: var(--color-brand-blue);
  --color-primary-hover: #4C9DD9;
  --color-primary-active: #3A83B9;
  --color-primary-disabled-bg: #BFDBF1;
  --color-primary-disabled-text: #BFDBF1;
  --color-primary-outline-bg: #E9F2FB;
  --color-primary-container: var(--color-info-container);

  --color-bg-page: var(--color-fill-light);
  --color-bg-container: #FFFFFF;
  --color-bg-section: var(--color-fill-normal);
  --color-bg-overlay: rgba(0, 0, 0, 0.5);

  --color-border: #DCDFE6;
  --color-border-input: #DCDFE6;
  --color-border-hover: #C0C4CC;
  --color-border-focus: var(--color-primary);
  --color-border-error: var(--color-error);

  /* ---- 6. 导航（侧边栏深蓝） ---- */
  --color-sidebar-bg: #0085D0;
  --color-sidebar-text: #FFFFFF;
  --color-sidebar-active-bg: #1A91D5;
  --color-sidebar-active-text: #00F7FF;
  --color-sidebar-hover-bg: rgba(255, 255, 255, 0.12);
  --color-sidebar-disabled-text: rgba(255, 255, 255, 0.35);
  --color-sidebar-divider: rgba(255, 255, 255, 0.2);

  /* ---- 7. 间距（4 的倍数体系） ---- */
  --space-0: 0px;
  --space-2: 2px;
  --space-4: 4px;
  --space-8: 8px;
  --space-12: 12px;
  --space-16: 16px;
  --space-20: 20px;
  --space-24: 24px;
  --space-32: 32px;
  --space-40: 40px;
  --space-48: 48px;
  --space-64: 64px;
  --space-80: 80px;

  /* ---- 8. 圆角 ---- */
  --radius-none: 0px;
  --radius-xs: 2px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --radius-xl: 30px;
  --radius-pill: 64px;
  --radius-circle: 50%;

  /* ---- 9. 字体族 ---- */
  --font-family-base: "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Helvetica,
    "Hiragino Sans GB", "Segoe UI", Arial, sans-serif;
  --font-family-mono: "SF Mono", "JetBrains Mono", "Geist Mono", Menlo, Consolas, monospace;

  /* 排版层级（Figma 页面实测值） */
  --font-page-title: 600 30px/38px var(--font-family-base);
  --font-form-title: 500 18px/26px var(--font-family-base);
  --font-section-title: 500 16px/24px var(--font-family-base);
  --font-subsection-title: 400 16px/24px var(--font-family-base);
  --font-body: 400 14px/22px var(--font-family-base);
  --font-body-medium: 500 14px/22px var(--font-family-base);
  --font-button-lg: 500 14px/22px var(--font-family-base);
  --font-button-sm: 500 12px/20px var(--font-family-base);
  --font-label: 400 12px/20px var(--font-family-base);
  --font-table-header: 600 12px/20px var(--font-family-base);
  --font-table-body: 400 12px/20px var(--font-family-base);
  --font-caption: 400 10px/1.5 var(--font-family-base);

  /* ---- 10. 阴影 ---- */
  --shadow-card: 0 4px 10px rgba(119, 119, 119, 0.1);
  --shadow-floating: 0 2px 12px rgba(0, 0, 0, 0.1);
  --shadow-top-nav: 0 4px 6px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.06);
  --shadow-sidebar: 0 0 4px rgba(0, 0, 0, 0.1);
  --shadow-page-panel: 0 15px 35px rgba(37, 51, 66, 0.15);
  --shadow-dialog: 0 1px 3px rgba(0, 0, 0, 0.3);

  /* ---- 11. z-index ---- */
  --z-dropdown: 2000;
  --z-sticky: 2010;
  --z-dialog-mask: 2100;
  --z-dialog: 2110;
  --z-dialog-select: 2120;
  --z-tooltip: 2200;
  --z-toast: 2300;

  /* ---- 12. 布局（亮模式：侧栏 + 顶栏 + 内容插槽） ---- */
  --layout-sidebar-width: 252px;
  --layout-sidebar-collapsed: 55px;
  --layout-topbar-height: 32px;
  --layout-content-width: 1160px;
  --layout-content-padding: 32px;
  --layout-page-width: 1440px;

  /* =====================================================================
     Marketing Surface 覆盖（营销门户：首页、活动落地页、我的权益）
     圆角更大、阴影更强、间距更大、按钮更圆
     ===================================================================== */
  --radius-card: var(--radius-lg);
  --shadow-card-marketing: 0 4px 12px rgba(0, 0, 0, 0.08);
  --shadow-modal: 0 10px 30px rgba(0, 0, 0, 0.15);
  --shadow-hero: 0 24px 60px rgba(0, 0, 0, 0.18);
  --section-spacing-marketing: var(--space-64);
  --button-radius-marketing: var(--radius-md);
  --hero-height-desktop: 380px;
  --carousel-height-desktop: 360px;
  --config-card-radius: var(--radius-lg);

  /* =====================================================================
     Admin Surface 覆盖（管理后台：紧凑、克制、高密度）
     本批交付不含 Admin 页，保留以便后续对齐
     ===================================================================== */
  --card-radius-admin: var(--radius-md);
  --card-shadow-admin: 0 1px 3px rgba(0, 0, 0, 0.08);
  --table-row-height: 48px;
  --section-spacing-admin: var(--space-24);
  --font-size-data: 13px;
  --input-height-admin: 36px;
  --button-height-admin: 36px;

  /* ---- 13. 状态标签语义 ---- */
  --status-pending: var(--color-warning);
  --status-approved: var(--color-success);
  --status-rejected: var(--color-error);
  --status-info: var(--color-info);
}