/* 
 * 深色模式样式文件
 * 参考WincyFu网站风格的个人网站
 */

/* 深色模式样式 */
body.dark-mode {
    /* 文本颜色 */
    --text-primary: #f5f5f7;
    --text-secondary: #a1a1a6;
    --text-tertiary: #86868b;
    
    /* 背景颜色 */
    --bg-primary: #1d1d1f;
    --bg-secondary: #2d2d2f;
    --bg-tertiary: #3d3d3f;
    
    /* 边框颜色 */
    --border-color: #424245;
    
    /* 强调色和高亮色保持不变，确保可读性 */
}

/* 深色模式下的导航栏 */
body.dark-mode header {
    background-color: rgba(29, 29, 31, 0.8);
    border-bottom: 1px solid var(--border-color);
}

/* 深色模式下的主题切换按钮 */
body.dark-mode #theme-toggle i.fas.fa-sun::before {
    content: "\f186"; /* 月亮图标 */
}

body.dark-mode #mobile-theme-toggle i.fas.fa-sun::before {
    content: "\f186"; /* 月亮图标 */
}

/* 深色模式下的占位符 */
body.dark-mode .placeholder {
    background-color: var(--bg-tertiary);
}

/* 深色模式下的卡片 */
body.dark-mode .work-item,
body.dark-mode .article-item {
    background-color: var(--bg-secondary);
}

/* 深色模式下的页脚 */
body.dark-mode footer {
    background-color: var(--bg-primary);
    border-top: 1px solid var(--border-color);
}

/* 深色模式下的按钮 */
body.dark-mode .secondary-btn {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

body.dark-mode .secondary-btn:hover {
    background-color: var(--border-color);
}

/* 深色模式下的社交图标 */
body.dark-mode .social-icon {
    color: var(--text-secondary);
}

body.dark-mode .social-icon:hover {
    color: var(--accent-color);
}