.ct-save-price {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	max-width: 100%;
	vertical-align: middle;
}

.ct-save-badge {
	display: inline-block;
	flex: 0 0 auto;
	padding: 3px 6px;
	border-radius: 2px;
	background: #f79321;
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.25;
	white-space: nowrap;
}

.ct-original-price {
	display: inline-block;
	min-width: 0;
	color: inherit;
}

.ct-save-price .ct-original-price > .price,
.ct-save-price .ct-original-price .woocommerce-Price-amount {
	color: inherit;
}

/* Hide the percentage/Sale label only on a card that actually rendered the
   savings badge. HOT (.featured), NEW (.new) and Sold out (.out-of-stock)
   labels use different classes and stay untouched. */
:is(.wd-product, .wd-product-wrapper, li.product, .product-grid-item):has(.ct-save-price) .onsale {
	display: none !important;
}

@media (max-width: 767px) {
	.ct-save-price {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 3px;
		width: 100%;
	}

	.ct-save-badge {
		max-width: 100%;
		white-space: normal;
		overflow-wrap: anywhere;
	}

	.ct-original-price {
		max-width: 100%;
	}
}