/* ============================================================
   海南曦讯科技有限公司 · 零售电商设计系统令牌 v3.0（墨曜曦金）
   白底 · 墨色导航 · 曦金点缀 · 现代科技电商风
   与旧版（米白暖调商场风）刻意拉开差异
   ============================================================ */
:root {
  /* ---------- 品牌主色：墨色为骨，曦金为点 ---------- */
  --mh-primary: #1B1E24;          /* 墨 · 主操作色（按钮/导航） */
  --mh-primary-hover: #2C313A;    /* hover 态 */
  --mh-primary-active: #101318;   /* active 态 */
  --mh-accent: #E88D1F;           /* 曦金 · 价格/高亮/点缀 */
  --mh-accent-deep: #C46F0E;      /* 曦金深 · hover */
  --mh-accent-light: #FFF3E0;     /* 曦金浅底 · 仅作高亮底色 */

  /* ---------- 文字色阶 ---------- */
  --mh-text-1: #16181D;           /* 主文字 · 墨黑 */
  --mh-text-2: #4B5563;           /* 次级文字 */
  --mh-text-3: #98A1AE;           /* 辅助文字 */
  --mh-text-4: #C3C9D2;           /* 占位/禁用 */
  --mh-text-inverse: #FFFFFF;     /* 反白文字 */

  /* ---------- 背景色阶（冷灰白体系，弃用暖米） ---------- */
  --mh-bg-page: #FFFFFF;          /* 页面底 · 纯白 */
  --mh-bg-card: #FFFFFF;          /* 卡片底 */
  --mh-bg-soft: #F6F7F9;          /* 柔和底 · 冷灰 */
  --mh-bg-section: #EEF0F3;       /* 区块底 */
  --mh-bg-dark: #16181D;          /* 深色区 · 墨 */

  /* ---------- 分隔/边框 ---------- */
  --mh-line: #E4E7EC;             /* 分隔线 */
  --mh-line-soft: #EEF0F3;        /* 轻分隔 */
  --mh-border: #D5DAE1;           /* 边框 */

  /* ---------- 功能色 ---------- */
  --mh-success: #16A34A;          /* 成功 */
  --mh-warning: #E88D1F;          /* 警告 · 曦金 */
  --mh-error: #DC2626;            /* 错误 */
  --mh-promo: #DC2626;            /* 促销价 */

  /* ---------- 阴影（中性墨色） ---------- */
  --mh-shadow-sm: 0 1px 3px rgba(22, 24, 29, 0.05);
  --mh-shadow-md: 0 6px 18px rgba(22, 24, 29, 0.07);
  --mh-shadow-lg: 0 14px 38px rgba(22, 24, 29, 0.12);
  --mh-shadow-hover: 0 12px 28px rgba(232, 141, 31, 0.16);

  /* ---------- 圆角 ---------- */
  --mh-radius-sm: 4px;
  --mh-radius: 8px;               /* 按钮/标签 */
  --mh-radius-md: 12px;           /* 输入框/小卡 */
  --mh-radius-lg: 16px;           /* 商品卡/大卡 */
  --mh-radius-xl: 24px;           /* Hero/横幅 */
  --mh-radius-pill: 999px;        /* 胶囊 */

  /* ---------- 渐变 ---------- */
  --mh-gradient-warm: linear-gradient(135deg, #1B1E24 0%, #3A3F49 100%);
  --mh-gradient-soft: linear-gradient(180deg, #FFFFFF 0%, #F6F7F9 100%);
  --mh-gradient-banner: linear-gradient(120deg, #16181D 0%, #23272F 55%, #C46F0E 130%);
  --mh-gradient-gold: linear-gradient(135deg, #F2A63B 0%, #E88D1F 55%, #C46F0E 100%);

  /* ---------- 字体（弃衬线展示体，改几何无衬线） ---------- */
  --mh-font-display: "Outfit", "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  --mh-font-body: "Outfit", "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;

  /* ---------- 动效 ---------- */
  --mh-ease: cubic-bezier(0.4, 0, 0.2, 1);
  --mh-dur: 0.28s;
}

/* ============================================================
   主题色映射 · 让旧类名继承新令牌
   ============================================================ */
.font-theme { color: var(--mh-accent-deep) !important; }
a:hover { color: var(--mh-accent-deep) !important; }
.link-hover:hover { color: var(--mh-accent-deep) !important; }

/* body 基础调色（覆盖 theme.css 的白底） */
body {
  background-color: var(--mh-bg-page);
  color: var(--mh-text-1);
  font-family: var(--mh-font-body);
}

/* 通用阴影类令牌化 */
.box-shadow {
  background: var(--mh-bg-card);
  box-shadow: var(--mh-shadow-md);
}
.box-shadow-light {
  background: var(--mh-bg-card);
  box-shadow: var(--mh-shadow-sm);
}
