/* Gerllish mobile storefront layout. */

/* The server-rendered mobile heading must never alter the desktop layout. */
body.single-product .gerllish-mobile-product-title {
	display: none;
}

@media (max-width: 1024px), (max-device-width: 1024px), (hover: none) and (pointer: coarse) {
	/* The WoodMart announcement slot is empty and leaves a close-only strip. */
	body .wd-hb-wrapp {
		display: none !important;
		height: 0 !important;
		min-height: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	.elementor-location-header,
	header.elementor-location-header.elementor-523 .elementor-element.elementor-element-31919d6,
	header.elementor-location-header.elementor-523 .elementor-element.elementor-element-31919d6 > .e-con-inner,
	header.elementor-location-header.elementor-523 .elementor-element.elementor-element-0265423,
	header.elementor-location-header.elementor-523 .elementor-element.elementor-element-0265423 > .elementor-widget-container,
	header.elementor-location-header.elementor-523 .elementor-element.elementor-element-0265423 .wd-image,
	.elementor-location-header .gerllish-brand-banner,
	.elementor-location-header .gerllish-brand-banner > .elementor-widget-container,
	.elementor-location-header .gerllish-brand-banner .wd-image {
		width: 100% !important;
		max-width: 100% !important;
		height: auto !important;
		min-height: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	.elementor-location-header {
		overflow: hidden !important;
		background: #050608 !important;
	}

	header.elementor-location-header.elementor-523 .elementor-element.elementor-element-0265423 img,
	.elementor-location-header .gerllish-brand-banner img {
		display: block !important;
		width: 100% !important;
		max-width: 100% !important;
		height: auto !important;
		max-height: none !important;
		aspect-ratio: auto !important;
		margin: 0 !important;
		object-fit: contain !important;
		object-position: 50% 50% !important;
	}

	body.single-product .gerllish-mobile-product-title {
		display: block !important;
		visibility: visible !important;
		grid-column: 1 / -1 !important;
		flex: 0 0 100% !important;
		order: -1 !important;
		width: 100% !important;
		max-width: 100% !important;
		box-sizing: border-box !important;
		margin: 0 0 14px !important;
		padding: 12px 15px 0 !important;
		color: var(--wd-title-color, #242424) !important;
		font-size: clamp(21px, 5.6vw, 28px) !important;
		font-weight: 600 !important;
		line-height: 1.3 !important;
		letter-spacing: 0 !important;
		white-space: normal !important;
		overflow: visible !important;
		text-overflow: clip !important;
	}

	body.single-product .summary-inner > h1.product_title {
		display: none !important;
	}

	/* Keep the restored contact controls clear of WoodMart's bottom toolbar. */
	.chaty-widget {
		right: 14px !important;
		bottom: calc(76px + env(safe-area-inset-bottom)) !important;
		z-index: 100001 !important;
	}

	.chaty-widget .chaty-i-trigger .chaty-cta-main .on-hover-text {
		max-width: calc(100vw - 92px) !important;
		white-space: nowrap !important;
	}

	body .chatway--container .chatway--trigger-container {
		right: 14px !important;
		bottom: calc(76px + env(safe-area-inset-bottom)) !important;
	}
}

/* Woo Variation Swatches and Chaty add these classes from the mobile user
 * agent. They cover Alipay/translated webviews that report a desktop viewport. */
body.wvs-mobile .wd-hb-wrapp,
body.cht-in-mobile .wd-hb-wrapp {
	display: none !important;
	height: 0 !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
}

body.wvs-mobile .elementor-location-header,
body.wvs-mobile header.elementor-location-header.elementor-523 .elementor-element.elementor-element-31919d6,
body.wvs-mobile header.elementor-location-header.elementor-523 .elementor-element.elementor-element-31919d6 > .e-con-inner,
body.wvs-mobile header.elementor-location-header.elementor-523 .elementor-element.elementor-element-0265423,
body.wvs-mobile header.elementor-location-header.elementor-523 .elementor-element.elementor-element-0265423 > .elementor-widget-container,
body.wvs-mobile header.elementor-location-header.elementor-523 .elementor-element.elementor-element-0265423 .wd-image,
body.cht-in-mobile .elementor-location-header,
body.cht-in-mobile header.elementor-location-header.elementor-523 .elementor-element.elementor-element-31919d6,
body.cht-in-mobile header.elementor-location-header.elementor-523 .elementor-element.elementor-element-31919d6 > .e-con-inner,
body.cht-in-mobile header.elementor-location-header.elementor-523 .elementor-element.elementor-element-0265423,
body.cht-in-mobile header.elementor-location-header.elementor-523 .elementor-element.elementor-element-0265423 > .elementor-widget-container,
body.cht-in-mobile header.elementor-location-header.elementor-523 .elementor-element.elementor-element-0265423 .wd-image {
	width: 100% !important;
	max-width: 100% !important;
	height: auto !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
}

body.wvs-mobile .elementor-location-header,
body.cht-in-mobile .elementor-location-header {
	overflow: hidden !important;
	background: #050608 !important;
}

body.wvs-mobile header.elementor-location-header.elementor-523 .elementor-element.elementor-element-0265423 img,
body.wvs-mobile .elementor-location-header .gerllish-brand-banner img,
body.cht-in-mobile header.elementor-location-header.elementor-523 .elementor-element.elementor-element-0265423 img,
body.cht-in-mobile .elementor-location-header .gerllish-brand-banner img {
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	height: auto !important;
	max-height: none !important;
	aspect-ratio: auto !important;
	margin: 0 !important;
	object-fit: contain !important;
	object-position: 50% 50% !important;
}

body.wvs-mobile.single-product .gerllish-mobile-product-title,
body.cht-in-mobile.single-product .gerllish-mobile-product-title {
	display: block !important;
	visibility: visible !important;
	grid-column: 1 / -1 !important;
	flex: 0 0 100% !important;
	order: -1 !important;
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box !important;
	margin: 0 0 14px !important;
	padding: 12px 15px 0 !important;
	color: var(--wd-title-color, #242424) !important;
	font-size: clamp(21px, 5.6vw, 28px) !important;
	font-weight: 600 !important;
	line-height: 1.3 !important;
	letter-spacing: 0 !important;
	white-space: normal !important;
	overflow: visible !important;
	text-overflow: clip !important;
}

body.wvs-mobile.single-product .summary-inner > h1.product_title,
body.cht-in-mobile.single-product .summary-inner > h1.product_title {
	display: none !important;
}

body.wvs-mobile .chaty-widget,
body.cht-in-mobile .chaty-widget {
	right: 14px !important;
	bottom: calc(76px + env(safe-area-inset-bottom)) !important;
	z-index: 100001 !important;
}

body.wvs-mobile .chaty-widget .chaty-i-trigger .chaty-cta-main .on-hover-text,
body.cht-in-mobile .chaty-widget .chaty-i-trigger .chaty-cta-main .on-hover-text {
	max-width: calc(100vw - 92px) !important;
	white-space: nowrap !important;
}

body.wvs-mobile .chatway--container .chatway--trigger-container,
body.cht-in-mobile .chatway--container .chatway--trigger-container {
	right: 14px !important;
	bottom: calc(76px + env(safe-area-inset-bottom)) !important;
}

@media (max-width: 360px) {
	.chaty-widget {
		right: 10px !important;
	}
}
