.header-support-login {
    display: flex;
    align-items: center;
    gap: 30px;
    /* khoảng cách giữa 2 box */
}

/*fotter */

.absolute-footer {
    background-color: #fff !important;
    /* nền trắng */
    color: #666 !important;
    /* chữ xám */
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    margin-bottom: 0 !important;
}

.pb {

    overflow-x: hidden !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    margin-bottom: 0 !important;

}

.pb-text {
    padding: 20px;
    padding-left: 10px;
}

.pb-text-1 {
    margin-bottom: 1rem !important;
    padding: 10px;

}

.pb-row-1 {
    padding-top: 22px;
}

body {
    font-family: Arial, sans-serif !important;
    font-weight: 400 !important;
    font-style: normal !important;
}

.pb-row {
    background: white;
    border-radius: 10px;
}

.copyright-footer {
    color: #3a445e;
}

#top-link {
    background-color: #2e7d32;
    color: white;
    border: none;
    transition: all 0.3s ease;
}

#top-link i {
    color: white;
}

#top-link:hover {
    background-color: #00B15E;
    color: white;
}

#top-link:hover i {
    color: #2e7d32;
}

.footer-link {
    color: #fff !important;
    background: transparent;
    border: none;
    font-size: 15px !important;
    display: block;
    transition: color 0.3s ease;
    padding-bottom: 0px !important;
    padding-top: 3.2px;
}

.footer-link:hover {
    color: #0e8248 !important;
}

.ux-menu-link a {
    padding-bottom: 0;
    padding-top: 0;
}

.ux-menu-link a:hover {
    color: #0e8248 !important;
}


.support-box,
.login-box {
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: Arial, sans-serif;
    color: #2c3e50;
}

.support-icon,
.login-icon {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    padding: 5px;
    object-fit: contain;
}



.login-link {
    font-weight: 500;
    text-decoration: none;
    color: #2c3e50;
}

.login-link:hover {
    text-decoration: underline;
}

/* Tab container */
.ux-tabs .tabbed-nav {
    display: flex;
    gap: 10px;
    background: red !important;
}

/* Nút tab */
.ux-tabs .tab-link {
    padding: 10px 20px;
    border: 1px solid #0e8248;
    background-color: white;
    color: #0e8248;
    border-radius: 999px;
    font-weight: 500;
    transition: all 0.3s ease;
}

/* Tab đang được chọn */
.ux-tabs .tab-link.active {
    background-color: #0e8248;
    color: white;
}

/* Tab bị disabled (nếu dùng thêm class) */
.ux-tabs .tab-link.disabled {
    background-color: #f1f1f1;
    color: #555;
    border-color: transparent;
    cursor: not-allowed;
}

.button.white.is-gloss.lowercase.all-button {
    background-color: #fff !important;
    color: #219653 !important;
    border: 1px solid #219653;
    transition: border-color 0.2s;
    text-align: center !important;
    margin: 20px auto;
    font-size: 16px;
    border-radius: 25px;
    cursor: pointer;
    width: auto;
    font-weight: 500;
    width: fit-content;
    box-sizing: border-box;
}


.button.white.is-gloss.lowercase.all-button:hover {
    background: #219653 !important;
    color: #fff !important;
    border-color: #007A41;
}



.text.product-title {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    white-space: initial;
    overflow: hidden;
    margin: 10px 0 5px;
    font-size: 1rem;
}




.column:hover {
    background: #fff;
    border-radius: 10px;
    border: 2px solid #f2f2f2;
    position: relative;
    z-index: 1;
}

/*image banner */
.images-banner-1 {
    width: 100%;
    border-radius: 16px 16px 0 0;
    object-fit: cover;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}

.images-banner-1 img {
    width: 100%;
    /* height: 300px; */
    object-fit: cover;
    display: block;
    border-radius: 16px 16px 0 0;
}



.banner-row {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
}

.custom-column {
    flex: 1 1 0;
    max-width: 20% !important;
    min-width: 0;
    box-sizing: border-box;

}

.custom-column-1 {
    background: #fff;
    border-radius: 10px;
    border: 2px solid #f2f2f2;
    position: relative;
    z-index: 1;

}



/* Khối box chính */
.coupon-box {
    background: white;
    padding: 20px;
    border-radius: 6px;
    border: 1px solid #eee;
    text-align: left;
    position: relative;
}

/* Tiêu đề mã giảm giá */
.coupon-title {
    font-size: 22px;
    font-weight: 700;
    color: #f44336;
    /* đỏ tươi */
    position: relative;
    display: inline-block;
    padding-bottom: 8px;
    margin-bottom: 12px;
}

/* Dấu gạch dưới tiêu đề */
.coupon-title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    background-color: #ddd;
    /* gạch xám nhạt */
}



.title-module {
    font-size: 16px;
    background: #fff;
    padding-bottom: 10px;
    padding-top: 5px;
}

/* Tùy chỉnh văn bản */
.text p {
    font-size: 14px;
    color: #333;
    margin-top: 10px;
    text-align: left;
    margin-bottom: 0 !important;
}

.custom-column:hover {
    background: #fff;
    border-radius: 10px;
    border: 2px solid #f2f2f2;
    position: relative;
    z-index: 1;
}

/*ảnh dưới banner*/
.custom-images-1 {
    width: 100px;
    height: 100px;
    border: 1px solid #ccc;
    /* viền mặc định */
    border-radius: 50%;
    overflow: hidden;
    margin: 0 auto 10px auto;
    position: relative;
}

.custom-images-1:hover {
    border: 3px solid #0e8248;
    /* viền xanh dày hơn */
}

/* Hiệu ứng quay viền khi hover */
.custom-images-1::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 50%;
    padding: 2px;
    background: conic-gradient(#0e8248 0deg, #0e8248 90deg, transparent 90deg);
    mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    mask-composite: exclude;
    -webkit-mask-composite: destination-out;
    opacity: 0;
    transition: opacity 0.3s;
    animation: spin 1s linear infinite;
    pointer-events: none;
}

.custom-images-1:hover::before {
    opacity: 1;
}

/* Ảnh bên trong */
.custom-images-1 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.news-img img {
    border-radius: 10px !important;
    max-width: 100%;
    height: auto;
}

.custom-column-2 {
    margin-bottom: 10px;
    background: #fff;
    border-radius: 8px;
    padding: 18px 12px 2px 12px !important;
    box-sizing: border-box;
}

/* Ảnh bên trái */
.news-img img {
    border-radius: 16px;

    max-width: 100%;
    max-height: 100%;
    object-fit: cover;
}

.home-news {
    display: flex;
    flex-wrap: wrap;
    align-items: center;

}

.article-title.title_page {
    font-size: 20px;
    color: #3a445e;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 3 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    display: -webkit-box;
}

.article-title.title_page :hover {
    color: #0F8848;
}

.page-header-wrapper {
    background: #EEEEEE !important;

}

.page-title-inner {
    background: #EEEEEE;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}

.pb-hd {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}

.pb-header-column {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;

}

.breadcrumbs {
    font-size: 12px;
}



/* Cột nội dung chính */
.news-content {
    background: #f0fbf5;
    flex: 1;
    margin-right: 15px !important;
    border-radius: 20px;
    padding: 10px 30px 30px 40px !important;
}

.news-content h3 {
    font-size: 24px;
    font-weight: 700;
    color: #1d2d35;
    margin-bottom: 16px;
    line-height: 1.4;
}

.news-content h3:hover {
    color: #00B15E !important;
}

.news-content p {
    font-size: 16px;
    color: #4a4a4a;
    margin-bottom: 24px;
    line-height: 1.6;
}

/* 

.button.white.is-gloss.lowercase.all-button-1 {
    background-color: #F0FBF5 !important;
    color: #219653 !important;
    border: 1px solid #219653;
    text-align: center !important;
    margin: 20px auto;
    font-size: 16px;
    border-radius: 25px;
    cursor: pointer;
    width: auto;
    font-weight: 500;
    width: fit-content;
}

.button.white.is-gloss.lowercase.all-button-1:hover {
    background: #219653 !important;
    color: #fff !important;
} */


.row-custom {
    background: #ffe600 !important;
    /* Nền trắng */
    border-radius: 10px;
    padding: 18px 12px 24px 12px;
    /* Padding trong cho row */
    box-sizing: border-box;
    max-width: 100%;
    margin: 0 auto;

}



.custom-text {
    font-size: 1em;
    margin: 0 0 24px 0;
    line-height: 1.6;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    /* Hiển thị 3 dòng */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-word;
}

.custom-text-column {
    background: #F0FBF5;
    border-radius: 8px;
    padding: 24px 24px 32px 24px;
    max-width: 100%;
    box-sizing: border-box;
}

.images-text-column {
    width: 100%;
    height: 220px;
    /* hoặc giá trị bạn muốn */
    overflow: hidden;
}

.images-text {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 16px !important;
    display: block;
}

@media (max-width: 900px) {
    .custom-column {
        max-width: 50%;
        width: 50%;
    }
}

@media (max-width: 600px) {
    .custom-column {
        max-width: 100%;
        width: 100%;
    }

    .col-pb {
        padding-bottom: 0px !important;
    }



}

.icon-shopping-basket::after {
    background-color: #007c3e !important;
    /* Xanh lá */
    color: #fff !important;
    /* Màu chữ trắng */
}


/* Nút CHỌN MUA */
.info {
    padding-top: 10px;
}

.title-wrapper {
    padding-top: 10px;
}

.price-wrapper {
    padding-top: 10px;
    gap: 0.5em;
}

.col .title-product {
    padding-bottom: 0 !important;
}

.ega-summary-list {
    border-bottom: 1px solid #e0e0e0;
    /* màu gạch ngang */
    padding-bottom: 8px;
    /* khoảng cách với gạch */
    margin-bottom: 12px;
    /* khoảng cách dưới gạch */
}

.custom-product-page {
    padding-bottom: 0 !important;
}






.custom-add-to-cart {
    background-color: #fff;
    color: #219653;
    padding: 8px 16px;
    border-radius: 4px;
    border: 1px solid #219653;
    cursor: pointer;
    font-size: 14px;
    width: 100%;
    text-align: center;
}

/* Hover chỉ khi còn hàng */
.custom-add-to-cart:not(.disabled):hover {
    background-color: #0e8248;
    color: #fff;
}

/* Nút HẾT HÀNG (disabled) */
.custom-add-to-cart.disabled {
    background: #fff;
    border: 1px solid #ccc;
    color: #ccc;
    cursor: not-allowed;
    pointer-events: none;
}

.product-small.box {
    margin-top: .5rem;
    margin-bottom: .5rem;
    cursor: pointer;
    border: 2px solid #f2f2f2;
    box-sizing: border-box;
    transition: border-color 0.2s;
    padding: 5px;
    border-radius: 10px;
}

/* .product-small.box:hover {
    background: #fff;
    border-radius: 10px;
    border-color: #f2f2f2;
    position: relative;
    z-index: 1;
} */

.woocommerce-Price-amount.amount {
    color: red;
}

.woocommerce-loop-product__title a {
    display: -webkit-box !important;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    height: auto;
}

.page-title-bg.fill {
    background: #EEEEEE;
}




/*css form tìm kiếm */


.custom-sorting {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    font-size: 16px;
    margin-bottom: 20px;
}

.custom-sorting .sort-label {
    margin-right: 10px;
    font-weight: 500;
    color: #333;
}

.custom-sorting .sort-link {
    margin-right: 15px;
    text-decoration: none;
    color: #777;
    transition: all 0.2s ease-in-out;
}

.custom-sorting .sort-link:hover {
    color: #111;
}

.custom-sorting .sort-link.active {
    color: #000;
    font-weight: 600;
    border-bottom: 2px solid #f1c40f;
    padding-bottom: 2px;
}

/*header giỏ hàng */

.header-cart-link {
    background-color: #fff !important;
    color: #007A41 !important;
    box-sizing: border-box;
    border: 2px solid transparent;
    transition: border-color 0.2s;
}

.header-cart-link:hover {
    background-color: #007A41 !important;
    color: #fff !important;
    border-color: #007A41 !important;
}

/* 1. Base style cho tất cả các tab */
.nav .tab.has-icon>a {
    display: inline-block;
    box-sizing: border-box;
    border-radius: 99px;
    background-color: #f1f1f1;
    color: #3a445e;
    font-size: 14px;
    text-decoration: none;
    /* giữ luôn 1px border để không bị shift */
    border: 1px solid transparent;
    padding: 4px 8px;
    /* tuỳ chỉnh padding tuỳ theo thiết kế */
    transition: background-color .2s, color .2s, border-color .2s;
}

.nav.nav-outline {
    gap: 5px;
}

/* 2. Hover chỉ với tab chưa active và chưa disabled */
.nav .tab.has-icon:not(.active):not(.disabled)>a:hover {
    background-color: #fff;
    color: #0e8248;
    /* chỉ đổi màu border, không tạo border mới */
    border-color: #0e8248;
}

/* 3. Active (và active:hover giữ nguyên) */
.nav .tab.has-icon.active>a,
.nav .tab.has-icon.active>a:hover {
    background-color: #0e8248;
    color: #fff;
    border-color: #0e8248;
}




/*custom product page */
.sale-custom {
    padding-bottom: 0 !important;
    border: 1px dashed #f1563f;
    background: #fff6f3;
    padding: 12px 16px;
    border-radius: 8px;
    font-size: 15px;
    color: #2d2d2d;
    margin-bottom: 16px;
}

.sale-custom h5 {
    color: #EE5A1A;
}

.col .single-column {
    padding-bottom: 0;
}

.text .custom-product {
    padding-bottom: 0;
}

.single-product .product-page-price {
    background: #fafafa;
    border-radius: 8px;
    padding: 10px 14px;
    margin: 4px 0 12px;
    width: 100%;
}

.single-product .price-wrapper .price ins .woocommerce-Price-amount.amount {
    font-size: 22px !important;
}

.single-product .price-wrapper .price del {
    text-decoration: none !important;
}

/* Style giá gốc */
.single-product .price-wrapper .price del .woocommerce-Price-amount.amount {
    font-size: 12px !important;
    font-weight: 700;
    color: #2f3e54 !important;
    opacity: 0.8;
    position: relative;
    display: inline-block;
}

/*đường gạch ngang giữa */
.single-product .price-wrapper .price del .woocommerce-Price-amount.amount::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    border-top: 2px solid currentColor;
}

.single-product .product-page-price ins {
    order: 1;
}

.single-product .product-page-price del {
    order: 2;
}

@media (max-width: 767px) {

    .img-custom,
    .single-column {
        margin-bottom: 0 !important;
        padding-bottom: 0 !important;
    }
}

/* MOBILE ONLY */
@media (max-width: 767px) {
    .ega-custom .custom-column-1 h5 {
        margin: 0 0 10px;
        font-size: 18px;
        font-weight: 800;
        padding-top: 10px;
    }

    .ega-custom .custom-column-1 .icon-box {
        display: flex !important;
        align-items: center;
        gap: 12px;
        padding: 10px 0;
        border-bottom: 1px solid #f3f5f7;
    }

    .ega-custom .custom-column-1 .icon-box:last-of-type {
        border-bottom: none;
        padding-bottom: 0;
    }

    .ega-custom .custom-column-1 .icon-box-img img {
        width: 28px;
        height: 28px;
        object-fit: contain;
    }

    .ega-custom .custom-column-1 .icon-box-text .text {
        font-size: 15px;
        text-align: left;
    }

    .img-custom,
    .single-column,
    .custom-images {
        margin-bottom: 0 !important;
        padding-bottom: 0 !important;
    }

}


.custom-row-1 {
    background: #fff;
    border-radius: 10px;
    border: 2px solid #f2f2f2;
    position: relative;
    z-index: 1;
    padding: 10px;
    margin-bottom: 30px;
}

/**/
.row-product {
    margin: 20px 10px 16px 10px;
    border: 1px solid #f2f2f2;
}



/*form đăng ký nhận tin  */
/* Căn giữa toàn bộ form */
#gform_wrapper_1 {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 40px 0;

}

/* Căn giữa tiêu đề */
#gform_wrapper_1 .gform_title {
    text-align: center;
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 20px;
}

/* Container của input + button */
#gform_wrapper_1 .gform_fields {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 0;
    width: auto;
}

/* Ô input email */
#gform_wrapper_1 input[type="email"] {
    padding: 12px 16px;
    height: 48px;
    border-radius: 8px 0 0 8px;
    font-size: 15px;
    color: #333;
    background: #fff;
    border: none;
    outline: none;
    width: 500px;
    max-width: 100%;
    box-sizing: border-box;
}

/* Nút đăng ký */
#gform_wrapper_1 .gform-button,
#gform_wrapper_1 input[type="submit"] {
    padding: 12px 24px;
    height: 48px;
    background-color: #ffc107;
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    border: none;
    border-radius: 0 8px 8px 0;
    cursor: pointer;
    transition: 0.3s ease;
    margin-left: -1px;
    /* dính sát input */
    width: auto;
    white-space: nowrap;
}

/* Hover */
#gform_wrapper_1 .gform-button:hover {
    background-color: #e0a800;
}

#gform_wrapper_1 .gfield_label {
    display: none;
}


/*css add-to-cart */

.single_add_to_cart_button.button.alt {
    background-color: #ff5722 !important;
    font-weight: bold;
    border: none;
    padding: 6px 12px;
    /* width: 100%; */
    border-radius: 6px;
    font-size: 12px;
    transition: background-color 0.3s ease;
    text-transform: uppercase;
}

/* Đặt 2 phần tử cùng hàng */
.add-to-cart-container .cart {
    display: flex;
    align-items: center;
    justify-content: space-between;
    /* quantity trái – nút phải */
    gap: 12px;
    width: 100%;
}

.add-to-cart-container .ux-quantity {
    margin: 0;
    flex: 0 0 auto;
}

.add-to-cart-container .cart .single_add_to_cart_button.button.alt {
    width: auto !important;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
}

.single_add_to_cart_button.button.alt:hover {
    background-color: #e64a19 !important;
}

.ux-quantity.quantity.buttons_added {
    display: flex;
    align-items: center;
    justify-content: start;
    width: max-content;
    border: 1px solid #dcdcdc;
    border-radius: 6px;
    overflow: hidden;
    height: 38px;
}

/*custom cart page*/

.hot-deal-box {
    border: 1px dashed #ff5722;
    background-color: #fff5f0;
    padding: 20px;
    border-radius: 6px;
}

.hot-deal-box .ux-icon-box-title,
.hot-deal-box h3 {
    color: #ff5722;
    font-weight: bold;
    font-size: 18px;
}

.hot-deal-list {
    margin-top: 10px;
    font-size: 15px;
    line-height: 1.8;
}

.uppercase {
    color: #ff5722;
    padding-bottom: 10px;
    margin-top: 10px;
}

.custom-row-2 {
    background: #fff;
    /* Nền vàng */
    border-radius: 16px;
    padding: 18px 12px 24px 12px;
    /* Padding ngoài cho section */
    box-sizing: border-box;
}


#gform_wrapper_4 .gform-button,
#gform_wrapper_4 input[type="submit"] {
    padding: 12px 24px;
    height: 48px;
    background-color: #ffc107;
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    border: none;
    border-radius: 0 8px 8px 0;
    cursor: pointer;
    transition: 0.3s ease;
    margin-left: -1px;
    /* dính sát input */
    width: auto;
    white-space: nowrap;
}

#gform_wrapper_4 .gform_fields {

    gap: 10px;
    width: auto;
}

/*% giá sale */
.sale-percentage .onsale {
    background-color: #e74c3c;
    /* Màu nền */
    color: #fff;
    /* Màu chữ */
    padding: 5px 10px;
    border-radius: 5px;
    font-weight: bold;
    font-size: 16px;
}

.mb-3 {
    font-size: 20px !important;
}

.heading-bar__action {
    text-align: right;

}


.btn-all {
    color: #168821 !important;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.3s ease !important;
}

.btn-all:hover {
    padding-left: 16px !important;
    padding-right: 14px !important;
}

.title_module_main {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
    padding: 5px 0 10px;
}

/*css trang shop */
.title-overlay.fill {
    background: #EEEEEE !important;
}

.woocommerce-breadcrumb.breadcrumbs.uppercase {
    color: #222;
}

.woocommerce-breadcrumb.breadcrumbs.uppercase a {
    color: #666666b2;
}

.custom-shop-wrapper {
    background-color: #f7f7f7;
    padding: 20px 0;
}

/*  Container trắng bo tròn */
.custom-layout-row {
    background: #ffffff;
    padding: 30px;
    border-radius: 12px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
}

.custom-shop-heading-wrapper {
    max-width: 100%;
    padding: 0 15px;
    margin-bottom: 20px;
    text-align: center;
}

.custom-shop-heading {
    font-size: 20px;
    font-weight: bold;
    text-transform: uppercase;
    margin: 0 auto;
}

/* Bố cục hai cột layout  */
.custom-layout-row {
    display: flex;

}

/* SIDEBAR */
.custom-sidebar {
    width: 25%;
    position: relative;
}

.custom-sidebar::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 1px;
    height: 100%;
    background-color: #e0e0e0;
}

.custom-sidebar-inner {
    padding-right: 20px;
}

.custom-widget-title {
    font-size: 14px;
    font-weight: bold;
    text-transform: uppercase;
    border-bottom: 1px solid #ddd;
    margin: 25px 0 15px;
    padding-bottom: 5px;
}

.custom-sidebar-inner label {
    display: block;
    font-size: 14px;
    margin-bottom: 10px;
}

.custom-sidebar-inner input[type="checkbox"] {
    margin-right: 8px;
    accent-color: #007c3e;
}

/*MAIN CONTENT */
.custom-main-content {
    width: 75%;
    padding-left: 20px;
}

/* Banner  */
.custom-banner img {
    border-radius: 8px;
    margin-bottom: 20px;
}

/* Tiêu đề sản phẩm  */
.custom-section-title {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 15px;
}

/*  Danh sách sản phẩm */
.products {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    margin: 0;
    padding: 0;
}

.products li.product {
    width: calc(25% - 15px);
    background: transparent;
    border: none;
    padding: 0;
    border-radius: 0;
    box-shadow: none;
    text-align: center;
    transition: all 0.3s ease;
}

.products li.product:hover {
    transform: translateY(-4px);
}

/* ==== Responsive ==== */
@media (max-width: 1024px) {
    .custom-layout-row {
        flex-direction: column;
    }

    .custom-sidebar,
    .custom-main-content {
        width: 100%;
        padding: 0;
    }

    .custom-sidebar::after {
        display: none;
    }

    .products li.product {
        width: 48%;
    }
}

@media (max-width: 480px) {
    .products li.product {
        width: 100%;
    }
}


/* Gói phân trang */
.custom-pagination-wrapper {
    text-align: right;
    margin-top: 15px;
}




/*có thể bạn thích */

.widget-title-bg {
    background-color: #007c3e;
    color: #fff;
    font-weight: bold;
    padding: 8px 12px;
    border-radius: 4px;
    margin-bottom: 12px;

    font-size: 16px;
}

.sidebar-favorite-products {
    list-style: none;
    margin: 0;
    padding: 0;
}

.sidebar-favorite-item {
    display: flex;
    gap: 10px;
    margin-bottom: 12px;
}

.sidebar-favorite-item .thumb {
    width: 70px;
    height: 70px;
    position: relative;
    flex-shrink: 0;
}

.sidebar-favorite-item .thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.sidebar-favorite-item .badge-sale {
    position: absolute;
    top: 0;
    left: 0;
    background-color: #f44336;
    color: white;
    font-size: 11px;
    padding: 2px 6px;
    font-weight: 600;
    border-bottom-right-radius: 4px;
}

.sidebar-favorite-item .info {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.sidebar-favorite-item .name {
    font-size: 13px;
    font-weight: 500;
    line-height: 1.3;
    color: #333;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 4px;
    text-decoration: none;
}

.sidebar-favorite-item .price {
    font-size: 14px;
    color: #d10000;
    font-weight: bold;
    margin-bottom: 4px;
}

.sidebar-favorite-item .price del {
    font-size: 12px;
    color: #999;
    margin-left: 6px;
}

.sidebar-favorite-item .add-to-cart {
    font-size: 11px;
    padding: 4px 10px;
    border: 1px solid #007c3e;
    color: #007c3e;
    text-align: center;
    border-radius: 3px;
    display: inline-block;
    width: 100%;
    transition: all 0.3s;
}

.sidebar-favorite-item .add-to-cart:hover {
    background: #007c3e;
    color: #fff;
}

.sidebar-favorite-item .add-to-cart.disabled {
    background: #f5f5f5;
    color: #aaa;
    border-color: #ccc;
    pointer-events: none;
}

/* mới */
.text-row {
    padding: 0 0 3px;
}

.nav-top-link {
    transition: background-color 0.3s ease;
}

.nav-top-link:hover,
.nav-top-link a:hover {
    background-color: #007A41 !important;
}

.category-title p {
    text-align: center !important;
    font-size: 15px;
    margin: 4px 0 12px;
    line-height: 1.5;
}

@media (max-width: 600px) {
    #gform_wrapper_4 .gform_fields {
        flex-direction: column;
        gap: 10px;
        width: 100%;
    }

    #gform_wrapper_4 .gform_fields .gfield input[type="email"],
    #gform_wrapper_4 .gform_fields .gfield input[type="text"],
    #gform_wrapper_4 .gform_fields .gfield input[type="submit"],
    #gform_wrapper_4 .gform_fields .gfield button {
        width: 100%;
        border-radius: 8px;
        box-sizing: border-box;
    }

    #gform_wrapper_4 input[type="submit"] {
        margin-left: 0;
        border-radius: 8px;
        margin-top: 6px;
    }
}

/*css form đăng ký nhận tin */
/* --- Responsive dưới 768px (Tablet & Mobile) --- */
@media (max-width: 768px) {
    #gform_wrapper_1 .gform_fields {
        flex-direction: column;
        width: 100%;
        gap: 10px;
    }

    #gform_wrapper_1 input[type="email"] {
        width: 100%;
        border-radius: 8px;
    }

    #gform_wrapper_1 .gform-button,
    #gform_wrapper_1 input[type="submit"] {
        width: 100%;
        border-radius: 8px;
        margin-left: 0;
    }
}

/* --- Responsive dưới 480px (Mobile nhỏ) --- */
@media (max-width: 480px) {
    #gform_wrapper_1 {
        padding: 24px 10px;
    }

    #gform_wrapper_1 .gform_title {
        font-size: 18px;
    }

    #gform_wrapper_1 input[type="email"] {
        font-size: 14px;
        height: 44px;
        padding: 10px 14px;
    }

    #gform_wrapper_1 .gform-button,
    #gform_wrapper_1 input[type="submit"] {
        font-size: 14px;
        height: 44px;
        padding: 10px 16px;
    }
}

/*màu mặc định của flatsome*/
.button.alt,
.button.checkout,
.checkout-button,
.secondary {
    background-color: #EE5A1A;
}


/* footer mobie */
@media (max-width: 600px) {

    .accordion-item {
        color: white;
        padding-top: 0 !important;
    }

    .accordion-title {
        border-top: none !important;
        font-size: 18px !important;
        padding-left: 0 !important;
        font-family: "Be Vietnam Pro", sans-serif;
    }

    .accordion-title.plain {
        padding-top: 0 !important;
        justify-content: space-between;
        display: flex !important;
        align-items: center !important;
        padding-bottom: 0 !important;
    }

    .accordion-title.plain .toggle {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        margin-right: 0.5em;
        padding: 0;
        height: auto;
        order: 2;
        width: auto;

    }

    .pb-row-1 {
        padding-top: 20px;
        padding-bottom: 10px !important;
    }

    .accordion-title:hover {
        color: #0E8248;
    }

    .accordion .toggle {
        right: 0 !important;
        left: unset !important;
    }

    /*màu chữ and dropdown*/
    .accordion-title[aria-expanded="true"] span,
    .accordion-title[aria-expanded="true"] i.icon-angle-down {
        color: #0e8248 !important;
    }


    #text-3756080514,
    #text-964883266 .text.tx {
        font-size: 18px !important;
    }
}

@media (min-width: 700px) and (max-width: 1024px) {
    .title-post {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
        text-overflow: ellipsis;
        line-height: 1.4em;

    }

    .custom-text {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
        text-overflow: ellipsis;
        line-height: 1.4em;
    }
}

@media (max-width: 991px) {
    .custom-images-1 {
        width: 100px !important;
        height: 100px !important;
        border-radius: 50% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        overflow: hidden !important;
        margin: 0 auto 8px auto;
        padding: 0 !important;
        border: 1px solid #ccc;

    }

    /* 2. Căn khung .img-inner full 100% */
    .custom-images-1 .img-inner {
        width: 100% !important;
        height: 100% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 0 !important;
    }

    /* 3. Ảnh chỉ chiếm tối đa 80% chiều cao khung, tự căn giữa */
    .custom-images-1 .img-inner img {
        width: auto !important;
        height: 80% !important;
        object-fit: cover !important;
        border-radius: 50% !important;
    }

    /* 4. Tiêu đề bên dưới cân giữa và độ rộng vừa phải */
    .category-title p {
        text-align: center !important;
        font-size: 13px;
        margin: 4px 0 12px;
        line-height: 1.3;
    }
}

@media (max-width: 600px) {
    .show-for-small .flickity-prev-next-button {
        display: block !important;
        opacity: 1 !important;
    }

    .custom-images-1 {
        width: 100px !important;
        height: 100px !important;
        border-radius: 50% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        overflow: hidden !important;
        margin: 0 auto 8px auto;
        padding: 0 !important;
        border: 1px solid #ccc;
    }

    .uppercase {
        color: #334862;
        font-size: 22.4px;
    }

    #text-687166087 h4 {
        padding-top: 10px;
    }

    #col-1710916058 {
        padding-bottom: 0 !important;
    }

    .accordion-inner {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    /* 2. Căn khung .img-inner full 100% */
    .custom-images-1 .img-inner {
        width: 100% !important;
        height: 100% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 0 !important;
    }

    /* 3. Ảnh chỉ chiếm tối đa 80% chiều cao khung, tự căn giữa */
    .custom-images-1 .img-inner img {
        width: auto !important;
        height: 80% !important;
        object-fit: cover !important;
        border-radius: 50% !important;
    }

    /* 4. Tiêu đề bên dưới cân giữa và độ rộng vừa phải */
    .category-title p {
        text-align: center !important;
        font-size: 13px;
        margin: 4px 0 12px;
        line-height: 1.3;
    }

}

/*bổ sung */
.uppercase.text-right {
    text-align: left;
    position: absolute;
    font-size: 25.6px;
    color: #555555;

}

.uppercase.text-right:hover {
    color: #007A41;
}

.pb-1 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}



.product-small {
    padding-bottom: 0px !important;
}

.col.category-item {
    padding-bottom: 0 !important;
}

.pb-column {
    padding-bottom: 0 !important;
}

.pb-column-1 {
    margin-bottom: 1rem !important;
    padding-bottom: 0 !important;
}

.icon-inner {
    margin-top: 0;
    padding-top: 0 !important;
}

.icon-box-img img {
    padding-top: 0 !important;
}

/*chữu sale => % */
.product-small .onsale {
    position: absolute;
    top: 8px;
    left: 8px;
    background: #e53935;
    color: #fff;
    padding: 2px 6px;
    border-radius: 3px;
    font-size: 12px;
    z-index: 5;
}

/*hết hàng*/
.add-to-cart.disabled {
    pointer-events: none;
    opacity: 0.6;
    cursor: not-allowed;
}

/*slug thit hai san */

/*icon hover*/

.box-image__wrapper {
    position: relative;

}


.box-image__overlay {
    position: absolute;
    pointer-events: none;
    top: 0;
    left: 0;
    z-index: 1 !important;
}

.box-image img {
    max-width: 80%;
    height: auto;
    display: block;
    margin: 0 auto;
}

.product-small.box .box-image {
    position: relative;
    overflow: visible;
}



/*giá tiền */

.price-wrapper .price {
    display: inline-flex !important;
    align-items: baseline;
    gap: 0.3em;
}


.price-wrapper .price ins {
    order: 1 !important;
}

.price-wrapper .price del {
    order: 2 !important;
}


.price-wrapper .price ins .woocommerce-Price-amount.amount {
    font-size: 14.4px !important;
    font-weight: 700 !important;
    color: red !important;
    text-decoration: none !important;
}

.price-wrapper .price del .woocommerce-Price-amount.amount {
    font-size: 12px !important;
    color: #999 !important;
}

.header-main .header-cart .cart-dropdown {
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: opacity .2s ease, transform .2s ease;
    pointer-events: none;
}

.header-main .header-cart:hover .cart-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
}

.header-cart-link .header-cart-title {
    display: none !important;
}

.header-cart-link::before {
    content: 'Giỏ hàng';
    display: inline-block;
    margin-right: 0.5em;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1;
    padding: 10px;

}

.header-cart-link .icon-shopping-basket {
    vertical-align: middle;
}

.button.icon.is-small {
    border-width: 2px !important;
}


@media (max-width: 480px) {
    .header-cart-link::before {
        content: "\f07a";
        font-family: "Font Awesome 5 Free";
        font-weight: 900;
        font-size: 1.2rem;
        padding: 6px;
        margin-right: 0;
    }

    .flex-col.logo {
        display: none;
    }
}

@media(max-width : 900px) {
    .flex-col.logo {
        display: none;
    }

}

.horizontal-row-stack {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    gap: 1rem;
    padding-bottom: 35px !important;
    scrollbar-width: thin;
    scrollbar-color: rgb(255, 230, 0) rgb(230, 245, 230) !important;
}


.horizontal-row-stack::-webkit-scrollbar {
    height: 6px;
}

.horizontal-row-stack::-webkit-scrollbar-track {
    background-color: rgb(230, 245, 230) !important;
    /* màu track */
}

.horizontal-row-stack::-webkit-scrollbar-thumb {
    background-color: rgb(154, 205, 50) !important;
    /* màu thumb */
    border-radius: 3px;
}

.horizontal-row-stack::-webkit-scrollbar-corner {
    background: transparent;
}


.nav-pagination>li>.current,
.nav-pagination>li>a:hover,
.nav-pagination>li>span:hover {
    background-color: #007C3E;
    border-color: #007C3E;
    color: #fff;
}



/*dropdown menu*/

#menu-item-311,
#menu-item-545 {
    position: relative;

}

/* Container dropdown */
#menu-item-311>.sub-menu,
#menu-item-545>.sub-menu {
    background: #fff;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.08);
    border-radius: 8px;
    padding: 12px 0;
    min-width: 240px;
    opacity: 0;
    color: #3a445e;
    visibility: hidden;
    transform: translateY(10px);
    transition: opacity .3s ease, transform .3s ease, visibility .3s;
}

/* Hiển thị dropdown khi hover */
#menu-item-311:hover>.sub-menu,
#menu-item-545:hover>.sub-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* Link trong dropdown */
#menu-item-311>.sub-menu li a,
#menu-item-545>.sub-menu li a {
    display: block;
    padding: 12px 20px;
    color: #3a445e;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .5px;
    transition: background .2s, color .2s;
}

/* Hover link */
#menu-item-311>.sub-menu li a:hover,
#menu-item-545>.sub-menu li a:hover {
    background: #f0f0f0;
    color: #67b02b;
}

/* Xoay icon mũi tên */
#menu-item-311>a .icon-angle-down,
#menu-item-545>a .icon-angle-down {
    transition: transform .3s ease;
}

#menu-item-311:hover>a .icon-angle-down,
#menu-item-545:hover>a .icon-angle-down {
    transform: rotate(180deg);
}

#wide-nav .nav-top-link {
    font-weight: normal !important;
    font-family: sans-serif;
}


#menu-item-545>a.nav-top-link {
    color: #FFFFFFCC !important;
}

#wide-nav .sub-menu li a {
    font-family: sans-serif !important;
    font-size: 12px;
}

/* hiệu ứng cho icon */
@keyframes pulse-scale {

    0%,
    100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.2);
    }
}

.ux-menu-icon {
    display: inline-block;
    animation: pulse-scale 1s ease-in-out infinite;
}


/*form lọc a->z */
/* Container */
.custom-sorting {
    display: flex;
    align-items: center;
    margin: 0.5em 0 1em;
    font-size: 1rem;
    border-bottom: 1px solid #ddd;
    position: relative;
}


/* Nhãn “Sắp xếp:” */
.custom-sorting .sort-label {
    margin-right: 0.5em;
    font-weight: 500;
    color: #333;
}

/* Link chung */
.custom-sorting .sort-link {
    position: relative;
    color: #666;
    /* Màu chữ mặc định */
    text-decoration: none;
    padding-bottom: 0.25em;
    transition: color .2s ease;
}

/* Hover */
.custom-sorting .sort-link:hover {
    color: #28a745;
}

.custom-sorting .sort-link.active {
    color: #28a745;
    border-bottom: 1px solid #28a745;
}


/*rep mobie shop */
@media(max-width : 600px) {
    .custom-sidebar {
        display: none;
    }

}

/*mới css shop*/


body.post-type-archive-product .category-page-row {
    border-radius: 10px;
    background: #fff;
}

body.post-type-archive-product #main {
    background: #F8F8F8;
    padding: 30px 0;
}

.row.category-page-row>.col.large-3 {
    padding-right: 2rem;
    border-right: 1px solid #e0e0e0;
}

.row.category-page-row .col.large-3 .widget {
    border-bottom: 1px solid #e0e0e0;
}

.row.category-page-row>.col.large-3 {
    padding-right: 10px;
}

.row.category-page-row .col.large-3 .widget:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

/*product search*/
.widget_product_search .search-field {
    transition: border-color .3s;
}

.widget_product_search .submit-button {
    background-color: #0E8248;
    color: #fff;
    transition: background .3s;
}

.widget_product_search .submit-button .icon-search {
    color: #fff;
}

/*Filter by price*/
/* ========== Filter by price ========== */

/* 1. Slider rail */
.woocommerce .price_slider.ui-slider {
    background: #e8f5e9;
    border-radius: 4px;
    position: relative;
}

/* 2. Selected range */
.woocommerce .price_slider .ui-slider-range {
    background: green !important;
}

/* 3. Handles */
.woocommerce .price_slider .ui-slider-handle {
    width: 18px;
    height: 18px;
    background: #fff !important;
    border: 2px solid #4caf50;
    border-radius: 50%;
    cursor: pointer;
    transition: border-color 0.2s;
}

.woocommerce .price_slider .ui-slider-handle:hover {
    border-color: green !important;
}

/* 4. Layout Min/Max & Filter button */
.woocommerce .price_slider_amount {
    display: grid;
    grid-template-columns: repeat(2, 100px);
    grid-template-areas:
        "min max"
        "btn btn";
    column-gap: 0.75rem;
    align-items: center;
    margin-top: 1rem;
}

/* 5. Hide legacy labels/price_label/clear */
.woocommerce .price_slider_amount .price_label,
.woocommerce .price_slider_amount label,
.woocommerce .price_slider_amount .clear {
    display: none !important;
}

/* 6. Common styles for both inputs */
.woocommerce .price_slider_amount input[type="text"] {
    display: inline-block !important;
    width: 100%;
    padding: 0.5rem;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 0.875rem;
    text-align: center;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.05);
    transition: border-color 0.2s;
}

/* 7. Assign grid areas */
.woocommerce .price_slider_amount input#min_price {
    grid-area: min;
}

.woocommerce .price_slider_amount input#max_price {
    grid-area: max;
}

/* 8. Filter button */
.woocommerce .price_slider_amount .button {
    grid-area: btn;
    background: #fff !important;
    color: #007A41;
    border-radius: 4px !important;
    border: 1px solid #4caf50;
    cursor: pointer;
    margin-right: 0px;
}

.woocommerce .price_slider_amount .button:hover {
    background: #388e3c !important;
    color: #fff;
}

.is-divider.small {
    max-width: none;
    background: #fff;
    margin: 0;
}


/*product catagories */
/* Product Categories: chữ màu #3A445E */
.widget_product_categories .product-categories li a {

    border: 1px solid #007A41;
    background-color: #fff;
    color: #007C3E;
    border-radius: 6px !important;
    text-align: center;
}

.widget_product_categories .product-categories li a {
    display: inline-block;
    margin-bottom: 0.5rem;
}

/* Hover: bo góc, nền xanh đậm và chữ trắng */
.widget_product_categories .product-categories li a:hover {
    background-color: #007A41;
    color: #ffffff;
    border-radius: 6px;
}

.widget-title {
    color: #555;
}

.page-numbers {
    text-align: right !important;
}

.page-numbers li {

    border-color: #007c3e !important;
}

/* Container Woo */
.nav-pagination>li>.current,
.nav-pagination>li>a:hover,
.nav-pagination>li>span:hover {
    background-color: #007A41 !important;
    border-color: #007C3E !important;
    color: #fff !important;
}

.row.category-page-row .col.large-3 .is-sticky-column,
.row.category-page-row .col.large-3 .is-sticky-column__inner {
    position: static !important;
    top: auto !important;
    transform: none !important;
}

@media (max-width: 900px) {
    .category-filtering {
        color: #007A41 !important;
    }

    body.post-type-archive-product .category-page-row {
        padding-top: 0;
        background: #fff;
    }

    body.post-type-archive-product #main {
        background: #F8F8F8;
        padding-top: 0;
    }

    .sidebar-inner {
        background: #ffffff !important;
    }

}


.category-title-shop-page {
    padding-top: 20px;
    color: #444E67;
}

/* 
.woocommerce div.product .ux-tabs .nav-line > li.active > a {
    border-color: transparent !important; 
    font-size: 1.6em !important;
    color: #3a445e !important;
}

.woocommerce div.product .ux-tabs .nav-line > li > a:hover {
    border-color: transparent !important;
} */

.nav-line-bottom>li>a:before,
.nav-line-grow>li>a:before,
.nav-line>li>a:before {
    background: transparent !important;
}

.wc-tabs>li.active>a {
    font-size: 1.6em;
    color: #3a445e !important;
}

.wc-tabs>li>a:hover {
    border-color: transparent !important;
}

/* Readmore cho tab Description */
.woocommerce-Tabs-panel--description {
    overflow: hidden;
    position: relative;
    margin-bottom: 20px;
    padding-bottom: 0;
}

/* Hiệu ứng mờ khi đang thu gọn =>>>JS có thể thêm class has-gradient lúc thu gọn */
.woocommerce-Tabs-panel--description.has-gradient:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 55px;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #fff 100%);
    pointer-events: none;
}

.devvn_readmore_controls {
    text-align: center;
    margin-top: 10px;
}

.devvn_readmore_controls a {
    display: inline-block;
    color: #007A41;
    border: 2px solid #007A41;
    padding: 6px 24px;
    border-radius: 50rem;
    /* bo tròn kiểu pill */
    text-decoration: none;
    transition: all .3s ease;
}

.devvn_readmore_controls a:hover {
    background-color: #007A41;
    color: #fff;
}

.devvn_readmore_controls .devvn_readmore_less {
    margin-left: 8px;
}


/*tin tức*/

.page-title {
    color: #2c3e50;
    font-size: 25px !important;
}

.page-title h1 {
    position: absolute;
    left: -9999px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.col .post-item .col-inner {
    border: 1px solid #ccc;
    border-radius: 10px;

}

.col .post-item .col-inner img {
    padding: 10px;

}

.col .post-item .col-inner .is-divider {
    display: none;
}

.widget-area {
    background-color: #ffffff;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
    padding: 22px 25px;
    border-left: 3px solid #a6c63b;
    transition: all 0.3s ease;
}

.widget-area a:hover {
    color: #a6c63b;
}

.widget-area a::before {
    content: "\203A";
    color: #c8dc8c;
    font-size: 18px;
    line-height: 1;
    padding-right: 10px;
}