/* =========================================================
 *  Trang "Công bố sản phẩm" — bảng .table-custom trên mobile.
 *  frontend.css có sẵn layout "thẻ" cho mobile (ẩn header, mỗi dòng
 *  thành 1 card, lưới 2 cột) ở @media (max-width: 849px). Theo yêu
 *  cầu, ở đây HUỶ layout thẻ đó và trả về bảng ngang gốc (giống
 *  desktop) nhưng thu nhỏ chữ + cho .table-custom-wrap cuộn ngang.
 *  Web dùng 1rem = 20px.
 * ========================================================= */
@media (max-width: 849px) {
    .table-custom-wrap {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .product-release-content {
        min-width: 50rem;
    }

    /* ----- huỷ layout thẻ, trả về bảng ngang ----- */
    .table-custom {
        background: linear-gradient(180deg, #D7EAFF 0%, rgba(215, 234, 255, 0) 100%);
    }

    .table-custom .table-header {
        display: block;
    }

    .table-custom .wrap-body {
        padding: 0 1.5625rem;
    }

    .table-custom .table-body {
        display: block;
        padding: 0 1.042rem;
        border-top-left-radius: 2.604rem;
        border-top-right-radius: 2.604rem;
        background: #fff;
    }

    .table-custom .table-body li {
        display: flex !important;
        padding: 0.6rem 0;
        background: transparent;
        border-radius: 0;
    }

    .table-custom ul > li > span {
        width: auto;
        display: block;
        flex-direction: row;
        gap: 0;
        line-height: normal;
    }

    .table-custom ul > li > span:nth-child(1) { width: 10% !important; text-align: center; }
    .table-custom ul > li > span:nth-child(2) { width: 25% !important; }
    .table-custom ul > li > span:nth-child(3) { width: 20% !important; }
    .table-custom ul > li > span:nth-child(4) { width: 15% !important; }
    .table-custom ul > li > span:nth-child(5) { width: 20% !important; }
    .table-custom ul > li > span:nth-child(6) { width: 10% !important; }

    .table-custom ul > li > span:not(:last-child) {
        padding-right: 0.6rem !important;
        margin-bottom: 0;
    }

    .table-custom .table-body span > strong {
        display: none;
    }

    .table-custom ul > li > span:nth-child(1) > span {
        width: auto;
        height: auto;
        border-radius: 0;
        background: none;
        color: inherit;
        font-family: inherit;
        font-size: inherit;
        display: inline;
    }

    /* ----- thu nhỏ chữ cho dễ đọc khi cuộn ngang ----- */
    .table-custom .table-header span {
        font-size: 0.85rem;
    }

    .table-custom ul > li span.content {
        font-size: 0.8rem;
    }

    .table-custom ul > li span.accordion-name > .name {
        font-size: 0.8rem;
    }

    .table-custom ul > li span > a {
        font-size: 0.8rem;
    }

    .table-custom ul > li span.inner-info {
        font-size: 0.65rem;
    }
}
