/**
 * 主题系统 - CSS 变量定义
 * 通过 data-theme 属性切换主题
 */

/* 默认主题（清新天蓝） */
:root,
[data-theme="default"] {
  --bg-primary: #ffffff;
  --bg-secondary: #f0f9ff;
  --bg-tertiary: #e0f2fe;
  --bg-gradient-from: #f0f9ff;
  --bg-gradient-via: #ffffff;
  --bg-gradient-to: #ecfeff;
  
  --text-primary: #1e293b;
  --text-secondary: #64748b;
  --text-muted: #94a3b8;
  
  --accent-primary: #0ea5e9;
  --accent-secondary: #38bdf8;
  --accent-tertiary: #06b6d4;
  --accent-glow: rgba(14, 165, 233, 0.35);

  --border-color: #e0f2fe;
  --border-hover: #bae6fd;
  
  --card-bg: #ffffff;
  --card-shadow: rgba(14, 165, 233, 0.1);
  --card-hover-shadow: rgba(14, 165, 233, 0.2);
  
  --header-bg: rgba(255, 255, 255, 0.95);
  --header-border: rgba(224, 242, 254, 0.5);
  
  --btn-primary-bg: linear-gradient(135deg, #0ea5e9, #06b6d4);
  --btn-primary-text: #ffffff;
  --btn-secondary-bg: #f0f9ff;
  --btn-secondary-text: #0ea5e9;
  
  --input-bg: #ffffff;
  --input-border: #e0f2fe;
  --input-focus-border: #38bdf8;
  
  --scrollbar-track: #f0f9ff;
  --scrollbar-thumb: #bae6fd;
  
  --tag-bg: #e0f2fe;
  --tag-text: #0369a1;
  
  --skeleton-bg: #e0f2fe;
  --skeleton-shine: #bae6fd;
}

/* 应用主题变量到全局 */
body {
  background: linear-gradient(135deg, var(--bg-gradient-from), var(--bg-gradient-via), var(--bg-gradient-to));
  color: var(--text-primary);
  transition: background 0.3s ease, color 0.3s ease;
}

/* 卡片主题适配 */
.card-hover {
  background: var(--card-bg);
  border-color: var(--border-color);
  box-shadow: 0 2px 8px var(--card-shadow);
}

.card-hover:hover {
  border-color: var(--border-hover);
  box-shadow: 0 8px 20px var(--card-hover-shadow);
}

/* 头部主题适配 */
header {
  background: var(--header-bg);
  border-color: var(--header-border);
}

/* 按钮主题适配 */
.btn-primary {
  background: var(--btn-primary-bg);
  color: var(--btn-primary-text);
}

.btn-secondary {
  background: var(--btn-secondary-bg);
  color: var(--btn-secondary-text);
}

/* 输入框主题适配 */
input, textarea, select {
  background: var(--input-bg);
  border-color: var(--input-border);
  color: var(--text-primary);
}

input:focus, textarea:focus, select:focus {
  border-color: var(--input-focus-border);
}

/* 滚动条主题适配 */
::-webkit-scrollbar-track {
  background: var(--scrollbar-track);
}

::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb);
}

/* 标签主题适配 */
.tag {
  background: var(--tag-bg);
  color: var(--tag-text);
}

/* 骨架屏主题适配 */
.skeleton {
  background: var(--skeleton-bg);
}

/* 文本颜色类 */
.text-primary { color: var(--text-primary); }
.text-secondary { color: var(--text-secondary); }
.text-muted { color: var(--text-muted); }
.text-accent { color: var(--accent-primary); }

/* 背景颜色类 */
.bg-primary { background: var(--bg-primary); }
.bg-secondary { background: var(--bg-secondary); }
.bg-accent { background: var(--accent-primary); }