/**
 * Pasek „Zaoszczędzasz łącznie" — koszyk boczny i strona koszyka.
 *
 * ⚠️ OSOBNY, MAŁY ARKUSZ ŁADOWANY NA KAŻDEJ PODSTRONIE.
 * Koszyk boczny FunnelKit otwiera się wszędzie i dociąga treść AJAX-em,
 * więc styl musi być na stronie, zanim klient kliknie ikonę koszyka.
 * Reszta stylu cen (boks rabatów, tabela koszyka) siedzi w `ceny.css`
 * i schodzi tylko tam, gdzie faktycznie stoi.
 */

.st-oszcz {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 10px 0 2px;
	padding: 10px 12px;
	border: 1px solid rgba(23, 120, 75, .22);
	border-radius: 10px;

	/*
	 * ⚠️ ZIELEŃ PRZYCIEMNIONA WOBEC KOLORU FUNKCJONALNEGO Z PALETY.
	 * #1E8E5A daje na bieli 4,14:1 — poniżej progu AA dla drobnego tekstu,
	 * a ten pasek jest pisany małym stopniem. #17784B daje 5,2:1.
	 * Ta sama korekta co przy liczniku promocji (08.09).
	 */
	background: rgba(23, 120, 75, .07);
	color: #17784B;
	font-size: .88rem;
	line-height: 1.35;
}

.st-oszcz-znak {
	display: inline-flex;
	flex: 0 0 auto;
}

.st-oszcz-svg {
	width: 17px;
	height: 17px;
}

.st-oszcz-tekst {
	font-weight: 600;

	/* ⚠️ Bez tego długa etykieta rozpycha pasek i kwota ucieka poza koszyk. */
	min-width: 0;
}

/* Kwota dosunięta do prawej krawędzi — tak jak sumy wyżej w podsumowaniu. */
.st-oszcz-kwota {
	margin-left: auto;
	flex: 0 0 auto;
	font-weight: 700;
	white-space: nowrap;
}

.st-oszcz-kwota .amount,
.st-oszcz-kwota bdi {
	color: inherit;
}

/* --------------------------------------------- zwykła strona koszyka (tabela) */

.st-oszcz-wiersz th,
.st-oszcz-wiersz td {
	color: #17784B;
	font-weight: 700;
}

.st-oszcz-wiersz .amount,
.st-oszcz-wiersz bdi {
	color: inherit;
}