/* ============================================================
   DG — cross-sell G-1 (animaxkot), 28.10.2026
   Ładowany tylko na karcie produktu, w koszyku i w checkoucie
   (functions.php: animax_enqueue_cross_sell_css).
   Sekcje: A) „Często kupowane razem” (Sales Booster FBT, poziome karty — v2 28.10)
           B) „Pasuje do tego produktu” (blok Kadence Upsell)
           C) koszyk — blok Woo Cross-Sells
           D) checkout — order bump
   Kolory: limonka marki = var(--global-palette1) #cad439.
   ============================================================ */

/* ---------- A. FBT na karcie produktu — POZIOME KARTY (wersja 2, uwaga Emilii 28.10) ----------
   Lista z checkboxami była nieczytelna → karty w rzędzie: zdjęcie, nazwa, cena, „Zobacz produkt”,
   „Dodaj do koszyka”. Checkboxy, wiersz „Ten produkt” i stopka „Razem / Dodaj do koszyka razem”
   zostają w markupie (JS modułu Sales Booster ich szuka), ale są ukryte. */
.iconic-wsb-product-bumps.dg-fbt {
	margin: 0 0 8px; /* etap 1e: ramka w osobnym wierszu szablonu (shortcode [kt_fbt]), odstęp daje wiersz */
	border: 1px solid #e3e5e7;
	border-radius: 6px;
}
/* etap 1e: na desktopie ramka na całą szerokość (od zdjęcia do „Do koszyka”) → większe karty, do 5 w rzędzie */
@media (min-width: 1025px) {
	.dg-fbt .iconic-wsb-product-bumps__list {
		gap: 16px;
		padding: 16px 20px 20px;
	}
	.dg-fbt .iconic-wsb-product-bumps__list-item {
		max-width: 280px;
	}
	.dg-fbt .iconic-wsb-bump-product__body {
		padding: 14px 14px 16px;
	}
	.dg-fbt .dg-fbt-thumb {
		width: 150px;
		height: 150px;
	}
	.dg-fbt .iconic-wsb-bump-product__title {
		font-size: 14px;
	}
	.dg-fbt .dg-fbt-btn,
	.dg-fbt .dg-fbt-btn.button {
		font-size: 14px;
		padding: 8px 10px;
	}
}
.dg-fbt .iconic-wsb-product-bumps__header {
	padding: 12px 16px 10px;
	background: #f6f7f2;
}
.dg-fbt .iconic-wsb-product-bumps__title {
	font-size: 18px;
	line-height: 1.3;
	font-weight: 700;
}
.dg-fbt .dg-fbt-sub {
	margin: 2px 0 0;
	font-size: 13px;
	line-height: 1.4;
	color: #555;
}
/* etap 1f (uwaga Emilii): większe napisy w nagłówku ramki na desktopie */
@media (min-width: 1025px) {
	.dg-fbt .iconic-wsb-product-bumps__header {
		padding: 16px 20px 14px;
	}
	.dg-fbt .iconic-wsb-product-bumps__title {
		font-size: 24px;
	}
	.dg-fbt .dg-fbt-sub {
		margin-top: 4px;
		font-size: 16px;
	}
}
/* pasek miniatur modułu, wiersz bieżącego produktu, checkboxy i stopka — ukryte */
.dg-fbt .iconic-wsb-product-bumps__images,
.dg-fbt .iconic-wsb-product-bumps__list-item.dg-fbt-this,
.dg-fbt .iconic-wsb-bump-product__checkbox,
.dg-fbt .iconic-wsb-product-bumps__actions {
	display: none !important;
}
.dg-fbt .iconic-wsb-product-bumps__list {
	display: flex;
	flex-wrap: nowrap;
	gap: 12px;
	padding: 14px 16px 16px;
	margin: 0;
	border-top: 0;
	list-style: none;
}
.dg-fbt .iconic-wsb-product-bumps__list-item {
	flex: 1 1 0;
	min-width: 0;
	padding: 0;
	border: 1px solid #eceef0;
	border-radius: 6px;
	background: #fff;
	opacity: 1;
}
.dg-fbt .iconic-wsb-product-bumps__list-item--faded {
	opacity: 1;
}
.dg-fbt .iconic-wsb-bump-product,
.dg-fbt .iconic-wsb-bump-product__body {
	height: 100%;
}
.dg-fbt .iconic-wsb-bump-product__body {
	padding: 10px 10px 12px;
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 8px;
	box-sizing: border-box;
}
.dg-fbt .iconic-wsb-bump-product label {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	margin: 0;
	cursor: default;
	flex: 1 1 auto;
	text-align: center;
}
.dg-fbt .dg-fbt-thumb {
	display: block;
	width: 120px;
	height: 120px;
	max-width: 100%;
}
.dg-fbt .dg-fbt-thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}
.dg-fbt .dg-fbt-info {
	flex: 1 1 auto;
	min-width: 0;
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 3px;
}
.dg-fbt .iconic-wsb-bump-product__title {
	margin: 0;
	font-size: 13px;
	line-height: 1.35;
	color: #222;
	text-decoration: none;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.dg-fbt a.iconic-wsb-bump-product__title:hover {
	text-decoration: underline;
}
.dg-fbt .iconic-wsb-bump-product__price {
	font-size: 15px;
	font-weight: 600;
	margin-top: auto;
}
.dg-fbt .iconic-wsb-bump-product__price del {
	font-size: 12px;
	font-weight: 400;
	color: #888;
	margin-right: 4px;
}
.dg-fbt .dg-fbt-incart {
	font-size: 12px;
	color: #777;
}
.dg-fbt .iconic-wsb-bump-product__select {
	margin: 4px 0 0;
	max-width: 100%;
	font-size: 13px;
}
/* dwa przyciski, jeden pod drugim, równo na dole karty */
.dg-fbt .dg-fbt-btns {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin-top: auto;
}
.dg-fbt .dg-fbt-btn,
.dg-fbt .dg-fbt-btn.button {
	display: block;
	width: 100%;
	box-sizing: border-box;
	padding: 7px 8px;
	border-radius: 4px;
	font-size: 13px;
	line-height: 1.3;
	font-weight: 600;
	text-align: center;
	text-decoration: none;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.dg-fbt .dg-fbt-btn--view {
	border: 1px solid #cad439;
	background: #fff;
	color: #222;
}
.dg-fbt .dg-fbt-btn--view:hover {
	background: #f6f7f2;
}
.dg-fbt .dg-fbt-btn--cart,
.dg-fbt .dg-fbt-btn--cart.button {
	border: 1px solid #cad439;
	background: #cad439;
	color: #222;
}
.dg-fbt .dg-fbt-btn--cart:hover,
.dg-fbt .dg-fbt-btn--cart.button:hover {
	background: #bcc62f;
	border-color: #bcc62f;
}
.dg-fbt .dg-fbt-btn--cart.loading {
	opacity: 0.6;
}
/* link „Zobacz koszyk”, który add-to-cart.js dokleja po dodaniu */
.dg-fbt .dg-fbt-btns .added_to_cart {
	font-size: 12px;
	text-align: center;
	text-decoration: underline;
	color: #555;
}
@media (max-width: 719px) {
	/* na telefonie 3 karty nie mieszczą się w 359 px → pozioma przewijana lista */
	.dg-fbt .iconic-wsb-product-bumps__list {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scroll-snap-type: x mandatory;
		scrollbar-width: thin;
		padding: 12px 12px 14px;
		gap: 10px;
	}
	.dg-fbt .iconic-wsb-product-bumps__list-item {
		flex: 0 0 150px;
		scroll-snap-align: start;
	}
	.dg-fbt .dg-fbt-thumb {
		width: 100px;
		height: 100px;
	}
}

/* ---------- B. „Pasuje do tego produktu” (Kadence Upsell) ---------- */
/* mniejsze karty: 5 kolumn na desktopie ustawia atrybut bloku; tu rozmiary w karcie */
.kwt-upsell-wrap .kwt-image-wrap {
	max-width: 190px;
	margin-left: auto;
	margin-right: auto;
}
/* !important: Kadence Woo Template wstrzykuje regułę tytułu z :not():not() (specyficzność nie do przebicia) */
.kwt-upsell-wrap .woocommerce-loop-product__title {
	font-size: 14px !important;
	line-height: 1.3 !important;
	margin-bottom: 6px !important;
}
.kwt-upsell-wrap .woocommerce-loop-product__title a {
	display: -webkit-box !important;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
/* przycisk „Do koszyka” równo na dole każdej karty (różne długości nazw i cen):
   li.product jest flex-kolumną Kadence, niżej siatka → zamieniamy łańcuch na flex-kolumny */
.kwt-upsell-wrap li.product > .kb-row-layout-wrap {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
}
.kwt-upsell-wrap li.product > .kb-row-layout-wrap > .kt-row-column-wrap {
	flex: 1 1 auto;
	display: flex !important;
	flex-direction: column;
}
.kwt-upsell-wrap li.product .kt-row-column-wrap > .wp-block-kadence-column {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
}
.kwt-upsell-wrap li.product .kt-inside-inner-col {
	flex: 1 1 auto;
	display: flex !important;
	flex-direction: column;
}
/* karta = kolumna (marka, tytuł) z ZAGNIEŻDŻONĄ drugą kolumną (ceny + przycisk);
   ostatnie dziecko zewnętrznej kolumny spychamy na dół */
.kwt-upsell-wrap li.product .kt-inside-inner-col > *:last-child,
.kwt-upsell-wrap li.product .wcpc {
	margin-top: auto;
}
.kwt-upsell-wrap .wcpc__price-main .amount {
	font-size: 15px;
}
.kwt-upsell-wrap .wcpc__unit {
	font-size: 12px;
}
/* w podpowiedzi tylko jeden przycisk */
.kwt-upsell-wrap .wcpc__btn--more {
	display: none;
}
.kwt-upsell-wrap .wcpc__btn--cart {
	width: 100%;
}
/* mobile: karuzela pozioma zamiast siatki ciągnącej stronę w dół */
/* Kadence wstrzykuje per blok: .kwt-upsell-wrap.kwt-upsell-<id> .upsells.products ul.products {display:grid} (0,5,1)
   → nasz selektor musi być bardziej specyficzny (0,6,1) */
@media (max-width: 767px) {
	.kwt-upsell-wrap.kwt-upsell-single .upsells.products ul.products.grid-cols {
		display: flex;
		flex-wrap: nowrap;
		gap: 12px;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scroll-snap-type: x mandatory;
		scrollbar-width: thin;
		padding-bottom: 8px;
		margin-left: -16px;
		margin-right: -16px;
		padding-left: 16px;
		padding-right: 16px;
	}
	.kwt-upsell-wrap.kwt-upsell-single .upsells.products ul.products.grid-cols > li.product {
		flex: 0 0 43%;
		max-width: 43%;
		min-width: 150px;
		scroll-snap-align: start;
		margin: 0;
	}
}

/* ---------- C0. Koszyk — układ dwukolumnowy na desktopie (uwaga Emilii 28.10) ----------
   checkout.css (SP Media) rozciąga pozycje na 100 % i spycha „Podsumowanie koszyka” pod spód
   (50 % szerokości, margin-left 48 %) — po dołożeniu polecanych wyglądało to jak przypadkowo
   wstawiony kafel. Tu: pozycje + polecane po lewej, podsumowanie w węższej, przyklejonej kolumnie
   po prawej. Specyficzność (0,3,0)+!important bije reguły (0,1,0)+!important z checkout.css. */
@media (min-width: 1025px) {
	.wp-block-woocommerce-cart .wc-block-cart.wp-block-woocommerce-filled-cart-block {
		display: flex !important;
		align-items: flex-start;
		gap: 32px;
	}
	.wp-block-woocommerce-cart .wc-block-cart__main {
		flex: 1 1 0;
		min-width: 0;
		width: auto !important;
		margin-bottom: 0;
	}
	.wp-block-woocommerce-cart .wc-block-cart__sidebar {
		/* 28.10, 2. runda uwag: węższe podsumowanie (360 → 320 px), żeby nazwy polecanych się mieściły */
		flex: 0 0 320px;
		width: 320px !important;
		margin-left: 0 !important;
		margin-right: 0;
		padding: 0;
		position: sticky;
		top: 110px;
	}
	.wp-block-woocommerce-cart .wc-block-cart .wp-block-woocommerce-cart-order-summary-block {
		padding: 28px;
		margin-bottom: 16px;
	}
}

/* ---------- C. Koszyk — blok Woo Cross-Sells ---------- */
.wp-block-woocommerce-cart-cross-sells-block {
	margin-top: 32px;
	padding-top: 20px;
	border-top: 1px solid #e3e5e7;
}
.wp-block-woocommerce-cart-cross-sells-block > .wp-block-heading {
	font-size: 24px;
	line-height: 1.3;
	margin: 0 0 16px;
}
/* wrapper produktów to div bez klasy (render React) */
.wp-block-woocommerce-cart-cross-sells-block > div {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 20px 16px;
}
/* Woo cart.css: .wp-block-woocommerce-cart … .cross-sells-product {inline-block; width:30%; padding-right:5%; content-box}
   — ta sama specyficzność, więc !important na czterech właściwościach układu */
.wp-block-woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block .cross-sells-product {
	display: flex !important;
	flex-direction: column;
	box-sizing: border-box !important;
	width: auto !important;
	padding: 0 !important;
	margin: 0 !important;
	text-align: center;
}
.wp-block-woocommerce-cart-cross-sells-block .cross-sells-product > div:first-child {
	flex: 1 1 auto;
}
.wp-block-woocommerce-cart-cross-sells-block .wc-block-components-product-image {
	max-width: 170px;
	margin: 0 auto 10px;
}
.wp-block-woocommerce-cart-cross-sells-block .wc-block-components-product-image img {
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
	object-fit: contain;
}
.wp-block-woocommerce-cart-cross-sells-block .wc-block-components-product-title {
	display: block;
	font-size: 14px;
	line-height: 1.35;
	margin: 0 0 4px;
	display: -webkit-box;
	-webkit-line-clamp: 3; /* 28.10: pełne nazwy żwirków nie mieściły się w 2 liniach */
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.wp-block-woocommerce-cart-cross-sells-block .wc-block-components-product-name {
	font-size: 14px;
	line-height: 1.35;
}
.wp-block-woocommerce-cart-cross-sells-block .wc-block-components-product-rating-stars {
	font-size: 12px;
}
.wp-block-woocommerce-cart-cross-sells-block .wc-block-components-product-price {
	font-size: 15px;
	font-weight: 600;
}
.wp-block-woocommerce-cart-cross-sells-block .wc-block-components-product-price__regular {
	font-size: 13px;
	font-weight: 400;
	color: #888;
}
.wp-block-woocommerce-cart-cross-sells-block .wc-block-components-product-button {
	margin-top: 8px;
}
.wp-block-woocommerce-cart-cross-sells-block .wc-block-components-product-button__button {
	width: 100%;
	min-height: 36px;
	height: 36px;
	padding: 4px 10px;
	font-size: 14px;
	justify-content: center;
}
@media (max-width: 900px) {
	.wp-block-woocommerce-cart-cross-sells-block > div {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}
@media (max-width: 600px) {
	.wp-block-woocommerce-cart-cross-sells-block > .wp-block-heading {
		font-size: 20px;
	}
	.wp-block-woocommerce-cart-cross-sells-block > div {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 16px 12px;
	}
	.wp-block-woocommerce-cart-cross-sells-block .wc-block-components-product-image {
		max-width: 140px;
	}
}

/* ---------- D. Checkout — order bump ---------- */
/* checkout.css motywu ustawia etykiety na 0,9em (12,6 px) — tu ma być czytelna */
.woocommerce-checkout .iconic-wsb-checkout-bump .iconic-wsb-checkout-bump__header-bump-title {
	font-weight: 700;
	font-size: 14px !important;
	line-height: 1.4;
}
.iconic-wsb-checkout-bump__body {
	font-size: 14px;
	line-height: 1.4;
}