/* ============================================
   themes.css - 主题系统
   严格遵循 DESIGN_GUIDE.md 规范
   6种主题：light / dark / eyecare / paper / parchment / springFestival
   ============================================ */

/* ===== 主题切换按钮 ===== */
.theme-btn-inline {
    padding: var(--space-1) var(--space-3);
    border-radius: var(--radius-sm);
    border: 1px solid var(--border-color);
    background: var(--card-bg);
    color: var(--text-secondary);
    cursor: pointer;
    font-size: 12px;
    transition: var(--transition);
}

.theme-btn-inline.active,
.theme-btn-inline:hover {
    color: white;
    border-color: transparent;
}

/* 浅色按钮 */
.theme-btn-inline[data-theme="light"].active,
.theme-btn-inline[data-theme="light"]:hover {
    background: #4361ee;
}

/* 深色按钮 */
.theme-btn-inline[data-theme="dark"].active,
.theme-btn-inline[data-theme="dark"]:hover {
    background: #4a5568;
}

/* 护眼按钮 */
.theme-btn-inline[data-theme="eyecare"].active,
.theme-btn-inline[data-theme="eyecare"]:hover {
    background: #4caf50;
}

/* 纸质按钮 */
.theme-btn-inline[data-theme="paper"].active,
.theme-btn-inline[data-theme="paper"]:hover {
    background: #c4956a;
}
/* 羊皮纸按钮 */
.theme-btn-inline[data-theme="parchment"].active,
.theme-btn-inline[data-theme="parchment"]:hover {
    background: #8b4513;
}

/* 春节按钮 */
.theme-btn-inline[data-theme="springFestival"].active,
.theme-btn-inline[data-theme="springFestival"]:hover {
    background: #d62c2c;
}

/* ===== 各主题下章节项背景 ===== */
[data-theme="dark"] .chapter-item {
    background: rgba(26, 26, 46, 0.9);
    color: #e0e0e0;
}

[data-theme="dark"] .chapter-item.active {
    background: linear-gradient(135deg, var(--theme-primary), color-mix(in srgb, var(--theme-primary) 70%, white));
    color: white;
}

[data-theme="eyecare"] .chapter-item {
    background: rgba(240, 245, 233, 0.9);
    color: #2c3e3f;
}

[data-theme="eyecare"] .chapter-item.active {
    background: linear-gradient(135deg, var(--theme-primary), color-mix(in srgb, var(--theme-primary) 70%, white));
    color: white;
}

[data-theme="paper"] .chapter-item {
    background: rgba(250, 243, 232, 0.9);
    color: #3e2e21;
}

[data-theme="paper"] .chapter-item.active {
    background: linear-gradient(135deg, var(--theme-primary), color-mix(in srgb, var(--theme-primary) 70%, white));
    color: white;
}

[data-theme="parchment"] .chapter-item {
    background: rgba(245, 233, 208, 0.9);
    color: #3e2e21;
}

[data-theme="parchment"] .chapter-item.active {
    background: linear-gradient(135deg, #8b4513, #a0522d);
    color: white;
}

[data-theme="springFestival"] .chapter-item {
    background: rgba(255, 245, 240, 0.9);
    color: #5c2e1a;
}

[data-theme="springFestival"] .chapter-item.active {
    background: linear-gradient(135deg, #d62c2c, #ff8c42);
    color: white;
}

/* ===== 有背景图片时强制透明 ===== */
body.has-bg-image {
    background-color: transparent !important;
}

body.has-bg-image .sidebar,
body.has-bg-image .reader,
body.has-bg-image .editor,
body.has-bg-image .chapter-content,
body.has-bg-image #editor,
body.has-bg-image .top-header,
body.has-bg-image .editor-toolbar,
body.has-bg-image .chapter-list,
body.has-bg-image .chapter-item,
body.has-bg-image .current-book,
body.has-bg-image .sidebar-header,
body.has-bg-image .book-stats,
body.has-bg-image .main,
body.has-bg-image .footer-icp {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

body.has-bg-image .chapter-item {
    color: #333333 !important;
}

body.has-bg-image .chapter-item.active {
    background: linear-gradient(135deg, var(--theme-primary), color-mix(in srgb, var(--theme-primary) 70%, white)) !important;
    color: white !important;
}

body.has-bg-image .tool-btn,
body.has-bg-image .btn,
body.has-bg-image .btn-outline {
    color: #333333 !important;
}

body.has-bg-image .tool-btn:hover,
body.has-bg-image .btn:hover {
    color: white !important;
}

/* ===== 纸质纹理（paper主题特有） ===== */
[data-theme="paper"] body {
    background-image:
        repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(180,160,140,0.03) 2px, rgba(180,160,140,0.03) 4px),
        url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E");
}

[data-theme="paper"] .card,
[data-theme="paper"] .stat-card,
[data-theme="paper"] .heatmap-section,
[data-theme="paper"] .recent-section {
    background-image: linear-gradient(0deg, transparent 24px, rgba(180,160,140,0.06) 25px);
    border-color: rgba(180,160,140,0.25);
}

/* ===== 羊皮纸纹理（parchment主题特有） ===== */
[data-theme="parchment"] body {
    background-image:
        repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(139,69,19,0.02) 2px, rgba(139,69,19,0.02) 4px);
}

/* ===== 春节主题特殊样式 ===== */
[data-theme="springFestival"] .stat-card i {
    color: #d62c2c;
}

[data-theme="springFestival"] .btn-primary {
    background: linear-gradient(135deg, #d62c2c, #ff8c42);
}

/* ===== 主题切换动画 ===== */
html {
    transition: background-color 0.25s ease;
}

html * {
    transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}

/* 主题切换时临时禁用所有过渡，使变化同时发生 */
html.no-transition,
html.no-transition * {
    transition: none !important;
}

/* ===== 主题选择器（设置面板中） ===== */
.theme-options {
    display: flex;
    gap: var(--space-3);
    flex-wrap: wrap;
}

.theme-option {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-1);
    cursor: pointer;
    padding: var(--space-2);
    border-radius: var(--radius-md);
    transition: var(--transition);
}

.theme-option:hover {
    background: var(--hover-bg);
}

.theme-option.active {
    background: var(--hover-bg);
    outline: 2px solid var(--theme-primary);
}

.theme-preview {
    width: 44px;
    height: 44px;
    border-radius: var(--radius-md);
    border: 2px solid var(--border-color);
    display: block;
}

.theme-preview.light {
    background: linear-gradient(135deg, #ffffff 50%, #f8f9fa 50%);
}

.theme-preview.dark {
    background: linear-gradient(135deg, #1a1a2e 50%, #16213e 50%);
}

.theme-preview.eyecare {
    background: linear-gradient(135deg, #f2f8f4 50%, #e8f2ed 50%);
}

.theme-preview.paper {
    background: linear-gradient(135deg, #f5f0e6 50%, #e9e2d5 50%);
}

.theme-preview.parchment {
    background: linear-gradient(135deg, #f5e9d0 50%, #ede1c5 50%);
}

.theme-preview.springFestival {
    background: linear-gradient(135deg, #fff5f0 50%, #fce8e0 50%);
}

.theme-label {
    font-size: 0.75rem;
    color: var(--text-secondary);
    text-align: center;
}

/* ===== 主题颜色同步到PWA状态栏 ===== */
meta[name="theme-color"] {
    transition: content 0.25s ease;
}