/* ============================================
   ARTICLE CONTENT IMAGE CONTAINMENT
   Fixes image overflow in Post/Detail and Single/Detail pages
   ============================================ */

/* Ensure article content container doesn't overflow */
.article-content {
    overflow-x: hidden;
    word-wrap: break-word;
}

/* All images in article content must stay within container */
.article-content img {
    max-width: 100% !important;
    height: auto !important;
    display: block;
    margin: 1.5rem auto;
    border-radius: 8px;
}

/* Figure elements (contain images) */
.article-content figure {
    max-width: 100%;
    margin: 1.5rem 0;
    overflow: hidden;
}

.article-content figure img {
    max-width: 100% !important;
    height: auto !important;
    margin: 0 auto;
}

/* Other media elements */
.article-content iframe,
.article-content video,
.article-content embed {
    max-width: 100% !important;
    height: auto;
    display: block;
    margin: 1rem auto;
}

/* Detail page specific classes */
.post-detail .article-content,
.news-detail .article-content {
    overflow-x: hidden;
}

.post-detail figure,
.news-detail figure {
    max-width: 100%;
    overflow: hidden;
}

.post-detail figure img,
.news-detail figure img {
    max-width: 100% !important;
    width: 100%;
    height: auto !important;
}

/* Ensure the main figure at top of article also respects container */
.post-detail>figure,
.news-detail>figure,
article.post-detail>figure,
article.news-detail>figure {
    max-width: 100%;
    overflow: hidden;
}

.post-detail>figure img,
.news-detail>figure img,
article.post-detail>figure img,
article.news-detail>figure img {
    max-width: 100% !important;
    width: 100%;
    height: auto !important;
    object-fit: cover;
}