/* 建议将以下CSS移至 style.css 文件中 */
:root {
--primary-color: #333;
--border-color: #ccc;
--bg-light: #f7f7f7;
--link-color: #333;
--link-hover: #ff0000;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: "Microsoft YaHei", sans-serif; background: #fff; color: var(--primary-color); line-height: 1.6; }
a { color: var(--link-color); text-decoration: none; }
a:hover { color: var(--link-hover); }
.container { max-width: 1000px; margin: 0 auto; background: #fff; }
/* 侧边栏样式 */
.sidebar { width: 240px; flex-shrink: 0; }
.widget { margin-bottom: 20px; border: 1px solid var(--border-color); }
.widget-title { background: #333; color: #fff; padding: 8px; text-align: center; font-weight: bold; }
.widget-content { padding: 10px; }
.widget-content ul { list-style: none; }
.widget-content li { padding: 3px 0; }

/* 列表样式 */
.news-article-list { flex: 1; margin-left: 20px; }
.list-header { display: flex; background: #333; color: #fff; padding: 8px; }
.list-header span { text-align: center; }
.list-header .title { flex: 1; text-align: left; }
.list-header .views, .list-header .date { width: 80px; }

.list-item { display: flex; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--bg-light); }
.list-item .title { flex: 1; }
.list-item .views, .list-item .date { width: 80px; text-align: center; color: #999; }

/* 热门文章 */
.hot-list .item { padding: 5px 0; border-bottom: 1px dashed #eee; }

/* 分页 */
.pagination { text-align: right; padding: 15px 0; }

/* 响应式 */
@media (max-width: 768px) {
.container { padding: 10px; }
.news-main-content { flex-direction: column; }
.sidebar { width: 100%; margin-bottom: 20px; }
.news-article-list { margin-left: 0; }
.list-header .views, .list-item .views { display: none; } /* 手机端隐藏阅读数 */
}