/* Hide only the Elementor menu-cart container while the cart is empty. */
.elementor-element.hide-if-cart-empty {
	opacity: 0;
	visibility: hidden;
	display: none;
	width: 0 !important;
	min-width: 0 !important;
	flex: 0 0 0 !important;
	pointer-events: none;
	transition: opacity .35s ease, width .35s ease, visibility 0s linear .35s;
}

body.cart-has-items .elementor-element.hide-if-cart-empty {
	opacity: 1;
	visibility: visible;
	display: inline-block;
	width: 100% !important;
	min-width: unset !important;
	flex: 0 0 auto !important;
	pointer-events: auto;
	transition: opacity .35s ease, width .35s ease, visibility 0s;
}

/* Keep native WooCommerce page titles consistent with the Elementor site kit. */
.woocommerce-cart h1.entry-title,
.woocommerce-checkout h1.entry-title {
	width: 100%;
	max-width: 100% !important;
	margin-top: 2em !important;
	margin-right: 0 !important;
	margin-left: 0 !important;
	color: var(--e-global-color-primary, #C8102E) !important;
	font-family: var(--e-global-typography-primary-font-family, "Montserrat"), sans-serif;
	font-weight: var(--e-global-typography-primary-font-weight, 800);
	line-height: var(--e-global-typography-primary-line-height, 1.1);
}

/* Elementor's active kit uses a 1240px content width. WooCommerce pages are
 * rendered by Hello Elementor at 1140px, and core's alignwide margins shift
 * the blocks another 80px left. Normalize both only at desktop widths. */
@media (min-width: 768px) {
	.woocommerce-cart main.site-main,
	.woocommerce-checkout main.site-main {
		width: calc(100% - 40px) !important;
		max-width: 1240px !important;
		margin-right: auto !important;
		margin-left: auto !important;
	}

	.woocommerce-cart .wp-block-woocommerce-cart.alignwide,
	.woocommerce-checkout .wp-block-woocommerce-checkout.alignwide {
		width: 100%;
		max-width: 100%;
		margin-right: 0 !important;
		margin-left: 0 !important;
		box-sizing: border-box;
	}
}

@media (max-width: 767px) {
	.woocommerce-cart .wp-block-woocommerce-cart.alignwide,
	.woocommerce-checkout .wp-block-woocommerce-checkout.alignwide {
		width: 100%;
		max-width: 100%;
		margin-right: 0 !important;
		margin-left: 0 !important;
		box-sizing: border-box;
	}

	.woocommerce-checkout .wp-block-woocommerce-checkout.alignwide {
		width: auto;
		margin-right: 2em !important;
		margin-left: 2em !important;
	}

	.wc-block-cart__submit-button {
		position: relative;
		z-index: 5;
		pointer-events: auto;
		touch-action: manipulation;
	}
}
