/* ========================================
   主题管理系统
   文件结构：
   1. 公共样式
   2. 白天主题（light）
   3. 夜晚主题（dark）
   4. 经典主题（classic）
   5. 自动主题（auto）
   6. 主题切换动画
   ======================================== */

/* ========================================
   1. 公共样式
   ======================================== */

/* 主题选择器容器 */
.theme-picker {
    position: relative;
    display: inline-block;
}

/* 主题切换按钮 */
.theme-toggle {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 2px solid var(--border-color);
    background: var(--background-color);
    cursor: pointer;
    overflow: hidden;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.theme-toggle:hover {
    transform: scale(1.1);
    border-color: var(--theme-primary);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.theme-toggle:active {
    transform: scale(0.95);
}

/* 主题指示器 */
.theme-indicator {
    width: 100%;
    height: 100%;
    background: var(--theme-gradient);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.5s ease;
}

.theme-indicator i {
    color: #ffffff;
    font-size: 16px;
}

/* 主题面板 */
.theme-panel {
    position: absolute;
    top: 100%;
    right: 0;
    margin-top: 12px;
    background: var(--background-color);
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
    padding: 20px;
    min-width: 280px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition: all 0.3s ease;
    z-index: 10000;
}

/* 激活状态 */
.theme-picker.active .theme-panel {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* 面板标题 */
.theme-panel h4 {
    font-size: 16px;
    font-weight: 600;
    color: var(--text-color);
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--border-color);
}

/* 主题列表 */
.theme-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* 主题项 */
.theme-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    background: transparent;
}

.theme-item:hover {
    background: var(--background-color-hover);
    transform: translateX(4px);
}

/* 主题选中状态 */
.theme-item.active {
    background: linear-gradient(135deg, 
        rgba(102, 126, 234, 0.1) 0%, 
        rgba(118, 75, 162, 0.1) 100%);
}

.theme-item.active .theme-check {
    opacity: 1;
    transform: scale(1);
}

/* 主题预览 */
.theme-preview {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.theme-preview::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 50%;
    height: 100%;
    background: var(--theme-primary);
}

.theme-preview::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 50%;
    height: 100%;
    background: var(--theme-secondary);
}

/* 主题信息 */
.theme-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.theme-name {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-color);
}

.theme-desc {
    font-size: 12px;
    color: var(--text-color-secondary);
}

/* 主题选中标记 */
.theme-check {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--theme-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transform: scale(0);
    transition: all 0.3s ease;
}

.theme-check i {
    color: #ffffff;
    font-size: 12px;
}

/* 主题面板箭头 */
.theme-panel::before {
    content: '';
    position: absolute;
    top: -6px;
    right: 14px;
    width: 12px;
    height: 12px;
    background: var(--background-color);
    transform: rotate(45deg);
    box-shadow: -2px -2px 4px rgba(0, 0, 0, 0.05);
}

/* ========================================
   2. 白天主题（light）
   ======================================== */

/* 白天主题预览 */
.theme-item[data-theme="light"] .theme-preview {
    --theme-primary: #667eea;
    --theme-secondary: #764ba2;
}

/* ========================================
   3. 夜晚主题（dark）
   ======================================== */

/* 夜晚主题CSS变量定义 */
body.theme-dark {
    --background-color: #1a1a2e;
    --background-color-page: #0e111b;
    --background-color-hover: #0f3460;
    --text-color: #eaeaea;
    --text-color-secondary: #a0a0a0;
    --text-color-placeholder: #6c6c6c;
    --border-color: #2d2d44;
    --border-color-light: #3d3d5c;
    --box-shadow-base: 0 2px 8px rgba(0, 0, 0, 0.3);
    --box-shadow-dark: 0 4px 16px rgba(0, 0, 0, 0.4);
}

/* 夜晚主题通用背景 */
body.theme-dark {
    background-color: #16213e !important;
}

/* 夜晚主题夜晚主题预览 */
.theme-item[data-theme="dark"] .theme-preview {
    --theme-primary: #6C5CE7;
    --theme-secondary: #A29BFE;
}

/* 夜晚主题 - 页面和面板 */
body.theme-dark .card,
body.theme-dark .news-card,
body.theme-dark .service-card,
body.theme-dark .job-card,
body.theme-dark .house-card,
body.theme-dark .article-card,
body.theme-dark .goods-card,
body.theme-dark .product-card,
body.theme-dark .article-item,
body.theme-dark .filter-panel,
body.theme-dark .process-section,
body.theme-dark .sidebar-section,
body.theme-dark .hot-articles,
body.theme-dark .information-grid {
    background-color: #1f1f3a !important;
    border: 1px solid #2d2d44 !important;
}

body.theme-dark .filter-panel {
    background-color: #1a1a2e !important;
}

body.theme-dark .page-header {
    border: none !important;
}

/* 夜晚主题 - 文字颜色 */
body.theme-dark .article-title,
body.theme-dark .article-excerpt,
body.theme-dark .article-meta,
body.theme-dark .hot-article-title,
body.theme-dark .hot-meta,
body.theme-dark .job-title,
body.theme-dark .company-name,
body.theme-dark .job-location,
body.theme-dark .job-time,
body.theme-dark .welfare-item,
body.theme-dark .house-title,
body.theme-dark .detail-item,
body.theme-dark .house-meta,
body.theme-dark .service-title,
body.theme-dark .service-desc,
body.theme-dark .service-count,
body.theme-dark .step-title,
body.theme-dark .step-desc,
body.theme-dark .goods-title,
body.dark .goods-meta,
body.theme-dark .stat-number,
body.theme-dark .stat-label,
body.theme-dark .filter-label,
body.theme-dark .filter-option,
body.theme-dark .page-header h1,
body.theme-dark .page-header p,
body.theme-dark .section-title,
body.theme-dark .sidebar-title,
body.theme-dark .quick-link {
    color: #eaeaea !important;
}
body.theme-dark .news-card-title,
body.theme-dark .article-source,
body.theme-dark .article-views,
body.theme-dark .hot-article-meta,
body.theme-dark .job-tags .tag,
body.theme-dark .house-tag span {
    color: var(--text-lightest) !important;
}

body.theme-dark .article-meta,
body.theme-dark .goods-meta,
body.theme-dark .news-card-meta {
    border-top: 1px solid var(--border-dark) !important;
}
body.theme-dark .hot-article {
    border-bottom: 1px solid var(--border-dark) !important;
    background: transparent !important;
}

/* 夜晚主题 - 导航和头部 */
body.theme-dark .site-header {
    background-color: #1a1a2e !important;
    border-color: #2d2d44 !important;
}
body.theme-dark .logo-title{
    filter: contrast(1.8);
}
body.theme-dark .logo-img,
body.theme-dark .logo-subtitle {
    filter: brightness(4.5);
}

body.theme-dark .nav-link:hover {
    color: #ffffff !important;
    background-color: transparent !important;
}

/* 夜晚主题 - 搜索框 */

body.theme-dark .search-input {
    color: #eaeaea !important;
    background: transparent !important;
}

body.theme-dark .search-input::placeholder {
    color: #6c6c6c !important;
}

body.theme-dark .login-link {
    color: #eaeaea !important;
}

body.theme-dark .login-link:hover {
    color: var(--theme-primary) !important;
}

body.theme-dark .register-link {
    background-color: var(--theme-primary) !important;
    color: #ffffff !important;
}

body.theme-dark .register-link:hover {
    opacity: 0.9;
}

/* 夜晚主题 - Banner区域 */
body.theme-dark .banner-section {
    background: #1a1a2e !important;
}

body.theme-dark .banner-controls,
body.theme-dark .banner-indicators .indicator {
    background-color: rgba(255, 255, 255, 0.1) !important;
    border-color: #2d2d44 !important;
}

body.theme-dark .banner-indicators .indicator.active {
    background-color: rgba(255, 255, 255, 0.3) !important;
}

/* 夜晚主题 - Section区域 */
body.theme-dark .section,
body.theme-dark .information-section,
body.theme-dark .house-section,
body.theme-dark .job-section,
body.theme-dark .service-section {
    background-color: #1a1a2e !important;
}

body.theme-dark .news-section {
    background: transparent !important;
}

/* 夜晚主题 - 入口项目 */

body.theme-dark .entry-item i,
body.theme-dark .entry-item span {
    color: #eaeaea !important;
}

body.theme-dark .entry-icon {
    background: var(--theme-gradient) !important;
}

/* 夜晚主题 - 快速入口 */
body.theme-dark .quick-entry {
    background-color: #1a1a2e !important;
}

body.theme-dark .quick-entry-item {
    background-color: #16213e !important;
    border-color: #2d2d44 !important;
    color: #eaeaea !important;
}

body.theme-dark .quick-entry-item:hover {
    border-color: var(--theme-primary) !important;
}

/* 夜晚主题 - 卡片悬停 */
body.theme-dark .card:hover,
body.theme-dark .news-card:hover,
body.theme-dark .job-card:hover,
body.theme-dark .house-card:hover,
body.theme-dark .service-card:hover,
body.theme-dark .goods-card:hover {
    border-color: #3d3d54 !important;
}

/* 黑夜模式下的新闻列表样式 */
body.theme-dark .news-list-section {
    background: #1f1f3a !important;
    border-color: var(--border-color) !important;
}
body.theme-dark .news-list-item {
    border-color: var(--border-color);
}
body.theme-dark .news-list-item:hover {
    background: var(--background-color-hover);
}

/* 夜晚主题 - Job统计和列表 */
body.theme-dark .stat-card {
    background-color: #1a1a2e !important;
    border-color: #2d2d44 !important;
}

body.theme-dark .job-card {
    border-color: #2d2d44 !important;
    background-color: #1a1a2e !important;
}

body.theme-dark .job-card:hover {
    border-color: var(--theme-primary) !important;
}

body.theme-dark .job-header,
body.theme-dark .job-company,
body.theme-dark .job-footer {
    border-color: #2d2d44 !important;
}

/* 夜晚主题 - House搜索和列表 */
body.theme-dark .house-card {
    border-color: #2d2d44 !important;
    background-color: #1a1a2e !important;
}

body.theme-dark .house-card:hover {
    border-color: var(--theme-primary) !important;
}

body.theme-dark .house-details {
    border-bottom-color: #2d2d44 !important;
}

/* 夜晚主题 - 服务卡片 */
body.theme-dark .service-card .service-link h4 {
    color: var(--text-light) !important;
}

body.theme-dark .service-card:hover .service-link h4 {
    color: #ffffff !important;
}

body.theme-dark .service-card .service-link p {
    color: #4a4a6a !important;
}

body.theme-dark .service-card:hover .service-link p {
    color: #ffffff !important;
}

body.theme-dark .service-price {
    color: var(--theme-primary) !important;
}

/* 夜晚主题 - 婚恋交友和同城活动板块 */
body.theme-dark .love-section,
body.theme-dark .event-section {
    background: transparent !important;
}

body.theme-dark .love-card,
body.theme-dark .event-card {
    border-color: #2d2d44 !important;
    background-color: #1a1a2e !important;
}

body.theme-dark .love-card:hover,
body.theme-dark .event-card:hover {
    border-color: #3d3d54 !important;
}

body.theme-dark .love-title,
body.theme-dark .event-title {
    color: #eaeaea !important;
}

body.theme-dark .love-meta,
body.theme-dark .event-meta {
    color: #6c6c8c !important;
}

body.theme-dark .love-meta i,
body.theme-dark .event-meta i {
    color: var(--theme-primary) !important;
}

/* 夜晚主题 - 婚恋交友和同城活动分类标签 */
body.theme-dark .love-category-item,
body.theme-dark .event-category-item {
    background-color: #1a1a2e !important;
    border-color: #2d2d44 !important;
    color: #eaeaea !important;
}

body.theme-dark .love-category-item:hover,
body.theme-dark .event-category-item:hover {
    border-color: var(--color-love-start) !important;
    background-color: rgba(255, 107, 157, 0.2) !important;
    color: #ffffff !important;
}

body.theme-dark .event-category-item:hover {
    border-color: var(--color-event-start) !important;
    background-color: rgba(255, 118, 117, 0.2) !important;
}

body.theme-dark .love-excerpt,
body.theme-dark .event-excerpt {
    color: #a0a0a0 !important;
}

body.theme-dark .event-price {
    box-shadow: 0 2px 8px rgba(240, 147, 251, 0.2) !important;
}

/* 夜晚主题 - 合作伙伴 */
body.theme-dark .partner-section {
    background-color: #1a1a2e !important;
}

body.theme-dark .partner-item {
    background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%) !important;
    border-color: #2d2d44 !important;
    color: #6c6c8c !important;
}

body.theme-dark .partner-item:hover {
    background: var(--theme-gradient) !important;
    color: #ffffff !important;
}

/* 夜晚主题 - 过滤器 */
body.theme-dark .filter-row {
    border-bottom-color: #2d2d44 !important;
}

body.theme-dark .filter-search-input {
    border-color: #2d2d44 !important;
    color: #eaeaea !important;
}

body.theme-dark .filter-search-input::placeholder {
    color: #6c6c6c !important;
}

/* 夜晚主题 - 快速链接 */
body.theme-dark .quick-link {
    background-color: #1a1a2e !important;
    border-color: #2d2d44 !important;
    color: #eaeaea !important;
}

body.theme-dark .quick-link:hover {
    background: var(--theme-gradient) !important;
    color: #ffffff !important;
}

/* 夜晚主题 - 输入框 */
body.theme-dark input,
body.theme-dark textarea,
body.theme-dark select {
    background-color: #1a1a2e !important;
    border-color: #2d2d44 !important;
    color: #eaeaea !important;
}

body.theme-dark input:focus,
body.theme-dark textarea:focus,
body.theme-dark select:focus {
    border-color: var(--theme-primary) !important;
    background-color: #1f1f3a !important;
}

body.theme-dark input::placeholder,
body.theme-dark textarea::placeholder {
    color: #6c6c6c !important;
}

/* 夜晚主题 - 按钮 */
body.theme-dark .btn,
body.theme-dark button,
body.theme-dark input[type="submit"],
body.theme-dark input[type="button"],
body.theme-dark .btn-default {
    background-color: #1f1f3a !important;
    border-color: #2d2d44 !important;
    color: #eaeaea !important;
}

body.theme-dark .btn:hover,
body.theme-dark button:hover,
body.theme-dark .btn-default:hover {
    background-color: #2d2d44 !important;
    border-color: var(--theme-primary) !important;
    color: var(--theme-primary) !important;
}

/* 夜晚主题 - 分页 */
body.theme-dark .page-info,
body.theme-dark .page-btn,
body.theme-dark .page-num {
    background-color: #1a1a2e !important;
    border-color: #2d2d44 !important;
    color: #eaeaea !important;
}

body.theme-dark .page-info {
    background-color: transparent !important;
    color: #a0a0a0 !important;
}

body.theme-dark .page-info strong {
    color: #eaeaea !important;
}

body.theme-dark .page-btn:hover:not(.disabled),
body.theme-dark .page-num:hover:not(.active) {
    background-color: #2d2d44 !important;
    border-color: var(--theme-primary) !important;
    color: var(--theme-primary) !important;
}

/* 夜晚主题 - 底部和Footer */
body.theme-dark .pc-promise-bar {
    background-color: #1a1a2e !important;
    border-color: #2d2d44 !important;
}

body.theme-dark .pc-promise-item {
    color: #eaeaea !important;
}

body.theme-dark .pc-footer-main,
body.theme-dark .pc-footer-bottom {
    background-color: #1a1a2e !important;
    border-color: #2d2d44 !important;
    color: #eaeaea !important;
}

body.theme-dark .pc-footer-main a {
    color: #bdc3c7 !important;
}

body.theme-dark .pc-footer-main a:hover {
    color: #ffffff !important;
}

/* 夜晚主题 - 标签和徽章 */
body.theme-dark .tag,
body.theme-dark .badge,
body.theme-dark .category-item,
body.theme-dark .news-category-item,
body.theme-dark .secondhand-category-tab,
body.theme-dark .filter-option,
body.theme-dark .job-industry-tag {
    background-color: #2d2d44 !important;
    border-color: #3d3d5c !important;
    color: #eaeaea !important;
}

body.theme-dark .tag-primary,
body.theme-dark .tag-success,
body.theme-dark .tag-warning {
    color: #ffffff !important;
}

/* 夜晚主题 - 下拉菜单 */
body.theme-dark .dropdown-menu,
body.theme-dark .submenu {
    background-color: #1f1f3a !important;
    border-color: #2d2d44 !important;
    border-radius: var(--border-radius-lg) !important;
}

body.theme-dark .dropdown-item,
body.theme-dark .submenu a {
    color: #eaeaea !important;
    border-color: transparent !important;
}

body.theme-dark .dropdown-item:hover,
body.theme-dark .submenu a:hover {
    background-color: #2d2d44 !important;
    color: #ffffff !important;
}

body.theme-dark .submenu-inner {
    border: 1px solid var(--border-dark) !important;
}

/* 夜晚主题 - 空状态 */
body.theme-dark .empty-state,
body.theme-dark .news-empty-state,
body.theme-dark .service-empty-state,
body.theme-dark .house-empty-state,
body.theme-dark .secondhand-empty-state {
    background-color: #1a1a2e !important;
    color: #a0a0a0 !important;
}

body.theme-dark .article-image i,
body.theme-dark .house-image i,
body.theme-dark .goods-image i,
body.theme-dark .empty-state i,
body.theme-dark .news-empty-state i,
body.theme-dark .service-empty-state i,
body.theme-dark .house-empty-state i,
body.theme-dark .secondhand-empty-state i {
    color: #2d2d44 !important;
}

/* 夜晚主题 - 表格 */
body.theme-dark table,
body.theme-dark .table {
    background-color: #1a1a2e !important;
    border-color: #2d2d44 !important;
}

body.theme-dark th,
body.theme-dark td {
    border-color: #2d2d44 !important;
    color: #eaeaea !important;
}

body.theme-dark tr:hover {
    background-color: #1f1f3a !important;
}

/* 夜晚主题 - 模态框 */
body.theme-dark .modal-content,
body.theme-dark .popup {
    background-color: #1f1f3a !important;
    border-color: #2d2d44 !important;
}

/* 夜晚主题 - 图片占位符 */
body.theme-dark .placeholder,
body.theme-dark .thumbnail {
    background-color: #1a1a2e !important;
    border-color: #2d2d44 !important;
}

/* 夜晚主题 - 加载动画 */
body.theme-dark .loading,
body.theme-dark .spinner {
    border-color: #2d2d44 !important;
}

/* 夜晚主题 - 阴影 */
body.theme-dark .card,
body.theme-dark .modal-content {
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3) !important;
}

/* 夜晚主题 - 水平线 */
body.theme-dark hr {
    border-color: #2d2d44 !important;
}

/* 夜晚主题 - 滚动条 */
body.theme-dark ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

body.theme-dark ::-webkit-scrollbar-track {
    background: #1a1a2e !important;
}

body.theme-dark ::-webkit-scrollbar-thumb {
    background: #2d2d44 !important;
    border-radius: 4px;
}

body.theme-dark ::-webkit-scrollbar-thumb:hover {
    background: #3d3d54 !important;
}

/* 夜晚主题 - 移动端底部TabBar */
body.theme-dark .mobile-tabbar {
    background: #1a1a2e !important;
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.3) !important;
}

body.theme-dark .mobile-tabbar .tabbar-item {
    color: #a0a0a0 !important;
}

body.theme-dark .mobile-tabbar .tabbar-item.active {
    color: var(--theme-primary) !important;
}

body.theme-dark .mobile-tabbar .tabbar-item-post i {
    background: #1a1a2e !important;
}

/* 夜晚主题 - 浮动按钮 */
body.theme-dark .float-btn {
    background: #1a1a2e !important;
    color: #eaeaea !important;
}

body.theme-dark .float-btn-top {
    background: #1f1f3a !important;
}

/* 夜晚主题 - 移动端导航 */
body.theme-dark .mobile-nav-toggle {
    border-color: #2d2d44 !important;
    background: #1a1a2e !important;
    color: #eaeaea !important;
}

body.theme-dark .mobile-nav-drawer {
    background: #1a1a2e !important;
}

body.theme-dark .mobile-nav-header {
    background: #1a1a2e !important;
    border-bottom-color: #2d2d44 !important;
}

body.theme-dark .mobile-nav-title {
    color: #eaeaea !important;
}

body.theme-dark .mobile-nav-close {
    background: #2d2d44 !important;
    color: #a0a0a0 !important;
}

body.theme-dark .mobile-nav-item {
    color: #eaeaea !important;
}

body.theme-dark .mobile-nav-item:hover {
    background: #2d2d44 !important;
}

/* Dark 主题 - 文章详情页 */
body.theme-dark .reading-progress {
    background: rgba(255,255,255,0.1);
}
body.theme-dark .article-tools {
    background: rgba(30,30,40,0.8);
}
body.theme-dark .article-tool-item {
    color: rgba(255,255,255,0.7);
}
body.theme-dark .article-tool-item:hover {
    background: rgba(102, 126, 234, 0.2);
    color: #667eea;
}
body.theme-dark .article-tool-item.active {
    background: rgba(102, 126, 234, 0.3);
    color: #667eea;
}
body.theme-dark .article-tool-divider {
    background: rgba(255,255,255,0.1);
}
body.theme-dark .article-font-size-inline {
    background: rgba(255,255,255,0.1);
}
body.theme-dark .article-font-size-btn {
    background: rgba(255,255,255,0.1);
    color: rgba(255,255,255,0.7);
}

body.theme-dark .article-share-btn {
    color: rgba(255,255,255,0.7);
}
body.theme-dark .article-share-btn:hover {
    background: rgba(102, 126, 234, 0.2);
    color: #667eea;
}
body.theme-dark .article-toc {
    background: rgba(30,30,40,0.8);
}
body.theme-dark .toc-header {
    border-bottom-color: rgba(255,255,255,0.1);
}
body.theme-dark .toc-header-title {
    color: rgba(255,255,255,0.9);
}
body.theme-dark .toc-footer {
    border-top-color: rgba(255,255,255,0.1);
    color: rgba(255,255,255,0.6);
}
body.theme-dark .toc-footer:hover {
    background: rgba(102, 126, 234, 0.2);
    color: #667eea;
}
body.theme-dark .toc-link {
    color: rgba(255,255,255,0.7);
}
body.theme-dark .toc-link:hover {
    background: rgba(102, 126, 234, 0.2);
    color: #667eea;
}
body.theme-dark .toc-link.active {
    background: rgba(102, 126, 234, 0.3);
    color: #667eea;
}
body.theme-dark .article-hot-list {
    background: rgba(30,30,40,0.8);
}
body.theme-dark .hot-list-header {
    border-bottom-color: rgba(255,255,255,0.1);
    color: rgba(255,255,255,0.9);
}
body.theme-dark .hot-list-item {
    border-bottom-color: rgba(255,255,255,0.1);
    color: rgba(255,255,255,0.8);
}
body.theme-dark .hot-list-item:hover {
    background: rgba(102, 126, 234, 0.2);
}
body.theme-dark .hot-title {
    color: rgba(255,255,255,0.8);
}
body.theme-dark .article-breadcrumb {
    background: rgba(30,30,40,0.8);
}
body.theme-dark .article-breadcrumb a {
    color: rgba(255,255,255,0.7);
}
body.theme-dark .article-breadcrumb a:hover {
    color: #667eea;
}
body.theme-dark .article-breadcrumb span {
    color: rgba(255,255,255,0.5);
}
body.theme-dark .article-breadcrumb .current {
    color: rgba(255,255,255,0.9);
}
body.theme-dark .article-detail-header {
    background: rgba(30,30,40,0.8);
    border-bottom-color: rgba(255,255,255,0.1);
}
body.theme-dark .article-detail-category {
    background: rgba(102, 126, 234, 0.2);
    color: #667eea;
}
body.theme-dark .article-detail-title {
    color: rgba(255,255,255,0.95);
}
body.theme-dark .article-detail-meta {
    color: rgba(255,255,255,0.7);
}
body.theme-dark .article-meta-divider {
    color: rgba(255,255,255,0.3);
}
body.theme-dark .article-tag {
    background: rgba(255,255,255,0.1);
    color: rgba(255,255,255,0.7);
}
body.theme-dark .article-tag:hover {
    background: #667eea;
    color: white;
}
body.theme-dark .article-synopsis {
    background: rgba(102, 126, 234, 0.1);
    border-left-color: #667eea;
    color: rgba(255,255,255,0.8);
}
body.theme-dark .article-detail-content {
    background: rgba(30,30,40,0.8);
    color: rgba(255,255,255,0.9);
}
body.theme-dark .article-detail-content h1,
body.theme-dark .article-detail-content h2,
body.theme-dark .article-detail-content h3,
body.theme-dark .article-detail-content h4,
body.theme-dark .article-detail-content h5,
body.theme-dark .article-detail-content h6 {
    color: rgba(255,255,255,0.95);
}
body.theme-dark .article-detail-content blockquote {
    background: rgba(102, 126, 234, 0.1);
    border-left-color: #667eea;
}
body.theme-dark .article-detail-content code {
    background: rgba(255,255,255,0.1);
    color: rgba(255,255,255,0.9);
}
body.theme-dark .article-detail-content pre {
    background: #1a1a2e;
    color: #e0e0e0;
}
body.theme-dark .article-nav-item {
    background: rgba(30,30,40,0.8);
}
body.theme-dark .article-nav-item:hover {
    background: rgba(102, 126, 234, 0.2);
}
body.theme-dark .article-nav-label {
    color: rgba(255,255,255,0.6);
}
body.theme-dark .article-nav-title {
    color: rgba(255,255,255,0.9);
}
body.theme-dark .article-nav-empty {
    color: rgba(255,255,255,0.5);
}
body.theme-dark .article-related {
    background: rgba(30,30,40,0.8);
}
body.theme-dark .article-related-title {
    color: rgba(255,255,255,0.9);
    border-bottom-color: rgba(102, 126, 234, 0.5);
}
body.theme-dark .related-item-title {
    background: rgba(30,30,40,0.8);
    color: rgba(255,255,255,0.9);
}
body.theme-dark .image-lightbox {
    background: rgba(0,0,0,0.95);
}
body.theme-dark .image-lightbox-close {
    color: rgba(255,255,255,0.8);
}
body.theme-dark .image-lightbox-close:hover {
    color: #667eea;
}
body.theme-dark .image-lightbox-caption {
    color: rgba(255,255,255,0.8);
}

/* ========================================
   4. 经典主题（classic）
   ======================================== */

/* 经典主题CSS变量定义 */
body.theme-classic {
    --background-color: #ffffff;
    --background-color-page: #f0f2f5;
    --background-color-hover: #e8e8e8;
    --text-color: #333333;
    --text-color-secondary: #666666;
    --text-color-placeholder: #999999;
    --border-color: #d9d9d9;
    --border-color-light: #f0f0f0;
}

/* 经典主题预览 */
.theme-item[data-theme="classic"] .theme-preview {
    --theme-primary: #1890ff;
    --theme-secondary: #096dd9;
}

/* 经典模式禁用渐变，使用单色 */
body.theme-classic .theme-gradient,
body.theme-classic .gradient-bg,
body.theme-classic .gradient-background {
    background: var(--theme-primary) !important;
}

/* 强制所有渐变变量在经典模式下使用单色 */
body.theme-classic {
    --theme-gradient: var(--theme-primary);
    --color-news-gradient: var(--color-news-start);
    --color-job-gradient: var(--color-job-start);
    --color-secondhand-gradient: var(--color-secondhand-start);
    --color-house-gradient: var(--color-house-start);
    --color-service-gradient: var(--color-service-start);
    --color-love-gradient: var(--color-love-start);
    --color-event-gradient: var(--color-event-start);
}

/* 按钮渐变效果在经典模式下使用单色 */
body.theme-classic .btn-primary,
body.theme-classic .btn-gradient,
body.theme-classic .btn-gradient-primary {
    background: var(--theme-primary) !important;
    background-image: none !important;
}

/* 卡片渐变背景在经典模式下使用单色 */
body.theme-classic .card-gradient,
body.theme-classic .card-gradient-bg,
body.theme-classic .gradient-card {
    background: var(--theme-primary) !important;
    background-image: none !important;
}

/* 保留属性选择器用于动态生成的内联样式 */
body.theme-classic [style*="gradient"] {
    background: var(--theme-primary) !important;
    background-image: none !important;
}

/* 经典主题 - 各模块section背景单色（各自使用自己的主题色） */
body.theme-classic .news-section {
    background: var(--color-news-start) !important;
    background-image: none !important;
}

body.theme-classic .love-section {
    background: var(--color-love-start) !important;
    background-image: none !important;
}

body.theme-classic .event-section {
    background: var(--color-event-start) !important;
    background-image: none !important;
}

/* 经典主题 - 各模块section标题和链接 */
body.theme-classic .news-section .section-header h2,
body.theme-classic .love-section .section-header h2,
body.theme-classic .event-section .section-header h2 {
    color: #ffffff !important;
}

body.theme-classic .news-section .more-link,
body.theme-classic .love-section .more-link,
body.theme-classic .event-section .more-link {
    color: rgba(255,255,255,0.8) !important;
    background: rgba(255,255,255,0.2) !important;
}

body.theme-classic .news-section .more-link:hover,
body.theme-classic .love-section .more-link:hover,
body.theme-classic .event-section .more-link:hover {
    background: rgba(255,255,255,0.3) !important;
    color: #ffffff !important;
}

/* 经典主题 - 婚恋交友和同城活动分类标签 */
body.theme-classic .love-category-item.active,
body.theme-classic .event-category-item.active {
    background: var(--color-love-start) !important;
}

body.theme-classic .event-category-item.active {
    background: var(--color-event-start) !important;
}

body.theme-classic .love-card:hover,
body.theme-classic .event-card:hover {
    border-color: var(--color-love-start) !important;
}

body.theme-classic .event-card:hover {
    border-color: var(--color-event-start) !important;
}

body.theme-classic .event-price {
    background: var(--color-event-start) !important;
}

/* 经典主题 - 移动端底部TabBar */
body.theme-classic .mobile-tabbar {
    background: #ffffff !important;
}

body.theme-classic .mobile-tabbar .tabbar-item-post i {
    background: #ffffff !important;
    box-shadow: 0 -2px 10px rgba(24, 144, 255, 0.3) !important;
}

/* 经典主题 - 浮动按钮 */
body.theme-classic .float-btn-service {
    background: var(--theme-primary) !important;
}

body.theme-classic .float-btn-top {
    background: #ffffff !important;
    color: var(--theme-primary) !important;
}

/* Classic 主题 - 文章详情页 */
body.theme-classic .toc-link {
    color: #495057;
}
body.theme-classic .toc-link:hover {
    background: #e9ecef;
    color: #007bff;
}
body.theme-classic .toc-link.active {
    background: #cfe2ff;
    color: #0d6efd;
}
body.theme-classic .hot-rank{
    box-shadow: none;
}
body.theme-classic .hot-rank.top1{
    background: #ff4757;
}
body.theme-classic .hot-rank.top2{
    background: #ffa502;
}
body.theme-classic .hot-rank.top3{
    background: #2ed573;
}

/* ========================================
   移动端导航菜单主题样式
   ======================================== */

/* 各应用移动端导航主题色 */
body[data-app="news"] .mobile-nav-item:hover,
body[data-app="news"] .mobile-nav-item.active {
    border-left-color: var(--color-news-start) !important;
    color: var(--color-news-start) !important;
}

body[data-app="job"] .mobile-nav-item:hover,
body[data-app="job"] .mobile-nav-item.active {
    border-left-color: var(--color-job-start) !important;
    color: var(--color-job-start) !important;
}

body[data-app="secondhand"] .mobile-nav-item:hover,
body[data-app="secondhand"] .mobile-nav-item.active {
    border-left-color: var(--color-secondhand-start) !important;
    color: var(--color-secondhand-start) !important;
}

body[data-app="house"] .mobile-nav-item:hover,
body[data-app="house"] .mobile-nav-item.active {
    border-left-color: var(--color-house-start) !important;
    color: var(--color-house-start) !important;
}

body[data-app="service"] .mobile-nav-item:hover,
body[data-app="service"] .mobile-nav-item.active {
    border-left-color: var(--color-service-start) !important;
    color: var(--color-service-start) !important;
}

body[data-app="love"] .mobile-nav-item:hover,
body[data-app="love"] .mobile-nav-item.active {
    border-left-color: var(--color-love-start) !important;
    color: var(--color-love-start) !important;
}

body[data-app="event"] .mobile-nav-item:hover,
body[data-app="event"] .mobile-nav-item.active {
    border-left-color: var(--color-event-start) !important;
    color: var(--color-event-start) !important;
}

/* 经典主题 - 移动端导航按钮 */
body.theme-classic .mobile-nav-toggle:hover {
    border-color: var(--theme-primary) !important;
    color: var(--theme-primary) !important;
}

/* 经典主题 - 移动端导航项悬停 */
body.theme-classic .mobile-nav-item:hover {
    border-left-color: var(--theme-primary) !important;
    color: var(--theme-primary) !important;
}

/* ========================================
   5. 自动主题（auto）
   ======================================== */

/* 自动模式指示器动画 */
body.theme-auto .theme-indicator {
    animation: indicatorAutoSwitch 3s ease-in-out infinite;
}

@keyframes indicatorAutoSwitch {
    0%, 100% {
        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    }
    50% {
        background: linear-gradient(135deg, #6C5CE7 0%, #A29BFE 100%);
    }
}

/* 自动主题预览 */
.theme-item[data-theme="auto"] .theme-preview {
    --theme-primary: #667eea;
    --theme-secondary: #6C5CE7;
    animation: autoThemeSwitch 3s ease-in-out infinite;
}

@keyframes autoThemeSwitch {
    0%, 100% {
        background: linear-gradient(to right, #667eea 50%, #6C5CE7 50%);
    }
    50% {
        background: linear-gradient(to right, #6C5CE7 50%, #667eea 50%);
    }
}

.theme-item[data-theme="auto"] .theme-preview::before,
.theme-item[data-theme="auto"] .theme-preview::after {
    display: none;
}

/* ========================================
   6. 主题切换动画和过渡
   ======================================== */

/* 主题切换动画 */
@keyframes themeChange {
    0% {
        opacity: 0.8;
    }
    50% {
        opacity: 1;
    }
    100% {
        opacity: 1;
    }
}

.theme-changing {
    animation: themeChange 0.5s ease;
}

/* 主题切换过渡效果 */
body {
    transition: 
        background-color 0.3s ease,
        color 0.3s ease;
}


/* ========================================
   YouTube风格页面跳转进度条
   ======================================== */

body.theme-dark .page-progress-indicator {
    box-shadow: 0 0 10px rgba(102, 126, 234, 0.8);
}

body.theme-dark[data-app="news"] .page-progress-indicator {
    box-shadow: 0 0 10px rgba(102, 126, 234, 0.8);
}

body.theme-dark[data-app="job"] .page-progress-indicator {
    box-shadow: 0 0 10px rgba(17, 153, 142, 0.8);
}

body.theme-dark[data-app="secondhand"] .page-progress-indicator {
    box-shadow: 0 0 10px rgba(0, 201, 183, 0.8);
}

body.theme-dark[data-app="service"] .page-progress-indicator {
    box-shadow: 0 0 10px rgba(79, 172, 254, 0.8);
}

body.theme-dark[data-app="house"] .page-progress-indicator {
    box-shadow: 0 0 10px rgba(250, 112, 154, 0.8);
}

body.theme-dark[data-app="love"] .page-progress-indicator {
    box-shadow: 0 0 10px rgba(255, 64, 129, 0.8);
}

body.theme-dark[data-app="event"] .page-progress-indicator {
    box-shadow: 0 0 10px rgba(229, 91, 19, 0.8);
}