/* TỐI ƯU CHO THIẾT BỊ DI ĐỘNG (< 768px) */
@media (max-width: 767.98px) {

    /* 1. Loại bỏ khoảng trắng thừa của Container */
    .container, .container-fluid {
        padding-left: 5px !important;
        padding-right: 5px !important;
    }

    html, body {
        overflow-x: hidden !important;
    }

    /* 3. Biến các nút bấm thành Full-width (dễ chạm ngón cái) */
    .btn-mobile-full {
        width: 100% !important;
        margin-bottom: 10px;
        padding: 12px !important; /* Tăng vùng chạm */
    }

    /* 5. Khoảng cách (Ghi đè các class m-5, p-5 vốn quá lớn trên mobile) */
    .py-5 {
        padding-top: 2rem !important;
        padding-bottom: 2rem !important;
    }

    .my-5 {
        margin-top: 2rem !important;
        margin-bottom: 2rem !important;
    }

    /* 6. Xử lý bảng (Table) - Ép cuộn ngang để không vỡ khung */
    .table-responsive-fix {
        display: block;
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .reviews-section {
        padding: 0 !important;
    }

    .comments-product-container {
        padding: 0 !important;
    }
    .rating-summary {
        gap: 0.5rem !important;
        padding: 1rem !important;
        margin-bottom: 1rem !important;
    }
    /* pagination */
    .pagination {
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }


}