/* ============ 主题变量 ============ */
:root {
    --bg-primary: #f5f7fa;
    --bg-secondary: #ffffff;
    --bg-card: #ffffff;
    --text-primary: #333333;
    --text-secondary: #666666;
    --border-color: #e0e0e0;
    --shadow: rgba(0,0,0,0.06);
}

/* ============ 夜间模式 ============ */
.theme-dark {
    --bg-primary: #1a1a2e;
    --bg-secondary: #16213e;
    --bg-card: #1f2940;
    --text-primary: #e0e0e0;
    --text-secondary: #aaaaaa;
    --border-color: #333344;
    --shadow: rgba(0,0,0,0.3);
}

.theme-dark .cu-container,
.theme-dark .cu-main,
.theme-dark body {
    background: var(--bg-primary);
    color: var(--text-primary);
}

.theme-dark .cu-header {
    background: linear-gradient(135deg, #1f2940 0%, #16213e 100%);
}

.theme-dark .cu-sidebar {
    background: var(--bg-secondary);
    border-right-color: var(--border-color);
}

.theme-dark .cu-nav-item {
    color: var(--text-secondary);
}

.theme-dark .cu-nav-item:hover,
.theme-dark .cu-nav-item.active {
    background: var(--bg-card);
    color: var(--text-primary);
}

/* 设置页面卡片适配 */
.theme-dark .settings-card {
    background: var(--bg-card);
    box-shadow: 0 2px 8px var(--shadow);
}

.theme-dark .settings-card h3 {
    color: var(--text-primary);
}

.theme-dark .setting-item {
    border-bottom-color: var(--border-color);
}

.theme-dark .setting-label {
    color: var(--text-primary);
}

.theme-dark .setting-desc {
    color: var(--text-secondary);
}

.theme-dark .setting-option {
    border-color: var(--border-color);
    background: var(--bg-card);
    color: var(--text-primary);
}

.theme-dark .setting-option:hover {
    border-color: #667eea;
    background: rgba(102, 126, 234, 0.15);
}

.theme-dark .preview-box {
    background: var(--bg-secondary);
}

.theme-dark .preview-box h4 {
    color: var(--text-secondary);
}

.theme-dark .setting-btn-secondary {
    background: var(--bg-secondary);
    color: var(--text-primary);
}

/* 声音页面卡片适配 */
.theme-dark .sound-item {
    border-bottom-color: var(--border-color);
}

.theme-dark .sound-label {
    color: var(--text-primary);
}

.theme-dark .sound-desc {
    color: var(--text-secondary);
}

.theme-dark .test-btn {
    background: var(--bg-card);
    color: var(--text-primary);
    border-color: var(--border-color);
}

/* 预览文字 */
.theme-dark .preview-text {
    color: var(--text-primary);
}

/* ============ 个人中心模块 - 深色模式 ============ */
.theme-dark .overview-card {
    background: var(--bg-card);
    border-color: var(--border-color);
}

.theme-dark .card-label {
    color: var(--text-secondary);
}

.theme-dark .card-sub {
    color: var(--text-secondary);
}

.theme-dark .trend-section {
    background: var(--bg-secondary);
}

.theme-dark .chart-label {
    color: var(--text-secondary);
}

.theme-dark .bar.empty {
    background: var(--border-color);
}

.theme-dark .bar-label {
    color: var(--text-secondary);
}

.theme-dark .achievement-card {
    background: var(--bg-card);
    border-color: var(--border-color);
}

.theme-dark .achievement-card.unlocked {
    border-color: #667eea;
    background: rgba(102, 126, 234, 0.15);
}

.theme-dark .achievement-desc {
    color: var(--text-secondary);
}

.theme-dark .activity-item {
    background: var(--bg-card);
    border-color: var(--border-color);
}

.theme-dark .activity-desc {
    color: var(--text-secondary);
}

.theme-dark .activity-time {
    color: var(--text-secondary);
}

.theme-dark .export-section {
    background: var(--bg-secondary);
}

.theme-dark .export-btn {
    background: var(--bg-card);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.theme-dark .export-btn:hover {
    background: var(--bg-secondary);
}

/* ============ 通用基线类 - 暗色模式 ============ */
.theme-dark .cu-module,
.theme-dark .cu-card,
.theme-dark .cu-stat-card {
    background: var(--bg-card);
    color: var(--text-primary);
}
.theme-dark .cu-module-header {
    border-bottom-color: var(--border-color);
}
.theme-dark .cu-module-header h2,
.theme-dark .cu-table th {
    color: var(--text-primary);
}
.theme-dark .cu-module-header p,
.theme-dark .cu-table td,
.theme-dark .cu-stat-label {
    color: var(--text-secondary);
}
.theme-dark .cu-board-section {
    background: var(--bg-secondary);
}
.theme-dark .cu-table th,
.theme-dark .cu-table td {
    border-bottom-color: var(--border-color);
}

/* ============ 个人中心模块 - 护眼模式 ============ */
.theme-protect .overview-card {
    background: var(--bg-card);
    border-color: var(--border-color);
}

.theme-protect .card-label {
    color: var(--text-secondary);
}

.theme-protect .card-sub {
    color: var(--text-secondary);
}

.theme-protect .trend-section {
    background: var(--bg-secondary);
}

.theme-protect .chart-label {
    color: var(--text-secondary);
}

.theme-protect .bar.empty {
    background: var(--border-color);
}

.theme-protect .bar-label {
    color: var(--text-secondary);
}

.theme-protect .achievement-card {
    background: var(--bg-card);
    border-color: var(--border-color);
}

.theme-protect .achievement-desc {
    color: var(--text-secondary);
}

.theme-protect .activity-item {
    background: var(--bg-card);
    border-color: var(--border-color);
}

.theme-protect .activity-desc {
    color: var(--text-secondary);
}

.theme-protect .activity-time {
    color: var(--text-secondary);
}

.theme-protect .export-section {
    background: var(--bg-secondary);
}

.theme-protect .export-btn {
    background: var(--bg-card);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.theme-protect .export-btn:hover {
    background: var(--bg-secondary);
}

/* ============ 通用基线类 - 护眼模式 ============ */
.theme-protect .cu-module,
.theme-protect .cu-card,
.theme-protect .cu-stat-card {
    background: var(--bg-card);
    color: var(--text-primary);
}
.theme-protect .cu-table th,
.theme-protect .cu-table td {
    border-bottom-color: var(--border-color);
}
.theme-protect .cu-board-section {
    background: var(--bg-secondary);
}

/* ============ 护眼模式 ============ */
.theme-protect {
    --bg-primary: #cce8cf;
    --bg-secondary: #e8f5e9;
    --bg-card: #ffffff;
    --text-primary: #2e7d32;
    --text-secondary: #558b2f;
    --border-color: #a5d6a7;
    --shadow: rgba(46,125,50,0.08);
}

.theme-protect .cu-container,
.theme-protect .cu-main,
.theme-protect body {
    background: var(--bg-primary);
    color: var(--text-primary);
}

.theme-protect .cu-header {
    background: linear-gradient(135deg, #43a047 0%, #66bb6a 100%);
}

.theme-protect .cu-sidebar {
    background: var(--bg-secondary);
}

.theme-protect .cu-nav-item {
    color: var(--text-secondary);
}

.theme-protect .settings-card {
    background: var(--bg-card);
}

/* ============ 字体大小 ============ */
.font-small .cu-main { font-size: 14px; }
.font-small .cu-module,
.font-small .cu-card { font-size: 13px; }
.font-large .cu-main { font-size: 18px; }
.font-large .cu-module,
.font-large .cu-card { font-size: 17px; }

/* ============ 主题色（全局） ============ */
.color-blue .cu-header { background: linear-gradient(135deg, #1976d2 0%, #42a5f5 100%); }
.color-blue .pp-btn-primary { background: linear-gradient(135deg, #1976d2 0%, #42a5f5 100%); }
.color-blue .setting-option.active { background: linear-gradient(135deg, #1976d2 0%, #42a5f5 100%); border-color: #1976d2; }
.color-blue .login-btn { background: linear-gradient(135deg, #1976d2 0%, #42a5f5 100%); }
.color-blue .login-btn:hover { box-shadow: 0 8px 20px rgba(25,118,210,0.4); }
.color-blue .cu-nav-item.active,
.color-blue .cu-nav-item:hover { border-left-color: #42a5f5; }
.color-blue .cu-btn-primary { background: linear-gradient(135deg, #1976d2 0%, #42a5f5 100%); }
.color-blue .cu-board-btn { background: linear-gradient(135deg, #1976d2 0%, #42a5f5 100%); }

.color-green .cu-header { background: linear-gradient(135deg, #43a047 0%, #66bb6a 100%); }
.color-green .pp-btn-primary { background: linear-gradient(135deg, #43a047 0%, #66bb6a 100%); }
.color-green .setting-option.active { background: linear-gradient(135deg, #43a047 0%, #66bb6a 100%); border-color: #43a047; }
.color-green .login-btn { background: linear-gradient(135deg, #43a047 0%, #66bb6a 100%); }
.color-green .login-btn:hover { box-shadow: 0 8px 20px rgba(67,160,71,0.4); }
.color-green .cu-nav-item.active,
.color-green .cu-nav-item:hover { border-left-color: #66bb6a; }
.color-green .cu-btn-primary { background: linear-gradient(135deg, #43a047 0%, #66bb6a 100%); }
.color-green .cu-board-btn { background: linear-gradient(135deg, #43a047 0%, #66bb6a 100%); }

.color-orange .cu-header { background: linear-gradient(135deg, #ff9800 0%, #f57c00 100%); }
.color-orange .pp-btn-primary { background: linear-gradient(135deg, #ff9800 0%, #f57c00 100%); }
.color-orange .setting-option.active { background: linear-gradient(135deg, #ff9800 0%, #f57c00 100%); border-color: #ff9800; }
.color-orange .login-btn { background: linear-gradient(135deg, #ff9800 0%, #f57c00 100%); }
.color-orange .login-btn:hover { box-shadow: 0 8px 20px rgba(255,152,0,0.4); }
.color-orange .cu-nav-item.active,
.color-orange .cu-nav-item:hover { border-left-color: #f57c00; }
.color-orange .cu-btn-primary { background: linear-gradient(135deg, #ff9800 0%, #f57c00 100%); }
.color-orange .cu-board-btn { background: linear-gradient(135deg, #ff9800 0%, #f57c00 100%); }