/* TLH Cart 1.2.0 */

/* Side cart above the header: the Catalogue mega menu bar (z-index 99999, white top and bottom
   lines) sat over the open drawer, so two white lines ran through dark product photos. */
.elementor-location-header .e-con:has(.elementor-menu-cart--shown) { z-index: 100000 !important; }

/* No "View cart" link next to the button after adding: the side cart opens instead. */
.single-product .added_to_cart.wc-forward { display: none !important; }

/* Product page button: adding … */
.single-product .elementor-button.add_to_cart_button.loading { pointer-events: none; cursor: progress; }
.single-product .elementor-button.add_to_cart_button.loading .elementor-button-text { animation: tlh-cart-pulse 1.1s ease-in-out infinite; }
@keyframes tlh-cart-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .45; } }

/* … and "In your order": on hover the label slides up and a friendlier line slides in. */
.single-product .elementor-button.lh-in-cart-btn .elementor-button-content-wrapper { position: relative; overflow: hidden; }
.single-product .elementor-button.lh-in-cart-btn .elementor-button-text { display: inline-block; transition: transform .45s cubic-bezier(.22, .61, .36, 1), opacity .35s ease; }
.single-product .elementor-button.lh-in-cart-btn .elementor-button-content-wrapper::after {
	content: attr(data-tlh-hover); position: absolute; left: 0; right: 0; top: 50%;
	transform: translateY(70%); opacity: 0; text-align: center; white-space: nowrap;
	transition: transform .45s cubic-bezier(.22, .61, .36, 1), opacity .35s ease;
}
@media (hover: hover) {
	.single-product .elementor-button.lh-in-cart-btn:hover .elementor-button-text,
	.single-product .elementor-button.lh-in-cart-btn:focus-visible .elementor-button-text { transform: translateY(-120%); opacity: 0; }
	.single-product .elementor-button.lh-in-cart-btn:hover .elementor-button-content-wrapper::after,
	.single-product .elementor-button.lh-in-cart-btn:focus-visible .elementor-button-content-wrapper::after { transform: translateY(-50%); opacity: 1; }
}

/* Side cart: the remove cross says what it does. */
.elementor-menu-cart__product-remove { overflow: visible; }
.elementor-menu-cart__product-remove::marker { content: none; }
.elementor-menu-cart__product .tlh-cart-tip {
	position: absolute; right: 28px; top: 50%; transform: translate(6px, -50%); opacity: 0; pointer-events: none;
	white-space: nowrap; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: #000;
	background: #fff; padding: 4px 8px; box-shadow: 0 2px 10px rgba(0, 0, 0, .08);
	transition: opacity .3s ease, transform .35s cubic-bezier(.22, .61, .36, 1);
}
@media (hover: hover) {
	.elementor-menu-cart__product-remove:hover .tlh-cart-tip { opacity: 1; transform: translate(0, -50%); }
}
@media (prefers-reduced-motion: reduce) {
	.single-product .elementor-button.lh-in-cart-btn .elementor-button-text,
	.single-product .elementor-button.lh-in-cart-btn .elementor-button-content-wrapper::after,
	.elementor-menu-cart__product .tlh-cart-tip { transition: none; }
	.single-product .elementor-button.add_to_cart_button.loading .elementor-button-text { animation: none; }
}

/* Forms on phones and tablets: iOS zooms the page in when a field below 16px gets focus. Elementor
   forms (newsletter, sell your lighter, contact, Spark convention) and the WooCommerce checkout
   used 15px. Desktop keeps its own sizes. */
@media (max-width: 1024px), (hover: none) {
	input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="image"]):not([type="file"]):not([type="color"]),
	select,
	textarea,
	.select2-container .select2-selection__rendered,
	.select2-container .select2-search__field { font-size: 16px !important; }
}
