/* frontend/css/variables.css — CSS 变量（三色体系） */

:root {
  /* ═══ 主色调 — 三大任务体系 ═══ */
  --color-school: #E74C3C;        /* 红色 — 学校任务 */
  --color-school-light: #FADBD8;
  --color-school-dark: #C0392B;
  
  --color-self-study: #F39C12;    /* 橙色 — 自学任务 */
  --color-self-study-light: #FDEBD0;
  --color-self-study-dark: #D68910;
  
  --color-family: #27AE60;        /* 绿色 — 家庭任务 */
  --color-family-light: #D5F5E3;
  --color-family-dark: #1E8449;

  /* ═══ 功能色 ═══ */
  --color-primary: #3498DB;
  --color-primary-light: #D6EAF8;
  --color-primary-dark: #2980B9;
  
  --color-success: #27AE60;
  --color-warning: #F39C12;
  --color-danger: #E74C3C;
  --color-info: #3498DB;

  /* ═══ 中性色 ═══ */
  --color-white: #FFFFFF;
  --color-bg: #F5F7FA;
  --color-bg-card: #FFFFFF;
  --color-border: #E8ECF1;
  --color-border-light: #F0F2F5;
  
  --color-text-primary: #2C3E50;
  --color-text-secondary: #7F8C8D;
  --color-text-muted: #BDC3C7;

  /* ═══ AI 助学板块专属色（v3.3） ═══ */
  --ai-primary: #6366f1;
  --ai-primary-light: #818cf8;
  --ai-primary-lighter: #c7d2fe;
  --ai-primary-lightest: #eef2ff;
  --ai-bg-start: #f8faff;
  --ai-bg-end: #f0f4ff;
  --ai-card-bg: #ffffff;
  --ai-card-border: #f1f5f9;
  --ai-border-light: #e8ecf4;
  --ai-desc-color: #94a3b8;
  --ai-text-primary: #1e293b;
  --ai-text-secondary: #64748b;
  --ai-text-tertiary: #334155;
  --ai-success-bg: #f0fdf4;
  --ai-success-border: #bbf7d0;
  --ai-warning-bg: #fffbeb;
  --ai-warning-border: #fde68a;
  --ai-danger-bg: #fef2f2;
  --ai-danger-border: #fecaca;
  --ai-bubble-bg: rgba(255,255,255,0.85);
  --ai-button-bg: #f0f2f5;
  --ai-button-active-bg: #e0e3e8;
  --ai-dot-color: #c7d2fe;
  --ai-skip-border: #e2e8f0;
  --ai-kg-bg: #f8fafc;
  --ai-kg-bar-bg: #e2e8f0;

  /* ═══ 间距 ═══ */
  --spacing-xs: 4px;
  --spacing-sm: 8px;
  --spacing-md: 16px;
  --spacing-lg: 24px;
  --spacing-xl: 32px;
  --spacing-xxl: 48px;

  /* ═══ 圆角 ═══ */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-full: 50%;

  /* ═══ 阴影 ═══ */
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.08);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.1);
  --shadow-lg: 0 8px 24px rgba(0,0,0,0.12);

  /* ═══ 字体 ═══ */
  --font-size-xs: 12px;
  --font-size-sm: 14px;
  --font-size-md: 16px;
  --font-size-lg: 20px;
  --font-size-xl: 24px;
  --font-size-xxl: 32px;

  /* ═══ 动画 ═══ */
  --transition-fast: 0.15s ease;
  --transition-normal: 0.3s ease;
  --transition-slow: 0.5s ease;
}