/* 文章内容容器 */
.post-content {
    max-width: 800px;   /* 限制最大宽度，避免过宽 */
    margin: 0 auto;     /* 水平居中 */
	padding: 0 20px;
    text-align: left !important; /* 文本居中 */
}

/* 无序列表左对齐 */
.post-content ul {
  text-align: left;
  padding-left: 1em;  /* 保持适当的缩进 */
  margin-left: 0;
}

/* 列表项内容左对齐 */
.post-content li {
  text-align: left;
  margin-left: 0;
}

/* 针对以-开头的Markdown列表 */
.post-content ul > li::before {
  content: none;  /* 可选：移除默认的项目符号 */
}

/* 文章主标题保持居中 */
.post-title, 
.post-content h1 {
  text-align: center;
}

/* 强制所有子标题左对齐 */
.post-content h2,
.post-content h3,
.post-content h4,
.post-content h5,
.post-content h6 {
  text-align: left !important;
  margin-left: 0 !important; /* 可选：移除默认缩进 */
}

/* 确保代码块、图片等块级元素居中 */
.post-content pre,
.post-content img,
.post-content table,
.post-content blockquote {
    max-width: 100%;    /* 防止元素超出容器 */
    margin: 0 auto;     /* 水平居中 */
}

/* 特别针对图片的优化 */
.post-content img {
	max-width: min(100%, 800px); /* 不超过 800px，也不超过容器宽度 */
    height: auto;       /* 保持宽高比 */
    display: block;     /* 避免行内元素间隙 */
    border-radius: 4px; /* 可选：圆角效果 */
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); /* 可选：轻微阴影 */
}

/* 代码块内部文本保持左对齐 */
.post-content pre {
    text-align: left;
    overflow-x: auto;   /* 如果代码太长，允许横向滚动 */
    padding: 12px;
    background: #f5f5f5;
    border-radius: 4px;
}

@media (max-width: 768px) {
    .post-content {
        padding: 0 10px;
        max-width: 100%;
    }
}

/* 页眉样式 */
.site-header {
    background: #f8f8f8;
    padding: 15px 0;
    border-bottom: 1px solid #eee;
}

.header-nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 800px;  /* 与文章容器相同 */
    margin: 0 auto;
    padding: 0 20px;    /* 与文章容器相同 */
}

.nav-left, .nav-right {
    display: flex;
    gap: 20px;
	font-size: 1.5em; /* 根据父元素调整 */
}

/* 手机端适配 */
@media (max-width: 768px) {
    .nav-right a {
        font-size: 1.5em; /* 根据父元素调整 */
    }
}