/* 赣锋锂电 - 色板系统
 * 基于品牌色: #d3de37, #1a1a12, #ed6c00, #dcdfd9
 */

 :root {
  /* ========== 主色 (黄绿色) ========== */
  --primary-0: #000000;
  --primary-10: #1a1d00;
  --primary-20: #313300;
  --primary-25: #3d4000;
  --primary-30: #494c00;
  --primary-35: #555900;
  --primary-40: #5d6300;
  --primary-50: #787d00;
  --primary-60: #93981e;
  --primary-70: #aeb339;
  --primary-80: #cacf56;
  --primary-90: #d3de37;  /* 品牌主色 */
  --primary-95: #e1ec77;
  --primary-98: #eff9aa;
  --primary-99: #f8fccf;
  --primary-100: #ffffff;

  /* 主色容器与表面 (基于主色阶) */
  --primary-container: var(--primary-90);
  --on-primary-container: var(--primary-10);
  --primary-fixed: var(--primary-90);
  --primary-fixed-dim: var(--primary-80);
  --on-primary-fixed: var(--primary-10);
  --on-primary-fixed-variant: var(--primary-25);

  /* ========== 次色 (灰绿色) ========== */
  --secondary-0: #000000;
  --secondary-10: #1a1a12;
  --secondary-20: #2f3129;
  --secondary-25: #3a3c33;
  --secondary-30: #45473e;
  --secondary-35: #505349;
  --secondary-40: #5c5f54;
  --secondary-50: #75776c;
  --secondary-60: #8f9185;
  --secondary-70: #aaaca0;
  --secondary-80: #c5c7ba;
  --secondary-90: #e2e4d8;
  --secondary-95: #f0f2e6;
  --secondary-98: #f9faf3;
  --secondary-99: #fcfdf6;
  --secondary-100: #ffffff;

  /* 次色容器与表面 (基于次色阶) */
  --secondary-container: var(--secondary-90);
  --on-secondary-container: var(--secondary-20);
  --secondary-fixed: var(--secondary-90);
  --secondary-fixed-dim: var(--secondary-80);
  --on-secondary-fixed: var(--secondary-10);
  --on-secondary-fixed-variant: var(--secondary-30);

  /* ========== 第三色 (橙色) ========== */
  --tertiary-0: #000000;
  --tertiary-10: #2c1200;
  --tertiary-20: #4a2300;
  --tertiary-25: #5c2d00;
  --tertiary-30: #6e3800;
  --tertiary-35: #804200;
  --tertiary-40: #924d00;
  --tertiary-50: #b86200;
  --tertiary-60: #d67600;
  --tertiary-70: #ed8c00;
  --tertiary-80: #ffa845;
  --tertiary-90: #ffdcb8;
  --tertiary-95: #ffeadd;
  --tertiary-98: #fff3ec;
  --tertiary-99: #fff8f5;
  --tertiary-100: #ffffff;

  /* 第三色容器与表面 (基于第三色阶) */
  --tertiary-container: var(--tertiary-90);
  --on-tertiary-container: var(--tertiary-20);
  --tertiary-fixed: var(--tertiary-90);
  --tertiary-fixed-dim: var(--tertiary-70);
  --on-tertiary-fixed: var(--tertiary-10);
  --on-tertiary-fixed-variant: var(--tertiary-30);

  /* ========== 中性色 (灰色) ========== */
  --neutral-0: #000000;
  --neutral-10: #1a1a12;
  --neutral-20: #2f3029;
  --neutral-25: #3a3b33;
  --neutral-30: #45463e;
  --neutral-35: #505149;
  --neutral-40: #5c5d54;
  --neutral-50: #75766c;
  --neutral-60: #8f9086;
  --neutral-70: #aaaba0;
  --neutral-80: #c5c6bb;
  --neutral-90: #e2e3d8;
  --neutral-95: #f0f1e6;
  --neutral-98: #f9faf3;
  --neutral-99: #fcfdf6;
  --neutral-100: #ffffff;

  /* ========== 中性变体 (浅灰绿) ========== */
  --neutral-variant-0: #000000;
  --neutral-variant-10: #1a1d12;
  --neutral-variant-20: #2f3329;
  --neutral-variant-25: #3a3e33;
  --neutral-variant-30: #45493e;
  --neutral-variant-35: #505549;
  --neutral-variant-40: #5c6154;
  --neutral-variant-50: #757a6c;
  --neutral-variant-60: #8f9486;
  --neutral-variant-70: #aaafa0;
  --neutral-variant-80: #c5cabb;
  --neutral-variant-90: #e2e7d8;
  --neutral-variant-95: #f0f5e6;
  --neutral-variant-98: #f9faf3;
  --neutral-variant-99: #fcfdf6;
  --neutral-variant-100: #ffffff;

  /* ========== 表面色 (基于中性色阶) ========== */
  --surface: var(--neutral-99);
  --surface-dim: var(--neutral-90);
  --surface-bright: var(--neutral-100);
  --surface-variant: var(--neutral-variant-90);
  --surface-container: var(--neutral-95);
  --surface-container-low: var(--neutral-98);
  --surface-container-lowest: var(--neutral-100);
  --surface-container-high: var(--neutral-90);
  --surface-container-highest: var(--neutral-80);

  /* ========== 背景与文字 (基于中性色阶) ========== */
  --background: var(--neutral-99);
  --on-background: var(--neutral-10);
  --on-surface: var(--neutral-10);
  --on-surface-variant: var(--neutral-variant-30);

  /* ========== 主色与次色 on-color (基于色阶) ========== */
  --primary: var(--primary-70);
  --on-primary: var(--primary-100);
  --secondary: var(--secondary-40);
  --on-secondary: var(--secondary-100);
  --tertiary: var(--tertiary-40);
  --on-tertiary: var(--tertiary-100);

  /* ========== 错误色 ========== */
  --error-0: #000000;
  --error-10: #410002;
  --error-20: #690005;
  --error-30: #93000a;
  --error-40: #ba1a1a;
  --error-50: #de3730;
  --error-60: #ff5449;
  --error-70: #ff897d;
  --error-80: #ffb4ab;
  --error-90: #ffdad6;
  --error-95: #ffedea;
  --error-98: #fff8f7;
  --error-99: #fffbff;
  --error-100: #ffffff;

  --error: var(--error-40);
  --on-error: var(--error-100);
  --error-container: var(--error-90);
  --on-error-container: var(--error-30);

  /* ========== 轮廓与分割线 ========== */
  --outline: var(--neutral-variant-50);
  --outline-variant: var(--neutral-variant-80);

  /* ========== 反色 (用于深色背景) ========== */
  --inverse-surface: var(--secondary-20);
  --inverse-on-surface: var(--secondary-90);
  --inverse-primary: var(--primary-80);
  --surface-tint: var(--primary-40);

  /* ========== 阴影 ========== */
  --shadow-0: 0px 0px 0px 0px rgba(26, 26, 18, 0);
  --shadow-1: 0px 1px 2px 0px rgba(26, 26, 18, 0.3);
  --shadow-2: 0px 1px 4px 0px rgba(26, 26, 18, 0.15), 0px 2px 8px 0px rgba(26, 26, 18, 0.1);
  --shadow-3: 0px 2px 8px 0px rgba(26, 26, 18, 0.12), 0px 4px 16px 0px rgba(26, 26, 18, 0.08);
  --shadow-4: 0px 4px 16px 0px rgba(26, 26, 18, 0.15), 0px 8px 32px 0px rgba(26, 26, 18, 0.1);
  --shadow-5: 0px 8px 24px 0px rgba(26, 26, 18, 0.2), 0px 16px 48px 0px rgba(26, 26, 18, 0.12);
}

/* ========== 暗色模式变量 ========== */
.dark {
  /* 主色 */
  --primary-0: #ffffff;
  --primary-10: #f8fccf;
  --primary-20: #eff9aa;
  --primary-25: #e1ec77;
  --primary-30: #d3de37;
  --primary-35: #cacf56;
  --primary-40: #aeb339;
  --primary-50: #93981e;
  --primary-60: #787d00;
  --primary-70: #5d6300;
  --primary-80: #494c00;
  --primary-90: #313300;
  --primary-95: #1a1d00;
  --primary-98: #0d0f00;
  --primary-99: #070800;
  --primary-100: #000000;

  --primary-container: var(--primary-25);
  --on-primary-container: var(--primary-95);
  --primary-fixed: var(--primary-90);
  --primary-fixed-dim: var(--primary-80);
  --on-primary-fixed: var(--primary-10);
  --on-primary-fixed-variant: var(--primary-95);

  /* 次色 */
  --secondary-0: #ffffff;
  --secondary-10: #fcfdf6;
  --secondary-20: #f9faf3;
  --secondary-25: #f0f2e6;
  --secondary-30: #e2e4d8;
  --secondary-35: #c5c7ba;
  --secondary-40: #aaaca0;
  --secondary-50: #8f9185;
  --secondary-60: #75776c;
  --secondary-70: #5c5f54;
  --secondary-80: #45473e;
  --secondary-90: #2f3129;
  --secondary-95: #1a1a12;
  --secondary-98: #0d0d09;
  --secondary-99: #070704;
  --secondary-100: #000000;

  --secondary-container: var(--secondary-30);
  --on-secondary-container: var(--secondary-90);
  --secondary-fixed: var(--secondary-90);
  --secondary-fixed-dim: var(--secondary-80);
  --on-secondary-fixed: var(--secondary-10);
  --on-secondary-fixed-variant: var(--secondary-95);

  /* 第三色 */
  --tertiary-0: #ffffff;
  --tertiary-10: #fff8f5;
  --tertiary-20: #fff3ec;
  --tertiary-25: #ffeadd;
  --tertiary-30: #ffdcb8;
  --tertiary-35: #ffa845;
  --tertiary-40: #ed8c00;
  --tertiary-50: #d67600;
  --tertiary-60: #b86200;
  --tertiary-70: #924d00;
  --tertiary-80: #6e3800;
  --tertiary-90: #4a2300;
  --tertiary-95: #2c1200;
  --tertiary-98: #160900;
  --tertiary-99: #0b0400;
  --tertiary-100: #000000;

  --tertiary-container: var(--tertiary-30);
  --on-tertiary-container: var(--tertiary-90);
  --tertiary-fixed: var(--tertiary-90);
  --tertiary-fixed-dim: var(--tertiary-70);
  --on-tertiary-fixed: var(--tertiary-10);
  --on-tertiary-fixed-variant: var(--tertiary-95);

  /* 中性色 */
  --neutral-0: #ffffff;
  --neutral-10: #fcfdf6;
  --neutral-20: #f9faf3;
  --neutral-25: #f0f1e6;
  --neutral-30: #e2e3d8;
  --neutral-35: #c5c6bb;
  --neutral-40: #aaaba0;
  --neutral-50: #8f9086;
  --neutral-60: #75766c;
  --neutral-70: #5c5d54;
  --neutral-80: #45463e;
  --neutral-90: #2f3029;
  --neutral-95: #1a1a12;
  --neutral-98: #0d0d09;
  --neutral-99: #070704;
  --neutral-100: #000000;

  /* 中性变体 */
  --neutral-variant-0: #ffffff;
  --neutral-variant-10: #fcfdf6;
  --neutral-variant-20: #f9faf3;
  --neutral-variant-25: #f0f5e6;
  --neutral-variant-30: #e2e7d8;
  --neutral-variant-35: #c5cabb;
  --neutral-variant-40: #aaafa0;
  --neutral-variant-50: #8f9486;
  --neutral-variant-60: #757a6c;
  --neutral-variant-70: #5c6154;
  --neutral-variant-80: #45493e;
  --neutral-variant-90: #2f3329;
  --neutral-variant-95: #1a1d12;
  --neutral-variant-98: #0d0f09;
  --neutral-variant-99: #070804;
  --neutral-variant-100: #000000;

  /* 表面色 (基于中性色阶) */
  --surface: var(--neutral-10);
  --surface-dim: var(--neutral-0);
  --surface-bright: var(--neutral-20);
  --surface-variant: var(--neutral-variant-30);
  --surface-container: var(--neutral-variant-10);
  --surface-container-low: var(--neutral-0);
  --surface-container-lowest: var(--neutral-0);
  --surface-container-high: var(--neutral-variant-20);
  --surface-container-highest: var(--neutral-variant-25);

  /* 背景与文字 (基于中性色阶) */
  --background: var(--neutral-10);
  --on-background: var(--neutral-30);
  --on-surface: var(--neutral-30);
  --on-surface-variant: var(--neutral-variant-80);

  /* 主色与次色 */
  --primary: var(--primary-40);
  --on-primary: var(--primary-90);
  --secondary: var(--secondary-35);
  --on-secondary: var(--secondary-90);
  --tertiary: var(--tertiary-35);
  --on-tertiary: var(--tertiary-90);

  /* 错误色 */
  --error-0: #ffffff;
  --error-10: #fffbff;
  --error-20: #fff8f7;
  --error-30: #ffedea;
  --error-40: #ffdad6;
  --error-50: #ffb4ab;
  --error-60: #ff897d;
  --error-70: #ff5449;
  --error-80: #de3730;
  --error-90: #690005;
  --error-95: #410002;
  --error-98: #240001;
  --error-99: #140000;
  --error-100: #000000;

  --error: var(--error-80);
  --on-error: var(--error-90);
  --error-container: var(--error-30);
  --on-error-container: var(--error-90);

  /* 轮廓 */
  --outline: var(--neutral-variant-50);
  --outline-variant: var(--neutral-variant-30);

  /* 反色 */
  --inverse-surface: var(--secondary-30);
  --inverse-on-surface: var(--neutral-90);
  --inverse-primary: var(--primary-70);
  --surface-tint: var(--primary-40);

  /* 阴影 */
  --shadow-0: 0px 0px 0px 0px rgba(0, 0, 0, 0);
  --shadow-1: 0px 1px 2px 0px rgba(0, 0, 0, 0.3);
  --shadow-2: 0px 1px 4px 0px rgba(0, 0, 0, 0.15), 0px 2px 8px 0px rgba(0, 0, 0, 0.1);
  --shadow-3: 0px 2px 8px 0px rgba(0, 0, 0, 0.12), 0px 4px 16px 0px rgba(0, 0, 0, 0.08);
  --shadow-4: 0px 4px 16px 0px rgba(0, 0, 0, 0.15), 0px 8px 32px 0px rgba(0, 0, 0, 0.1);
  --shadow-5: 0px 8px 24px 0px rgba(0, 0, 0, 0.2), 0px 16px 48px 0px rgba(0, 0, 0, 0.12);
}
