@import url('https://fonts.googleapis.com/css2?family=Open+Sans&display=swap');
/* ========================================= */
/* Translate */
/* ========================================= */
.gt_selector option:first-child {
	display: none;
}

.gt_selector {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;

	padding: 6px 28px 6px 10px;
	color: white;
	font-size: 18px;
	background: none;
	border: none;
	background-repeat: no-repeat;
	background-position: right 7px center;
	background-size: 18px;
	cursor: pointer;
	width: 70px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 24 25' fill='none'%3E%3Cpath d='M6 9.59091L12 15.5909L18 9.59091' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
}
.gt_selector option{
	color: black !important;
}

/* ========================================= */
/* WooCommerce Breadcrumbs */
/* ========================================= */
.custom-woo-breadcrumb{
	display: flex; 
	align-items: center; 
	gap:8px;
	font-family:'Open Sans'; 
	font-size: 18px; 
	color: black;
	font-weight: 400;
}
.custom-woo-breadcrumb .breadcrumb-home-icon img{
	width:16px; 
	height:16px; 
	display:block;
}
.woocommerce .woocommerce-breadcrumb {
	margin: 0;
	padding: 0;
}
span.crumb-delimiter img {
	padding-bottom: 2px;
}
.custom-woo-breadcrumb .crumb-delimiter{
	margin:0 2px;
}
.woocommerce-breadcrumb{
	color: black;
}
.custom-woo-breadcrumb a{
	color: #000000; 
	text-decoration:none;
}
.custom-woo-breadcrumb a:hover{
	text-decoration:underline;
}

/* ========================================= */
/* Email Footer */
/* ========================================= */
/* 
.email-footer .custom-email-footer {
display: flex;
align-items: center;
padding: 20px 20px 20px 0;
background-color: #F0F2F4;
width: 100%;
max-width: 500px;
max-height: 52px;
position: relative;
}

.email-footer .custom-email-footer input[type="email"] {
border: none;
background: transparent;
outline: none;
font-size: 16px;
color: #929292;
width: 100%;
font-family: 'Open Sans';
padding-top: 20px;
}

.email-footer .custom-submit-btn {
background: none;
border: none;
cursor: pointer;
padding: 0;
margin-left: 8px;
display: flex;
align-items: center;
padding-top: 10px;
}

.email-footer .custom-submit-btn .arrow-icon {
width: 20px;
height: 20px;
color: #929292;
transition: transform 0.3s ease;
}

.email-footer .custom-submit-btn:hover .arrow-icon {
transform: translateX(4px);
}
*/
.custom-email-footer {
	display: flex;
	--width-btn-submit: 50px;
	height: 50px;
	background-color: #F0F2F4;
}
.custom-email-footer * {
	padding: 0;
	margin: 0;
	border: 0 !important;
	outline: 0;
	background: transparent !important;
	font-family: 'Open Sans';
}

.custom-email-footer .input-with-underline {
	width: calc(100% - var(--width-btn-submit));
}

.custom-email-footer  > p {
	width: var(--width-btn-submit);
}

.custom-email-footer > p > button {
	width: 100%;
	height: 100%;
}
.custom-email-footer > p > button svg {
	width: 24px;
}
.custom-email-footer > p > button svg path{
	stroke: #555555;
}

.custom-email-footer br {
	display: none;
}

.custom-email-footer .input-with-underline p, .custom-email-footer .input-with-underline p span, .custom-email-footer .input-with-underline p span input {
	height: 100%;
	display: block;
}

/* ========================================= */
/*  Css dot slide */
/* ========================================= */
.swiper-pagination{
	margin-top: 50px;
	bottom: -20px !important;
}
.swiper-pagination-bullet {
	width: 50px !important; 
	border-radius: 4px !important;
	background: #2E2D2D;
	height: 1px !important;
	color: #2E2D2D;;
}

.swiper-pagination-bullet-active {
	width: 250px !important;
	background: #570000 !important;
}
@media screen and (max-width: 1199px) {
}

@media screen and (max-width: 1366px) {
}

@media screen and (max-width: 991px) {
	.swiper-pagination-bullet-active {
		width: 100px !important;
	}
	.swiper-pagination-bullet{
		width: 20px !important; 
	}
}

@media screen and (max-width: 768px) {
	.swiper-pagination-bullet-active {
		max-width: 100px !important;
	}
	.swiper-pagination-bullet{
		width: 20px !important; 
	}
}

@media screen and (max-width: 525px) {
	.swiper-pagination-bullet-active {
		width: 100px !important;
	}
	.swiper-pagination-bullet{
		width: 20px !important; 
	}
}
/* ========================================= */
/*  Product Detail */
/* ========================================= */
.single-product form.variations_form .single_add_to_cart_button.disabled,
.single-product form.variations_form .single_add_to_cart_button.wc-variation-selection-needed,
.single-product form.variations_form .single_add_to_cart_button[disabled] {
	display: none !important;
}

svg#yith-wcwl-icon-heart-outline {
	order: 2;
}
.yith-wcwl-add-to-wishlist-button__label {
	color: #570000;
	font: 600 18px "Open sans";
}
.woocommerce div.product div.images .flex-control-thumbs li {
	width: 33%;
}
.wp-post-image{
	object-fit: cover;
	max-height: 30px !important;
}
/* .elementor img a{
object-fit: cover;
max-height: 450px !important;
} */
/* .swiper-wrapper .swiper-slide {
max-height: 410px !important;
} */

/* Sticky */
.swiper.mySwiperThumbnail.swiper-initialized.swiper-horizontal.swiper-watch-progress.swiper-backface-hidden.swiper-thumbs {
	aspect-ratio: 3;
}

ol.flex-control-nav.flex-control-thumbs li img
{
	border-radius: 10px;
}

.elementor-widget-container{
	border-radius: 50px !important;
}

/* Cho Color, Size va gia tri nam cung 1 hang */
.variations tr {
	display: flex;
	align-items: center; 
	gap: 15px; 
}

.variations th.label {
	flex: 0 0 auto;     
	margin: 0;
}

.variations td.value {
	flex: 1;
}

.variable-items-wrapper {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.variable-item-contents{
	padding: 10px !important;
}

td.value.woo-variation-items-wrapper {
	margin-top: 10px;
}

li.variable-item.button-variable-item {
	border-radius: 20px !important;
}

.woocommerce div.product form.cart .variations td, .woocommerce div.product form.cart .variations th {
    display: flex;
    align-items: center;
}

.woo-variation-raw-select {
	display: none !important;
}

button.single_add_to_cart_button.button.alt {
	display: none;
}
.variation tr:hover {
	background-color: #fff;
}

td.value.woo-variation-items-wrapper {
	background: transparent;
}

th.label {
	background: white !important;
	padding: 0;
	font-weight: 600;
	font-size: 18px;
	font-family: 'Open Sans' !important;
}
th.label label{
	font-weight: 600;
	font-size: 18px;
	font-family: 'Open Sans' !important;
}

th.label label::after {
	content: ":";
}
th.label label[for="pa_size"] {
	display: inline-block !important;
/* 	margin-top: -25px !important; */
}

.woo-selected-variation-item-name{
	display: none !important;
}

li.variable-item.button-variable-item.selected {
	background: #570000 !important;
	color: white;
}
.button-variable-item.selected .variable-item-span-button {
	color: white !important;
}
.variable-item.button-variable-item{
	font-size: 18px;
	font-weight: 400;
	font-family: 'Open Sans';
	color: #646464;	
}
.woocommerce-variation.single_variation{
	display: none;
}
.woocommerce-variation-availability {
	display: none;
}
ul.tabs.wc-tabs {
	display: flex;
	margin: 0 auto !important;
	justify-content: center;
	border-bottom: 1px solid;
	/* width: 100%; */
	/* width: fit-content; */
}
#variation-status{
	font-size: 18px;
	font-weight: 400;
	font-family: 'Open Sans';
	color: #000000;	
}

tbody tr:first-child {
	max-height: 30px !important;
}

/* An sku trong meta product detail */
.variations tr:nth-child(3) { 
	margin-top: -23px;
}

span.sku_wrapper.detail-container .detail-label, span.sku_wrapper.detail-container .sku {
	display: none;
}

.product-sku-row{
	padding-top: 10px;
}
.product-sku-row .label{
	margin-bottom: 7px !important; 
}
th.label label {
    margin-bottom: -5px !important;
}
.product-sku-row .detail-content{
	display: inline-block;
	font-size: 18px;
	font-weight: 400;
	font-family: 'Open Sans';
}

.sku {
	font-weight: normal !important;
}
.detail-content a{
	font-weight: normal !important;
}

a.reset_variations{
    padding: 10px;
	font-family: 'Open Sans';
}

@media screen and (max-width: 525px) {
	.product-sku-row .detail-content{
		font-size: 16px;
	}
}

@media screen and (max-width: 1199px) {
}

@media screen and (max-width: 1366px) {
}

@media screen and (max-width: 991px) {
	tbody tr:first-child {
		min-height: 50px !important;
	}
}

@media screen and (max-width: 768px) {
}

@media screen and (max-width: 525px) {
	.variable-items-wrapper {
		gap: 4px;
	}
	.variations tr {
		gap: 4px;
	}	
	.woocommerce div.product .woocommerce-tabs ul.tabs {
		padding: 0;
	}
	ul.tabs.wc-tabs {
		justify-content: space-between;
	}
}
/* ========================================= */
/*  Display list product */
/* ========================================= */
/* Gioi han noi dung san pham cua danh sach */
.product-content {
	display: -webkit-box;
	-webkit-line-clamp: 2; /* số dòng muốn hiển thị */
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.custom-template-header{
	display:flex;
	justify-content:space-between;
	align-items:center;
	margin-bottom: 50px;
}
.custom-template-icons{
	display:flex; 
	gap:10px;
}
.custom-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	grid-gap: 80px 10px;
}

.custom-grid.list-view {
	display: grid;
	grid-template-columns: repeat(1, 1fr);
	gap: 20px;
	margin-bottom: 20px;
}
.custom-template-icons img {
	cursor: pointer;
	width: 42px;
	height: 42px;
	transition: opacity 0.2s;
}
.custom-template-icons img.active {
	opacity: 0.6;
}

/* ========================================= */
/* Phan trang danh muc */
/* ========================================= */
.custom-pagination {
	padding-left: 100px;
	padding-top: 50px;
	display: flex;
	gap: 8px;
	justify-content: left;
}
.custom-pagination a {
	display: inline-block;
	padding: 10px 15px 10px 15px ;
	/*     border: 1px solid #000; */
	color: #000;
	text-decoration: none;
	transition: 0.2s;
	font-family: 'Open Sans';
	background: #E8E8E8;
}
.custom-pagination a:hover {
	background: #000;
	color: #fff;
}
.custom-pagination a.active {
	background: #000;
	color: #fff;
}
.custom-showing {
	font-family: 'Open Sans';
	padding-top: 50px;
	font-size: 18px;
	font-weight:400;
	text-decoration: underline !important;
	color: black;
}

/* ========================================= */
/* Sap xep danh muc */
/* ========================================= */
#sort-select {
	width: 100%;
	max-width: 200px;
	height: 40px;
	line-height: 1.5em;
	font-size: 16px;
	color: #7F7F7F;
	border-radius: 0px;
	border: 0px solid #ccc;
	outline: 0;
	box-shadow: 0px 4px 4px 0px #00000040;
	appearance: none;
	background: url(/wp-content/uploads/2025/08/Vector-8.svg) right 16px center / 10px no-repeat;
}

@media screen and (max-width: 1199px) {
}

@media screen and (max-width: 1366px) {
	.custom-grid {
		grid-template-columns: repeat(3, 1fr);
	}
}

@media screen and (max-width: 991px) {
	.custom-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media screen and (max-width: 768px) {
	.custom-grid {
		grid-template-columns: repeat(2, 1fr);
	}
	#sort-select {
		width: 100%;           
		max-width: 200px;         
		font-size: 16px;    
		color: #000;            
		border-radius: 6px;
		border: 1px solid #ccc;
		box-sizing: border-box; 
	}
	#sort-select option {
		color: #000;
		font-family: 'Open Sans', sans-serif;
	}	
}

@media screen and (max-width: 525px) {
	.custom-grid {
		grid-template-columns: repeat(2, 1fr);
		grid-gap: 40px 5px;
	}
	.custom-pagination {
		padding: 0;
		padding-top: 20px;
	}
	.custom-pagination a {
		font-size: 12px;
	}
	.custom-showing {
		padding: 0;
		padding-top: 20px;
		font-size: 12px;
		padding-left: 20px;
	}
	#sort-select {
		width: 100%;           
		max-width: 200px;         
		/*     padding: 20px 25px;        */
		font-size: 16px;    
		color: #000;            
		border-radius: 6px;
		border: 1px solid #ccc;
		box-sizing: border-box; 
	}
	#sort-select option {
		color: #000;
		font-family: 'Open Sans', sans-serif;
	}
}


.no-product{
	text-align:center;
	font-family: 'Open Sans';
}
/* ========================================= */
/* News */
/* ========================================= */
.elementor-pagination .page-numbers{
	padding: 5px 10px;
	color: #000;
	text-decoration: none;
	transition: 0.2s;
	font-family: 'Open Sans';
	background: #E8E8E8;
}
.elementor-pagination .page-numbers.current {
	background: #000;
	color: #fff;
}

.swiper-slide-inner img {
    aspect-ratio: 9/12;
    width: 100% !important;
    object-fit: cover;
}
.elementor-pagination .page-numbers
{
	padding: 10px !important;
}
.next-news, .pre-news{
	height: 20px !important;
}

/* ========================================= */
/* Contact */
/* ========================================= */
.custom-email-wrapper{
	margin: 0 auto;
	width: 55%;
}
.custom-email-wrapper input{
	border-radius: 20px; 
}
.custom-email-wrapper input::placeholder{
	color: #570000;
	font-size: 18px;
	font-weight: 400;
	padding-left: 5px;
}
.custom-email-wrapper .custom-submit-btn{
	color: white;
	font-size: 18px;
	font-weight: 400;
	font-family: 'Open Sans';
	background: black;
	border: 0;
	display: flex;
	width: 100%;
	text-align: center;
	justify-content: center;
	border-radius: 20px;
}

@media screen and (max-width: 1366px) {
	.custom-email-wrapper{
		width: 75%;
	}
}

@media screen and (max-width: 991px) {
	.custom-email-wrapper{
		width: 75%;
	}
}

@media screen and (max-width: 768px) {
	.custom-email-wrapper{
		width: 75%;
	}
}

@media screen and (max-width: 525px) {
	.custom-email-wrapper{
		width: 75%;
	}
}


/* .elementor-134 .elementor-element.elementor-element-72536be img {
height: 700px !important;
} */


.swiper-pagination {
	left: 50% !important;
	bottom: -50px !important;
}

.carosel-gallery .swiper-pagination {
	left: 0 !important;
	bottom: -50px !important;
}
/* ========================================= */
/* Transform cho banner */
/* ========================================= */
/* trạng thái ẩn mặc định */
.mySwiper .swiper-slide .transform-banner {
	transform: translateX(100%);
	opacity: 0;
	transition: all 0.8s ease-out;
}

/* khi slide active thì hiện ra */
.mySwiper .swiper-slide-active .transform-banner {
	transform: translateX(0);
	opacity: 1;
}


/* Chỉ áp dụng cho slide có class location-banner */
.mySwiper .swiper-slide.location-banner::before {
	content: "";
	position: absolute;
	top: -100%; /* nằm trên ngoài màn hình */
	left: 0;
	width: 100%;
	height: 100%;
	background: url("/wp-content/uploads/2025/08/map-text-1.png") 
		no-repeat right center/contain;
	z-index: 5;
	transition: top 1s ease;
}

/* Khi slide location-banner active thì ảnh rơi xuống */
.mySwiper .swiper-slide.location-banner.swiper-slide-active::before {
	top: 0;
}

/* ========================================= */
/* CSS cho "Xem thêm" trong content-product */
/* ========================================= */
.hn__product-content_boxed {
    max-height: calc((100vw - (100vw - 1300px)) * 0.39 - 110px) !important;
    overflow: hidden;
}
.hn__product-content_boxed.show-more {
	max-height: unset !important;
}
.hn__product-content_boxed .hn__button {
    border: 0;
    margin-bottom: 2px !important;
    padding-left: 10px;
}
.hn__product-content_boxed .hn__button > div {
    border-bottom: 1px solid;
}
.hn__product-content_boxed .hn__button a {
    line-height: 1.4em !important;
}
.hn__product-content_boxed .hn__button.hidden {
	display: none;
}
.hn__product-content_boxed.show-more .hn__button {
    position: static;
    width: fit-content;
    padding: 0;
    border: 0;
}





.hn__product-item-image img {
    aspect-ratio: 9/12;
    object-fit: cover;
}

.hn__carousel-gallery .swiper-pagination {
    margin: 0px !important;
    bottom: -10px !important;
}