/* In bài viết — chỉ load từ _LayoutArticle (BaiViet, PhotoDetail, …) */

.article-print-header {
    display: none;
}

@media print {
    body:has(.content-container.content-article) {
        background: #fff !important;
        color: #000 !important;
        width: 100% !important;
        overflow: visible !important;
    }

    @page {
        margin: 12mm;
        size: A4;
    }

    body:has(.content-container.content-article) .container,
    body:has(.content-container.content-article) .container-fluid,
    body:has(.content-container.content-article) main,
    body:has(.content-container.content-article) main .row {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    body:has(.content-container.content-article) .header-transparent,
    body:has(.content-container.content-article) .header,
    body:has(.content-container.content-article) .navbar,
    body:has(.content-container.content-article) .banner,
    body:has(.content-container.content-article) footer,
    body:has(.content-container.content-article) .footer,
    body:has(.content-container.content-article) .breadcrumb-content,
    body:has(.content-container.content-article) .breaking-news-bar,
    body:has(.content-container.content-article) .arrow_top,
    body:has(.content-container.content-article) .tool-rail,
    body:has(.content-container.content-article) .tool-end-post,
    body:has(.content-container.content-article) .back-tools,
    body:has(.content-container.content-article) .detail-info .tools,
    body:has(.content-container.content-article) ul.tools,
    body:has(.content-container.content-article) .list-inline.tools,
    body:has(.content-container.content-article) .modal,
    body:has(.content-container.content-article) .box_comment,
    body:has(.content-container.content-article) .box_rating,
    body:has(.content-container.content-article) .wrap_comment,
    body:has(.content-container.content-article) #commentSection,
    body:has(.content-container.content-article) #loadMoreComments,
    body:has(.content-container.content-article) .action-controls,
    body:has(.content-container.content-article) .audio-player,
    body:has(.content-container.content-article) .audio-options-menu,
    body:has(.content-container.content-article) .menu-overlay,
    body:has(.content-container.content-article) #div_audio,
    body:has(.content-container.content-article) .grid-container > .grid-item-fixed,
    body:has(.content-container.content-article) .content-container > .row-breadscrumb,
    body:has(.content-container.content-article) .yhy-append-wrap,
    body:has(.content-container.content-article) .yhy-append,
    body:has(.content-container.content-article) #yhy-append,
    body:has(.content-container.content-article) #btnEMC,
    body:has(.content-container.content-article) .yhy-append-btn,
    body:has(.content-container.content-article) .yhy-btn-emc,
    body:has(.content-container.content-article) .yhy-btn-btttt {
        display: none !important;
        visibility: hidden !important;
    }

    body:has(.content-container.content-article) .grid-container > .grid-item:not(:has(.detail-container)) {
        display: none !important;
    }

    body:has(.content-container.content-article) .article-print-header {
        display: block !important;
        text-align: center;
        margin: 0 0 16px;
        padding-bottom: 12px;
        border-bottom: 2px solid #333;
    }

    body:has(.content-container.content-article) .article-print-logo {
        max-height: 56px;
        width: auto;
    }

    body:has(.content-container.content-article) .content-container,
    body:has(.content-container.content-article) .article-content-left {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    body:has(.content-container.content-article) .grid-container {
        display: block !important;
    }

    body:has(.content-container.content-article) .grid-item:has(.detail-container) {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        position: static !important;
        grid-column: 1 / -1 !important;
        margin: 0 !important;
        padding: 0 !important;
        left: auto !important;
        transform: none !important;
    }

    body:has(.content-container.content-article) .detail-container {
        margin: 0 !important;
        padding: 0 !important;
        max-width: 100% !important;
    }

    body:has(.content-container.content-article) .detail-container,
    body:has(.content-container.content-article) .detail-top-info,
    body:has(.content-container.content-article) .detail-title,
    body:has(.content-container.content-article) .article-header,
    body:has(.content-container.content-article) .author-info,
    body:has(.content-container.content-article) .detail-info,
    body:has(.content-container.content-article) .detail-post-info,
    body:has(.content-container.content-article) .detail-content,
    body:has(.content-container.content-article) .detail-content-lead,
    body:has(.content-container.content-article) .live-session-info {
        display: block !important;
        visibility: visible !important;
        position: static !important;
        width: 100% !important;
        overflow: visible !important;
        break-inside: auto;
    }

    body:has(.content-container.content-article) .detail-top-info {
        border-bottom: none !important;
        padding-bottom: 0 !important;
        margin-bottom: 8px !important;
    }

    body:has(.content-container.content-article) .detail-title {
        font-size: 22pt !important;
        font-weight: 700 !important;
        line-height: 1.35 !important;
        margin: 0 0 12px !important;
        color: #000 !important;
    }

    body:has(.content-container.content-article) .article-header {
        margin-bottom: 12px !important;
        padding-bottom: 8px !important;
        border-bottom: 1px solid #ccc !important;
    }

    body:has(.content-container.content-article) .author-name,
    body:has(.content-container.content-article) .author,
    body:has(.content-container.content-article) .post-datetime,
    body:has(.content-container.content-article) .detail-info .time,
    body:has(.content-container.content-article) .detail-info .author {
        font-size: 11pt !important;
        color: #333 !important;
    }

    body:has(.content-container.content-article) .detail-content-lead {
        font-size: 12pt !important;
        margin-bottom: 12px !important;
    }

    body:has(.content-container.content-article) .detail-content {
        font-size: 12pt !important;
        line-height: 1.55 !important;
        color: #000 !important;
        max-width: 100% !important;
        overflow: visible !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    body:has(.content-container.content-article) .detail-content figure.image-bleed,
    body:has(.content-container.content-article) .detail-content figure.image-bleed img {
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        left: auto !important;
    }

    body:has(.content-container.content-article) .longform .detail-content [data-article-bg]::before,
    body:has(.content-container.content-article) .longform .detail-content article[style*="background-color"]::before,
    body:has(.content-container.content-article) .longform .detail-content > div[style*="background-color"]::before {
        left: 0 !important;
        width: 100% !important;
    }

    body:has(.content-container.content-article) .detail-content img,
    body:has(.content-container.content-article) .detail-content figure,
    body:has(.content-container.content-article) .detail-content figure img {
        max-width: 100% !important;
        height: auto !important;
        page-break-inside: avoid;
    }

    body:has(.content-container.content-article) .detail-content p:has(iframe),
    body:has(.content-container.content-article) .detail-content p:has(video),
    body:has(.content-container.content-article) .detail-content div:has(iframe),
    body:has(.content-container.content-article) .detail-content div:has(video),
    body:has(.content-container.content-article) .detail-content figure:has(iframe),
    body:has(.content-container.content-article) .detail-content figure:has(video) {
        overflow: visible !important;
        max-width: 100% !important;
        width: 100% !important;
    }

    body:has(.content-container.content-article) .detail-content table {
        page-break-inside: avoid;
        max-width: 100% !important;
    }

    body:has(.content-container.content-article) .detail-content a[href]:after {
        content: "" !important;
    }
}
