/* tokens.css — Design tokens: 暗色(默认) + 亮色双主题 */

/* ===== 暗色主题（默认）===== */
:root[data-theme="dark"] {
  /* 背景层级（精致深邃，Apple 暗模式系，替代 #0d1117）*/
  --bg-base: #1C1C1E;
  --bg-elevated: #2C2C2E;
  --bg-surface: #3A3A3C;
  --bg-overlay: rgba(44, 44, 46, 0.72);

  /* 前景层级 */
  --fg-primary: #F5F5F7;
  --fg-secondary: #AEAEC2;
  --fg-tertiary: #6E6E73;

  /* 边框 */
  --border-subtle: rgba(255, 255, 255, 0.06);
  --border-default: rgba(255, 255, 255, 0.10);
  --border-strong: rgba(255, 255, 255, 0.18);

  /* 语义色（与终端仪表盘语义对齐）*/
  --color-long: #30D158;    /* 做多/折价/盈利 */
  --color-short: #FF453A;   /* 做空/溢价/亏损 */
  --color-warn: #FFD60A;    /* 警告/紧急 */
  --color-info: #64D2FF;    /* 信息/盘后 */
  --color-hold: #BF5AF2;    /* 持仓/观察 */
  --color-neutral: #8E8E93; /* 盘外/中性 */
  --color-accent: #E5C46B;   /* 主交互色 — OpenAI 暖金，替代 cyan */
  --color-accent-fg: #1C1C1E;

  /* 语义色 alpha 叠加（badge/行背景，保证可见度）*/
  --bg-long: rgba(48, 209, 88, 0.16);
  --bg-short: rgba(255, 69, 58, 0.16);
  --bg-warn: rgba(255, 214, 10, 0.16);
  --bg-info: rgba(100, 210, 255, 0.14);
  --bg-hold: rgba(191, 90, 242, 0.14);
  --bg-neutral: rgba(142, 142, 147, 0.16);
  --bg-accent: rgba(229, 196, 107, 0.14);

  /* 阴影 */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.12);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.18);
  --shadow-lg: 0 8px 28px rgba(0, 0, 0, 0.24);

  /* 滚动条 */
  --scrollbar-thumb: rgba(255, 255, 255, 0.12);
  --scrollbar-track: transparent;
}

/* ===== 亮色主题 ===== */
:root[data-theme="light"] {
  /* 背景层级（OpenAI 暖白 + 纯白卡片）*/
  --bg-base: #FAFAF8;
  --bg-elevated: #FFFFFF;
  --bg-surface: #F5F5F0;
  --bg-overlay: rgba(255, 255, 255, 0.72);

  /* 前景层级 */
  --fg-primary: #1D1D1F;
  --fg-secondary: #6E6E73;
  --fg-tertiary: #AEAEC2;

  /* 边框 */
  --border-subtle: rgba(0, 0, 0, 0.05);
  --border-default: rgba(0, 0, 0, 0.08);
  --border-strong: rgba(0, 0, 0, 0.14);

  /* 语义色（亮色版微调）*/
  --color-long: #248A3D;
  --color-short: #D70015;
  --color-warn: #C9A227;
  --color-info: #007AFF;
  --color-hold: #AF52DE;
  --color-neutral: #8E8E93;
  --color-accent: #B8941F;
  --color-accent-fg: #FFFFFF;

  /* alpha 叠加 */
  --bg-long: rgba(36, 138, 61, 0.12);
  --bg-short: rgba(215, 0, 21, 0.10);
  --bg-warn: rgba(201, 162, 39, 0.14);
  --bg-info: rgba(0, 122, 255, 0.10);
  --bg-hold: rgba(175, 82, 222, 0.10);
  --bg-neutral: rgba(142, 142, 147, 0.12);
  --bg-accent: rgba(184, 148, 31, 0.10);

  /* 阴影（亮色更柔和）*/
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.04);
  --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.06);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.08);

  --scrollbar-thumb: rgba(0, 0, 0, 0.12);
  --scrollbar-track: transparent;
}

/* ===== 共享 token（与主题无关）===== */
:root {
  /* 字号 scale（8 阶，基准 13px）*/
  --text-xs: 11px;
  --text-sm: 12px;
  --text-base: 13px;
  --text-md: 14px;
  --text-lg: 16px;
  --text-xl: 18px;
  --text-2xl: 22px;
  --text-3xl: 28px;

  /* 字重 */
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;

  /* 间距 scale（4px 基数）*/
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;

  /* 圆角（统一体系）*/
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-full: 999px;

  /* 动效 */
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --duration-fast: 120ms;
  --duration-normal: 200ms;
  --duration-slow: 320ms;

  /* 毛玻璃 */
  --blur: 20px;
  --blur-saturate: 180%;

  /* 表格 */
  --table-row-height: 36px;
  --table-padding-x: 12px;
  --table-padding-y: 8px;

  /* 滚动条 */
  --scrollbar-width: 6px;

  /* 字体栈 */
  --font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display",
    "PingFang SC", "Helvetica Neue", "Microsoft YaHei", system-ui, sans-serif;
  --font-mono: "SF Mono", "JetBrains Mono", "Fira Code", "Menlo", "Consolas", monospace;
}

/* 默认主题指向暗色，避免无属性时空白 */
:root:not([data-theme="light"]) {
  --bg-base: #1C1C1E;
  --bg-elevated: #2C2C2E;
  --bg-surface: #3A3A3C;
  --bg-overlay: rgba(44, 44, 46, 0.72);
  --fg-primary: #F5F5F7;
  --fg-secondary: #AEAEC2;
  --fg-tertiary: #6E6E73;
  --border-subtle: rgba(255, 255, 255, 0.06);
  --border-default: rgba(255, 255, 255, 0.10);
  --border-strong: rgba(255, 255, 255, 0.18);
  --color-long: #30D158;
  --color-short: #FF453A;
  --color-warn: #FFD60A;
  --color-info: #64D2FF;
  --color-hold: #BF5AF2;
  --color-neutral: #8E8E93;
  --color-accent: #E5C46B;
  --color-accent-fg: #1C1C1E;
  --bg-long: rgba(48, 209, 88, 0.16);
  --bg-short: rgba(255, 69, 58, 0.16);
  --bg-warn: rgba(255, 214, 10, 0.16);
  --bg-info: rgba(100, 210, 255, 0.14);
  --bg-hold: rgba(191, 90, 242, 0.14);
  --bg-neutral: rgba(142, 142, 147, 0.16);
  --bg-accent: rgba(229, 196, 107, 0.14);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.12);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.18);
  --shadow-lg: 0 8px 28px rgba(0, 0, 0, 0.24);
  --scrollbar-thumb: rgba(255, 255, 255, 0.12);
  --scrollbar-track: transparent;
}