/* ============================================================
   新知源 · 品牌视觉变量
   所有配色、间距、圆角、阴影统一在此管理
   ============================================================ */

:root {
  /* ---------- 品牌色 ---------- */
  --brand-primary: #00B894;          /* 青绿色 主色 */
  --brand-primary-dark: #009B7D;     /* 主色深 用于按压态 */
  --brand-primary-light: #E6F7F3;    /* 主色浅 用于背景 */
  --brand-gradient: linear-gradient(135deg, #00B894 0%, #0088CC 100%); /* 蓝绿渐变 */
  --brand-gradient-soft: linear-gradient(135deg, #00D9A3 0%, #2AA9E0 100%);

  /* ---------- 强调色(活动/限时,橙色) ---------- */
  --accent: #FF7A45;
  --accent-dark: #E85A2A;
  --accent-light: #FFF1EA;

  /* ---------- 功能色 ---------- */
  --success: #00B894;
  --warning: #FFB020;
  --danger: #F5222D;
  --info: #0088CC;

  /* ---------- 中性色(文字) ---------- */
  --text-primary: #1A1A1A;     /* 标题 */
  --text-regular: #333333;      /* 正文 */
  --text-secondary: #666666;    /* 次要 */
  --text-placeholder: #999999;  /* 占位 */
  --text-disabled: #CCCCCC;     /* 禁用 */

  /* ---------- 背景与分割 ---------- */
  --bg-page: #F7F8FA;           /* 页面背景(浅灰) */
  --bg-card: #FFFFFF;           /* 卡片背景 */
  --bg-mask: rgba(0,0,0,0.45);  /* 遮罩 */
  --border-color: #EEEEEE;
  --divider: #F0F0F0;

  /* ---------- 圆角 ---------- */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;            /* 标准卡片圆角 */
  --radius-xl: 20px;
  --radius-pill: 999px;         /* 胶囊 */

  /* ---------- 阴影 ---------- */
  --shadow-card: 0 4px 16px rgba(0,0,0,0.06);
  --shadow-hover: 0 8px 24px rgba(0,0,0,0.10);
  --shadow-tab: 0 -2px 12px rgba(0,0,0,0.05);
  --shadow-fixed: 0 -4px 20px rgba(0,0,0,0.08);

  /* ---------- 间距 ---------- */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 12px;
  --space-lg: 16px;             /* 标准左右 padding */
  --space-xl: 20px;
  --space-xxl: 24px;

  /* ---------- 字号 ---------- */
  --font-xs: 11px;
  --font-sm: 12px;
  --font-md: 14px;              /* 正文 */
  --font-lg: 16px;              /* 小标题 */
  --font-xl: 18px;
  --font-xxl: 22px;             /* 页面大标题 */
  --font-price: 20px;           /* 价格 */

  /* ---------- 布局 ---------- */
  --content-max-width: 750px;
  --header-height: 48px;
  --tabbar-height: 56px;
  --safe-bottom: env(safe-area-inset-bottom, 0px);

  /* ---------- 字体 ---------- */
  --font-family: -apple-system, BlinkMacSystemFont, "PingFang SC",
                 "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;

  /* ---------- 动画 ---------- */
  --transition: all 0.2s ease;
}