.qodef--stack{
	 width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

/* Ensure container reserves square space even if there's no .qodef-e-media-image inside */
.qodef-e-media{
	display: block;
	width: 100%;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	background-color: #f6f6f6;
}
.qodef-e-media > .qodef-e-media-image{
	width: 100%;
	height: 100%;
	display: block;
}

@supports not (aspect-ratio: 1 / 1) {
	.qodef-e-media{
		height: 0;
		padding-top: 100%;
	}
	.qodef-e-media > .qodef-e-media-image,
	.qodef-e-media img{
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		object-fit: cover !important;
		object-position: center center !important;
	}
}

.qodef-woo-product-image img{
	width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

.woocommerce-product-gallery__image{
	width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

.qodef-session .qodef-button.qodef-layout--filled.qodef-html--link{
	border: none;
	background: transparent;
}

.qodef-session .qodef-m-button a{
	position: relative;
	display: inline-block;
	background: transparent;
	text-decoration: none;
}

/* line nền */
.qodef-session .qodef-m-button a::before{
	content: "";
	position: absolute;
	left: 0;
	bottom: -6px;
	width: 100%;
	height: 2px;
	background: currentColor;
	opacity: 0.4;
}

/* line animation */
.qodef-session .qodef-m-button a::after{
	content: "";
	position: absolute;
	left: 0;
	bottom: -6px;
	width: 100%;
	height: 2px;
	background: currentColor;

	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.3s ease;
}

.qodef-session .qodef-m-button a:hover::after{
	transform: scaleX(1);
}
.qodef-woo-product-categories, .qodef-woo-product-list.qodef-item-layout--button-below .qodef-woo-product-content .button{
	display: none !important;
}

/* Giới hạn thumbnails: chỉ hiển thị 3 item, nếu nhiều hơn thì bật cuộn */
.qodef-woo-thumbnails-wrapper{
	overflow:auto;
	-webkit-overflow-scrolling: touch;
	/* Ẩn scrollbar nhưng vẫn cho phép cuộn */
	scrollbar-width: none; /* Firefox */
	-ms-overflow-style: none; /* IE 10+ */
	/* GPU promotion for smoother scrolling */
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	will-change: transform;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}
.qodef-woo-thumbnails-wrapper::-webkit-scrollbar{
	width: 0;
	height: 0;
}
.qodef-woo-thumbnails-wrapper::-webkit-scrollbar-thumb{
	background: transparent;
}
.qodef-woo-thumbnails-wrapper::-webkit-scrollbar-track{
	background: transparent;
}
.qodef-woo-thumbnails-wrapper .woocommerce-product-gallery__image{
	display:block;
	margin:0;
}

/* Mobile: force horizontal layout and scrolling */
@media (max-width: 768px) {
	.qodef-woo-thumbnails-wrapper{
		display: flex !important;
		flex-wrap: nowrap !important;
		gap: 8px !important;
		overflow-x: auto !important;
		overflow-y: hidden !important;
		-webkit-overflow-scrolling: touch !important;
		touch-action: pan-x !important;
		/* use proximity for smoother, less janky interaction */
		scroll-snap-type: x proximity !important;
		scrollbar-width: none !important;
		-ms-overflow-style: -ms-autohiding-scrollbar !important;
		-webkit-transform: translateZ(0) !important;
		transform: translateZ(0) !important;
		will-change: transform !important;
		-webkit-backface-visibility: hidden !important;
		backface-visibility: hidden !important;
	}
	.qodef-woo-thumbnails-wrapper .woocommerce-product-gallery__image{
		flex: 0 0 calc((100% - 16px) / 3) !important;
		max-width: calc((100% - 16px) / 3) !important;
		width: calc((100% - 16px) / 3) !important;
		box-sizing: border-box !important;
		scroll-snap-align: start !important;
		display: block !important;
		-webkit-transform: translateZ(0) !important;
		transform: translateZ(0) !important;
		will-change: transform !important;
		-webkit-backface-visibility: hidden !important;
		backface-visibility: hidden !important;
	}
	.qodef-woo-thumbnails-wrapper .woocommerce-product-gallery__image img{
		width: 100% !important;
		height: auto !important;
		display: block !important;
		object-fit: cover !important;
		-webkit-transform: translateZ(0) !important;
		transform: translateZ(0) !important;
		will-change: transform !important;
		-webkit-backface-visibility: hidden !important;
		backface-visibility: hidden !important;
	}
}

/* Make post/media images square and reserve placeholder space when missing */
.qodef-e-media-image{
	position: relative;
	width: 100%;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	background-color: #f6f6f6; /* subtle placeholder background */
	display: block;
}
.qodef-e-media-image > a{
	display: block;
	width: 100%;
	height: 100%;
}
.qodef-e-media-image img{
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	object-position: center center !important;
	display: block !important;
	vertical-align: middle !important;
}

.qodef-m-image.qodef-zoom-scroll{
	position: relative;
	overflow: hidden;
}

.qodef-m-image.qodef-zoom-scroll img{
	display: block;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	object-position: center center !important;
	max-width: none !important;
	max-height: none !important;
}

#qodef-side-area{
	display: flex;
	align-items: center;
}

#button-lien-he-1{
	text-align: center;
}

#qodef-side-area-inner{
	width: 100%;
}

/* Fallback for browsers without aspect-ratio support */
@supports not (aspect-ratio: 1 / 1) {
	.qodef-e-media-image{
		height: 0;
		padding-top: 100%;
	}
	.qodef-e-media-image > a,
	.qodef-e-media-image img{
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		object-fit: cover !important;
		object-position: center center !important;
	}
}

@media (max-width: 767px) {
	sr7-content, sr7-module-bg, sr7-adjuster, sr7-module {
		height: 40vh !important;
		min-height: 40vh !important;
		max-height: 40vh !important;
		overflow: hidden !important;
	}

	sr7-content > sr7-slide,
	sr7-content > sr7-slide > sr7-mask {
		height: 100% !important;
	}

	sr7-content sr7-txt,
	sr7-content sr7-img {
		left: 50% !important;
		top: 60% !important;
		translate: -50% -60% !important;
		transform: none !important;
	}
}