/* 配色方案CSS文件 */
/* 默认配色方案(樱花色) */
:root {
    --primary-bg-color: #FFF0F5; /* 淡粉色背景 */
    --header-gradient-start: #FF69B4; /* 更鲜艳的樱花色渐变起始 */
    --header-gradient-end: #FFB6C1; /* 樱花色渐变结束 */
    --header-text-color: #fff; /* 白色文字 */    --primary-button-bg: #FF69B4; /* 热粉色按钮 */
    --primary-button-hover: #FF1493; /* 深粉色按钮悬停 */
    --primary-button-text: white; /* 主按钮文字颜色 */
    --secondary-button-bg: #f8f9fa; /* 次要按钮背景 */
    --secondary-button-text: #333; /* 次要按钮文字 */
    --secondary-button-hover: #e9ecef; /* 次要按钮悬停 */
    --text-color: #333; /* 文本颜色 */
    --text-secondary: #666; /* 次要文本颜色 */--card-bg-color: white; /* 卡片背景 */
    --card-bg: white; /* 卡片背景 - 别名 */
    --card-shadow: rgba(0, 0, 0, 0.1); /* 卡片阴影 */
    --input-bg-color: #fff; /* 输入框背景 */
    --input-bg: #fff; /* 输入框背景 - 别名 */
    --input-border-color: #ddd; /* 输入框边框 */
    --input-focus-border: #FF69B4; /* 输入框焦点边框 */
    --border-color: #ddd; /* 边框颜色 */
    --accent-bg: #f8f9fa; /* 强调背景色 */
    --accent-color: #FF69B4; /* 重点颜色，用于高亮和强调 */
    --link-color: #FF1493; /* 链接颜色 */
    --modal-overlay: rgba(0, 0, 0, 0.5); /* 模态框覆盖层 */
    --tag-bg-color: #FFC0CB; /* 标签背景色 */
    --tag-text-color: #fff; /* 标签文字颜色 */
    --disabled-color: #ccc; /* 禁用状态颜色 */
}

/* 天空蓝配色方案 */
.color-scheme-sky {
    --primary-bg-color: #EFF8FB; /* 淡蓝色背景 */
    --header-gradient-start: #87CEFA; /* 浅天蓝色渐变起始 */
    --header-gradient-end: #1E90FF; /* 道奇蓝渐变结束 */
    --header-text-color: #fff; /* 白色文字 */    --primary-button-bg: #4682B4; /* 钢蓝色按钮 */
    --primary-button-hover: #0000CD; /* 中蓝色按钮悬停 */
    --primary-button-text: white; /* 主按钮文字颜色 */
    --secondary-button-bg: #f8f9fa; /* 次要按钮背景 */
    --secondary-button-text: #333; /* 次要按钮文字 */
    --secondary-button-hover: #e9ecef; /* 次要按钮悬停 */
    --text-color: #333; /* 文本颜色 */
    --text-secondary: #666; /* 次要文本颜色 */--card-bg-color: white; /* 卡片背景 */
    --card-bg: white; /* 卡片背景 - 别名 */
    --card-shadow: rgba(0, 0, 0, 0.1); /* 卡片阴影 */
    --input-bg-color: #fff; /* 输入框背景 */
    --input-bg: #fff; /* 输入框背景 - 别名 */
    --input-border-color: #ddd; /* 输入框边框 */
    --input-focus-border: #4682B4; /* 输入框焦点边框 */
    --border-color: #ddd; /* 边框颜色 */
    --accent-bg: #e6f3ff; /* 强调背景色 */
    --accent-color: #4682B4; /* 重点颜色，用于高亮和强调 */
    --link-color: #1E90FF; /* 链接颜色 */
    --modal-overlay: rgba(0, 0, 0, 0.5); /* 模态框覆盖层 */
    --tag-bg-color: #87CEFA; /* 标签背景色 */
    --tag-text-color: #fff; /* 标签文字颜色 */
    --disabled-color: #c0d6e4; /* 禁用状态颜色 */
}

/* 薄荷绿配色方案 */
.color-scheme-mint {
    --primary-bg-color: #F0FFF0; /* 淡绿色背景 */
    --header-gradient-start: #98FB98; /* 淡绿色渐变起始 */
    --header-gradient-end: #3CB371; /* 中绿色渐变结束 */
    --header-text-color: #fff; /* 白色文字 */    --primary-button-bg: #2E8B57; /* 海绿色按钮 */
    --primary-button-hover: #006400; /* 深绿色按钮悬停 */
    --primary-button-text: white; /* 主按钮文字颜色 */
    --secondary-button-bg: #f8f9fa; /* 次要按钮背景 */
    --secondary-button-text: #333; /* 次要按钮文字 */
    --secondary-button-hover: #e9ecef; /* 次要按钮悬停 */
    --text-color: #333; /* 文本颜色 */
    --text-secondary: #666; /* 次要文本颜色 */--card-bg-color: white; /* 卡片背景 */
    --card-bg: white; /* 卡片背景 - 别名 */
    --card-shadow: rgba(0, 0, 0, 0.1); /* 卡片阴影 */
    --input-bg-color: #fff; /* 输入框背景 */
    --input-bg: #fff; /* 输入框背景 - 别名 */
    --input-border-color: #ddd; /* 输入框边框 */
    --input-focus-border: #2E8B57; /* 输入框焦点边框 */
    --border-color: #ddd; /* 边框颜色 */
    --accent-bg: #f0fff0; /* 强调背景色 */
    --accent-color: #2E8B57; /* 重点颜色，用于高亮和强调 */
    --link-color: #3CB371; /* 链接颜色 */
    --modal-overlay: rgba(0, 0, 0, 0.5); /* 模态框覆盖层 */
    --tag-bg-color: #98FB98; /* 标签背景色 */
    --tag-text-color: #006400; /* 标签文字颜色 */
    --disabled-color: #c8e6c9; /* 禁用状态颜色 */
}

/* 紫罗兰配色方案 */
.color-scheme-lavender {
    --primary-bg-color: #F8F4FF; /* 淡紫色背景 */
    --header-gradient-start: #DDA0DD; /* 浅紫色渐变起始 */
    --header-gradient-end: #9370DB; /* 中紫色渐变结束 */
    --header-text-color: #fff; /* 白色文字 */    --primary-button-bg: #9370DB; /* 紫色按钮 */
    --primary-button-hover: #800080; /* 深紫色按钮悬停 */
    --primary-button-text: white; /* 主按钮文字颜色 */
    --secondary-button-bg: #f8f9fa; /* 次要按钮背景 */
    --secondary-button-text: #333; /* 次要按钮文字 */
    --secondary-button-hover: #e9ecef; /* 次要按钮悬停 */
    --text-color: #333; /* 文本颜色 */
    --text-secondary: #666; /* 次要文本颜色 */--card-bg-color: white; /* 卡片背景 */
    --card-bg: white; /* 卡片背景 - 别名 */
    --card-shadow: rgba(0, 0, 0, 0.1); /* 卡片阴影 */
    --input-bg-color: #fff; /* 输入框背景 */
    --input-bg: #fff; /* 输入框背景 - 别名 */
    --input-border-color: #ddd; /* 输入框边框 */
    --input-focus-border: #9370DB; /* 输入框焦点边框 */
    --border-color: #ddd; /* 边框颜色 */
    --accent-bg: #f8f4ff; /* 强调背景色 */
    --accent-color: #9370DB; /* 重点颜色，用于高亮和强调 */
    --link-color: #8A2BE2; /* 链接颜色 */
    --modal-overlay: rgba(0, 0, 0, 0.5); /* 模态框覆盖层 */    --tag-bg-color: #DDA0DD; /* 标签背景色 */
    --tag-text-color: #4B0082; /* 标签文字颜色 - 改为深紫色以提高对比度 */
    --disabled-color: #e1d4e6; /* 禁用状态颜色 */
}

/* 黄昏橙配色方案 */
.color-scheme-sunset {
    --primary-bg-color: #FFF8F0; /* 淡橙色背景 */
    --header-gradient-start: #FFA07A; /* 浅橙色渐变起始 */
    --header-gradient-end: #FF7F50; /* 珊瑚色渐变结束 */
    --header-text-color: #fff; /* 白色文字 */    --primary-button-bg: #FF8C00; /* 深橙色按钮 */
    --primary-button-hover: #FF4500; /* 红橙色按钮悬停 */
    --primary-button-text: white; /* 主按钮文字颜色 */
    --secondary-button-bg: #f8f9fa; /* 次要按钮背景 */
    --secondary-button-text: #333; /* 次要按钮文字 */
    --secondary-button-hover: #e9ecef; /* 次要按钮悬停 */
    --text-color: #333; /* 文本颜色 */
    --text-secondary: #666; /* 次要文本颜色 */--card-bg-color: white; /* 卡片背景 */
    --card-bg: white; /* 卡片背景 - 别名 */
    --card-shadow: rgba(0, 0, 0, 0.1); /* 卡片阴影 */
    --input-bg-color: #fff; /* 输入框背景 */
    --input-bg: #fff; /* 输入框背景 - 别名 */
    --input-border-color: #ddd; /* 输入框边框 */
    --input-focus-border: #FF8C00; /* 输入框焦点边框 */
    --border-color: #ddd; /* 边框颜色 */
    --accent-bg: #fff8f0; /* 强调背景色 */
    --accent-color: #FF8C00; /* 重点颜色，用于高亮和强调 */
    --link-color: #FF4500; /* 链接颜色 */
    --modal-overlay: rgba(0, 0, 0, 0.5); /* 模态框覆盖层 */    --tag-bg-color: #FFA07A; /* 标签背景色 */
    --tag-text-color: #8B4513; /* 标签文字颜色 - 改为棕色以提高对比度 */
    --disabled-color: #ffe0cc; /* 禁用状态颜色 */
}

/* 深色模式 */
.color-scheme-dark {    --primary-bg-color: #121212; /* 深灰色背景 */
    --header-gradient-start: #1F1F1F; /* 深灰色渐变起始 */
    --header-gradient-end: #2D2D2D; /* 稍浅灰色渐变结束 */
    --header-text-color: #FFFFFF; /* 标题文字颜色 - 改为纯白色以提高可读性 */    --primary-button-bg: #BB86FC; /* 中灰色按钮 - 改为亮紫色按钮以提高可读性 */
    --primary-button-hover: #A370F7; /* 浅灰色按钮悬停 - 调整为更亮的紫色 */
    --primary-button-text: white; /* 主按钮文字颜色 */
    --secondary-button-bg: #3E3E3E; /* 次要按钮背景 */
    --secondary-button-text: #E0E0E0; /* 次要按钮文字 */
    --secondary-button-hover: #505050; /* 次要按钮悬停 */
    --text-color: #E0E0E0; /* 亮灰色文本 */
    --text-secondary: #B0B0B0; /* 次要文本颜色 */--card-bg-color: #2D2D2D; /* 卡片背景 */
    --card-bg: #2D2D2D; /* 卡片背景 - 别名 */
    --card-shadow: rgba(0, 0, 0, 0.4); /* 卡片阴影 */
    --input-bg-color: #3E3E3E; /* 输入框背景 */
    --input-bg: #3E3E3E; /* 输入框背景 - 别名 */
    --input-border-color: #505050; /* 输入框边框 */
    --input-focus-border: #707070; /* 输入框焦点边框 */
    --border-color: #505050; /* 边框颜色 */
    --accent-bg: #3E3E3E; /* 强调背景色 */
    --accent-color: #BB86FC; /* 重点颜色，用于高亮和强调（紫色） */
    --link-color: #03DAC6; /* 链接颜色（青色） */
    --modal-overlay: rgba(0, 0, 0, 0.7); /* 模态框覆盖层 */    --tag-bg-color: #5A5A5A; /* 标签背景色 - 调亮 */
    --tag-text-color: #FFFFFF; /* 标签文字颜色 - 纯白色以提高对比度 */
    --disabled-color: #5A5A5A; /* 禁用状态颜色 */
}

/* 配色方案选择器样式 - 主要定义颜色，布局由header-buttons.css控制 */
.color-scheme-selector select option {
    background-color: var(--primary-bg-color);
    color: var(--text-color);
}

.color-scheme-selector select option[value="default"] {
    background-color: #FFF0F5; /* 樱花粉 */
    color: #333;
}

.color-scheme-selector select option[value="sky"] {
    background-color: #E6F3FF; /* 天空蓝 */
    color: #333;
}

.color-scheme-selector select {
    padding: 5px 10px;
    border: 2px solid rgba(255, 255, 255, 0.5);
    border-radius: 4px;
    background-color: rgba(255, 255, 255, 0.2);
    color: var(--header-text-color);
    cursor: pointer;
    outline: none;
    transition: all 0.3s ease;
}

.color-scheme-selector select:hover {
    background-color: rgba(255, 255, 255, 0.3);
}

.color-scheme-selector select:focus {
    border-color: rgba(255, 255, 255, 0.8);
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.2);
}

/* 选择器选项文字颜色 */
.color-scheme-selector select option {
    background-color: white;
    font-weight: bold;
}

/* 默认(樱花色)选项 */
.color-scheme-selector select option[value="default"] {
    color: #FF69B4; /* 粉色 */
}

/* 天空蓝选项 */
.color-scheme-selector select option[value="sky"] {
    color: #4682B4; /* 蓝色 */
}

/* 薄荷绿选项 */
.color-scheme-selector select option[value="mint"] {
    color: #2E8B57; /* 绿色 */
}

/* 紫罗兰选项 */
.color-scheme-selector select option[value="lavender"] {
    color: #9370DB; /* 紫色 */
}

/* 黄昏橙选项 */
.color-scheme-selector select option[value="sunset"] {
    color: #FF8C00; /* 橙色 */
}

/* 深色模式选项 */
.color-scheme-selector select option[value="dark"] {
    color: #333333; /* 深色 */
}