@charset "UTF-8";

/* ===== Article detail page H5 adaptation (414px design base) ===== */
@media (max-width: 768px) {
    /* Top banner: PC 3.5rem compressed to 1.8rem */
    .category-banner {
        height: 1.8rem;
        padding-top: .3rem;
    }

    .category-banner p {
        margin-bottom: .06rem;
        font-size: .28rem;
        line-height: .4rem;
    }

    .category-banner .line {
        width: .4rem;
        height: .02rem;
        margin-bottom: .06rem;
    }

    .category-banner h2 {
        font-size: .3rem;
        line-height: .42rem;
    }

    /* Content card: tighter padding */
    .content-box {
        padding: .24rem 0;
    }

    .content {
        padding: .24rem;
        border-radius: .08rem;
    }

    /* Title: left aligned and enlarged for readability; body colour set to solid black */
    .content .title {
        font-size: .2rem;
        line-height: .3rem;
        text-align: left;
        color: #000 !important;
    }

    .content .time {
        margin: .16rem 0;
        font-size: .14rem;
        line-height: .22rem;
        text-align: left;
        color: #000 !important;
    }

    .article_text {
        margin-top: .24rem;
    }

    /* Body text: override CMS inline font-size / line-height (inline styles win, must use !important) */
    .article_text p,
    .article_text span,
    .article_text strong,
    .article_text a {
        font-size: .16rem !important;
        line-height: 1.8 !important;
        /* base.css body uses translucent grey rgba(41,47,65,0.6); body text inherits it and looks faded.
           Use solid black on mobile for better readability. */
        color: #000 !important;
    }

    /* Lists and table cells: same treatment */
    .article_text li,
    .article_text td,
    .article_text th {
        color: #000 !important;
    }

    .article_text h1,
    .article_text h2,
    .article_text h3,
    .article_text h4 {
        margin: .2rem 0 .1rem;
        font-size: .18rem !important;
        line-height: 1.5 !important;
        color: #000 !important;
    }

    /* Images fit the screen width, no horizontal scrolling */
    .article_text img {
        display: block;
        max-width: 100% !important;
        height: auto !important;
        margin: .12rem auto;
    }

    /* Tables scroll horizontally */
    .article_text table {
        display: block;
        width: 100% !important;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        font-size: .14rem !important;
    }

    .article_text td,
    .article_text th {
        padding: .06rem .08rem;
        word-break: break-word;
    }

    /* Attachment lists */
    .article_text ul,
    .article_text ol {
        padding-left: .32rem;
    }
}