.xts-page-title-overlay{
	background-color:#f9f9f9;
}

.xts-footer{
	background-color:#282828;
}

body{
	font-family: "Roboto", Arial, Helvetica, sans-serif;font-weight: 500;
}

.xts-textfont-content{
	font-family: "Roboto", Arial, Helvetica, sans-serif;font-weight: 500;
}

legend, th, h1, h2, h3, h4, h5, h6, .title, .widget_block.widget_search .wp-block-search__label, .xts-anim-text, .xts-size-guide-table tr:first-child td, .woocommerce-thankyou-order-received, .woocommerce-Reviews .comment-reply-title{
	font-family: "Montserrat", Arial, Helvetica, sans-serif;
}

.xts-textfont-title{
	font-family: "Montserrat", Arial, Helvetica, sans-serif;
}

.xts-entities-title, .widget_recent_comments li > a, .widget_recent_entries a, .widget_rss li > a, .wp-block-latest-comments .wp-block-latest-comments__comment-link, .wp-block-latest-posts__list li a, .xts-single-post .xts-post-url-text, table .product-name a, .product_list_widget .product-title, .product_title{
	font-family: "Montserrat", Arial, Helvetica, sans-serif;color: #333333;
}

a.xts-entities-title{
	color: #333333;
}

a.xts-entities-title:hover, .xts-entities-title a:hover, .xts-page-nav-btn:hover .xts-page-nav-title, .widget_recent_comments li > a:hover, .widget_recent_entries a:hover, .widget_rss li > a:hover, .wp-block-latest-comments .wp-block-latest-comments__comment-link:hover, .wp-block-latest-posts__list li a:hover, table .product-name a:hover, .product_list_widget .product-title:hover, .product_title a:hover{
	color: #3cb8b9;
}

.xts-nav-main > li > a{
	font-family: "Montserrat", Arial, Helvetica, sans-serif;font-weight: 500;
}

.widget-title, .widget_block .wp-block-group h1, .widget_block .wp-block-group h2, .widget_block .wp-block-group h3, .widget_block .wp-block-group h4, .widget_block .wp-block-group h5, .widget_block .wp-block-group h6{
	font-family: "Montserrat", Arial, Helvetica, sans-serif;font-weight: 500;
}

.xts-textfont-alt{
	font-family: "Montserrat", Arial, Helvetica, sans-serif;font-weight: 500;
}

.title.xts-textcolor-primary, .xts-list-style-icons li:before, .xts-textcolor-primary, .xts-scheme-light .xts-textcolor-primary, .xts-scheme-dark .xts-textcolor-primary, .xts-post .xts-button-icon i:before, .xts-box-icon, .xts-button.xts-color-primary.xts-style-bordered, .xts-button.xts-color-primary.xts-style-bordered:hover, .xts-button.xts-color-primary.xts-style-link-3, .xts-button.xts-color-primary.xts-style-link-3:hover, .xts-plan-features i, .xts-price-plan.xts-scheme-hover-dark:hover .xts-plan-features li i, .xts-plan-icon, .xts-el-video-play-btn, .xts-el-video.xts-action-play .xts-el-video-btn:hover .xts-el-video-play-btn, .xts-el-video.xts-action-overlay:hover .xts-el-video-play-btn, .xts-circle-meter-value, .xts-404-content > span, .xts-no-results-title, .elementor-element u, .xts-product-label.xts-onsale, span.amount, .xts-header-search.xts-design-round .xts-header-el-icon, .xts-header-mobile-search.xts-design-round .xts-header-el-icon, .xts-header-mobile-burger.xts-design-round .xts-header-el-icon, .xts-header-cart.xts-design-round .xts-header-el-icon, .xts-header-compare.xts-design-round .xts-header-el-icon, .xts-header-my-account.xts-design-round .xts-header-el-icon, .xts-header-wishlist.xts-design-round .xts-header-el-icon, a.xts-login-to-price-msg:hover, .xts-account-links a:hover:before, .xts-visits-count-number:before, .xts-wtl-table .xts-confirmed:before, .woocommerce-form-login-toggle .woocommerce-info :is(a, .showcoupon, .showlogin), .woocommerce-form-login-toggle .wc-block-components-notice-banner :is(a, .showcoupon, .showlogin), .woocommerce-form-coupon-toggle .woocommerce-info :is(a, .showcoupon, .showlogin), .woocommerce-form-coupon-toggle .wc-block-components-notice-banner :is(a, .showcoupon, .showlogin), .woocommerce-privacy-policy-link, .woocommerce-terms-and-conditions-link, .woocommerce-privacy-policy-link:hover, .woocommerce-terms-and-conditions-link:hover, .woocommerce-MyAccount-navigation ul li.is-active a, .woocommerce-MyAccount-navigation ul li:hover a, .xts-login-extra a, .xts-login-extra a:hover{
	color:#3cb8b9;
}

.xts-bgcolor-primary, .xts-nav-label.xts-color-primary, .xts-nav.xts-style-underline > li > a .xts-nav-text:after, .xts-style-aside.xts-design-with-bg .xts-sub-menu-wrapp > .xts-sub-menu, nav[class*="-pagination"] li .page-numbers.current, .widget_calendar #today, .xts-hint:before, .xts-tags-list > a:hover:before, .tagcloud > a:hover:before, .wp-block-calendar #today, .xts-nav-mobile-tab.xts-style-underline .nav-link-text:after, .xts-single-post .xts-post-quote, .xts-single-post .xts-post-url, .xts-post.xts-format-design-mask, .xts-post-label, .xts-post-controls, .xts-project-categories li, .xts-section-title.xts-design-simple .xts-section-title-divider:after, .xts-social-buttons.xts-style-simple a:hover, .xts-countdown-timer.xts-style-default.xts-bg-color-primary .xts-countdown-item, .xts-countdown-timer.xts-style-inline.xts-bg-color-primary .xts-countdown-timer-inner, .xts-timeline-dot, .xts-spot-icon.xts-style-default:before, .xts-scroll-to-top:hover, .elementor-progress-bar, body .select2-container--default .select2-results__option--highlighted[aria-selected], body .select2-container--default .select2-results__option--highlighted[data-selected], div.quantity button:hover, .widget_price_filter .ui-slider-range, .widget_price_filter .ui-slider-handle:after, .widget_layered_nav > ul li.chosen a:before, .xts-widget-stock-status li a.xts-selected:before, .xts-progress-track, .xts-header-search.xts-design-round .xts-header-el-icon:after, .xts-header-mobile-search.xts-design-round .xts-header-el-icon:after, .xts-header-mobile-burger.xts-design-round .xts-header-el-icon:after, .xts-header-cart.xts-design-round .xts-header-el-icon:after, .xts-header-compare.xts-design-round .xts-header-el-icon:after, .xts-header-my-account.xts-design-round .xts-header-el-icon:after, .xts-header-wishlist.xts-design-round .xts-header-el-icon:after, .xts-sticky-navbar .xts-navbar-count, .xts-header-cart.xts-design-round-bordered .xts-header-el-icon > span[class*="count"], .xts-header-cart.xts-design-round .xts-header-el-icon > span[class*="count"], .xts-header-compare.xts-design-round-bordered .xts-header-el-icon > span[class*="count"], .xts-header-compare.xts-design-round .xts-header-el-icon > span[class*="count"], .xts-header-wishlist.xts-design-round-bordered .xts-header-el-icon > span[class*="count"], .xts-header-wishlist.xts-design-round .xts-header-el-icon > span[class*="count"], .xts-header-cart.xts-design-count .xts-cart-count, .xts-header-compare.xts-design-count .xts-compare-count, .xts-header-wishlist.xts-design-count .xts-wishlist-count, .xts-header-cart.xts-design-count-alt .xts-cart-count, .xts-header-compare.xts-design-count-alt .xts-compare-count, .xts-header-wishlist.xts-design-count-alt .xts-wishlist-count, .woocommerce-store-notice, .xts-size-guide-table tr:not(:first-child) td:hover, .xts-sticky-cats-title, .xts-visits-count.xts-style-with-bg:before, .xts-pt-signed-icon:after, .xts-prod-design-summary-alt .xts-product:hover .xts-add-cart-btn > a, .xts-prod-design-icons-alt .xts-product:hover .xts-add-cart-btn > a{
	background-color:#3cb8b9;
}

blockquote, .xts-comments-area .comment-reply-link, .xts-comments-area #cancel-comment-reply-link, .xts-comments-area .comment-reply-link:hover, .xts-comments-area #cancel-comment-reply-link:hover, .xts-tags-list > a:hover, .tagcloud > a:hover, .wp-block-pullquote:not(.is-style-solid-color), .xts-button.xts-color-primary.xts-style-bordered, .xts-button.xts-color-primary.xts-style-bordered:hover, .xts-button.xts-color-primary.xts-style-link, .xts-button.xts-color-primary.xts-style-link:hover, .xts-section-title.xts-design-underline .xts-section-title-text, .widget_layered_nav > ul li a:hover:before, .xts-widget-stock-status li a:hover:before, .widget_layered_nav > ul li.chosen a:before, .xts-widget-stock-status li a.xts-selected:before, .xts-tabs-header.xts-design-by-sides-2 .xts-tabs-title-wrapper, .xts-account-links a:hover, .cart_totals, .cart_totals .shipping-calculator-button, .cart_totals .shipping-calculator-button:hover, .xts-checkout-order-review, .xts-clear-filters-btn, .xts-clear-filters-btn:hover, .woocommerce-MyAccount-navigation ul li.is-active a, .woocommerce-MyAccount-navigation ul li:hover a{
	border-color:#3cb8b9;
}

.searchform .searchsubmit, .comment-form input[type="submit"], .wp-block-search .wp-block-search__button, .xts-button.xts-color-primary, .xts-cookies-accept-btn, .wpcf7 [type="submit"], .mc4wp-form [type="submit"], .woocommerce-widget-layered-nav-dropdown__submit, .widget_price_filter .price_slider_amount .button, .woocommerce-mini-cart__buttons .checkout, button[name="track"], .xts-wtl-form .button, .xts-popup-pt :is(.xts-pt-add, .xts-close-popup), .xts-desired-price-save, .xts-cart-actions .button[name="apply_coupon"], .cart_totals .checkout-button, .shipping-calculator-form .button, .checkout_coupon .button, #place_order, .woocommerce-orders-table__cell-order-actions > a, .woocommerce-MyAccount-downloads-file, button[name=save_account_details], button[name=save_address], .woocommerce-form-login button, .woocommerce-form-register button, .lost_reset_password button, .xts-compare-table .button, .return-to-shop .button, .xts-product-add-btn > a, .single_add_to_cart_button, .xts-buy-now-btn{
	background-color:#3cb8b9;
}
.searchform .searchsubmit:hover, .comment-form input[type="submit"]:hover, .wp-block-search .wp-block-search__button:hover, .xts-button.xts-color-primary:hover, .xts-cookies-accept-btn:hover, .wpcf7 [type="submit"]:hover, .mc4wp-form [type="submit"]:hover, .woocommerce-widget-layered-nav-dropdown__submit:hover, .widget_price_filter .price_slider_amount .button:hover, .woocommerce-mini-cart__buttons .checkout:hover, button[name="track"]:hover, .xts-wtl-form .button:hover, .xts-popup-pt :is(.xts-pt-add:hover, .xts-close-popup):hover, .xts-desired-price-save:hover, .xts-cart-actions .button[name="apply_coupon"]:hover, .cart_totals .checkout-button:hover, .shipping-calculator-form .button:hover, .checkout_coupon .button:hover, #place_order:hover, .woocommerce-orders-table__cell-order-actions > a:hover, .woocommerce-MyAccount-downloads-file:hover, button[name=save_account_details]:hover, button[name=save_address]:hover, .woocommerce-form-login button:hover, .woocommerce-form-register button:hover, .lost_reset_password button:hover, .xts-compare-table .button:hover, .return-to-shop .button:hover, .xts-product-add-btn > a:hover, .single_add_to_cart_button:hover, .xts-buy-now-btn:hover{
	background-color:rgba(56, 171, 172, 1);
}

.title.xts-textcolor-secondary, .xts-textcolor-secondary, .xts-scheme-light .xts-textcolor-secondary, .xts-scheme-dark .xts-textcolor-secondary, .xts-button.xts-color-secondary.xts-style-bordered, .xts-button.xts-color-secondary.xts-style-bordered:hover, .xts-button.xts-color-secondary.xts-style-link-3, .xts-button.xts-color-secondary.xts-style-link-3:hover{
	color:#333333;
}

.xts-bgcolor-secondary, .xts-nav-label.xts-color-secondary, .xts-countdown-timer.xts-style-default.xts-bg-color-secondary .xts-countdown-item, .xts-countdown-timer.xts-style-inline.xts-bg-color-secondary .xts-countdown-timer-inner{
	background-color:#333333;
}

.xts-button.xts-color-secondary.xts-style-bordered, .xts-button.xts-color-secondary.xts-style-bordered:hover, .xts-button.xts-color-secondary.xts-style-link, .xts-button.xts-color-secondary.xts-style-link:hover{
	border-color:#333333;
}

.xts-button.xts-color-secondary{
	background-color:#333333;
}
.xts-button.xts-color-secondary:hover{
	background-color:rgba(47, 47, 47, 1);
}

@font-face {
	font-weight: normal;
	font-style: normal;
	font-family: "font-icon";
	src: url("//smarthometop.com/wp-content/themes/xts-hitek/fonts/font-icon.woff") format("woff"),
	url("//smarthometop.com/wp-content/themes/xts-hitek/fonts/font-icon.woff2") format("woff2");
}


.container {
	max-width: 1400px;
}

:root{
	--xts-container-w: 1400px;
}

.elementor-section.xts-section-stretch > .elementor-column-gap-no {
	max-width: 1370px;
}

.elementor-section.xts-section-stretch > .elementor-column-gap-narrow {
	max-width: 1380px;
}

.elementor-section.xts-section-stretch > .elementor-column-gap-default {
	max-width: 1390px;
}

.elementor-section.xts-section-stretch > .elementor-column-gap-extended {
	max-width: 1400px;
}

.elementor-section.xts-section-stretch > .elementor-column-gap-wide {
	max-width: 1410px;
}

.elementor-section.xts-section-stretch > .elementor-column-gap-wider {
	max-width: 1430px;
}

@media (min-width: 1417px) {
	.platform-Windows .xts-section-stretch > .elementor-container {
		margin-left: auto;
		margin-right: auto;
	}
}

@media (min-width: 1400px) {
	html:not(.platform-Windows) .xts-section-stretch > .elementor-container {
		margin-left: auto;
		margin-right: auto;
	}
}


/* Quick view */
.xts-quick-view-popup {
	max-width: 920px;
}

/* Promo popup */
.xts-promo-popup {
	max-width: 800px;
}

/* Blog single content boxed */

/* Header Boxed */
.xts-header.xts-design-boxed:not(.xts-full-width) .xts-header-main {
	max-width: 1370px;
}

.xts-widget-filter .xts-scroll-content {
	max-height: 280px;
}
.xts-product-add-btn .xts-add-to-cart {
    color: #ffffff;          /* Màu chữ (Ví dụ: Màu trắng) */
    background-color: #ff5722; /* Màu nền (Ví dụ: Màu cam) */
    border-color: #ff5722;     /* Màu viền (nếu có) */
}

/* Hiệu ứng khi rê chuột vào (Hover) */
.xts-product-add-btn .xts-add-to-cart:hover {
    color: #ffffff;
    background-color: #e64a19; /* Màu nền tối hơn một chút khi hover */
}
.xts-product-add-btn .xts-add-to-cart {
    background: linear-gradient(135deg, #3cb8b9 0%, #1a5d67 100%) !important;
    color: #ffffff !important;
    border: none !important;
    transition: all 0.3s ease;
}

/* Khi di chuột vào (Hover) -> Nút sáng lên hoặc đảo chiều gradient */
.xts-product-add-btn .xts-add-to-cart:hover {
    background: linear-gradient(135deg, #4ad2d3 0%, #227581 100%) !important;
    box-shadow: 0 4px 15px rgba(60, 184, 185, 0.4);
}
.page-numbers.current {
    background: linear-gradient(135deg, #3cb8b9 0%, #1a5d67 100%) !important;
    color: #ffffff !important; /* Màu số trắng để nổi bật trên nền tối */
    padding: 6px 12px;         /* Tạo khoảng cách xung quanh số */
    border-radius: 4px;        /* Bo góc nhẹ cho hiện đại */
    font-weight: bold;
    display: inline-block;
}
/* ==========================================================================
   1. ĐỔI MÀU THANH SLIDER (DẢI KHOẢNG GIÁ ĐÃ CHỌN)
   ========================================================================== */
.price_slider_wrapper .ui-slider .ui-slider-range {
    background: linear-gradient(90deg, #3cb8b9 0%, #1a5d67 100%) !important; /* Gradient ngang theo logo */
    height: 100%;
}

/* Thanh nền xám mặc định (khoảng giá chưa chọn) - Bạn có thể chỉnh cho thanh mảnh và gọn hơn */
.price_slider_wrapper .ui-slider-horizontal {
    background-color: #e9e9e9 !important;
    height: 5px !important; /* Làm thanh slider thanh mảnh, hiện đại hơn */
    border: none !important;
}

/* ==========================================================================
   2. ĐỔI MÀU 2 NÚT KÉO (SLIDER HANDLES)
   ========================================================================== */
.price_slider_wrapper .ui-slider .ui-slider-handle {
    background-color: #ffffff !important;   /* Nền nút màu trắng */
    border: 3px solid #29a1a4 !important;    /* Viền màu xanh ngọc thương hiệu */
    border-radius: 50% !important;           /* Biến nút kéo thành hình tròn tinh tế */
    top: -5px !important;                    /* Căn chỉnh lại vị trí cho vừa vặn với thanh 5px */
    width: 15px !important;
    height: 15px !important;
    cursor: pointer;
    box-shadow: 0 2px 5px rgba(0,0,0,0.15);
    transition: transform 0.1s ease, border-color 0.2s ease;
}

/* Hiệu ứng khi người dùng click giữ hoặc di chuột vào nút kéo */
.price_slider_wrapper .ui-slider .ui-slider-handle:hover,
.price_slider_wrapper .ui-slider .ui-slider-handle:focus {
    border-color: #1a5d67 !important;       /* Chuyển sang xanh đậm khi tương tác */
    transform: scale(1.1);                   /* Phóng to nhẹ một chút để tạo trải nghiệm tốt */
    outline: none;
}

/* ==========================================================================
   3. ĐỔI MÀU NÚT "FILTER" (LỌC)
   ========================================================================== */
.price_slider_amount .button {
    background-color: #29a1a4 !important;    /* Nền phẳng màu xanh ngọc thương hiệu */
    color: #ffffff !important;               /* Chữ trắng */
    border: 1px solid #29a1a4 !important;
    padding: 6px 15px !important;
    font-weight: 600 !important;
    text-transform: uppercase;               /* Chữ in hoa cho mạnh mẽ */
    letter-spacing: 0.5px;
    border-radius: 4px !important;           /* Bo góc nhẹ đồng bộ website */
    transition: all 0.3s ease !important;
}

/* Hiệu ứng khi di chuột vào nút Filter */
.price_slider_amount .button:hover {
    background-color: #1a5d67 !important;    /* Đổi sang màu xanh đậm của logo */
    border-color: #1a5d67 !important;
    box-shadow: 0 3px 10px rgba(26, 93, 103, 0.3);
}
/* 1. Màu cho dòng đang được chọn hoặc khi di chuột qua (Hover) */
.select2-results__option--highlighted {
    background-color: #29a1a4 !important; /* Nền xanh ngọc theo logo */
    color: #ffffff !important;            /* Chữ trắng */
}

/* 2. Màu cho các dòng bình thường (chưa hover) */
.select2-results__option {
    color: #1a5d67 !important;            /* Chữ màu xanh đậm cho dễ đọc */
    background-color: #ffffff !important; /* Nền trắng */
}
/* Chỉ đổi màu dòng khi di chuột (hover) vào */
.select2-results__options .select2-results__option:hover,
.select2-results__option--highlighted {
    background-color: #29a1a4 !important; /* Nền xanh ngọc */
    color: #ffffff !important;            /* Chữ trắng */
}

/* CHỈ ĐỔI MÀU KHỐI BÊN PHẢI (Miễn phí vận chuyển, Hotline 24/7) */
.xts-header-col.xts-end .xts-box-desc[data-elementor-setting-key="description"] {
    color: #29a1a4 !important; /* Màu xanh ngọc từ logo */
    font-weight: 500;
}
.xts-sticky-cats-title {
    background-color: #29a1a4 !important; /* Nền xanh ngọc */
}

.xts-sticky-cats-title span {
    color: #ffffff !important;            /* Chữ trắng */
    font-weight: 600;                      /* Làm đậm chữ một chút */
}
.xts-cart-count {
    background-color: #29a1a4 !important; /* Nền xanh ngọc */
    color: #ffffff !important;            /* Màu số trắng */
    padding: 2px 6px;                     /* Tạo khoảng cách xung quanh số */
    border-radius: 50%;                   /* Bo tròn dạng vòng tròn nhỏ */
    font-weight: bold;
    display: inline-block;
}

/* Đổi màu chữ "items" đi kèm thành màu xanh đậm để dễ nhìn */
.xts-cart-count span {
    color: #1a5d67 !important;
    margin-left: 3px;
    font-weight: normal;
}
/* Chỉ đổi màu nền và màu icon khi hover */
.xts-scroll-to-top:hover {
    background-color: #1a5d67 !important; /* Chuyển sang xanh đậm thương hiệu */
    color: #ffffff !important;            /* Đảm bảo mũi tên bên trong màu trắng */
}
/* Đổi màu cho "hình ảnh" mũi tên bên trong nút */
.xts-post-control::before,
.xts-post-control::after {
    color: #ffffff !important; /* Đổi màu mũi tên thành màu trắng (hoặc mã màu bạn muốn) */
    fill: #ffffff !important;  /* Ép mã màu nếu mũi tên đó là dạng SVG */
}

/* Đổi luôn nền của nút cho khớp với mũi tên trắng */
.xts-post-control {
    background-color: #29a1a4 !important; /* Nền xanh ngọc */
    border-color: #29a1a4 !important;
}
/* 1. Màu mặc định của nút Return to shop */
.button.wc-backward {
    background-color: #29a1a4 !important; /* Nền màu xanh ngọc */
    color: #ffffff !important;            /* Chữ trắng */
    border: 1px solid #29a1a4 !important;
    font-weight: 600 !important;
    text-transform: uppercase;            /* In hoa chữ cho mạnh mẽ (tùy chọn) */
    border-radius: 4px !important;        /* Bo góc nhẹ cho hiện đại */
    transition: all 0.3s ease !important; /* Hiệu ứng chuyển màu mượt mà */
}

/* 2. Màu khi di chuột vào (Hover) */
.button.wc-backward:hover {
    background-color: #1a5d67 !important; /* Nền chuyển sang xanh đậm */
    border-color: #1a5d67 !important;
    box-shadow: 0 4px 12px rgba(26, 93, 103, 0.3); /* Tạo hiệu ứng đổ bóng nhẹ */
}
/* 1. Triệt hạ thanh cuộn trên toàn bộ khối danh mục và các thẻ con bên trong */
.xts-sticky-cats, 
.xts-sticky-cats *,
.xts-nav-sticky-cat {
    scrollbar-width: none !important; /* Ẩn cho Firefox */
    -ms-overflow-style: none !important; /* Ẩn cho IE/Edge cũ */
}

/* 2. Ẩn thanh cuộn cho Chrome, Safari, Edge mới trên toàn bộ các thẻ liên quan */
.xts-sticky-cats::-webkit-scrollbar,
.xts-sticky-cats *::-webkit-scrollbar,
.xts-nav-sticky-cat::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    background: transparent !important;
}

/* 3. Đảm bảo chiều cao hợp lý và giữ tính năng cuộn bằng chuột/vân tay */
.xts-sticky-cats {
    max-height: 100vh !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}@media (min-width: 1025px) {
	.xts-product-add-btn .xts-add-to-cart {
    color: #ffffff;          /* Màu chữ (Ví dụ: Màu trắng) */
    background-color: #ff5722; /* Màu nền (Ví dụ: Màu cam) */
    border-color: #ff5722;     /* Màu viền (nếu có) */
}

/* Hiệu ứng khi rê chuột vào (Hover) */
.xts-product-add-btn .xts-add-to-cart:hover {
    color: #ffffff;
    background-color: #e64a19; /* Màu nền tối hơn một chút khi hover */
}
.xts-product-add-btn .xts-add-to-cart {
    background: linear-gradient(135deg, #3cb8b9 0%, #1a5d67 100%) !important;
    color: #ffffff !important;
    border: none !important;
    transition: all 0.3s ease;
}

/* Khi di chuột vào (Hover) -> Nút sáng lên hoặc đảo chiều gradient */
.xts-product-add-btn .xts-add-to-cart:hover {
    background: linear-gradient(135deg, #4ad2d3 0%, #227581 100%) !important;
    box-shadow: 0 4px 15px rgba(60, 184, 185, 0.4);
}
.page-numbers.current {
    background: linear-gradient(135deg, #3cb8b9 0%, #1a5d67 100%) !important;
    color: #ffffff !important; /* Màu số trắng để nổi bật trên nền tối */
    padding: 6px 12px;         /* Tạo khoảng cách xung quanh số */
    border-radius: 4px;        /* Bo góc nhẹ cho hiện đại */
    font-weight: bold;
    display: inline-block;
}
/* ==========================================================================
   1. ĐỔI MÀU THANH SLIDER (DẢI KHOẢNG GIÁ ĐÃ CHỌN)
   ========================================================================== */
.price_slider_wrapper .ui-slider .ui-slider-range {
    background: linear-gradient(90deg, #3cb8b9 0%, #1a5d67 100%) !important; /* Gradient ngang theo logo */
    height: 100%;
}

/* Thanh nền xám mặc định (khoảng giá chưa chọn) - Bạn có thể chỉnh cho thanh mảnh và gọn hơn */
.price_slider_wrapper .ui-slider-horizontal {
    background-color: #e9e9e9 !important;
    height: 5px !important; /* Làm thanh slider thanh mảnh, hiện đại hơn */
    border: none !important;
}

/* ==========================================================================
   2. ĐỔI MÀU 2 NÚT KÉO (SLIDER HANDLES)
   ========================================================================== */
.price_slider_wrapper .ui-slider .ui-slider-handle {
    background-color: #ffffff !important;   /* Nền nút màu trắng */
    border: 3px solid #29a1a4 !important;    /* Viền màu xanh ngọc thương hiệu */
    border-radius: 50% !important;           /* Biến nút kéo thành hình tròn tinh tế */
    top: -5px !important;                    /* Căn chỉnh lại vị trí cho vừa vặn với thanh 5px */
    width: 15px !important;
    height: 15px !important;
    cursor: pointer;
    box-shadow: 0 2px 5px rgba(0,0,0,0.15);
    transition: transform 0.1s ease, border-color 0.2s ease;
}

/* Hiệu ứng khi người dùng click giữ hoặc di chuột vào nút kéo */
.price_slider_wrapper .ui-slider .ui-slider-handle:hover,
.price_slider_wrapper .ui-slider .ui-slider-handle:focus {
    border-color: #1a5d67 !important;       /* Chuyển sang xanh đậm khi tương tác */
    transform: scale(1.1);                   /* Phóng to nhẹ một chút để tạo trải nghiệm tốt */
    outline: none;
}

/* ==========================================================================
   3. ĐỔI MÀU NÚT "FILTER" (LỌC)
   ========================================================================== */
.price_slider_amount .button {
    background-color: #29a1a4 !important;    /* Nền phẳng màu xanh ngọc thương hiệu */
    color: #ffffff !important;               /* Chữ trắng */
    border: 1px solid #29a1a4 !important;
    padding: 6px 15px !important;
    font-weight: 600 !important;
    text-transform: uppercase;               /* Chữ in hoa cho mạnh mẽ */
    letter-spacing: 0.5px;
    border-radius: 4px !important;           /* Bo góc nhẹ đồng bộ website */
    transition: all 0.3s ease !important;
}

/* Hiệu ứng khi di chuột vào nút Filter */
.price_slider_amount .button:hover {
    background-color: #1a5d67 !important;    /* Đổi sang màu xanh đậm của logo */
    border-color: #1a5d67 !important;
    box-shadow: 0 3px 10px rgba(26, 93, 103, 0.3);
}
/* 1. Màu cho dòng đang được chọn hoặc khi di chuột qua (Hover) */
.select2-results__option--highlighted {
    background-color: #29a1a4 !important; /* Nền xanh ngọc theo logo */
    color: #ffffff !important;            /* Chữ trắng */
}

/* 2. Màu cho các dòng bình thường (chưa hover) */
.select2-results__option {
    color: #1a5d67 !important;            /* Chữ màu xanh đậm cho dễ đọc */
    background-color: #ffffff !important; /* Nền trắng */
}
/* Chỉ đổi màu dòng khi di chuột (hover) vào */
.select2-results__options .select2-results__option:hover,
.select2-results__option--highlighted {
    background-color: #29a1a4 !important; /* Nền xanh ngọc */
    color: #ffffff !important;            /* Chữ trắng */
}

/* CHỈ ĐỔI MÀU KHỐI BÊN PHẢI (Miễn phí vận chuyển, Hotline 24/7) */
.xts-header-col.xts-end .xts-box-desc[data-elementor-setting-key="description"] {
    color: #29a1a4 !important; /* Màu xanh ngọc từ logo */
    font-weight: 500;
}
.xts-sticky-cats-title {
    background-color: #29a1a4 !important; /* Nền xanh ngọc */
}

.xts-sticky-cats-title span {
    color: #ffffff !important;            /* Chữ trắng */
    font-weight: 600;                      /* Làm đậm chữ một chút */
}
.xts-cart-count {
    background-color: #29a1a4 !important; /* Nền xanh ngọc */
    color: #ffffff !important;            /* Màu số trắng */
    padding: 2px 6px;                     /* Tạo khoảng cách xung quanh số */
    border-radius: 50%;                   /* Bo tròn dạng vòng tròn nhỏ */
    font-weight: bold;
    display: inline-block;
}

/* Đổi màu chữ "items" đi kèm thành màu xanh đậm để dễ nhìn */
.xts-cart-count span {
    color: #1a5d67 !important;
    margin-left: 3px;
    font-weight: normal;
}
/* Chỉ đổi màu nền và màu icon khi hover */
.xts-scroll-to-top:hover {
    background-color: #1a5d67 !important; /* Chuyển sang xanh đậm thương hiệu */
    color: #ffffff !important;            /* Đảm bảo mũi tên bên trong màu trắng */
}
/* Đổi màu cho "hình ảnh" mũi tên bên trong nút */
.xts-post-control::before,
.xts-post-control::after {
    color: #ffffff !important; /* Đổi màu mũi tên thành màu trắng (hoặc mã màu bạn muốn) */
    fill: #ffffff !important;  /* Ép mã màu nếu mũi tên đó là dạng SVG */
}

/* Đổi luôn nền của nút cho khớp với mũi tên trắng */
.xts-post-control {
    background-color: #29a1a4 !important; /* Nền xanh ngọc */
    border-color: #29a1a4 !important;
}
/* 1. Màu mặc định của nút Return to shop */
.button.wc-backward {
    background-color: #29a1a4 !important; /* Nền màu xanh ngọc */
    color: #ffffff !important;            /* Chữ trắng */
    border: 1px solid #29a1a4 !important;
    font-weight: 600 !important;
    text-transform: uppercase;            /* In hoa chữ cho mạnh mẽ (tùy chọn) */
    border-radius: 4px !important;        /* Bo góc nhẹ cho hiện đại */
    transition: all 0.3s ease !important; /* Hiệu ứng chuyển màu mượt mà */
}

/* 2. Màu khi di chuột vào (Hover) */
.button.wc-backward:hover {
    background-color: #1a5d67 !important; /* Nền chuyển sang xanh đậm */
    border-color: #1a5d67 !important;
    box-shadow: 0 4px 12px rgba(26, 93, 103, 0.3); /* Tạo hiệu ứng đổ bóng nhẹ */
}
/* 1. Triệt hạ thanh cuộn trên toàn bộ khối danh mục và các thẻ con bên trong */
.xts-sticky-cats, 
.xts-sticky-cats *,
.xts-nav-sticky-cat {
    scrollbar-width: none !important; /* Ẩn cho Firefox */
    -ms-overflow-style: none !important; /* Ẩn cho IE/Edge cũ */
}

/* 2. Ẩn thanh cuộn cho Chrome, Safari, Edge mới trên toàn bộ các thẻ liên quan */
.xts-sticky-cats::-webkit-scrollbar,
.xts-sticky-cats *::-webkit-scrollbar,
.xts-nav-sticky-cat::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    background: transparent !important;
}

/* 3. Đảm bảo chiều cao hợp lý và giữ tính năng cuộn bằng chuột/vân tay */
.xts-sticky-cats {
    max-height: 100vh !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}
}

@media (min-width: 768px) and (max-width: 1024px) {
	.xts-product-add-btn .xts-add-to-cart {
    color: #ffffff;          /* Màu chữ (Ví dụ: Màu trắng) */
    background-color: #ff5722; /* Màu nền (Ví dụ: Màu cam) */
    border-color: #ff5722;     /* Màu viền (nếu có) */
}

/* Hiệu ứng khi rê chuột vào (Hover) */
.xts-product-add-btn .xts-add-to-cart:hover {
    color: #ffffff;
    background-color: #e64a19; /* Màu nền tối hơn một chút khi hover */
}
.xts-product-add-btn .xts-add-to-cart {
    background: linear-gradient(135deg, #3cb8b9 0%, #1a5d67 100%) !important;
    color: #ffffff !important;
    border: none !important;
    transition: all 0.3s ease;
}

/* Khi di chuột vào (Hover) -> Nút sáng lên hoặc đảo chiều gradient */
.xts-product-add-btn .xts-add-to-cart:hover {
    background: linear-gradient(135deg, #4ad2d3 0%, #227581 100%) !important;
    box-shadow: 0 4px 15px rgba(60, 184, 185, 0.4);
}
.page-numbers.current {
    background: linear-gradient(135deg, #3cb8b9 0%, #1a5d67 100%) !important;
    color: #ffffff !important; /* Màu số trắng để nổi bật trên nền tối */
    padding: 6px 12px;         /* Tạo khoảng cách xung quanh số */
    border-radius: 4px;        /* Bo góc nhẹ cho hiện đại */
    font-weight: bold;
    display: inline-block;
}
/* ==========================================================================
   1. ĐỔI MÀU THANH SLIDER (DẢI KHOẢNG GIÁ ĐÃ CHỌN)
   ========================================================================== */
.price_slider_wrapper .ui-slider .ui-slider-range {
    background: linear-gradient(90deg, #3cb8b9 0%, #1a5d67 100%) !important; /* Gradient ngang theo logo */
    height: 100%;
}

/* Thanh nền xám mặc định (khoảng giá chưa chọn) - Bạn có thể chỉnh cho thanh mảnh và gọn hơn */
.price_slider_wrapper .ui-slider-horizontal {
    background-color: #e9e9e9 !important;
    height: 5px !important; /* Làm thanh slider thanh mảnh, hiện đại hơn */
    border: none !important;
}

/* ==========================================================================
   2. ĐỔI MÀU 2 NÚT KÉO (SLIDER HANDLES)
   ========================================================================== */
.price_slider_wrapper .ui-slider .ui-slider-handle {
    background-color: #ffffff !important;   /* Nền nút màu trắng */
    border: 3px solid #29a1a4 !important;    /* Viền màu xanh ngọc thương hiệu */
    border-radius: 50% !important;           /* Biến nút kéo thành hình tròn tinh tế */
    top: -5px !important;                    /* Căn chỉnh lại vị trí cho vừa vặn với thanh 5px */
    width: 15px !important;
    height: 15px !important;
    cursor: pointer;
    box-shadow: 0 2px 5px rgba(0,0,0,0.15);
    transition: transform 0.1s ease, border-color 0.2s ease;
}

/* Hiệu ứng khi người dùng click giữ hoặc di chuột vào nút kéo */
.price_slider_wrapper .ui-slider .ui-slider-handle:hover,
.price_slider_wrapper .ui-slider .ui-slider-handle:focus {
    border-color: #1a5d67 !important;       /* Chuyển sang xanh đậm khi tương tác */
    transform: scale(1.1);                   /* Phóng to nhẹ một chút để tạo trải nghiệm tốt */
    outline: none;
}

/* ==========================================================================
   3. ĐỔI MÀU NÚT "FILTER" (LỌC)
   ========================================================================== */
.price_slider_amount .button {
    background-color: #29a1a4 !important;    /* Nền phẳng màu xanh ngọc thương hiệu */
    color: #ffffff !important;               /* Chữ trắng */
    border: 1px solid #29a1a4 !important;
    padding: 6px 15px !important;
    font-weight: 600 !important;
    text-transform: uppercase;               /* Chữ in hoa cho mạnh mẽ */
    letter-spacing: 0.5px;
    border-radius: 4px !important;           /* Bo góc nhẹ đồng bộ website */
    transition: all 0.3s ease !important;
}

/* Hiệu ứng khi di chuột vào nút Filter */
.price_slider_amount .button:hover {
    background-color: #1a5d67 !important;    /* Đổi sang màu xanh đậm của logo */
    border-color: #1a5d67 !important;
    box-shadow: 0 3px 10px rgba(26, 93, 103, 0.3);
}
/* 1. Màu cho dòng đang được chọn hoặc khi di chuột qua (Hover) */
.select2-results__option--highlighted {
    background-color: #29a1a4 !important; /* Nền xanh ngọc theo logo */
    color: #ffffff !important;            /* Chữ trắng */
}

/* 2. Màu cho các dòng bình thường (chưa hover) */
.select2-results__option {
    color: #1a5d67 !important;            /* Chữ màu xanh đậm cho dễ đọc */
    background-color: #ffffff !important; /* Nền trắng */
}
/* Chỉ đổi màu dòng khi di chuột (hover) vào */
.select2-results__options .select2-results__option:hover,
.select2-results__option--highlighted {
    background-color: #29a1a4 !important; /* Nền xanh ngọc */
    color: #ffffff !important;            /* Chữ trắng */
}

/* CHỈ ĐỔI MÀU KHỐI BÊN PHẢI (Miễn phí vận chuyển, Hotline 24/7) */
.xts-header-col.xts-end .xts-box-desc[data-elementor-setting-key="description"] {
    color: #29a1a4 !important; /* Màu xanh ngọc từ logo */
    font-weight: 500;
}
.xts-sticky-cats-title {
    background-color: #29a1a4 !important; /* Nền xanh ngọc */
}

.xts-sticky-cats-title span {
    color: #ffffff !important;            /* Chữ trắng */
    font-weight: 600;                      /* Làm đậm chữ một chút */
}
.xts-cart-count {
    background-color: #29a1a4 !important; /* Nền xanh ngọc */
    color: #ffffff !important;            /* Màu số trắng */
    padding: 2px 6px;                     /* Tạo khoảng cách xung quanh số */
    border-radius: 50%;                   /* Bo tròn dạng vòng tròn nhỏ */
    font-weight: bold;
    display: inline-block;
}

/* Đổi màu chữ "items" đi kèm thành màu xanh đậm để dễ nhìn */
.xts-cart-count span {
    color: #1a5d67 !important;
    margin-left: 3px;
    font-weight: normal;
}
/* Chỉ đổi màu nền và màu icon khi hover */
.xts-scroll-to-top:hover {
    background-color: #1a5d67 !important; /* Chuyển sang xanh đậm thương hiệu */
    color: #ffffff !important;            /* Đảm bảo mũi tên bên trong màu trắng */
}
/* Đổi màu cho "hình ảnh" mũi tên bên trong nút */
.xts-post-control::before,
.xts-post-control::after {
    color: #ffffff !important; /* Đổi màu mũi tên thành màu trắng (hoặc mã màu bạn muốn) */
    fill: #ffffff !important;  /* Ép mã màu nếu mũi tên đó là dạng SVG */
}

/* Đổi luôn nền của nút cho khớp với mũi tên trắng */
.xts-post-control {
    background-color: #29a1a4 !important; /* Nền xanh ngọc */
    border-color: #29a1a4 !important;
}
/* 1. Màu mặc định của nút Return to shop */
.button.wc-backward {
    background-color: #29a1a4 !important; /* Nền màu xanh ngọc */
    color: #ffffff !important;            /* Chữ trắng */
    border: 1px solid #29a1a4 !important;
    font-weight: 600 !important;
    text-transform: uppercase;            /* In hoa chữ cho mạnh mẽ (tùy chọn) */
    border-radius: 4px !important;        /* Bo góc nhẹ cho hiện đại */
    transition: all 0.3s ease !important; /* Hiệu ứng chuyển màu mượt mà */
}

/* 2. Màu khi di chuột vào (Hover) */
.button.wc-backward:hover {
    background-color: #1a5d67 !important; /* Nền chuyển sang xanh đậm */
    border-color: #1a5d67 !important;
    box-shadow: 0 4px 12px rgba(26, 93, 103, 0.3); /* Tạo hiệu ứng đổ bóng nhẹ */
}
/* 1. Triệt hạ thanh cuộn trên toàn bộ khối danh mục và các thẻ con bên trong */
.xts-sticky-cats, 
.xts-sticky-cats *,
.xts-nav-sticky-cat {
    scrollbar-width: none !important; /* Ẩn cho Firefox */
    -ms-overflow-style: none !important; /* Ẩn cho IE/Edge cũ */
}

/* 2. Ẩn thanh cuộn cho Chrome, Safari, Edge mới trên toàn bộ các thẻ liên quan */
.xts-sticky-cats::-webkit-scrollbar,
.xts-sticky-cats *::-webkit-scrollbar,
.xts-nav-sticky-cat::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    background: transparent !important;
}

/* 3. Đảm bảo chiều cao hợp lý và giữ tính năng cuộn bằng chuột/vân tay */
.xts-sticky-cats {
    max-height: 100vh !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}
}

@media (max-width: 767px) {
	.xts-product-add-btn .xts-add-to-cart {
    color: #ffffff;          /* Màu chữ (Ví dụ: Màu trắng) */
    background-color: #ff5722; /* Màu nền (Ví dụ: Màu cam) */
    border-color: #ff5722;     /* Màu viền (nếu có) */
}

/* Hiệu ứng khi rê chuột vào (Hover) */
.xts-product-add-btn .xts-add-to-cart:hover {
    color: #ffffff;
    background-color: #e64a19; /* Màu nền tối hơn một chút khi hover */
}
.xts-product-add-btn .xts-add-to-cart {
    background: linear-gradient(135deg, #3cb8b9 0%, #1a5d67 100%) !important;
    color: #ffffff !important;
    border: none !important;
    transition: all 0.3s ease;
}

/* Khi di chuột vào (Hover) -> Nút sáng lên hoặc đảo chiều gradient */
.xts-product-add-btn .xts-add-to-cart:hover {
    background: linear-gradient(135deg, #4ad2d3 0%, #227581 100%) !important;
    box-shadow: 0 4px 15px rgba(60, 184, 185, 0.4);
}
.page-numbers.current {
    background: linear-gradient(135deg, #3cb8b9 0%, #1a5d67 100%) !important;
    color: #ffffff !important; /* Màu số trắng để nổi bật trên nền tối */
    padding: 6px 12px;         /* Tạo khoảng cách xung quanh số */
    border-radius: 4px;        /* Bo góc nhẹ cho hiện đại */
    font-weight: bold;
    display: inline-block;
}
/* ==========================================================================
   1. ĐỔI MÀU THANH SLIDER (DẢI KHOẢNG GIÁ ĐÃ CHỌN)
   ========================================================================== */
.price_slider_wrapper .ui-slider .ui-slider-range {
    background: linear-gradient(90deg, #3cb8b9 0%, #1a5d67 100%) !important; /* Gradient ngang theo logo */
    height: 100%;
}

/* Thanh nền xám mặc định (khoảng giá chưa chọn) - Bạn có thể chỉnh cho thanh mảnh và gọn hơn */
.price_slider_wrapper .ui-slider-horizontal {
    background-color: #e9e9e9 !important;
    height: 5px !important; /* Làm thanh slider thanh mảnh, hiện đại hơn */
    border: none !important;
}

/* ==========================================================================
   2. ĐỔI MÀU 2 NÚT KÉO (SLIDER HANDLES)
   ========================================================================== */
.price_slider_wrapper .ui-slider .ui-slider-handle {
    background-color: #ffffff !important;   /* Nền nút màu trắng */
    border: 3px solid #29a1a4 !important;    /* Viền màu xanh ngọc thương hiệu */
    border-radius: 50% !important;           /* Biến nút kéo thành hình tròn tinh tế */
    top: -5px !important;                    /* Căn chỉnh lại vị trí cho vừa vặn với thanh 5px */
    width: 15px !important;
    height: 15px !important;
    cursor: pointer;
    box-shadow: 0 2px 5px rgba(0,0,0,0.15);
    transition: transform 0.1s ease, border-color 0.2s ease;
}

/* Hiệu ứng khi người dùng click giữ hoặc di chuột vào nút kéo */
.price_slider_wrapper .ui-slider .ui-slider-handle:hover,
.price_slider_wrapper .ui-slider .ui-slider-handle:focus {
    border-color: #1a5d67 !important;       /* Chuyển sang xanh đậm khi tương tác */
    transform: scale(1.1);                   /* Phóng to nhẹ một chút để tạo trải nghiệm tốt */
    outline: none;
}

/* ==========================================================================
   3. ĐỔI MÀU NÚT "FILTER" (LỌC)
   ========================================================================== */
.price_slider_amount .button {
    background-color: #29a1a4 !important;    /* Nền phẳng màu xanh ngọc thương hiệu */
    color: #ffffff !important;               /* Chữ trắng */
    border: 1px solid #29a1a4 !important;
    padding: 6px 15px !important;
    font-weight: 600 !important;
    text-transform: uppercase;               /* Chữ in hoa cho mạnh mẽ */
    letter-spacing: 0.5px;
    border-radius: 4px !important;           /* Bo góc nhẹ đồng bộ website */
    transition: all 0.3s ease !important;
}

/* Hiệu ứng khi di chuột vào nút Filter */
.price_slider_amount .button:hover {
    background-color: #1a5d67 !important;    /* Đổi sang màu xanh đậm của logo */
    border-color: #1a5d67 !important;
    box-shadow: 0 3px 10px rgba(26, 93, 103, 0.3);
}
/* 1. Màu cho dòng đang được chọn hoặc khi di chuột qua (Hover) */
.select2-results__option--highlighted {
    background-color: #29a1a4 !important; /* Nền xanh ngọc theo logo */
    color: #ffffff !important;            /* Chữ trắng */
}

/* 2. Màu cho các dòng bình thường (chưa hover) */
.select2-results__option {
    color: #1a5d67 !important;            /* Chữ màu xanh đậm cho dễ đọc */
    background-color: #ffffff !important; /* Nền trắng */
}
/* Chỉ đổi màu dòng khi di chuột (hover) vào */
.select2-results__options .select2-results__option:hover,
.select2-results__option--highlighted {
    background-color: #29a1a4 !important; /* Nền xanh ngọc */
    color: #ffffff !important;            /* Chữ trắng */
}

/* CHỈ ĐỔI MÀU KHỐI BÊN PHẢI (Miễn phí vận chuyển, Hotline 24/7) */
.xts-header-col.xts-end .xts-box-desc[data-elementor-setting-key="description"] {
    color: #29a1a4 !important; /* Màu xanh ngọc từ logo */
    font-weight: 500;
}
.xts-sticky-cats-title {
    background-color: #29a1a4 !important; /* Nền xanh ngọc */
}

.xts-sticky-cats-title span {
    color: #ffffff !important;            /* Chữ trắng */
    font-weight: 600;                      /* Làm đậm chữ một chút */
}
.xts-cart-count {
    background-color: #29a1a4 !important; /* Nền xanh ngọc */
    color: #ffffff !important;            /* Màu số trắng */
    padding: 2px 6px;                     /* Tạo khoảng cách xung quanh số */
    border-radius: 50%;                   /* Bo tròn dạng vòng tròn nhỏ */
    font-weight: bold;
    display: inline-block;
}

/* Đổi màu chữ "items" đi kèm thành màu xanh đậm để dễ nhìn */
.xts-cart-count span {
    color: #1a5d67 !important;
    margin-left: 3px;
    font-weight: normal;
}
/* Chỉ đổi màu nền và màu icon khi hover */
.xts-scroll-to-top:hover {
    background-color: #1a5d67 !important; /* Chuyển sang xanh đậm thương hiệu */
    color: #ffffff !important;            /* Đảm bảo mũi tên bên trong màu trắng */
}
/* Đổi màu cho "hình ảnh" mũi tên bên trong nút */
.xts-post-control::before,
.xts-post-control::after {
    color: #ffffff !important; /* Đổi màu mũi tên thành màu trắng (hoặc mã màu bạn muốn) */
    fill: #ffffff !important;  /* Ép mã màu nếu mũi tên đó là dạng SVG */
}

/* Đổi luôn nền của nút cho khớp với mũi tên trắng */
.xts-post-control {
    background-color: #29a1a4 !important; /* Nền xanh ngọc */
    border-color: #29a1a4 !important;
}
/* 1. Màu mặc định của nút Return to shop */
.button.wc-backward {
    background-color: #29a1a4 !important; /* Nền màu xanh ngọc */
    color: #ffffff !important;            /* Chữ trắng */
    border: 1px solid #29a1a4 !important;
    font-weight: 600 !important;
    text-transform: uppercase;            /* In hoa chữ cho mạnh mẽ (tùy chọn) */
    border-radius: 4px !important;        /* Bo góc nhẹ cho hiện đại */
    transition: all 0.3s ease !important; /* Hiệu ứng chuyển màu mượt mà */
}

/* 2. Màu khi di chuột vào (Hover) */
.button.wc-backward:hover {
    background-color: #1a5d67 !important; /* Nền chuyển sang xanh đậm */
    border-color: #1a5d67 !important;
    box-shadow: 0 4px 12px rgba(26, 93, 103, 0.3); /* Tạo hiệu ứng đổ bóng nhẹ */
}
/* 1. Triệt hạ thanh cuộn trên toàn bộ khối danh mục và các thẻ con bên trong */
.xts-sticky-cats, 
.xts-sticky-cats *,
.xts-nav-sticky-cat {
    scrollbar-width: none !important; /* Ẩn cho Firefox */
    -ms-overflow-style: none !important; /* Ẩn cho IE/Edge cũ */
}

/* 2. Ẩn thanh cuộn cho Chrome, Safari, Edge mới trên toàn bộ các thẻ liên quan */
.xts-sticky-cats::-webkit-scrollbar,
.xts-sticky-cats *::-webkit-scrollbar,
.xts-nav-sticky-cat::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    background: transparent !important;
}

/* 3. Đảm bảo chiều cao hợp lý và giữ tính năng cuộn bằng chuột/vân tay */
.xts-sticky-cats {
    max-height: 100vh !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}
}