/*
 * 智店星后台视觉规范（docs/design/后台视觉规范.md）的唯一取值来源。
 * 页面和组件只引用这里的变量；新增取值先改规范再改本文件。
 */
:root {
  /* 品牌 */
  --zdx-brand: #1768e5;
  --zdx-brand-deep: #0b4ec7;
  --zdx-brand-100: #dbe8fd;
  --zdx-brand-soft: #eef5ff;
  --zdx-navy: #10233f;

  /* 中性色 9 阶 */
  --zdx-gray-900: #10233f;
  --zdx-gray-800: #1b2738;
  --zdx-gray-700: #3d4a5c;
  --zdx-gray-600: #5d6b7e;
  --zdx-gray-400: #9aa4b2;
  --zdx-gray-300: #d5dce6;
  --zdx-gray-200: #e6ebf2;
  --zdx-gray-100: #f1f4f8;
  --zdx-gray-50: #f5f7fb;

  /* 文字与界面语义 */
  --zdx-heading: var(--zdx-gray-900);
  --zdx-text: var(--zdx-gray-800);
  --zdx-text-secondary: var(--zdx-gray-700);
  --zdx-muted: var(--zdx-gray-600);
  --zdx-placeholder: var(--zdx-gray-400);
  --zdx-border-strong: var(--zdx-gray-300);
  --zdx-border: var(--zdx-gray-200);
  --zdx-fill: var(--zdx-gray-100);
  --zdx-canvas: var(--zdx-gray-50);
  --zdx-surface: #ffffff;
  --zdx-on-color: #ffffff; /* 彩色底（主色按钮、深色侧栏）上的文字和图标 */

  /* 状态色：前景用于文字和圆点，底色用于标签背景，前景在底色上对比度 ≥ 4.5 */
  --zdx-success: #167a4e;
  --zdx-success-soft: #e8f2ed;
  --zdx-processing: var(--zdx-brand-deep);
  --zdx-processing-soft: var(--zdx-brand-soft);
  --zdx-warning: #a65300;
  --zdx-warning-soft: #f6eee6;
  --zdx-danger: #c62f3d;
  --zdx-danger-soft: #f9eaec;
  --zdx-neutral: var(--zdx-gray-600);
  --zdx-neutral-soft: var(--zdx-gray-100);

  /* 字号 7 档，后台最小 12px */
  --zdx-font-caption: 12px;
  --zdx-font-body-sm: 13px;
  --zdx-font-body: 14px;
  --zdx-font-title-sm: 16px;
  --zdx-font-title-md: 18px;
  --zdx-font-title-lg: 22px;
  --zdx-font-number-xl: 28px;
  --zdx-font-family: "PingFang SC", "HarmonyOS Sans SC", "Microsoft YaHei", system-ui, sans-serif;
  --zdx-font-mono: ui-monospace, Menlo, Consolas, monospace;

  /* 圆角 3 档 */
  --zdx-radius-sm: 4px;
  --zdx-radius-md: 8px;
  --zdx-radius-lg: 12px;
  --zdx-radius: var(--zdx-radius-lg);

  /* 间距：4 的倍数 */
  --zdx-space-1: 4px;
  --zdx-space-2: 8px;
  --zdx-space-3: 12px;
  --zdx-space-4: 16px;
  --zdx-space-6: 24px;
  --zdx-space-8: 32px;

  --zdx-shadow: 0 8px 28px rgba(16, 35, 63, .08);
  --zdx-shadow-overlay: -12px 0 40px rgba(16, 35, 63, .18);

  /*
   * Element Plus 主题映射。Element Plus 的浅色/深色派生值在编译期固定为默认蓝，
   * 只改主色会让悬停、禁用、标签底色仍是旧蓝，所以派生值必须一并给出。
   */
  --el-color-primary: #1768e5;
  --el-color-primary-light-3: #5d95ed;
  --el-color-primary-light-5: #8bb4f2;
  --el-color-primary-light-7: #b9d2f7;
  --el-color-primary-light-8: #d1e1fa;
  --el-color-primary-light-9: #e8f0fc;
  --el-color-primary-dark-2: #1253b7;
  --el-color-success: #167a4e;
  --el-color-success-light-3: #5ca283;
  --el-color-success-light-5: #8abca6;
  --el-color-success-light-7: #b9d7ca;
  --el-color-success-light-8: #d0e4dc;
  --el-color-success-light-9: #e8f2ed;
  --el-color-success-dark-2: #12623e;
  --el-color-warning: #a65300;
  --el-color-warning-light-3: #c1874c;
  --el-color-warning-light-5: #d2a980;
  --el-color-warning-light-7: #e4cbb2;
  --el-color-warning-light-8: #edddcc;
  --el-color-warning-light-9: #f6eee6;
  --el-color-warning-dark-2: #854200;
  --el-color-danger: #c62f3d;
  --el-color-danger-light-3: #d76d77;
  --el-color-danger-light-5: #e2979e;
  --el-color-danger-light-7: #eec1c5;
  --el-color-danger-light-8: #f4d5d8;
  --el-color-danger-light-9: #f9eaec;
  --el-color-danger-dark-2: #9e2631;
  --el-color-error: #c62f3d;
  --el-color-error-light-3: #d76d77;
  --el-color-error-light-5: #e2979e;
  --el-color-error-light-7: #eec1c5;
  --el-color-error-light-8: #f4d5d8;
  --el-color-error-light-9: #f9eaec;
  --el-color-error-dark-2: #9e2631;
  --el-color-info: #5d6b7e;
  --el-color-info-light-3: #8e97a5;
  --el-color-info-light-5: #aeb5be;
  --el-color-info-light-7: #ced3d8;
  --el-color-info-light-8: #dfe1e5;
  --el-color-info-light-9: #eff0f2;
  --el-color-info-dark-2: #4a5665;

  --el-text-color-primary: #10233f;
  --el-text-color-regular: #1b2738;
  --el-text-color-secondary: #5d6b7e;
  --el-text-color-placeholder: #9aa4b2;
  --el-border-color: #d5dce6;
  --el-border-color-light: #e6ebf2;
  --el-border-color-lighter: #e6ebf2;
  --el-border-color-extra-light: #f1f4f8;
  --el-fill-color-light: #f5f7fb;
  --el-fill-color-lighter: #f5f7fb;
  --el-bg-color-page: #f5f7fb;

  --el-border-radius-small: 4px;
  --el-border-radius-base: 8px;
  --el-border-radius-round: 20px;
  --el-font-size-extra-small: 12px;
  --el-font-size-small: 13px;
  --el-font-size-base: 14px;
  --el-font-size-medium: 16px;
  --el-font-size-large: 18px;
  --el-font-size-extra-large: 22px;
  --el-font-family: var(--zdx-font-family);
  /* Extended spacing, categorical/provider colours and alpha channels. */
  --zdx-brand-on-dark: #9ed0ff;
  --zdx-brand-rgb: 23, 104, 229;
  --zdx-category-teal: #107864;
  --zdx-category-teal-soft: #e8f4f0;
  --zdx-category-violet: #6d4cb5;
  --zdx-category-violet-soft: #f0ebf8;
  --zdx-danger-rgb: 198, 47, 61;
  --zdx-muted-rgb: 93, 107, 126;
  --zdx-navy-rgb: 16, 35, 63;
  --zdx-on-dark-muted: #c7d3e3;
  --zdx-payment-alipay: #1677ff;
  --zdx-payment-unionpay-blue: #2375c9;
  --zdx-payment-unionpay-green: #19a26f;
  --zdx-payment-unionpay-red: #e74047;
  --zdx-payment-wechat: #16b955;
  --zdx-provider-aliyun: #ff6a00;
  --zdx-space-10: 40px;
  --zdx-space-12: 48px;
  --zdx-space-16: 64px;
  --zdx-space-20: 80px;
  --zdx-success-on-dark: #8fe0b7;
  --zdx-surface-rgb: 255, 255, 255;
  --zdx-text-rgb: 27, 39, 56;
  --zdx-warning-on-dark: #ffd183;
}