:root {
  /* 核心主色 - 旗舰红 (Flagship Crimson) - 沉稳、权威、商业 */
  /* 优化：不再使用刺眼的亮红，改为更有质感的绯红，兼顾活力与稳重 */
  --color-primary: #cd1d1d;
  --color-primary-hover: #b91c1c;
  --color-primary-active: #991b1b;
  --color-primary-light: #ef4444;
  --color-primary-lighter: #f87171;
  --color-primary-lightest: #fef2f2;
  --color-primary-rgb: 205, 29, 29;

  /* 辅助色 - 勃艮第酒红 (Burgundy) - 深邃、底蕴 */
  /* 优化：用于渐变深色端，增加色彩厚度 */
  --color-secondary: #9f1225;
  --color-secondary-hover: #881337;
  --color-secondary-active: #7f1d1d;
  --color-secondary-light: #be123c;
  --color-secondary-lightest: #fff1f2;
  --color-secondary-rgb: 159, 18, 37;

  /* 强调色 - 丝绒红 (Velvet Red) - 高级、吸睛 */
  --color-accent: #e11d48;
  --color-accent-hover: #be123c;
  --color-accent-active: #9f1239;
  --color-accent-light: #fda4af;
  --color-accent-lighter: #ffe4e6;
  --color-accent-rgb: 225, 29, 72;

  /* 功能色 - 保持高辨识度，但略微调整饱和度以匹配商务风 */
  --color-purple: #be185d; /* 偏洋红，与红色系更融合 */
  --color-purple-hover: #9d174d;
  --color-purple-dark: #831843;
  --color-purple-light: #f472b6;
  --color-purple-lightest: #fdf2f8;
  --color-purple-rgb: 190, 24, 93;

  --color-success: #15803d; /* 深绿，代表稳健收益 */
  --color-success-hover: #166534;
  --color-success-light: #dcfce7;
  --color-success-dark: #14532d;
  --color-success-rgb: 21, 128, 61;

  --color-warning: #b45309; /* 琥珀金，更具金属质感 */
  --color-warning-hover: #92400e;
  --color-warning-light: #fef3c7;
  --color-warning-dark: #78350f;
  --color-warning-rgb: 180, 83, 9;

  --color-danger: #c2410c; /* 橘红，与主色区分 */
  --color-danger-hover: #9a3412;
  --color-danger-light: #ffedd5;
  --color-danger-dark: #7c2d12;
  --color-danger-rgb: 194, 65, 12;

  --color-info: #0369a1;
  --color-info-hover: #075985;
  --color-info-light: #e0f2fe;
  --color-info-dark: #0c4a6e;
  --color-info-rgb: 3, 105, 161;

  /* 文本颜色 - 注入红色基因的暖黑 (Warm Black) */
  /* 优化：黑色不再是纯黑，而是带有极深的红棕色倾向，极具高级感 */
  --color-text-primary: #1a1414; /* 暖炭黑 */
  --color-text-secondary: #362828; /* 深暖灰 */
  --color-text-tertiary: #584848;
  --color-text-quaternary: #756565;
  --color-text-muted: #a39393;
  --color-text-placeholder: #a39393;
  --color-text-disabled: #d6cfcf;
  --color-text-inverse: #ffffff;

  /* 背景颜色 - 亮部保持纯净白 */
  --color-bg-primary: #ffffff;
  --color-bg-secondary: #f8f9fa; /* 保持不变 */
  --color-bg-tertiary: #f5f5f5; /* 保持不变 */
  --color-bg-quaternary: #f8fafc; /* 保持不变 */
  --color-bg-light: #fafafa;
  --color-bg-hover: #fff1f2; /* 悬停时极淡的粉白，增加互动反馈 */
  --color-bg-active: #ffe4e6;
  --color-bg-selected: #fef2f2;
  --color-bg-overlay: rgba(26, 20, 20, 0.5); /* 遮罩带一点暖意 */
  --color-bg-overlay-light: rgba(26, 20, 20, 0.3);
  --color-bg-overlay-dark: rgba(26, 20, 20, 0.7);

  /* 深色背景 - 专为暗黑模式或页脚设计的"红黑" */
  --color-bg-dark: #120b0b; /* 极深的红黑 */
  --color-bg-dark-secondary: #1f1010;
  --color-bg-dark-tertiary: #2d1a1a;
  --color-bg-dark-hover: #3d2222;

  /* 边框颜色 - 暖灰色调，避免发蓝 */
  --color-border-lightest: #f5f5f5;
  --color-border-light: #efefef;
  --color-border: #e6e2e2; /* 暖调灰 */
  --color-border-secondary: #d4cfcf;
  --color-border-tertiary: #bfbaba;
  --color-border-dark: #8f8585;
  --color-border-darker: #5e5454;

  /* 渐变色 - 丝绸般顺滑的红色系过渡 */
  /* 优化：从正红流向深红，营造纵深感 */
  --gradient-primary: linear-gradient(135deg, var(--color-primary) 0%, #9f1225 100%);
  --gradient-primary-90: linear-gradient(90deg, var(--color-primary), #9f1225);
  --gradient-primary-120: linear-gradient(120deg, var(--color-primary) 0%, #b91c1c 100%);
  --gradient-primary-reverse: linear-gradient(135deg, #9f1225 0%, var(--color-primary) 100%);
  --gradient-primary-vertical: linear-gradient(180deg, var(--color-primary) 0%, #881337 100%);

  --gradient-accent: linear-gradient(135deg, #e11d48 0%, #9f1239 100%);
  --gradient-accent-reverse: linear-gradient(135deg, #9f1239 0%, #e11d48 100%);

  --gradient-purple: linear-gradient(135deg, #be185d 0%, #831843 100%);
  --gradient-purple-reverse: linear-gradient(135deg, #831843 0%, #be185d 100%);

  /* 暗色渐变 - 暖黑渐变 */
  --gradient-dark: linear-gradient(135deg, #120b0b 0%, #1f1010 100%);
  --gradient-dark-vertical: linear-gradient(180deg, #120b0b 0%, #000000 100%);
  --gradient-dark-reverse: linear-gradient(135deg, #1f1010 0%, #120b0b 100%);

  --gradient-overlay: linear-gradient(120deg, rgba(26, 20, 20, 0.85) 0%, rgba(26, 20, 20, 0.6) 40%, rgba(26, 20, 20, 0.2) 100%);
  --gradient-overlay-vertical: linear-gradient(180deg, rgba(26, 20, 20, 0.6) 0%, rgba(26, 20, 20, 0.3) 100%);

  /* 阴影 - 红色漫射光，增加氛围感 */
  --shadow-xs: 0 1px 2px rgba(26, 20, 20, 0.05);
  --shadow-sm: 0 2px 4px rgba(26, 20, 20, 0.06);
  --shadow-base: 0 4px 10px rgba(26, 20, 20, 0.08);
  --shadow-md: 0 6px 16px rgba(26, 20, 20, 0.08);
  --shadow-lg: 0 10px 24px rgba(26, 20, 20, 0.1);
  --shadow-xl: 0 15px 35px rgba(26, 20, 20, 0.12);
  --shadow-2xl: 0 20px 50px rgba(26, 20, 20, 0.18);

  /* 关键：彩色阴影更深沉，不发粉，而是发红 */
  --shadow-primary: 0 8px 20px -4px rgba(205, 29, 29, 0.4);
  --shadow-primary-lg: 0 12px 28px -6px rgba(205, 29, 29, 0.5);
  --shadow-secondary: 0 8px 20px -4px rgba(159, 18, 37, 0.3);
  --shadow-accent: 0 8px 20px -4px rgba(225, 29, 72, 0.3);
  --shadow-purple: 0 8px 20px -4px rgba(190, 24, 93, 0.3);

  --shadow-inset: inset 0 0 5px rgba(0, 0, 0, 0.05);
  --shadow-focus: 0 0 0 3px rgba(205, 29, 29, 0.15); /* 红色聚焦环 */
  --shadow-focus-accent: 0 0 0 3px rgba(225, 29, 72, 0.15);

  --shadow-text-sm: 0 0 4px rgba(0, 0, 0, 0.7), 0 3px 12px rgba(0, 0, 0, 0.8);
  --shadow-text-md: 0 0 6px rgba(0, 0, 0, 0.8), 0 0 18px rgba(0, 0, 0, 0.8), 0 6px 24px rgba(0, 0, 0, 0.9);

  --opacity-hover: 0.9;
  --opacity-disabled: 0.5;
  --opacity-overlay: 0.5;
  --opacity-muted: 0.6;

  --z-dropdown: 100;
  --z-sticky: 200;
  --z-fixed: 300;
  --z-modal-backdrop: 400;
  --z-modal: 500;
  --z-popover: 600;
  --z-tooltip: 700;
  --z-toast: 800;
}

/* 深色模式 - 极致奢华的"暗夜红" */
[data-theme="dark"] {
  /* 文字微调：在深色背景上，文字带一点点暖色调会更舒适 */
  --color-text-primary: #fff1f2; 
  --color-text-secondary: #fecdd3;
  --color-text-tertiary: #fda4af;
  --color-text-quaternary: #fb7185;
  --color-text-muted: #9f1239;
  --color-text-placeholder: #881337;
  --color-text-disabled: #4c0519;
  --color-text-inverse: #1a1414;

  /* 背景：不再是纯黑，而是极深极深的红黑 */
  --color-bg-primary: #0f0505; 
  --color-bg-secondary: #1a0a0a;
  --color-bg-tertiary: #261010;
  --color-bg-quaternary: #2b1515;
  --color-bg-light: #261010;
  --color-bg-hover: #3a1818;
  --color-bg-active: #4a1d1d;
  --color-bg-selected: #450a0a;

  --color-border-lightest: #2b1515;
  --color-border-light: #3a1818;
  --color-border: #4a1d1d;
  --color-border-secondary: #5e2626;
  --color-border-tertiary: #752e2e;
  --color-border-dark: #993333;

  --color-bg-dark: #000000;
  --color-bg-dark-secondary: #0f0505;

  --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.5);
  --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.6);
  --shadow-base: 0 4px 12px rgba(0, 0, 0, 0.7);
  --shadow-md: 0 6px 16px rgba(0, 0, 0, 0.8);
  --shadow-lg: 0 10px 24px rgba(0, 0, 0, 0.9);
  --shadow-xl: 0 15px 35px rgba(0, 0, 0, 0.95);
  --shadow-2xl: 0 20px 50px rgba(0, 0, 0, 1);

  /* 深色模式下的红色需要稍微提亮，保证可见性，但保持深沉 */
  --color-primary: #dc2626; 
  --color-primary-rgb: 220, 38, 38;
  --color-secondary: #ef4444;
  --color-secondary-rgb: 239, 68, 68;
  
  --shadow-primary: 0 8px 30px rgba(220, 38, 38, 0.3);
  --shadow-primary-lg: 0 12px 40px rgba(220, 38, 38, 0.4);
}

.high-contrast {
  --color-text-primary: #000000;
  --color-text-secondary: #1a1a1a;
  --color-text-tertiary: #333333;
  
  --color-bg-primary: #ffffff;
  --color-bg-secondary: #f5f5f5;
  
  --color-border: #000000;
  --color-border-secondary: #333333;
  
  --color-primary: #8a0000; /* 更深的红，保证对比度 */
  --color-secondary: #660000;
  --color-danger: #cc0000;
  
  --color-success: #004d00;
}

@media print {
  :root {
    --color-text-primary: #000000;
    --color-text-secondary: #333333;
    --color-text-tertiary: #666666;
    
    --color-bg-primary: #ffffff;
    --color-bg-secondary: #ffffff;
    --color-bg-tertiary: #ffffff;
    
    --color-primary: #cd1d1d;
    --color-secondary: #9f1225;
    
    --shadow-xs: none;
    --shadow-sm: none;
    --shadow-base: none;
    --shadow-md: none;
    --shadow-lg: none;
    --shadow-xl: none;
    --shadow-2xl: none;
    --shadow-primary: none;
    --shadow-primary-lg: none;
    --shadow-secondary: none;
    --shadow-accent: none;
    --shadow-purple: none;
    --shadow-focus: none;
    --shadow-focus-accent: none;
  }
}

html {
  transition: background-color 0.3s ease, color 0.3s ease;
}

html[data-theme] *,
html[data-theme] *::before,
html[data-theme] *::after {
  transition: background-color 0.3s ease, 
              border-color 0.3s ease, 
              color 0.3s ease,
              box-shadow 0.3s ease;
}

@media (prefers-reduced-motion: reduce) {
  html,
  html[data-theme] *,
  html[data-theme] *::before,
  html[data-theme] *::after {
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
  }
}

@media screen and (max-width: 768px) {
  :root {
    --shadow-lg: 0 4px 16px rgba(26, 20, 20, 0.1);
    --shadow-xl: 0 6px 24px rgba(26, 20, 20, 0.12);
    --shadow-2xl: 0 8px 32px rgba(26, 20, 20, 0.16);
  }
}