/* ===============================
   KITO PRODUCT DETAIL FINAL OVERRIDE
   Fix: ảnh desktop 50%, jqzoom wrapper, option, hotline, nút mua,
   related products, tablet/mobile responsive.
================================================== */

/* Không để phần tử con làm vỡ layout */
#content, #content * { box-sizing: border-box !important; }

/* Xóa các clear gây tụt khối trong vùng chi tiết */
.product-row .clear { clear: none !important; height: 0 !important; margin: 0 !important; padding: 0 !important; }

/* ========== DESKTOP >= 992px ========== */
@media (min-width: 992px) {

    #content .product-row {
        display: grid !important;
        grid-template-columns: minmax(0, 50%) minmax(0, 50%) !important;
        column-gap: 28px !important;
        align-items: start !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 0 28px 0 !important;
        padding: 0 !important;
    }

    #content .product-row > .image-2025,
    #content .product-row > .product_info,
    #content .product-row > .product_info_mb {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        flex: none !important;
        float: none !important;
        display: block !important;
        margin: 0 !important;
    }

    #content .product-row > .image-2025 {
        grid-column: 1 / 2 !important;
        padding: 0 !important;
    }

    #content .product-row > .product_info,
    #content .product-row > .product_info_mb {
        grid-column: 2 / 3 !important;
        padding: 0 0 0 0 !important;
    }

    /* Ép toàn bộ khung ảnh và jqzoom wrapper full 100% cột ảnh */
    #content .image-2025,
    #content .image-2025 .thumbnails,
    #content .image-2025 .img_product,
    #content .image-2025 .img_product_mb,
    #content .image-2025 .thumb_li,
    #content .image-2025 li.thumb_li,
    #content .image-2025 .jqzoom,
    #content .image-2025 .thumbnail,
    #content .image-2025 .zoomWrapper,
    #content .image-2025 .zoomWrapperImage,
    #content .image-2025 .zoomPad {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        max-height: none !important;
        display: block !important;
        float: none !important;
        margin: 0 !important;
        padding: 0 !important;
        list-style: none !important;
        border: 0 !important;
        background: #fff !important;
        position: relative !important;
        box-sizing: border-box !important;
    }

    /* Ảnh chính chiếm full cột trái */
    #content .image-2025 .jqzoom img,
    #content .image-2025 .thumbnail img,
    #content .image-2025 .thumb_li > a > img,
    #content .image-2025 .img_product > li > a > img,
    #content .image-2025 .img_product_mb > li > a > img,
    #content .image-2025 .zoomWrapperImage img {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        max-height: none !important;
        display: block !important;
        object-fit: contain !important;
        object-position: center center !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 1px solid #e5e5e5 !important;
        border-radius: 10px !important;
        background: #fff !important;
        box-sizing: border-box !important;
    }

    /* Không cho plugin zoom tạo box nổi che layout */
    #content .image-2025 .zoomPup,
    #content .image-2025 .zoomWindow,
    #content .image-2025 .zoomPreload { z-index: 10 !important; }

    /* Ảnh phụ */
    #content .image-2025 .thumnail_small {
        width: 100% !important;
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 10px !important;
        margin: 12px 0 0 0 !important;
        padding: 0 !important;
    }

    #content .image-2025 .image-additional {
        flex: 0 0 76px !important;
        width: 76px !important;
        height: 76px !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 1px solid #ddd !important;
        border-radius: 8px !important;
        overflow: hidden !important;
        background: #fff !important;
    }

    #content .image-2025 .image-additional a,
    #content .image-2025 .image-additional img {
        width: 100% !important;
        height: 100% !important;
        display: block !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
    }

    #content .image-2025 .image-additional img { object-fit: cover !important; }
}

/* ========== THÔNG TIN SẢN PHẨM ========== */
#content .title_product {
    font-size: 26px !important;
    line-height: 34px !important;
    font-weight: 700 !important;
    color: #222 !important;
    margin: 0 0 10px 0 !important;
    padding-bottom: 10px !important;
    border-bottom: 1px solid #e5e5e5 !important;
}

#content .review-ss {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 6px !important;
    margin: 6px 0 14px 0 !important;
    font-size: 15px !important;
    line-height: 22px !important;
}
#content .review-ss .rating { margin: 0 !important; padding: 0 !important; }
#content .review-ss .fa-stack { width: 16px !important; height: 16px !important; line-height: 16px !important; }
#content .review-ss a {text-decoration: none !important; }

#content .quantity-sale { font-size: 15px !important; color: #555 !important; margin: 0 0 8px 0 !important; }
#content .label-color { font-size: 15px !important; color: #333 !important; margin: 0 0 10px 0 !important; }
#content .label-color .special, #content .special {
    color: #e60000 !important;
    font-size: 32px !important;
    line-height: 40px !important;
    font-weight: 800 !important;
    margin-right: 8px !important;
}
#content .label-color span[style*="line-through"] { color: #999 !important; font-size: 18px !important; }

#content .special-price-box {
    width: 100% !important;
    display: block !important;
    background: #fff8e6 !important;
    border: 3px dashed #ff9800 !important;
    border-radius: 12px !important;
    padding: 12px 15px !important;
    margin: 10px 0 16px 0 !important;
    text-align: center !important;
}
#content .special-price-box h3 { color: #d70000 !important; font-size: 22px !important; line-height: 30px !important; margin: 0 0 6px 0 !important;}
#content .special-price-box .countdown { color: #d70000 !important; font-size: 20px !important; line-height: 28px !important; font-weight: 800 !important; }
#content .special-price-box p { color: #5f4b32 !important; font-size: 15px !important; margin: 4px 0 0 0 !important; }

/* ========== OPTION / SỐ LƯỢNG / NÚT ========== */
#content .act-pro {
    margin-top: 12px !important;
    padding-top: 12px !important;
    border-top: 1px solid #eee !important;
}
#content .act-pro .form-group { margin-bottom: 12px !important; }
#content .act-pro .control-label { display: block !important; font-size: 16px !important; font-weight: 700 !important; color: #222 !important; margin-bottom: 8px !important; }
#content .act-pro select.form-control { width: 100% !important; max-width: 320px !important; height: 42px !important; border-radius: 7px !important; box-shadow: none !important; }

#content .act-pro .form-group .radio {
    float: none !important;
    display: inline-block !important;
    width: auto !important;
    height: auto !important;
    margin: 0 8px 10px 0 !important;
    vertical-align: top !important;
}
#content .act-pro .form-group .radio label,
#content .act-pro .form-group .checkbox label {
    min-width: 132px !important;
    min-height: 46px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 8px 12px !important;
    border: 1px solid #ddd !important;
    border-radius: 8px !important;
    background: #fff !important;
    font-size: 15px !important;
    line-height: 20px !important;
    cursor: pointer !important;
    white-space: normal !important;
}
#content .act-pro .form-group .radio label:hover,
#content .act-pro .form-group .checkbox label:hover { border-color: #2a7a2a !important; background: #f6fff3 !important; }
#content .act-pro .img-thumbnail { width: 18px !important; height: 18px !important; object-fit: cover !important; padding: 0 !important; border-radius: 3px !important; border: 1px solid #ddd !important; }

#content .quantity {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 16px 0 !important;
}
#content .quantity > label { margin: 0 !important; font-size: 16px !important; font-weight: 700 !important; }
#content .quantity .input-group { width: 130px !important; display: flex !important; }
#content .quantity .input-group-addon { width: 38px !important; height: 38px !important; padding: 0 !important; line-height: 38px !important; text-align: center !important; cursor: pointer !important; }
#content .quantity input { height: 38px !important; box-shadow: none !important; }

#content .phone_pro {
    width: 100% !important;
    max-width: 320px !important;
    margin: 16px 0 !important;
    padding: 10px 12px !important;
    background: #f8fff5 !important;
    border: 1px solid #d9efd2 !important;
    border-radius: 8px !important;
    text-align: center !important;
    color: #333 !important;
    font-size: 15px !important;
}
#content .phone_pro .hotline { color: #e60000 !important; font-size: 24px !important; line-height: 28px !important; font-weight: 800 !important; }

#content .buy-product {
    display: flex !important;
    align-items: stretch !important;
    gap: 10px !important;
    width: 100% !important;
    max-width: 430px !important;
    margin: 12px 0 0 0 !important;
}
#content .buy-product button {
    flex: 1 1 0 !important;
    width: auto !important;
    height: 64px !important;
    min-height: 64px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: column !important;
    padding: 8px 10px !important;
    margin: 0 !important;
    border: none !important;
    border-radius: 8px !important;
    font-weight: 800 !important;
    text-align: center !important;
    line-height: 20px !important;
}
#content #button-cart { background: #e60000 !important; color: #fff !important; font-size: 18px !important; }
#content #button-cart-add { background: #2a7a2a !important; color: #fff !important; font-size: 14px !important; }
#content #button-cart-add .cart-add { font-size: 16px !important; line-height: 18px !important; }

/* ========== TABS / MÔ TẢ ========== */
#content .nav-tabs { margin-top: 25px !important; border-bottom: 2px solid #2a7a2a !important; }
#content .nav-tabs > li > a { font-size: 16px !important; font-weight: 700 !important; color: #333 !important; }
#content .nav-tabs > li.active > a,
#content .nav-tabs > li.active > a:hover,
#content .nav-tabs > li.active > a:focus { background: #2a7a2a !important; color: #fff !important; border-color: #2a7a2a !important; }
#content #tab-description { font-size: 16px !important; line-height: 1.75 !important; color: #222 !important; }
#content #tab-description img {
    display: block !important;
    max-width: 100% !important;
    width: auto !important;
    height: auto !important;
    margin: 18px auto !important;
    object-fit: contain !important;
    box-sizing: border-box !important;
}
#content .toggle-btn { display: block !important; margin: 12px auto 20px auto !important; color: #2a7a2a !important; border: 1px solid #d5e8d0 !important; background: #f4fff1 !important; font-size: 16px !important; padding: 9px 18px !important; border-radius: 8px !important; }


/* ========== PRODUCT BOX PHÍA DƯỚI ========== */
#content .product-thumb_bottom {
    height: 100% !important;
    background: #fff !important;
    border: 1px solid #ddd !important;
    overflow: hidden !important;
    margin-bottom: 22px !important;
}
#content .product-thumb_bottom .image { width: 100% !important; height: 283px !important; overflow: hidden !important; background: #fff !important; }
#content .product-thumb_bottom .image a,
#content .product-thumb_bottom .image img { display: block !important; width: 100% !important; height: 100% !important; }
#content .product-thumb_bottom .image img { object-fit: cover !important; }
#content .product-thumb_bottom .caption { padding: 10px 12px !important; }
#content .product-thumb_bottom .caption h3 { height: 52px !important; line-height: 26px !important; overflow: hidden !important; margin: 0 0 8px 0 !important; font-size: 16px !important; }
#content .product-thumb_bottom .caption h3 a { color: #333 !important; font-weight: 600 !important; }
#content .product-thumb_bottom .price { min-height: 46px !important; margin: 0 !important; color: #e60000 !important; font-size: 18px !important; font-weight: 800 !important; }
#content .product-thumb_bottom .price-old { color: #999 !important; font-size: 15px !important; text-decoration: line-through !important; }

/* ========== TABLET 768 - 991 ========== */
@media (min-width: 768px) and (max-width: 991px) {
    #content .product-row {
        display: grid !important;
        grid-template-columns: minmax(0, 48%) minmax(0, 52%) !important;
        column-gap: 18px !important;
        align-items: start !important;
        width: 100% !important;
    }
    #content .product-row > .image-2025,
    #content .product-row > .product_info,
    #content .product-row > .product_info_mb { width: 100% !important; max-width: 100% !important; min-width: 0 !important; float: none !important; }
    #content .image-2025 .thumbnails,
    #content .image-2025 .img_product,
    #content .image-2025 .img_product_mb,
    #content .image-2025 .jqzoom,
    #content .image-2025 .thumbnail,
    #content .image-2025 .zoomWrapper,
    #content .image-2025 .zoomWrapperImage,
    #content .image-2025 .zoomPad { width: 100% !important; max-width: 100% !important; height: auto !important; display: block !important; }
    #content .image-2025 img { max-width: 100% !important; height: auto !important; }
    #content .title_product { font-size: 22px !important; line-height: 30px !important; }
    #content .label-color .special, #content .special { font-size: 26px !important; line-height: 34px !important; }
    #content .special-price-box h3 { font-size: 19px !important; line-height: 26px !important; }
    #content .buy-product { max-width: 100% !important; }
    #content .product-thumb_bottom .image { height: 350px !important; }
}

/* ========== MOBILE <= 767 ========== */
@media (max-width: 767px) {
    .container { padding-left: 10px !important; padding-right: 10px !important; }
    #content { width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; }
    #content .product-row { display: block !important; width: 100% !important; margin-bottom: 16px !important; }
    #content .product-row > .image-2025,
    #content .product-row > .product_info,
    #content .product-row > .product_info_mb { width: 100% !important; max-width: 100% !important; min-width: 0 !important; float: none !important; display: block !important; }
    #content .product-row > .image-2025 { margin-bottom: 14px !important; }

    #content .image-2025 .thumbnails,
    #content .image-2025 .img_product,
    #content .image-2025 .img_product_mb,
    #content .image-2025 .thumb_li,
    #content .image-2025 .jqzoom,
    #content .image-2025 .thumbnail { width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; }
    #content .image-2025 .jqzoom img,
    #content .image-2025 .thumbnail img,
    #content .image-2025 .thumb_li img,
    #content .image-2025 .img_product img,
    #content .image-2025 .img_product_mb img { width: 100% !important; max-width: 100% !important; height: auto !important; border-radius: 8px !important; display: block !important; }

    #content .thumnail_small { flex-wrap: nowrap !important; overflow-x: auto !important; gap: 7px !important; padding-bottom: 5px !important; -webkit-overflow-scrolling: touch !important; }
    #content .image-additional { flex: 0 0 62px !important; width: 62px !important; height: 62px !important; border-radius: 7px !important; }

    #content .title_product { font-size: 20px !important; line-height: 28px !important; margin-bottom: 8px !important; }
    #content .review-ss { font-size: 14px !important; line-height: 22px !important; margin-bottom: 8px !important; }
    #content .quantity-sale { font-size: 14px !important; }
    #content .label-color .special, #content .special { font-size: 26px !important; line-height: 34px !important; }
    #content .label-color span[style*="line-through"] { font-size: 16px !important; }

    #content .special-price-box { padding: 10px !important; border-width: 2px !important; border-radius: 10px !important; }
    #content .special-price-box h3 { font-size: 18px !important; line-height: 25px !important; }
    #content .special-price-box .countdown { font-size: 18px !important; line-height: 26px !important; }
    #content .special-price-box p { font-size: 14px !important; }

    #content .act-pro select.form-control { max-width: 100% !important; width: 100% !important; }
    #content .act-pro .form-group .radio { display: block !important; width: 100% !important; margin: 0 0 8px 0 !important; }
    #content .act-pro .form-group .radio label,
    #content .act-pro .form-group .checkbox label { width: 100% !important; min-width: 0 !important; justify-content: flex-start !important; font-size: 14px !important; }

    #content .quantity { justify-content: space-between !important; margin-top: 10px !important; }
    #content .quantity .input-group { width: 135px !important; }
    #content .phone_pro { max-width: 100% !important; margin: 14px 0 !important; font-size: 14px !important; }
    #content .phone_pro .hotline { font-size: 24px !important; }
    #content .buy-product { max-width: 100% !important; display: flex !important; gap: 8px !important; }
    #content .buy-product button { height: 58px !important; min-height: 58px !important; padding: 6px 8px !important; }
    #content #button-cart { font-size: 17px !important; }
    #content #button-cart-add { font-size: 13px !important; }

    #content .nav-tabs { display: flex !important; flex-wrap: nowrap !important; overflow-x: auto !important; margin-top: 18px !important; }
    #content .nav-tabs > li { flex: 0 0 auto !important; }
    #content .nav-tabs > li > a { font-size: 14px !important; padding: 10px 12px !important; }
    #content #tab-description { font-size: 15px !important; line-height: 1.7 !important; }

    #content #tab-review, #content .tab-pane1 { padding: 12px !important; }
    #content .heading_title.viewed { font-size: 18px !important; line-height: 26px !important; margin: 18px 0 12px 0 !important; }
    #content .product-thumb_bottom { margin-bottom: 18px !important; }
    #content .product-thumb_bottom .image { height: 250px !important; }
    #content .product-thumb_bottom .caption { padding: 8px 9px !important; }
    #content .product-thumb_bottom .caption h3 { height: 44px !important; line-height: 22px !important; font-size: 14px !important; }
    #content .product-thumb_bottom .price { font-size: 16px !important; min-height: 42px !important; }
}

/* ========== MOBILE NHỎ <= 480 ========== */
@media (max-width: 480px) {
    #content .title_product { font-size: 19px !important; line-height: 27px !important; }
    #content .label-color .special, #content .special { font-size: 24px !important; line-height: 32px !important; }
    #content .image-additional { flex-basis: 58px !important; width: 58px !important; height: 58px !important; }
    #content .product-thumb_bottom .image { height: 191px !important; }
    #content .product-thumb_bottom .caption h3 { font-size: 13.5px !important; }
}


/* ==================================================
   FINAL COMPACT FIX 08/06/2026
   Tối ưu lại box option, số lượng, hotline, nút mua
   Giảm diện tích thừa, ảnh 50%, hiển thị đều trên mọi thiết bị
================================================== */

/* Ép chắc layout desktop: 50% ảnh / 50% thông tin */
@media (min-width: 992px) {
    #content .product-row {
        display: grid !important;
        grid-template-columns: minmax(0, 50%) minmax(0, 50%) !important;
        gap: 28px !important;
        align-items: start !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    #content .product-row > .image-2025,
    #content .product-row > .product_info,
    #content .product-row > .product_info_mb {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        float: none !important;
        flex: none !important;
    }

    #content .image-2025 .thumbnails,
    #content .image-2025 .img_product,
    #content .image-2025 .img_product_mb,
    #content .image-2025 .thumb_li,
    #content .image-2025 .jqzoom,
    #content .image-2025 .thumbnail,
    #content .image-2025 .zoomWrapper,
    #content .image-2025 .zoomWrapperImage,
    #content .image-2025 .zoomPad {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        display: block !important;
        float: none !important;
        margin: 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    #content .image-2025 .jqzoom img,
    #content .image-2025 .thumbnail img,
    #content .image-2025 .thumb_li img,
    #content .image-2025 .img_product img,
    #content .image-2025 .img_product_mb img,
    #content .image-2025 .zoomWrapper img,
    #content .image-2025 .zoomPad img {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        display: block !important;
        object-fit: contain !important;
        margin: 0 !important;
        padding: 0 !important;
    }
}

/* Khối thao tác mua hàng gọn lại */
#content .act-pro {
    width: 100% !important;
    max-width: 560px !important;
    margin-top: 10px !important;
    padding-top: 10px !important;
}

#content .act-pro .form-group {
    margin-bottom: 10px !important;
    clear: both !important;
}

#content .act-pro .control-label {
    margin-bottom: 6px !important;
    line-height: 22px !important;
}

/* Select option gọn, cùng trục với nhóm option */
#content .act-pro select.form-control {
    width: 100% !important;
    max-width: 360px !important;
    height: 40px !important;
    line-height: 40px !important;
    padding: 6px 12px !important;
}

/* Nhóm radio/checkbox hiển thị dạng grid để không bị xếp dọc tốn diện tích */
#content .act-pro .form-group div[id^="input-option"] {
    width: 100% !important;
    max-width: 520px !important;
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(145px, 1fr)) !important;
    gap: 8px !important;
    align-items: stretch !important;
}

#content .act-pro .form-group div[id^="input-option"] .clear {
    display: none !important;
}

#content .act-pro .form-group .radio,
#content .act-pro .form-group .checkbox {
    float: none !important;
    width: auto !important;
    height: auto !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
}

#content .act-pro .form-group .radio label,
#content .act-pro .form-group .checkbox label {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 40px !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 7px !important;
    padding: 7px 10px !important;
    margin: 0 !important;
    border: 1px solid #ddd !important;
    border-radius: 8px !important;
    background: #fff !important;
    font-size: 15px !important;
    line-height: 20px !important;
    color: #222 !important;
    cursor: pointer !important;
    white-space: normal !important;
    box-sizing: border-box !important;
}

#content .act-pro .form-group .radio input[type="radio"],
#content .act-pro .form-group .checkbox input[type="checkbox"] {
    flex: 0 0 auto !important;
    margin: 0 !important;
}

#content .act-pro .form-group .radio label:hover,
#content .act-pro .form-group .checkbox label:hover {
    border-color: #2a7a2a !important;
    background: #f6fff3 !important;
}

#content .act-pro .form-group .radio input[type="radio"]:checked + img,
#content .act-pro .form-group .radio input[type="radio"]:checked + span {
    outline: none !important;
}

#content .act-pro .img-thumbnail {
    flex: 0 0 18px !important;
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    min-height: 18px !important;
    object-fit: cover !important;
    padding: 0 !important;
    border-radius: 3px !important;
    border: 1px solid #ddd !important;
}

/* Số lượng gọn, không tách quá xa */
#content .quantity {
    width: 100% !important;
    max-width: 360px !important;
    display: grid !important;
    grid-template-columns: 90px 132px !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 12px 0 !important;
}

#content .quantity > label {
    margin: 0 !important;
    line-height: 38px !important;
}

#content .quantity .input-group {
    width: 132px !important;
    display: grid !important;
    grid-template-columns: 38px 56px 38px !important;
}

#content .quantity .input-group-addon,
#content .quantity input {
    height: 38px !important;
    line-height: 38px !important;
}

/* Hotline và nút mua về cùng trục, giảm khoảng trắng */
#content .phone_pro {
    width: 100% !important;
    max-width: 360px !important;
    margin: 12px 0 10px 0 !important;
    padding: 8px 10px !important;
}

#content .phone_pro .hotline {
    font-size: 23px !important;
    line-height: 27px !important;
}

#content .buy-product {
    width: 100% !important;
    max-width: 430px !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
    margin: 10px 0 0 0 !important;
    align-items: stretch !important;
}

#content .buy-product button {
    width: 100% !important;
    height: 58px !important;
    min-height: 58px !important;
    padding: 6px 10px !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: column !important;
    line-height: 18px !important;
    white-space: normal !important;
}

#content #button-cart {
    font-size: 18px !important;
}

#content #button-cart-add {
    font-size: 13.5px !important;
}

#content #button-cart-add .cart-add {
    font-size: 15px !important;
    line-height: 17px !important;
}

/* Tablet: giữ 2 cột, option vẫn gọn */
@media (min-width: 768px) and (max-width: 991px) {
    #content .act-pro {
        max-width: 100% !important;
    }

    #content .act-pro .form-group div[id^="input-option"] {
        max-width: 100% !important;
        grid-template-columns: repeat(auto-fit, minmax(135px, 1fr)) !important;
        gap: 7px !important;
    }

    #content .act-pro .form-group .radio label,
    #content .act-pro .form-group .checkbox label {
        min-height: 38px !important;
        padding: 7px 9px !important;
        font-size: 14px !important;
    }

    #content .phone_pro,
    #content .buy-product,
    #content .act-pro select.form-control {
        max-width: 100% !important;
    }
}

/* Mobile: option 2 cột để tiết kiệm chiều cao; nút bấm rõ ràng */
@media (max-width: 767px) {
    #content .act-pro {
        max-width: 100% !important;
        padding-top: 8px !important;
    }

    #content .act-pro .form-group {
        margin-bottom: 9px !important;
    }

    #content .act-pro .form-group div[id^="input-option"] {
        max-width: 100% !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 7px !important;
    }

    #content .act-pro .form-group .radio,
    #content .act-pro .form-group .checkbox {
        display: block !important;
        width: auto !important;
        margin: 0 !important;
    }

    #content .act-pro .form-group .radio label,
    #content .act-pro .form-group .checkbox label {
        width: 100% !important;
        min-height: 40px !important;
        padding: 7px 8px !important;
        font-size: 14px !important;
        line-height: 18px !important;
    }

    #content .quantity {
        max-width: 100% !important;
        grid-template-columns: 85px 132px !important;
        justify-content: start !important;
        margin: 10px 0 !important;
    }

    #content .phone_pro {
        max-width: 100% !important;
        margin: 10px 0 !important;
    }

    #content .buy-product {
        max-width: 100% !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 8px !important;
    }

    #content .buy-product button {
        height: 56px !important;
        min-height: 56px !important;
        padding: 6px 8px !important;
    }
}

/* Mobile rất nhỏ: option 1 cột để không vỡ chữ */
@media (max-width: 380px) {
    #content .act-pro .form-group div[id^="input-option"] {
        grid-template-columns: 1fr !important;
    }

    #content .buy-product {
        grid-template-columns: 1fr !important;
    }

    #content .buy-product button {
        height: 52px !important;
        min-height: 52px !important;
    }
}

/* ==================================================
   FINAL FIX 08/06 - SỐ LƯỢNG + HOTLINE + NÚT MUA
   Mục tiêu: gom cùng trục, không lệch, không dư khoảng trắng
================================================== */
#content #product > .form-group {
    width: 100% !important;
    max-width: 430px !important;
    display: block !important;
    margin: 14px 0 0 0 !important;
    padding: 0 !important;
    float: none !important;
    clear: both !important;
    text-align: left !important;
}

#content #product > .form-group .clear {
    display: none !important;
    clear: none !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Số lượng: label + cụm nút nằm cùng hàng, không bị tách */
#content #product .quantity {
    width: 100% !important;
    max-width: 430px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 16px !important;
    margin: 10px 0 12px 0 !important;
    padding: 0 !important;
    float: none !important;
    clear: both !important;
    text-align: left !important;
}

#content #product .quantity > label {
    width: 88px !important;
    min-width: 88px !important;
    max-width: 88px !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 38px !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    color: #222 !important;
    white-space: nowrap !important;
}

#content #product .quantity .input-group {
    width: 140px !important;
    min-width: 140px !important;
    max-width: 140px !important;
    height: 38px !important;
    display: inline-flex !important;
    align-items: stretch !important;
    border-collapse: separate !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

#content #product .quantity .input-group-addon,
#content #product .quantity .qc-product-qantity,
#content #product .quantity input#quantity {
    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;
    line-height: 38px !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    box-shadow: none !important;
    border-color: #ddd !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    text-align: center !important;
}

#content #product .quantity .input-group-addon {
    flex: 0 0 38px !important;
    width: 38px !important;
    min-width: 38px !important;
    max-width: 38px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #f7f7f7 !important;
    cursor: pointer !important;
}

#content #product .quantity .qc-product-qantity,
#content #product .quantity input#quantity {
    flex: 0 0 64px !important;
    width: 64px !important;
    min-width: 64px !important;
    max-width: 64px !important;
    display: block !important;
    border-left: 0 !important;
    border-right: 0 !important;
}

/* Hotline: kéo về cùng trục với số lượng và nút, không lệch sang phải */
#content #product .phone_pro {
    width: 100% !important;
    max-width: 430px !important;
    min-height: 70px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    float: none !important;
    clear: both !important;
    margin: 12px 0 12px 0 !important;
    padding: 10px 12px !important;
    background: #f8fff5 !important;
    border: 1px solid #cfeec8 !important;
    border-radius: 10px !important;
    text-align: center !important;
    box-sizing: border-box !important;
}

#content #product .phone_pro span:first-child {
    display: block !important;
    font-size: 15px !important;
    line-height: 20px !important;
    font-weight: 600 !important;
    color: #333 !important;
}

#content #product .phone_pro .hotline {
    display: block !important;
    color: #e60000 !important;
    font-size: 26px !important;
    line-height: 30px !important;
    font-weight: 900 !important;
    letter-spacing: .2px !important;
}

/* Nút mua: cùng chiều rộng với hotline, đều hàng */
#content #product .buy-product {
    width: 100% !important;
    max-width: 430px !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
    align-items: stretch !important;
    float: none !important;
    clear: both !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

#content #product .buy-product button,
#content #product .buy-product .btn,
#content #button-cart,
#content #button-cart-add {
    width: 100% !important;
    height: 60px !important;
    min-height: 60px !important;
    max-height: 60px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: column !important;
    margin: 0 !important;
    padding: 7px 10px !important;
    border: 0 !important;
    border-radius: 9px !important;
    box-sizing: border-box !important;
    text-align: center !important;
    line-height: 18px !important;
    white-space: normal !important;
    box-shadow: 0 2px 5px rgba(0,0,0,.18) !important;
}

#content #button-cart {
    background: #e60000 !important;
    color: #fff !important;
    font-size: 18px !important;
    font-weight: 900 !important;
}

#content #button-cart-add {
    background: #2a7a2a !important;
    color: #fff !important;
    font-size: 13px !important;
    font-weight: 800 !important;
}

#content #button-cart-add .cart-add {
    font-size: 15px !important;
    line-height: 17px !important;
    
}

/* Desktop: giữ cụm này nằm gọn trong cột thông tin, không trôi sang giữa trang */
@media (min-width: 992px) {
    #content #product > .form-group,
    #content #product .quantity,
    #content #product .phone_pro,
    #content #product .buy-product {
        margin-left: 0 !important;
        margin-right: auto !important;
    }
}

/* Tablet */
@media (min-width: 768px) and (max-width: 991px) {
    #content #product > .form-group,
    #content #product .quantity,
    #content #product .phone_pro,
    #content #product .buy-product {
        max-width: 100% !important;
    }
}

/* Mobile: giảm chiều cao, vẫn rõ ràng */
@media (max-width: 767px) {
    #content #product > .form-group {
        max-width: 100% !important;
        margin-top: 10px !important;
    }

    #content #product .quantity {
        max-width: 100% !important;
        gap: 10px !important;
        margin: 8px 0 10px 0 !important;
    }

    #content #product .quantity > label {
        width: 78px !important;
        min-width: 78px !important;
        max-width: 78px !important;
        font-size: 15px !important;
    }

    #content #product .quantity .input-group {
        width: 132px !important;
        min-width: 132px !important;
        max-width: 132px !important;
    }

    #content #product .quantity .qc-product-qantity,
    #content #product .quantity input#quantity {
        flex-basis: 56px !important;
        width: 56px !important;
        min-width: 56px !important;
        max-width: 56px !important;
    }

    #content #product .phone_pro {
        max-width: 100% !important;
        min-height: 42px !important;
        margin: 10px 0 !important;
        padding: 8px 10px !important;
    }

    #content #product .phone_pro .hotline {
        font-size: 24px !important;
        line-height: 28px !important;
    }

    #content #product .buy-product {
        max-width: 100% !important;
        gap: 8px !important;
    }

    #content #product .buy-product button,
    #content #button-cart,
    #content #button-cart-add {
        height: 56px !important;
        min-height: 56px !important;
        max-height: 56px !important;
    }
}

/* Mobile rất nhỏ: nút mua về 1 cột để không vỡ chữ */
@media (max-width: 380px) {
    #content #product .buy-product {
        grid-template-columns: 1fr !important;
    }
}

/* ==================================================
   FINAL PATCH 08/06 - REVIEW + PRICE + SPECIAL BOX
   Fix: đánh giá/so sánh cùng hàng, giá cũ cùng hàng giá bán,
   box giá đặc biệt thêm padding top
================================================== */

/* Đánh giá + so sánh sản phẩm cùng 1 hàng */
#content .review-ss {
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    margin: 8px 0 16px 0 !important;
    padding: 0 !important;
    font-size: 16px !important;
    line-height: 24px !important;
    color: #333 !important;
}

#content .review-ss a {
    display: inline-flex !important;
    align-items: center !important;
    line-height: 24px !important;
    text-decoration: none !important;
}

#content .review-ss .rating,
#content .review-ss .rating p {
    display: inline-flex !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 24px !important;
}

#content .review-ss .rating p {
    gap: 2px !important;
}

#content .review-ss .fa-stack {
    width: 18px !important;
    height: 18px !important;
    line-height: 18px !important;
    font-size: 14px !important;
}

#content .review-ss .fa-star,
#content .review-ss .fa-star-o {
    line-height: 18px !important;
}

#content .review-ss > a:last-child {
    white-space: nowrap !important;
}

/* Giá bán + giá cũ cùng 1 hàng, thẳng hàng chân chữ */
#content .label-color {
    display: flex !important;
    align-items: baseline !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
    margin: 0 0 10px 0 !important;
    padding: 0 !important;
    line-height: normal !important;
}

#content .label-color .special,
#content .special {
    display: inline-block !important;
    color: #e60000 !important;
    font-size: 40px !important;
    line-height: 54px !important;
    font-weight: 800 !important;
    margin: 0 !important;
    padding: 0 !important;
    text-shadow: 1px 2px 2px rgba(0,0,0,0.18) !important;
}

#content .label-color span[style*="line-through"] {
    display: inline-block !important;
    color: #999 !important;
    font-size: 30px !important;
    line-height: 36px !important;
    font-weight: 400 !important;
    margin: 0 !important;
    padding: 0 !important;
    text-decoration: line-through !important;
    vertical-align: baseline !important;
}

/* Box giá đặc biệt hôm nay */
#content .special-price-box {
    width: 100% !important;
    margin: 8px 0 22px 0 !important;
    padding: 26px 18px 22px 18px !important;
    background: #fff8e6 !important;
    border: 4px dashed #ff9800 !important;
    border-radius: 14px !important;
    text-align: center !important;
    box-sizing: border-box !important;
}

#content .special-price-box h3 {
    margin: 0 0 14px 0 !important;
    padding: 0 !important;
    color: #d70000 !important;
    font-size: 25px !important;
    line-height: 42px !important;
    
}

#content .special-price-box .countdown {
    margin: 0 0 12px 0 !important;
    padding: 0 !important;
    color: #d70000 !important;
    font-size: 30px !important;
    line-height: 33px !important;
}

#content .special-price-box p {
    margin: 0 !important;
    padding: 0 !important;
    color: #6c4c3b !important;
    font-size: 22px !important;
    line-height: 30px !important;
}

/* Tablet */
@media (min-width: 768px) and (max-width: 991px) {
    #content .review-ss {
        font-size: 15px !important;
        gap: 8px !important;
    }

    #content .label-color .special,
    #content .special {
        font-size: 38px !important;
        line-height: 46px !important;
    }

    #content .label-color span[style*="line-through"] {
        font-size: 24px !important;
        line-height: 32px !important;
    }

    #content .special-price-box {
        padding: 22px 14px 18px 14px !important;
    }

    #content .special-price-box h3 {
        font-size: 26px !important;
        line-height: 34px !important;
    }

    #content .special-price-box .countdown {
        font-size: 24px !important;
        line-height: 32px !important;
    }

    #content .special-price-box p {
        font-size: 18px !important;
        line-height: 26px !important;
    }
}

/* Mobile */
@media (max-width: 767px) {
    #content .review-ss {
        flex-wrap: wrap !important;
        gap: 6px !important;
        font-size: 14px !important;
        line-height: 22px !important;
        margin-bottom: 12px !important;
    }

    #content .review-ss a,
    #content .review-ss .rating,
    #content .review-ss .rating p {
        line-height: 22px !important;
    }

    #content .review-ss .fa-stack {
        width: 16px !important;
        height: 16px !important;
        line-height: 16px !important;
        font-size: 12px !important;
    }

    #content .label-color {
        gap: 8px !important;
        margin-bottom: 8px !important;
    }

    #content .label-color .special,
    #content .special {
        font-size: 34px !important;
        line-height: 42px !important;
    }

    #content .label-color span[style*="line-through"] {
        font-size: 20px !important;
        line-height: 28px !important;
    }

    #content .special-price-box {
        margin: 8px 0 16px 0 !important;
        padding: 18px 10px 16px 10px !important;
        border-width: 3px !important;
        border-radius: 12px !important;
    }

    #content .special-price-box h3 {
        font-size: 20px !important;
        line-height: 30px !important;
        margin-bottom: 10px !important;
    }

    #content .special-price-box .countdown {
        font-size: 20px !important;
        line-height: 28px !important;
        margin-bottom: 8px !important;
    }

    #content .special-price-box p {
        font-size: 15px !important;
        line-height: 22px !important;
    }
}

/* ==================================================
   FINAL STANDARD MOBILE AXIS FIX - 09/06/2026
   Mục tiêu: trên mobile tất cả box dóng thẳng 1 trục,
   không cộng dồn padding, khoảng lề điện thoại hợp lý.
================================================== */
@media (max-width: 767px) {

    /* Chỉ để 1 lớp lề ngoài duy nhất cho trang chi tiết */
    body #content {
        width: 100% !important;
        max-width: 100% !important;
        
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box !important;
    }

    body #content > .row,
    body #content .product-row {
        width: 100% !important;
        max-width: 100% !important;
        display: block !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box !important;
    }

    /* Ảnh và thông tin sản phẩm phải cùng trục trái/phải */
    body #content .product-row > .image-2025,
    body #content .product-row > .product_info,
    body #content .product-row > .product_info_mb {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        float: none !important;
        clear: both !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box !important;
    }

    body #content .product-row > .image-2025 {
        margin-bottom: 12px !important;
    }

    /* Không cho các lớp ảnh tự thụt vào */
    body #content .image-2025 .thumbnails,
    body #content .image-2025 .img_product,
    body #content .image-2025 .img_product_mb,
    body #content .image-2025 .thumb_li,
    body #content .image-2025 li,
    body #content .image-2025 .jqzoom,
    body #content .image-2025 .thumbnail,
    body #content .image-2025 .zoomWrapper,
    body #content .image-2025 .zoomPad,
    body #content .image-2025 .zoomWrapperImage {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        float: none !important;
        box-sizing: border-box !important;
    }

    body #content .image-2025 img {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Tất cả block thông tin không được cộng padding ngang */
    body #content .product_info,
    body #content .product_info_mb,
    body #content .product_info .title_product,
    body #content .product_info_mb .title_product,
    body #content .product_info .review-ss,
    body #content .product_info_mb .review-ss,
    body #content .product_info .list-unstyled,
    body #content .product_info_mb .list-unstyled,
    body #content .product_info .quantity-sale,
    body #content .product_info_mb .quantity-sale,
    body #content .product_info .label-color,
    body #content .product_info_mb .label-color,
    body #content .product_info .act-pro,
    body #content .product_info_mb .act-pro,
    body #content .product_info .form-group,
    body #content .product_info_mb .form-group,
    body #content .product_info .quantity,
    body #content .product_info_mb .quantity,
    body #content .product_info .phone_pro,
    body #content .product_info_mb .phone_pro,
    body #content .product_info .buy-product,
    body #content .product_info_mb .buy-product {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box !important;
    }

    /* Box có nền/viền vẫn có padding bên trong, nhưng cạnh ngoài giữ thẳng hàng */
    body #content .special-price-box {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding: 16px 10px 14px 10px !important;
        box-sizing: border-box !important;
    }

    body #content .phone_pro {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding: 10px !important;
        box-sizing: border-box !important;
    }

    /* Option không thụt lệch */
    body #content .act-pro .radio,
    body #content .act-pro .checkbox {
        width: 100% !important;
        float: none !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box !important;
    }

    body #content .act-pro .radio label,
    body #content .act-pro .checkbox label {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Cụm số lượng gọn và cùng trục */
    body #content .quantity {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 10px !important;
    }

    body #content .quantity .input-group {
        width: 132px !important;
        flex: 0 0 132px !important;
        margin: 0 !important;
    }

    /* Nút mua cùng trục với các box trên */
    body #content .buy-product {
        display: flex !important;
        gap: 8px !important;
    }

    body #content .buy-product button {
        flex: 1 1 0 !important;
        width: auto !important;
        min-width: 0 !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }

    /* Tab, mô tả, review cũng theo cùng trục #content */
    body #content .nav-tabs,
    body #content .tab-content,
    body #content #tab-description,
    body #content .tab-pane,
    body #content .tab-pane1,
    body #content #tab-review,
    body #content .heading_title.viewed {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box !important;
    }

    body #content .tab-content,
    body #content #tab-description {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    body #content #tab-review,
    body #content .tab-pane1 {
        padding: 10px !important;
    }
}
.box-cate-new{
     border: 1px solid #e5e7eb;
    border-radius: 10px;
    margin-bottom: 25px;
}
.box-cate-new a img{
    width: 100% !important; max-width: 100% !important; height: auto !important; margin: 0px auto; padding: 0px !important; display: block;
    border-radius: 8px 8px 0px 0px;
    overflow: hidden;
}
.kito-video-center {
  width: 100%;
  max-width: 800px;
  aspect-ratio: 16 / 9;
  margin: 25px auto;
  border-radius: 10px;
  overflow: hidden;
}

.kito-video-center iframe {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
}
.info_padd{padding-bottom: 15px;}

    /* KITO: preview video trong khu vực ảnh phụ */
    .thumnail_small .image-additional-video .thumbnail {
        position: relative;
        display: block;
        overflow: hidden;
        background: #000;
        border-radius: 4px;
    }

    .thumnail_small .image-additional-video .kito-thumb-video {
        width: 100%;
        height: 100%;
        min-height: 72px;
        display: block;
        object-fit: cover;
        background: #000;
        pointer-events: none;
    }

    .thumnail_small .image-additional-video .kito-video-play {
        position: absolute;
        left: 50%;
        top: 50%;
        width: 34px;
        height: 34px;
        line-height: 34px;
        margin-left: -17px;
        margin-top: -17px;
        border-radius: 50%;
        background: rgba(0, 0, 0, 0.58);
        color: #fff;
        text-align: center;
        font-size: 15px;
        z-index: 2;
    }

    .thumnail_small .image-additional-video .kito-video-badge {
        position: absolute;
        left: 5px;
        bottom: 5px;
        padding: 2px 6px;
        border-radius: 3px;
        background: rgba(0, 0, 0, 0.7);
        color: #fff;
        font-size: 10px;
        line-height: 1.4;
        z-index: 2;
    }


    /* KITO: cố định box ảnh lớn để ảnh/video focus không bị nhảy kích thước */
    .image-2025 .thumb_li,
    .image-2025 .img_product_mb > li:first-child {
        width: 100%;
        height: 520px;
        max-width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        overflow: hidden;
        background: #fff;
        border-radius: 4px;
        box-sizing: border-box;
    }

    .image-2025 .thumb_li > a,
    .image-2025 .img_product_mb > li:first-child > a,
    .image-2025 .thumb_li .jqzoom,
    .image-2025 .thumb_li .thumbnail {
        width: 100%;
        height: 100%;
        display: flex !important;
        align-items: center;
        justify-content: center;
        overflow: hidden;
        box-sizing: border-box;
    }

    .image-2025 .thumb_li img,
    .image-2025 .img_product_mb > li:first-child img {
        width: 100%;
        height: 100%;
        max-width: 100%;
        max-height: 100%;
        object-fit: contain;
        display: block;
    }

    .image-2025 .thumb_li .zoomPad {
        width: 100% !important;
        height: 100% !important;
        display: flex !important;
        align-items: center;
        justify-content: center;
    }

    .image-2025 .thumb_li .zoomPad > img {
        width: 100% !important;
        height: 100% !important;
        object-fit: contain;
    }

    .kito-main-video-wrap {
        position: relative;
        width: 100%;
        height: 606px;
        max-width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        background: #000;
        border-radius: 4px;
        overflow: hidden;
        box-sizing: border-box;
    }

    .kito-main-video-wrap .kito-main-video {
        width: 100%;
        height: 100%;
        max-width: 100%;
        max-height: 100%;
        display: block;
        object-fit: contain;
        background: #000;
    }

    .kito-main-video-wrap .kito-main-video-badge {
        position: absolute;
        left: 10px;
        bottom: 10px;
        z-index: 2;
        padding: 4px 9px;
        border-radius: 4px;
        background: rgba(0, 0, 0, 0.72);
        color: #fff;
        font-size: 12px;
        line-height: 1.4;
        pointer-events: none;
    }

    .kito-video-modal-overlay {
        position: fixed;
        z-index: 99999;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        display: none;
        align-items: center;
        justify-content: center;
        padding: 15px;
        background: rgba(0, 0, 0, 0.78);
    }

    .kito-video-modal-overlay.active {
        display: flex;
    }

    .kito-video-modal-box {
        position: relative;
        width: 100%;
        max-width: 900px;
        background: #000;
        border-radius: 8px;
        overflow: hidden;
        box-shadow: 0 8px 30px rgba(0, 0, 0, 0.35);
    }

    .kito-video-modal-box video {
        width: 100%;
        max-height: 82vh;
        display: block;
        background: #000;
    }

    .kito-video-modal-close {
        position: absolute;
        top: 8px;
        right: 8px;
        z-index: 3;
        width: 34px;
        height: 34px;
        line-height: 31px;
        border: 0;
        border-radius: 50%;
        background: rgba(0, 0, 0, 0.65);
        color: #fff;
        font-size: 24px;
        cursor: pointer;
    }

    @media (max-width: 767px) {
        .thumnail_small .image-additional-video .kito-thumb-video {
            min-height: 58px;
        }

        .image-2025 .thumb_li,
        .image-2025 .img_product_mb > li:first-child,
        .kito-main-video-wrap {
            height: 360px;
        }

        .kito-video-modal-overlay {
            padding: 8px;
        }
    }

    @media (max-width: 420px) {
        .image-2025 .thumb_li,
        .image-2025 .img_product_mb > li:first-child,
        .kito-main-video-wrap {
            height: 320px;
        }
    }

.special-price-box {
  background: #fff8e6;
  border: 4px dashed orange;
  border-radius: 10px;
  padding: 15px;
  text-align: center;
  font-family: Arial, sans-serif;
  margin: 10px 0;
}
.special-price-box h3 {
  color: #d70000;
  margin: 0;
  font-size: 22px;
}
.special-price-box h3 span {
  font-weight: bold;
}
.special-price-box .countdown {
  font-size: 20px;
  font-weight: bold;
  color: #333;
  margin-top: 5px;
}
.special-price-box p {
  color: #5f4b32;
  margin-top: 5px;
}
/* KITO Product YouTube Video Embed - Final */
#tab-description .kito-video-embed,
#content #tab-description .kito-video-embed {
    position: relative !important;
    width: 100% !important;
    max-width: 760px !important;
    margin: 24px auto !important;
    background: #000 !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

#tab-description .kito-video-embed::before,
#content #tab-description .kito-video-embed::before {
    content: "" !important;
    display: block !important;
    padding-top: 56.25% !important;
}

#tab-description .kito-video-embed.kito-video-portrait,
#content #tab-description .kito-video-embed.kito-video-portrait {
    max-width: 420px !important;
}

#tab-description .kito-video-embed.kito-video-portrait::before,
#content #tab-description .kito-video-embed.kito-video-portrait::before {
    padding-top: 177.77% !important;
}

#tab-description .kito-video-embed iframe,
#content #tab-description .kito-video-embed iframe {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    border: 0 !important;
    display: block !important;
    background: #000 !important;
}

@media (max-width: 767px) {
    #tab-description .kito-video-embed,
    #content #tab-description .kito-video-embed {
        max-width: 100% !important;
        margin: 18px auto !important;
        border-radius: 8px !important;
    }

    #tab-description .kito-video-embed.kito-video-portrait,
    #content #tab-description .kito-video-embed.kito-video-portrait {
        max-width: 360px !important;
    }
}

@media (max-width: 420px) {
    #tab-description .kito-video-embed.kito-video-portrait,
    #content #tab-description .kito-video-embed.kito-video-portrait {
        max-width: 100% !important;
    }
}
    /* Khung nội dung có hiệu ứng mờ khi chưa mở rộng */
    #tab-description {
        height: 500px; /* Chiều cao mặc định */
        overflow: hidden;
        position: relative;
        transition: height 0.3s ease;
    }

    /* Gradient làm mờ phía dưới */
    #tab-description::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 80px;
        background: linear-gradient(to bottom, rgba(255,255,255,0), #fff);
        transition: opacity 0.3s ease;
        pointer-events: none;
    }

    /* Khi mở rộng thì bỏ hiệu ứng mờ */
    #tab-description.expanded::after {
        opacity: 0;
    }

    #tab-description.expanded {
        height: auto;
    }

    /* Style nút */
  .toggle-btn {
    display: inline-block;
    margin: 10px auto 0 auto; /* Căn giữa theo chiều ngang */
    color: blue;
    border: none;
    background: #eaeaea;
    font-size: 18px;
    padding: 8px 14px;
    border-radius: 6px;
    transition: background 0.3s;
    text-align: center;
}

/* Dùng thêm class bao nút để hỗ trợ căn giữa */
.toggle-btn-wrapper {
    text-align: center;
}
    .toggle-btn img {
        width: 16px;
        vertical-align: middle;
        margin-left: 4px;
    }

        /* Thiết lập khung nội dung */
        .tab-pane {
            height: 500px; /* Chiều cao mặc định */
            overflow: hidden;
            transition: height 0.3s ease;
        }
 
        /* Class mở rộng nội dung */
        .tab-pane.expanded {
            height: auto;
        }

/* =========================================================
   KITO REVIEW SUCCESS POPUP - RESPONSIVE CSS ONLY
   Phạm vi tuyệt đối: chỉ #kito-review-success-popup
   Không tác động box / button / text khác trên website.
   ========================================================= */

#kito-review-success-popup {
    box-sizing: border-box !important;
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;

    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    min-height: 100vh !important;

    margin: 0 !important;
    padding: 16px !important;

    align-items: center !important;
    justify-content: center !important;

    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;

    background: rgba(0, 0, 0, .55) !important;
}

/* Chỉ box trắng trực tiếp bên trong popup */
#kito-review-success-popup > div {
    box-sizing: border-box !important;

    width: 100% !important;
    max-width: 460px !important;
    min-width: 0 !important;

    height: auto !important;
    max-height: calc(100vh - 32px) !important;

    margin: auto !important;
    padding: 28px 24px !important;

    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;

    background: #fff !important;
    border-radius: 14px !important;
    text-align: center !important;

    white-space: normal !important;
    overflow-wrap: break-word !important;
    word-wrap: break-word !important;
}

/* Icon dấu tick - chỉ phần tử đầu tiên trong box popup */
#kito-review-success-popup > div > div:first-child {
    box-sizing: border-box !important;

    width: 58px !important;
    height: 58px !important;
    min-width: 58px !important;

    line-height: 58px !important;

    margin: 0 auto 14px !important;
    padding: 0 !important;

    border-radius: 50% !important;

    font-size: 34px !important;
    text-align: center !important;

    white-space: nowrap !important;
    overflow: hidden !important;
}

/* Tiêu đề popup - chỉ div thứ 2 trong box */
#kito-review-success-popup > div > div:nth-child(2) {
    box-sizing: border-box !important;

    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;

    margin: 0 0 10px !important;
    padding: 0 !important;

    font-size: 22px !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
    text-align: center !important;

    white-space: normal !important;
    overflow-wrap: break-word !important;
    word-wrap: break-word !important;
    word-break: normal !important;
    overflow: visible !important;
}

/* Nội dung popup */
#kito-review-success-popup #kito-review-success-message {
    box-sizing: border-box !important;

    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;

    margin: 0 0 22px !important;
    padding: 0 !important;

    font-size: 16px !important;
    line-height: 1.55 !important;
    font-weight: 400 !important;
    text-align: center !important;

    white-space: normal !important;
    overflow-wrap: break-word !important;
    word-wrap: break-word !important;
    word-break: normal !important;
    overflow: visible !important;
}

/* Nút Đóng - selector theo ID nên không ảnh hưởng .btn ở nơi khác */
#kito-review-success-popup #kito-review-success-close {
    box-sizing: border-box !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: auto !important;
    min-width: 130px !important;
    max-width: 100% !important;
    min-height: 44px !important;

    margin: 0 auto !important;
    padding: 10px 26px !important;

    font-size: 16px !important;
    line-height: 1.35 !important;
    text-align: center !important;

    white-space: nowrap !important;
}

/* Tablet và điện thoại */
@media screen and (max-width: 600px) {
    #kito-review-success-popup {
        padding: 12px !important;
    }

    #kito-review-success-popup > div {
        /*
         * Không dùng width:100% + padding theo content-box.
         * calc() + border-box bảo đảm popup luôn nằm trong viewport.
         */
        width: calc(100vw - 24px) !important;
        max-width: calc(100vw - 24px) !important;
        max-height: calc(100vh - 24px) !important;

        margin: auto !important;
        padding: 24px 18px 20px !important;

        border-radius: 12px !important;
    }

    #kito-review-success-popup > div > div:first-child {
        width: 54px !important;
        height: 54px !important;
        min-width: 54px !important;
        line-height: 54px !important;

        margin-bottom: 12px !important;

        font-size: 31px !important;
    }

    #kito-review-success-popup > div > div:nth-child(2) {
        margin-bottom: 8px !important;

        font-size: 20px !important;
        line-height: 1.3 !important;
    }

    #kito-review-success-popup #kito-review-success-message {
        margin-bottom: 18px !important;

        font-size: 15px !important;
        line-height: 1.5 !important;
    }

    #kito-review-success-popup #kito-review-success-close {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 46px !important;

        padding: 11px 16px !important;

        font-size: 16px !important;
    }
}

/* Điện thoại rất hẹp */
@media screen and (max-width: 380px) {
    #kito-review-success-popup {
        padding: 10px !important;
    }

    #kito-review-success-popup > div {
        width: calc(100vw - 20px) !important;
        max-width: calc(100vw - 20px) !important;
        max-height: calc(100vh - 20px) !important;

        padding: 21px 15px 17px !important;
    }

    #kito-review-success-popup > div > div:first-child {
        width: 50px !important;
        height: 50px !important;
        min-width: 50px !important;
        line-height: 50px !important;

        font-size: 29px !important;
    }

    #kito-review-success-popup > div > div:nth-child(2) {
        font-size: 18px !important;
        line-height: 1.3 !important;
    }

    #kito-review-success-popup #kito-review-success-message {
        font-size: 14px !important;
        line-height: 1.5 !important;
    }
}

/* Điện thoại xoay ngang / màn hình thấp */
@media screen and (max-height: 520px) {
    #kito-review-success-popup {
        align-items: flex-start !important;
        padding-top: 10px !important;
        padding-bottom: 10px !important;
    }

    #kito-review-success-popup > div {
        max-height: calc(100vh - 20px) !important;
        padding-top: 17px !important;
        padding-bottom: 17px !important;
    }

    #kito-review-success-popup > div > div:first-child {
        width: 44px !important;
        height: 44px !important;
        min-width: 44px !important;
        line-height: 44px !important;

        margin-bottom: 8px !important;

        font-size: 26px !important;
    }

    #kito-review-success-popup > div > div:nth-child(2) {
        margin-bottom: 5px !important;

        font-size: 18px !important;
    }

    #kito-review-success-popup #kito-review-success-message {
        margin-bottom: 12px !important;

        font-size: 14px !important;
        line-height: 1.4 !important;
    }

    #kito-review-success-popup #kito-review-success-close {
        min-height: 42px !important;
        padding-top: 8px !important;
        padding-bottom: 8px !important;
    }
}

/* Viewport động trên Safari/Chrome mobile */
@supports (height: 100dvh) {
    #kito-review-success-popup {
        height: 100dvh !important;
        min-height: 100dvh !important;
    }

    #kito-review-success-popup > div {
        max-height: calc(100dvh - 32px) !important;
    }

    @media screen and (max-width: 600px) {
        #kito-review-success-popup > div {
            max-height: calc(100dvh - 24px) !important;
        }
    }

    @media screen and (max-width: 380px), screen and (max-height: 520px) {
        #kito-review-success-popup > div {
            max-height: calc(100dvh - 20px) !important;
        }
    }
}

/* Safe-area iPhone. Chỉ ghi đè padding của overlay popup. */
@supports (padding: max(0px)) {
    #kito-review-success-popup {
        padding-top: max(16px, env(safe-area-inset-top)) !important;
        padding-right: max(16px, env(safe-area-inset-right)) !important;
        padding-bottom: max(16px, env(safe-area-inset-bottom)) !important;
        padding-left: max(16px, env(safe-area-inset-left)) !important;
    }

    @media screen and (max-width: 600px) {
        #kito-review-success-popup {
            padding-top: max(12px, env(safe-area-inset-top)) !important;
            padding-right: max(12px, env(safe-area-inset-right)) !important;
            padding-bottom: max(12px, env(safe-area-inset-bottom)) !important;
            padding-left: max(12px, env(safe-area-inset-left)) !important;
        }
    }

    @media screen and (max-width: 380px) {
        #kito-review-success-popup {
            padding-top: max(10px, env(safe-area-inset-top)) !important;
            padding-right: max(10px, env(safe-area-inset-right)) !important;
            padding-bottom: max(10px, env(safe-area-inset-bottom)) !important;
            padding-left: max(10px, env(safe-area-inset-left)) !important;
        }
    }
}
/* ==========================================================
   

