/* Części sp-woo.css potrzebne na każdej stronie - wydzielone w 0.11.7 (docs/13 A3): akcja w powiadomieniu,
   pasek darmowej dostawy (także w panelu koszyka) i przewijana tabela w treści. Reszta sp-woo.css ładuje się
   tylko na stronach sklepu (inc/assets.php, sp_arkusze_sklepu()). Kolejność: zaraz przed sp-woo.css.
   Świadomie bez @layer, jak sp-woo.css. */

/* Akcja powiadomienia (.sp-link, 48 px celu dotykowego) w osobnym wierszu pod treścią -
   w środku zdania rozpychałaby linię tekstu. */
.sp-notice-body p > .sp-link {
	display: flex;
	width: max-content;
	max-width: 100%;
}

/* ── Darmowa dostawa (inc/darmowa-dostawa.php) ──
   Komunikat .sp-notice z paskiem .sp-progress. Kwota, której brakuje, w kolorze tekstu i bez łamania.
   Po osiągnięciu progu pasek w kolorze sukcesu. W kasie pasek stoi w stosie komunikatów nad danymi:
   16 px od przypomnienia o logowaniu i kodu rabatowego, 32 px do formularza. */
.sp-darmowa p {
	margin: 0;
}

.sp-darmowa .sp-darmowa-kwota {
	color: var(--sp-ink);
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.sp-darmowa .sp-progress {
	margin-top: 10px;
}

.sp-darmowa[data-tone="success"] .sp-progress > span {
	background: var(--sp-success);
}

.sp-darmowa--koszyk,
.sp-darmowa--kasa,
.sp-darmowa--skrot {
	margin-bottom: var(--sp-s4);
}

.woocommerce-form-coupon-toggle:has(~ .sp-darmowa:not([hidden])) {
	margin-bottom: var(--sp-s2);
}

/* Panel koszyka: zwarty komunikat nad przyciskami. Przed progiem sama kwota, po progu sam tytuł
   (inc/darmowa-dostawa.php), mniejsza ikona i ciaśniejsze pole. */
.sp-drawer-foot .sp-darmowa--panel {
	gap: 10px;
	align-items: center;
	margin: 0;
	padding: 10px 12px;
	font-size: 15px;
	line-height: 1.4;
}

.sp-drawer-foot .sp-darmowa--panel .sp-notice-body strong {
	margin: 0;
	font-size: 15px;
}

.sp-drawer-foot .sp-darmowa--panel .sp-progress {
	margin-top: 8px;
}

.sp-drawer-foot .sp-darmowa--panel > .sp-icon {
	width: 18px;
	height: 18px;
	margin-top: 0;
}

/* Tabele wpisane w treść (opisy produktów, wpisy, strony) dostają pudełko .sp-table-scroll
   (inc/setup.php) - przewija się tabela, a nie cała strona. */
.sp-table-scroll {
	max-width: 100%;
	margin-bottom: var(--sp-s3);
}

.sp-table-scroll > table {
	margin-bottom: 0;
}