/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0.1
*/

/* =======================================================
   1. CUSTOM CSS CHUNG
   ======================================================= */

/* (Nếu sau này bạn có CSS khác thì chèn phía dưới đoạn này) */


/* =======================================================
   2. FIX GIAO DIỆN TRANG SẢN PHẨM
   ======================================================= */

/* Đảm bảo phần tab mô tả / đánh giá đứng đúng dòng,
   không bị dính float hay box phía trên */
.single-product .woocommerce-tabs,
.single-product .woocommerce-tabs .panel {
    clear: both;
}

/* Một chút tối ưu typography cho mô tả */
.single-product .woocommerce-tabs .panel p {
    line-height: 1.5;
    margin-bottom: 8px;
}

/* =======================================================
   3. MOBILE CSS (MÀN HÌNH ≤ 48em ~ 768px)
   ======================================================= */

@media only screen and (max-width: 48em) {

    /*************** ADD MOBILE ONLY CSS HERE  ***************/

    /* Chừa khoảng trống đáy màn hình để thanh
       THÊM VÀO GIỎ / MUA NGAY, Zalo… không che chữ mô tả */
    body.single-product {
        padding-bottom: 130px; /* có thể tăng lên 150–160px nếu thanh dưới cao hơn */
    }

    /* Đảm bảo khu vực tab mô tả không bị dính vào các phần nổi phía trên */
    .single-product .woocommerce-tabs,
    .single-product .woocommerce-tabs .panel {
        padding-bottom: 10px;
    }

    /* Nếu nút thêm giỏ + mua ngay full width thì nhìn gọn hơn */
    .single-product form.cart {
        flex-direction: column;
    }
    .single-product form.cart .single_add_to_cart_button,
    .single-product .tp-buy-now {
        width: 100%;
        justify-content: center;
    }
} /* <-- ĐÃ ĐÓNG MEDIA QUERY ĐẦY ĐỦ */


/* Mobile: allow the product-page grid item to shrink to the viewport. */
@media only screen and (max-width: 48em) {
    body.single-product > #wrapper {
        min-width: 0;
        width: 100%;
    }
}
