/* 前端页面图片样式处理 */

/* 内容区域内的图片基础样式 */
.content-body img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

/* figure.image 容器样式 */
.content-body figure.image {
    margin: 1rem 0;
    text-align: center;
}

/* inline 样式的图片 */
.content-body figure.image.image-style-inline {
    display: inline;
    margin: 0;
}

.content-body figure.image.image-style-inline img {
    display: inline-block;
    margin: 0;
    vertical-align: middle;
}

/* block 样式的图片 - 这是关键！ */
.content-body figure.image.image-style-block {
    display: block;
    margin: 1rem auto;
    text-align: center;
}

.content-body figure.image.image-style-block img {
    display: block;
    margin: 0 auto;
    max-width: 100%;
    height: auto;
}

/* side 样式的图片 */
.content-body figure.image.image-style-side {
    display: block;
    margin: 1rem 0;
    text-align: center;
}

.content-body figure.image.image-style-side img {
    display: block;
    margin: 0 auto;
    max-width: 50%;
    height: auto;
}

/* 图片说明文字 */
.content-body figure.image figcaption {
    margin-top: 0.5rem;
    font-size: 0.9rem;
    color: #666;
    font-style: italic;
    text-align: center;
}

/* 确保没有其他样式干扰 */
.content-body figure.image:not(.image-style-inline):not(.image-style-block):not(.image-style-side) {
    display: block;
    margin: 1rem auto;
    text-align: center;
}

.content-body figure.image:not(.image-style-inline):not(.image-style-block):not(.image-style-side) img {
    display: block;
    margin: 0 auto;
    max-width: 100%;
    height: auto;
}

/* 响应式调整 */
@media (max-width: 768px) {
    .content-body figure.image.image-style-side img {
        max-width: 100%;
    }
}