/*
 * CSS dành riêng cho điện thoại (Flatsome: màn hình dưới 550px).
 * Cập nhật 01/08/2026: bỏ khoảng bù 100px và các margin âm gây lệch bố cục.
 */

body.woocommerce .shop-sidebar .widget {
    display: none;
}

.product-main {
    padding: 28px 0 36px;
}

.woocommerce-form-coupon-toggle,
.woocommerce-notices-wrapper,
.woocommerce-order-details,
.shop_table {
    padding-top: 0;
}

.nhanh-gift-baget {
    position: absolute;
    z-index: 21;
    top: 8px;
    right: 8px;
    max-width: calc(100% - 16px);
    text-align: right;
}

.box-text .button {
    margin-top: 0;
}

.has-shadow .box-text {
    padding-right: .6em;
    padding-left: .6em;
}

.woocommerce-ordering,
.woocommerce-ordering select {
    display: none;
}

.product-small span.amount {
    padding-right: 6px !important;
    font-size: 15px !important;
    font-weight: 700;
}

.grid-style-3 .price-wrapper {
    min-width: 0;
}

.row-small > .flickity-viewport > .flickity-slider > .col,
.row-small > .col {
    margin-bottom: 0;
    padding: 0 5px 10px;
}

.grid-style-3 .title-wrapper {
    font-size: 14px;
}

.mobile-nav > li > a > i + span {
    margin-left: 5px;
}

.header.show-on-scroll .hide-for-sticky,
.stuck .hide-for-sticky {
    display: inherit;
}

.row-xsmall > .flickity-viewport > .flickity-slider > .col,
.row-xsmall > .col {
    border-radius: 8px;
    background-color: #fffdfa;
}

.box-image {
    border-radius: 8px 8px 0 0;
}

.off-canvas-right .mfp-content,
.off-canvas-left .mfp-content {
    width: min(90vw, 360px);
}

.off-canvas-right.dark .mfp-content,
.off-canvas-left.dark .mfp-content {
    background-image: url("https://samngoclinh.vn/wp-content/uploads/2022/03/BG_SNL-1.svg");
    background-position: center;
    background-size: cover;
}

/* Để Flatsome tự xử lý sticky header; không cố định .header-main thủ công. */
.header-main {
    position: relative;
    width: 100%;
    background: #b82025;
}

#logo {
    width: 88px !important;
    margin-top: 0;
}

#logo img,
.stuck #logo img,
.transparent #logo img {
    max-height: 72px !important;
    margin-top: 0;
    padding: 6px;
    border-width: 2px;
}

.transparent .header-main {
    height: auto;
}

.badge-frame {
    height: auto;
    margin: 0;
}

.w_tintuc {
    padding-top: 0;
}

.home_box_grass .slider-wrapper.row {
    margin-inline: 0;
}
/* =====================================================
   K5 - FIX PRODUCT CARD MOBILE
   Giỏ hàng cùng dòng giá + tăng chiều rộng chữ
===================================================== */
@media (max-width: 549px) {

    /* Giảm khoảng trống trong thẻ -> chữ có nhiều chỗ hơn */
    .product-small.box.sp-tab-home {
        padding-left: 4px !important;
        padding-right: 4px !important;
    }

    .product-small .box-text {
        padding-left: 5px !important;
        padding-right: 5px !important;
        column-gap: 4px;
    }

    /* Tiêu đề sử dụng toàn bộ chiều rộng */
    .product-small .box-text .title-wrapper {
        flex: 0 0 100% !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    .product-small .product-title,
    .product-small .product-title a {
        width: 100% !important;
        max-width: 100% !important;
        white-space: normal !important;
        word-break: normal !important;
        overflow-wrap: normal !important;
        line-height: 1.35 !important;
    }

    /* Giá được phép co để nhường chỗ cho giỏ hàng */
    .product-small .box-text .price-wrapper {
        flex: 1 1 0 !important;
        min-width: 0 !important;
        width: 0 !important;
        margin: 0 !important;
    }

    /* Giỏ hàng luôn nằm bên phải giá */
    .product-small .box-text > a.add_to_cart_button {
        flex: 0 0 30px !important;
        width: 30px !important;
        min-width: 30px !important;
        max-width: 30px !important;

        margin: 0 !important;
        padding: 0 !important;

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