/* ============================================================
 * 设计令牌（网页管理端 · 第 54 轮建立 · 第 56 轮换品牌色）
 * ============================================================
 * 来源三处，优先级明确：
 *
 *   ① 《admin-ui-design》后台规范 —— 现在**只剩布局尺寸**
 *      （侧栏 240px / 顶栏 56px / 内容区底色 / 圆角 / 阴影 / 表格与标签形态）
 *
 *   ② ★ **微信小程序（`zgcl/app.wxss`）的色** —— 第 56 轮起以它为准。
 *      业务方要求：「改成与小程序一样的色」。客户在电脑上和手机上看到的，
 *      必须是**同一家产品**，不能一个蓝一个绿。
 *      ⚠️ 色值**逐字抄自 `zgcl/app.wxss`**，不自己调色；将来小程序改色，这里跟着改。
 *      ⚠️ **主色决策变更**：第 54 轮按后台规范取了蓝 `#3b82f6`，
 *         第 56 轮按业务方要求换成**小程序品牌绿 `#07C160`**。
 *
 *   ③ 本项目专属约定（第 45 / 51 轮）——
 *      · 钱的红绿按中国习惯：**涨红跌绿**（业务语义色，压过后台的「成功绿/危险红」）
 *      · **单号绝不截断**
 *
 * ⚠️ 文字色规则：**面色令牌不当文字色**（--brand / --ok / --warn / --danger / --info 全禁），
 *    文字一律用对应的深色变体（--brand-d / --ok-d / …）。纯色块背景才用面色。
 *    （这条在小程序 WXSS 里踩过：绿底绿字糊成一片。）
 *
 * ⚠️ 带白字的实心按钮底用 --brand-d（#05A150）而不是 --brand（#07C160）——
 *    与小程序 `app.wxss` 第 447 行**同一个决定**：白字在 #07C160 上只有 2.38:1，
 *    压到 --brand-d 是 3.35:1。小程序踩过的坑，网页端不重踩一遍。
 *
 * ⚠️ 换品牌色只改 --brand / --brand-d / --brand-lt / --brand-lt2 / --brand-line 五行。
 * ============================================================ */

:root {
  /* ---------- 布局尺寸（后台规范 —— 这一部分是小程序没有的） ---------- */
  --sidebar-w: 240px;
  --topbar-h: 56px;
  --content-min: 1200px;
  --content-pad-y: 20px;
  --content-pad-x: 24px;

  /* ---------- 底色（对齐小程序 --bg / --card / --fill） ---------- */
  --bg-body: #F5F6F8;          /* 小程序 --bg */
  --bg-card: #FFFFFF;          /* 小程序 --card */
  --bg-sidebar: #0C2B1B;       /* 侧栏深绿：小程序没有侧栏，取品牌绿的深色版，让全站同色相 */
  --bg-sidebar-hover: rgba(255, 255, 255, .08);
  --bg-sidebar-on: #07C160;    /* = --brand（侧栏选中态的实色版，实际渲染走 rgba） */
  --bg-thead: #F7F8FA;         /* 表头：比卡片略沉一档 */
  --bg-row-hover: #F7FCF9;     /* 行悬停：品牌绿的极浅版（原先是蓝调 #fafbff） */
  --bg-muted: #F2F3F5;         /* 小程序 --fill */
  --bg-mask: rgba(16, 24, 40, .45);  /* 小程序 --scrim */
  --bg-topbar: #FFFFFF;

  /* ---------- 文字（对齐小程序 --t1…--t4，对比度在小程序侧已按 WCAG 校准） ---------- */
  --t1: #1A1D24;        /* 主文字：标题、数值 */
  --t2: #5A6270;        /* 次文字：说明、标签 */
  --t3: #666F7C;        /* 辅助：注释、说明 */
  --t4: #A6AEBB;        /* 弱化：**只许**占位符 / 零值 / 禁用 / 纯装饰 */
  --t-side: rgba(255, 255, 255, .72);
  --t-side-on: #FFFFFF;
  --t-inv: #FFFFFF;

  /* ---------- 描边（对齐小程序 --line / --line-2） ---------- */
  --line: #E4E7EC;      /* 结构描边：卡片、输入框（小程序 --line-2） */
  --line-2: #EFF1F4;    /* 行分割线、内部虚线（小程序 --line） */
  --line-3: #D8DDE4;    /* 更深一档：控件描边、图表轴 */

  /* ---------- 主色（★ 小程序品牌绿，逐字抄自 zgcl/app.wxss） ---------- */
  --brand: #07C160;     /* 面：填充 / 圆点 / 条形 / 图标底（= 小程序 --brand / --ok） */
  --brand-d: #05A150;   /* 字：绿字 / 实心按钮底（= 小程序 --brand-d） */
  --brand-dd: #049045;  /* 再深一档：只给实心按钮的 hover（小程序没有 hover，故新增） */
  --brand-lt: #EAF9F1;  /* 浅底一档（= 小程序 --brand-l / --ok-l） */
  --brand-lt2: #D6F5E3; /* 浅底二档（= 小程序 --td-brand-color-light-active） */
  --brand-line: #B7EBCE;/* 品牌描边（= 小程序 --brand-line / --td-brand-color-disabled） */
  --brand-glow: rgba(7, 193, 96, .42);   /* 品牌投影（= 小程序 --brand-glow） */
  --brand-lt-bright: #34D98A;            /* 亮品牌绿：只做渐变尾色（= 小程序 --brand-lt） */

  /* ---------- 功能色（对齐小程序 --ok / --warn / --danger / --info） ---------- */
  --ok: #07C160;      --ok-d: #047A3D;   --ok-lt: #EAF9F1;     /* = 品牌绿 */
  --warn: #FF9500;    --warn-d: #A55C00; --warn-lt: #FFF5E6;   --warn-line: #FFE0B2;
  --danger: #FA5151;  --danger-d: #D42929; --danger-lt: #FFEFEE; --danger-line: #FBCFCF;
  --info: #10AEFF;    --info-d: #0B6FA8; --info-lt: #E8F5FF;
  --pink: #EC4899;    --pink-d: #BE185D; --pink-lt: #FDF2F8;
  --gray: #A6AEBB;    --gray-d: #475569; --gray-lt: #F2F3F5;
  --teal: #00BFA5;    --teal-d: #0A6E64; --teal-lt: #E5F8F5;

  /* ---------- ★ 本项目专属：业务语义色（钱的红绿按中国习惯） ----------
     涨 / 收 / 入 → 红；跌 / 支 / 出 → 绿。
     用在金额增减、库存增减、结款差额上时**以业务为准**，不要用 --ok / --danger。
     ⚠️ 取的就是小程序那两个红绿（红 = --danger 族，绿 = --ok / --brand 族），
        所以「涨红跌绿」与「品牌绿」同色 —— 这是小程序本来的样子，不是冲突。 */
  --up: #FA5151;      --up-d: #D42929;   --up-lt: #FFEFEE;
  --down: #07C160;    --down-d: #047A3D; --down-lt: #EAF9F1;

  /* ---------- 六类商品色（对齐小程序 --c-* 与 constants.PRODUCTS） ----------
     同一类商品在网页端与小程序里必须是**同一个颜色**，否则图例对不上。 */
  --c-summer: #FF8F1F;  --c-summer-l: #FFF4E8;
  --c-winter: #10AEFF;  --c-winter-l: #E8F5FF;
  --c-top: #8B5CF6;     --c-top-l: #F3EFFE;
  --c-pants: #00BFA5;   --c-pants-l: #E5F8F5;
  --c-wtop: #6D28D9;    --c-wtop-l: #F1EAFE;
  --c-wpants: #0D9488;  --c-wpants-l: #E3F5F3;

  /* ---------- 圆角 / 阴影 / 动效 ---------- */
  --r-sm: 6px;
  --r: 8px;
  --r-lg: 10px;
  --r-xl: 12px;
  --r-pill: 12px;
  --sh-1: 0 1px 2px rgba(16, 24, 40, .04);
  --sh-2: 0 2px 8px rgba(16, 24, 40, .06);
  --sh-3: 0 8px 24px rgba(16, 24, 40, .10);
  --sh-4: 0 16px 48px rgba(16, 24, 40, .16);
  --t-fast: .12s ease;
  --t: .2s ease;
  --t-slow: .3s ease;

  /* ---------- 字体 ---------- */
  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
    "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
  --mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
  --fs-xs: 11px;
  --fs-sm: 12px;
  --fs: 13px;
  --fs-md: 14px;
  --fs-lg: 16px;
  --fs-xl: 18px;
  --fs-num: 22px;
  --fs-big: 28px;

  /* ---------- 层级 ---------- */
  --z-sticky: 10;
  --z-drawer: 50;
  --z-modal: 100;
  --z-toast: 200;

  /* ---------- 组件高度（保持一致） ---------- */
  --h-ctl: 32px;
  --h-ctl-lg: 38px;

  /* ---------- 打印（第 56 轮 · 三联多层） ----------
     ⚠️ 打印是**白纸黑字**，与屏幕无关：不参与主题、不参与品牌色。
        打印纸上的「绿」在黑白激光机上只会变成一坨灰。所以联次与单据一律纯黑白。 */
  --print-gap: 14mm;      /* 联与联之间的裁切间距 */
  --print-ink: #000;
  --print-line: #000;
  --print-hair: #bbb;     /* 内部细线：比外框浅一档，避免整张纸糊死 */
}