/**
 * Loop Extra: dual price ("4 Loops" + EUR) markup safety.
 * Scoped to our own markup only. No fixed widths: the box shrinks, wraps and never clips the digits,
 * even when a theme/Elementor widget gives the price container a fixed width, ellipsis or overflow:hidden.
 */
.loop-dual-price {
	display: inline-block;
	box-sizing: border-box;
	width: auto;
	min-width: 0;
	max-width: 100%;
	overflow: visible;
	overflow-wrap: anywhere;
	white-space: normal;
	line-height: 1.3;
	text-overflow: clip;
	text-align: inherit;
}

.loop-dual-price .loop-price-loops,
.loop-dual-price .loop-price-eur {
	display: inline-block;
	box-sizing: border-box;
	min-width: 0;
	max-width: 100%;
	overflow: visible;
	overflow-wrap: anywhere;
	white-space: normal;
	text-overflow: clip;
}

/* Parent price wrapper: let our box show completely (progressive enhancement; ignored where :has is unsupported). */
.price:has(> .loop-dual-price),
.elementor-widget-container:has(> .loop-dual-price) {
	min-width: 0;
	max-width: 100%;
	overflow: visible;
	text-overflow: clip;
}

/*
 * Wallet line in the Cart / Checkout blocks (assets/js/loop-wallet-display.js).
 * React's own value element is hidden but stays in the DOM (React keeps updating it); our sibling
 * .loop-wallet-loops shows the Loops text derived from it.
 */
.loop-wallet-src {
	display: none !important;
}
