/* ============================================================
   Valabi Smart Offers — catalog discounts in cart / checkout
   The per-line price (.vso-price) and the savings note (.vso-savings).
   Every colour and the radius are custom properties, so a theme can
   retheme this without touching the plugin, e.g.
     .vso-savings, .vso-price { --vso-green-text: #1d5c40; }
   Logical properties throughout: correct in RTL and LTR alike.
   Contrast (WCAG AA): #23694a on #eef6f1 5.98:1, on #e3f1e9 5.65:1;
   #77776f on #fff 4.51:1.
   ============================================================ */

.vso-savings,
.vso-price {
	--vso-green: #2f7d59;
	--vso-green-bg: #eef6f1;
	--vso-green-text: #23694a;
	--vso-badge-bg: #e3f1e9;
	--vso-muted: #77776f;
	--vso-radius: 14px;
}

/* Savings note ---------------------------------------------- */
.vso-savings {
	box-sizing: border-box;
	display: flex;
	align-items: center;
	gap: 10px;
	margin-block: 12px;
	padding-block: 12px;
	padding-inline: 14px;
	background: var(--vso-green-bg);
	border-radius: var(--vso-radius);
	color: var(--vso-green-text);
	font-size: 13px;
	line-height: 1.7;
	text-align: start;
}
.vso-savings__icon {
	flex: 0 0 20px;
	width: 20px;
	height: 20px;
	color: var(--vso-green);
}
.vso-savings__text { flex: 1 1 auto; min-width: 0; }
.vso-savings__amount,
.vso-savings__amount .woocommerce-Price-amount {
	font-weight: 700;
	color: inherit;
	white-space: nowrap;
}

/* The checkout review table wraps the note in one full-width cell. */
.vso-savings-row > td {
	padding-inline: 0 !important;
	border: 0 !important;
}
.vso-savings-row .vso-savings { margin-block: 8px; }

/* Line price -------------------------------------------------- */
.vso-price {
	display: inline-flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 2px;
	line-height: 1.4;
}
.vso-price__sale { font-weight: inherit; }
.vso-price__meta {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	flex-wrap: wrap;
}
.vso-price__regular,
.vso-price__regular .woocommerce-Price-amount {
	color: var(--vso-muted);
	font-size: 12px;
	font-weight: 400;
	opacity: 1;
}
.vso-price__badge {
	display: inline-block;
	padding-block: 1px;
	padding-inline: 7px;
	background: var(--vso-badge-bg);
	color: var(--vso-green-text);
	border-radius: 999px;
	font-size: 11px;
	font-weight: 600;
	line-height: 1.6;
	white-space: nowrap;
}
