/* ============================================================
   benben 设计 tokens  (P0 · 2026-10-15)
   ------------------------------------------------------------
   用途：把全站视觉规则收口为 CSS 变量，供 P1（界面统一）
        与 P2（移动端适配）复用。**仅定义变量，不改变任何现有外观**。
   落地路径：static/stock/css/tokens.css
   引入位置：templates/dashboard/resources_head.html（最后一行）
   ============================================================ */

:root {
  /* ---------- 品牌色 ---------- */
  --bb-primary: #4e73df;
  --bb-primary-hover: #2e59d9;
  /* 2026-10-15（P1 批次5）修正：原值 #eaecf4 是 SB2 的 gray-200，
     而录入页 / 总览页实际在用的主色浅底是 #eaeeff ⇒ 更正为实际值，
     使 tokens 真正成为单一真相源（该 token 此前无任何引用，改值零风险）。 */
  --bb-primary-soft: #eaeeff;
  --bb-primary-soft-hover: #dde3fb;
  --bb-primary-dark: #3d5bc4;
  --bb-primary-ring: rgba(78, 115, 223, .25);
  --bb-primary-shadow: rgba(78, 115, 223, .12);

  /* ---------- 文本 ---------- */
  --bb-text: #3a3b45;
  --bb-text-muted: #858796;
  --bb-text-faint: #b7b9cc;
  --bb-text-invert: #fff;
  --bb-text-axis: #6b7280;     /* 图表轴文字灰（P1 批次3 确立）；card.css 原局部变量 --gray-dark
                                  —— 2026-10-15 起也用作指标卡的「数值」色 */
  --bb-text-subtle: #9ca3af;   /* 次级文字（card.css 基线：标签 / 单位 / 「详情 >」） */

  /* ---------- 边框 / 分割线 ---------- */
  --bb-border: #dddfeb;      /* 卡片描边（交易录入页基线） */
  --bb-border-w: 1.5px;
  --bb-divider: #e3e6f0;
  --bb-text-divider: #d1d3e2;  /* 极浅分隔符（如汇率行里的「·」） */
  --bb-dash: #eef0f6;          /* 虚线分隔（列表行之间） */
  --bb-card-border: rgba(209, 213, 219, .4);   /* 卡片浅描边（card.css 基线） */

  /* ---------- 语义色（提示横幅） ---------- */
  --bb-success-soft: #e5f7ec;
  --bb-success-border: #c9ecd6;
  --bb-success-text: #1e7e45;

  /* ---------- 危险 / 表单校验 ---------- */
  --bb-danger: #e34d59;        /* 校验错误（与 --bb-up 同值，语义独立，便于日后分化） */
  --bb-danger-ring: rgba(227, 77, 89, .12);

  /* ---------- 底色 ---------- */
  --bb-bg-page: #f8f9fc;
  --bb-bg-card: #fff;
  --bb-bg-hover: #eaecf4;
  --bb-bg-sunken: #f1f3f9;

  /* ---------- 涨跌（中国市场惯例：红涨绿跌） ---------- */
  --bb-up: #E34D59;
  --bb-down: #00A870;
  --bb-flat: #858796;

  /* ---------- 间距 ---------- */
  --bb-sp-1: .25rem;
  --bb-sp-2: .5rem;
  --bb-sp-3: .75rem;
  --bb-sp-4: 1rem;
  --bb-sp-5: 1.5rem;
  --bb-sp-6: 2rem;

  /* ---------- 圆角 ---------- */
  --bb-radius-sm: .2rem;
  --bb-radius: .35rem;
  --bb-radius-lg: .5rem;
  --bb-radius-pill: 999px;

  /* ---------- 字号 ---------- */
  --bb-fs-xs: .65rem;
  --bb-fs-sm: .75rem;
  --bb-fs-md: .85rem;
  --bb-fs-base: .875rem;
  --bb-fs-lg: 1rem;
  --bb-fs-xl: 1.25rem;

  /* ---------- 字体族 ---------- */
  --bb-font: "Nunito", -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
  --bb-font-num: verdana, "Segoe UI", sans-serif;   /* 数字列对齐用 */

  /* ---------- 骨架尺寸 ---------- */
  --bb-topbar-h: 4.375rem;
  --bb-sidebar-w: 12rem;          /* 桌面·展开（2026-10-15：14rem → 12rem，由 responsive.css「五」消费） */
  --bb-sidebar-w-folded: 6.5rem;  /* 桌面·折叠（SB Admin 2 原生值，未接） */
  --bb-drawer-w: 16rem;           /* 移动端·抽屉 */

  /* ---------- 阴影 ---------- */
  --bb-shadow-sm: 0 .15rem 1.75rem 0 rgba(58, 59, 69, .15);
  --bb-shadow-md: 0 .5rem 2rem rgba(58, 59, 69, .25);

  /* ---------- 交互 ---------- */
  --bb-touch-min: 44px;           /* 移动端最小点击区 */
  --bb-transition: .25s ease;
}

/* ------------------------------------------------------------
   断点策略（CSS 变量无法用于 @media，此处仅作文档）

     xs   手机竖屏      < 576px    ← 全站尚未适配（P2 主战场）
     sm   手机横屏      576~767    ← SB Admin 2「6.5rem 紧凑条」区间
     md   平板          768~991    ← 侧栏展开、内容单列
     lg   桌面          992~1199   ← 现状主要使用区间
     xl   宽屏          >= 1200

   ⚠️ 关键约束：SB Admin 2 的移动端规则写在媒体查询**之外**（移动优先），
      例如 `.sidebar { width: 6.5rem }`、`.nav-link { text-align: center }`。
      覆盖它们必须用 **等宽或更窄的 max-width 媒体查询**，且本文件最后加载。
   ------------------------------------------------------------ */
