/* =============================================================================
 * Phoenix B2B — 2.12.83 (client-panel-final-fixes)
 * -----------------------------------------------------------------------------
 * FINALNE dopięcie panelu klienta. Cztery obszary:
 *   §A  Kontenery — przebudowa układu (karty w siatce, bez absolute/translate).
 *   §B  Zamówienie (checkout panelowy) — szeroka prawa kolumna, radio-cardy
 *       dostaw, poziomy przycisk paczkomatu, czytelne wiersze podsumowania.
 *   §C  Listy zakupowe — dopieszczenie kart/buttonów + karty produktów na mobile.
 *   §D  (zwijanie sidebara — logika/persistencja w pb2b-sidebar-collapse-*.js;
 *        arkusz pb2b-sidebar-2.12.82.css; tu tylko ewentualne domknięcia.)
 *
 * WAŻNE — SPECYFICZNOŚĆ: panel-stage1.css (baza) bywa ładowany PO warstwach
 * 2.12.x (osobny enqueue w renderze panelu), więc reguły o równej specyficzności
 * `.phoenix-b2b-panel …` (0,2,0) przegrywały kaskadę. Tu używamy
 * `.phoenix-b2b-panel.pb2b-app …` (0,3,0) → wygrywamy deterministycznie,
 * niezależnie od kolejności ładowania. Scoped do panelu, kolory z tokenów.
 * Plik ładowany po 2.12.82. CSS-only.
 * ========================================================================== */

/* =============================================================================
 * §A — KONTENERY: czysta przebudowa układu sekcji.
 * -----------------------------------------------------------------------------
 * Problem (2.12.82): bazowa siatka auto-fill(300px) z panel-stage1 wygrywała
 * kaskadę → przy 1–2 kontenerach mała karta po lewej + ogromna pusta przestrzeń,
 * wnętrze ściśnięte, przyciski na granicy ucięcia.
 * Tu: siatka auto-FIT (puste tory się zwijają, karty rosną na całą szerokość
 * wiersza → brak „dziury"), karta w normalnym przepływie (ZERO absolute/translate
 * przesuwającego kartę), ikona po lewej, treść w kolumnie, przyciski na dole.
 * ========================================================================== */

.phoenix-b2b-panel.pb2b-app .pb2b-ctr-tiles {
	/* !important + ładowanie po 2.12.63 (równa specyficzność 0,3,0) → wygrywamy
	   z regułą auto-fill(280px) !important z 2.12.63, która rozbijała układ. */
	display: grid !important;
	grid-template-columns: repeat(auto-fit, minmax(380px, 1fr)) !important;
	gap: 14px !important;
	align-items: stretch;
	margin: 0;
	min-width: 0;
}

.phoenix-b2b-panel.pb2b-app .pb2b-ctr-tile {
	position: relative;        /* tylko dla nakładki .pb2b-ctr-tile-hit */
	display: flex;
	flex-direction: row;
	align-items: stretch;
	gap: 16px;
	width: auto;
	max-width: none;
	margin: 0;
	padding: 18px;
	transform: none;           /* żaden translate nie przesuwa karty */
	left: auto;
	top: auto;
	right: auto;
	bottom: auto;
}
.phoenix-b2b-panel.pb2b-app .pb2b-ctr-tile:hover { transform: translateY(-1px); }

/* Ikona po lewej (wyrównana do góry karty). */
.phoenix-b2b-panel.pb2b-app .pb2b-ctr-illus {
	flex: 0 0 auto;
	align-self: flex-start;
}

/* Treść: kolumna; nagłówek + meta + flaga, a przyciski dosunięte na dół.
   padding:0 !important — kasuje `padding:14px !important` z 2.12.63 (kartę
   paddinguje sam .pb2b-ctr-tile). */
.phoenix-b2b-panel.pb2b-app .pb2b-ctr-tile-body {
	display: flex !important;
	flex-direction: column !important;
	gap: 8px;
	flex: 1 1 auto;
	min-width: 0;
	padding: 0 !important;
}
.phoenix-b2b-panel.pb2b-app .pb2b-ctr-tile-top {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 10px;
	min-width: 0;
}
.phoenix-b2b-panel.pb2b-app .pb2b-ctr-tile-title {
	min-width: 0;
	overflow-wrap: anywhere;
}
.phoenix-b2b-panel.pb2b-app .pb2b-ctr-tile-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 26px;
	margin: 2px 0 0;
}

/* Przyciski na dole karty — zawsze widoczne, nieucięte, bez nachodzenia.
   flex-wrap:wrap !important — kasuje `flex-wrap:nowrap !important` (>=1200px)
   z 2.12.63, przez które dłuższe etykiety potrafiły się ucinać. */
.phoenix-b2b-panel.pb2b-app .pb2b-ctr-tile-cta {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 8px;
	margin-top: auto;          /* dosuń do dołu (równe karty w siatce) */
	padding-top: 6px;
}
.phoenix-b2b-panel.pb2b-app .pb2b-ctr-tile-cta .pb2b-app-button {
	min-width: 150px;
	min-height: 40px;
	white-space: nowrap;
	justify-content: center;
}

/* Zielony „Obserwujesz — przestań" + pewne ukrycie flagi, gdy NIE obserwujesz. */
.phoenix-b2b-panel.pb2b-app .pb2b-container-follow.is-following {
	background: #ecfdf5;
	color: #15803d;
	border-color: #bbf7d0;
}
.phoenix-b2b-panel.pb2b-app[data-pb2b-theme="dark"] .pb2b-container-follow.is-following {
	background: rgba(22, 163, 74, 0.16);
	color: #6ee7a8;
	border-color: rgba(22, 163, 74, 0.32);
}
.phoenix-b2b-panel.pb2b-app .pb2b-ctr-followflag.is-off,
.phoenix-b2b-panel.pb2b-app .pb2b-ctr-followflag[hidden] {
	display: none !important;
}

/* ---- Mobile: karty jedna pod drugą, przyciski pełnej szerokości. ---- */
@media (max-width: 767px) {
	.phoenix-b2b-panel.pb2b-app .pb2b-ctr-tiles {
		grid-template-columns: 1fr !important;
		gap: 12px;
	}
	.phoenix-b2b-panel.pb2b-app .pb2b-ctr-tile {
		padding: 14px;
		gap: 12px;
	}
	.phoenix-b2b-panel.pb2b-app .pb2b-ctr-tile-cta {
		width: 100%;
	}
	.phoenix-b2b-panel.pb2b-app .pb2b-ctr-tile-cta .pb2b-app-button {
		flex: 1 1 100%;
		min-width: 0;
		min-height: 44px;
	}
}

/* =============================================================================
 * §B — ZAMÓWIENIE (checkout panelowy): szeroka, czytelna prawa kolumna,
 *      radio-cardy dostaw, poziomy przycisk paczkomatu, wiersze podsumowania.
 * -----------------------------------------------------------------------------
 * Logika: [woocommerce_checkout] — tu wyłącznie wygląd. Warstwy 2.12.81/bundle
 * stylowały już checkout przy breakpoincie 992px (viewport), ale checkout żyje
 * w `.pb2b-content` węższym o sidebar (~260px) → przy 992–1280px prawa kolumna
 * była ściśnięta, a przycisk paczkomatu łamał się pionowo / wyglądał „surowo".
 * Tu: wyższa specyficzność `.pb2b-app` + !important + ładowanie ostatnie →
 * deterministyczna wygrana; 2 kolumny dopiero gdy JEST miejsce (>=1200px),
 * niżej podsumowanie schodzi pod formularz.
 * ========================================================================== */

/* < 1200px (lub gdy sidebar zjada miejsce): JEDNA kolumna — podsumowanie pod
   formularzem (zgodnie z wymaganiem „panel ma zejść pod formularz"). */
@media (max-width: 1199px) {
	.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo form.checkout {
		display: block !important;
		width: 100% !important;
	}
	.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo #customer_details,
	.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo #order_review_heading,
	.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo #order_review {
		width: 100% !important;
		float: none !important;
		grid-column: auto !important;
		grid-row: auto !important;
	}
	.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo #order_review { position: static !important; }
}

/* >= 1200px: dwie kolumny — formularz ~1fr (65–70%), „Twoje zamówienie" 360–420px. */
@media (min-width: 1200px) {
	.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo form.checkout {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) minmax(360px, 420px) !important;
		gap: 24px !important;
		align-items: start !important;
	}
	.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo #customer_details {
		grid-column: 1 !important;
		grid-row: 1 / span 2 !important;
		min-width: 0 !important;
	}
	.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo #order_review_heading {
		grid-column: 2 !important;
		grid-row: 1 !important;
		margin-top: 0 !important;
	}
	.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo #order_review {
		grid-column: 2 !important;
		grid-row: 2 !important;
		min-width: 0 !important;
		position: sticky !important;
		top: calc(var(--pb2b-app-header-h, 64px) + 12px) !important;
	}
}
@media (min-width: 1440px) {
	.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo form.checkout {
		grid-template-columns: minmax(0, 1fr) 420px !important;
	}
}

/* „Twoje zamówienie" = KARTA, nie surowa tabela. */
.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo .woocommerce-checkout-review-order {
	padding: 20px !important;
	border-radius: 16px !important;
	background: var(--pb2b-bg-2) !important;
	border: 1px solid var(--pb2b-border) !important;
}

/* Wiersze podsumowania: nazwa (z lewej) | wartość (z prawej), bez ściskania. */
.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo .woocommerce-checkout-review-order-table {
	width: 100% !important;
	border: 0 !important;
	border-collapse: collapse !important;
	margin: 0 !important;
}
.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo .woocommerce-checkout-review-order-table th,
.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo .woocommerce-checkout-review-order-table td {
	padding: 9px 0 !important;
	border: 0 !important;
	border-bottom: 1px solid var(--pb2b-border) !important;
	vertical-align: top !important;
	font-size: 13.5px !important;
}
.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo .woocommerce-checkout-review-order-table .product-name {
	text-align: left !important;
	color: var(--pb2b-text) !important;
	padding-right: 12px !important;
	word-break: break-word !important;
}
.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo .woocommerce-checkout-review-order-table .product-total,
.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo .woocommerce-checkout-review-order-table td.product-total {
	text-align: right !important;
	white-space: nowrap !important;
	font-weight: 700 !important;
	color: var(--pb2b-text) !important;
}
.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo .woocommerce-checkout-review-order-table .product-quantity {
	color: var(--pb2b-text-muted) !important;
	font-weight: 600 !important;
}
.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo .woocommerce-checkout-review-order-table tfoot th,
.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo .woocommerce-checkout-review-order-table tfoot td {
	font-size: 14px !important;
}
.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo .woocommerce-checkout-review-order-table tfoot .order-total th,
.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo .woocommerce-checkout-review-order-table tfoot .order-total td {
	font-size: 16px !important;
	font-weight: 800 !important;
	color: var(--pb2b-text) !important;
	border-bottom: 0 !important;
	padding-top: 12px !important;
}

/* Metody dostawy: duże, dotykowe radio-cardy. */
.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo #shipping_method {
	list-style: none !important;
	margin: 6px 0 0 !important;
	padding: 0 !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 10px !important;
}
.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo #shipping_method li {
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
	margin: 0 !important;
	padding: 13px 14px !important;
	border: 1px solid var(--pb2b-border) !important;
	border-radius: 12px !important;
	background: var(--pb2b-bg-1) !important;
	transition: border-color .15s ease, background .15s ease !important;
}
.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo #shipping_method li:hover {
	border-color: var(--pb2b-primary, #7c3aed) !important;
}
.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo #shipping_method li label {
	display: flex !important;
	flex: 1 1 auto !important;
	justify-content: space-between !important;
	align-items: center !important;
	gap: 10px !important;
	margin: 0 !important;
	cursor: pointer !important;
	font-weight: 600 !important;
}

/* Przycisk wyboru paczkomatu — POZIOMY, pełny tekst (nigdy pionowo). */
.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo a.show_map,
.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo button.show_map,
.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo .inpost-show-map,
.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo .easypack-open-modal,
.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo #easypack_modal_show,
.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo .inpost_widget_button,
.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo .furgonetka-point-select,
.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo [data-pb2b-pickup-btn] {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
	width: 100% !important;
	min-width: 200px !important;
	white-space: nowrap !important;       /* KLUCZ: tekst nie łamie się pionowo */
	margin: 10px 0 4px !important;
	padding: 13px 18px !important;
	line-height: 1.2 !important;
	text-align: center !important;
}

/* Komunikat „brak metody płatności" — czytelny box, nic nie nachodzi. */
.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo .woocommerce-notice--info,
.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo .woocommerce-info,
.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo #payment .woocommerce-NoticeGroup,
.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo #payment > .woocommerce-info {
	clear: both !important;
	margin: 0 0 12px !important;
	padding: 12px 14px !important;
	border: 1px solid var(--pb2b-border) !important;
	border-left: 3px solid var(--pb2b-primary, #7c3aed) !important;
	border-radius: 10px !important;
	background: var(--pb2b-bg-2) !important;
	color: var(--pb2b-text) !important;
	font-size: 13.5px !important;
	line-height: 1.45 !important;
}

/* Mobile: pełna szerokość, podsumowanie pod formularzem, modal/mapa w kontenerze. */
@media (max-width: 767px) {
	.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo a.show_map,
	.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo button.show_map,
	.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo .inpost-show-map,
	.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo .easypack-open-modal,
	.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo .inpost_widget_button,
	.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo [data-pb2b-pickup-btn] {
		width: 100% !important;
		min-width: 0 !important;
	}
	.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo .inpost-geowidget,
	.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo #inpost-geowidget,
	.phoenix-b2b-panel.pb2b-app .pb2b-checkout-woo iframe[src*="geowidget"] {
		width: 100% !important;
		max-width: 100% !important;
		min-height: 320px !important;
	}
}

/* =============================================================================
 * §C — LISTY ZAKUPOWE: dopieszczenie tabeli produktów + karty na mobile.
 * -----------------------------------------------------------------------------
 * Karty list / zwijanie / akcje (Zmień nazwę/Usuń) są z 2.12.81/82 — tu domykamy
 * TABELĘ rozwiniętych produktów: czytelne szerokości kolumn na PC oraz zamianę
 * wierszy w małe KARTY produktowe na mobile (nazwa, SKU, ilość, cena, akcja).
 * Wiersze ładują się leniwie (AJAX) dopiero po rozwinięciu — bez zmian.
 * ========================================================================== */

/* ---- PC: czytelna tabela (kolumny nie ściśnięte, ceny po prawej). ---- */
.phoenix-b2b-panel.pb2b-app .pb2b-list-table {
	width: 100%;
	border-collapse: collapse;
	table-layout: auto;
}
.phoenix-b2b-panel.pb2b-app .pb2b-list-table thead th {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--pb2b-text-muted);
	text-align: left;
	padding: 6px 10px;
	border-bottom: 1px solid var(--pb2b-border);
	white-space: nowrap;
}
.phoenix-b2b-panel.pb2b-app .pb2b-list-table tbody td {
	padding: 10px;
	border-bottom: 1px solid var(--pb2b-border);
	vertical-align: middle;
	font-size: 13.5px;
}
.phoenix-b2b-panel.pb2b-app .pb2b-list-table .pb2b-list-td-name { width: auto; min-width: 220px; }
.phoenix-b2b-panel.pb2b-app .pb2b-list-table .pb2b-list-td-name a { font-weight: 600; }
.phoenix-b2b-panel.pb2b-app .pb2b-list-table .pb2b-list-td-sku { white-space: nowrap; color: var(--pb2b-text-muted); }
.phoenix-b2b-panel.pb2b-app .pb2b-list-table .pb2b-list-td-qty { width: 110px; }
.phoenix-b2b-panel.pb2b-app .pb2b-list-table .pb2b-list-td-price { width: 130px; text-align: right; white-space: nowrap; font-weight: 700; color: var(--pb2b-text); }
.phoenix-b2b-panel.pb2b-app .pb2b-list-table .pb2b-list-td-act { width: 52px; text-align: center; }
.phoenix-b2b-panel.pb2b-app .pb2b-list-table .pb2b-list-qty {
	width: 84px;
	text-align: center;
}
/* Przycisk usuwania pozycji — wyraźny, wyśrodkowany. */
.phoenix-b2b-panel.pb2b-app .pb2b-list-table .pb2b-shop-icon-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 9px;
	border: 1px solid transparent;
	color: #dc2626;
	cursor: pointer;
	transition: background .15s ease, border-color .15s ease;
}
.phoenix-b2b-panel.pb2b-app .pb2b-list-table .pb2b-shop-icon-btn:hover {
	background: rgba(220, 38, 38, 0.08);
	border-color: rgba(220, 38, 38, 0.32);
}

/* ---- Mobile (<=767px): wiersze → małe KARTY produktowe. ---- */
@media (max-width: 767px) {
	.phoenix-b2b-panel.pb2b-app .pb2b-list-table thead { display: none; }
	.phoenix-b2b-panel.pb2b-app .pb2b-list-table,
	.phoenix-b2b-panel.pb2b-app .pb2b-list-table tbody,
	.phoenix-b2b-panel.pb2b-app .pb2b-list-table tr,
	.phoenix-b2b-panel.pb2b-app .pb2b-list-table td {
		display: block;
		width: auto;
	}
	.phoenix-b2b-panel.pb2b-app .pb2b-list-table tr {
		position: relative;
		margin: 0 0 10px;
		padding: 12px 12px 6px;
		border: 1px solid var(--pb2b-border);
		border-radius: 12px;
		background: var(--pb2b-bg-1);
	}
	.phoenix-b2b-panel.pb2b-app .pb2b-list-table td {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		padding: 5px 0;
		border: 0;
		font-size: 13.5px;
	}
	/* Etykieta kolumny (z data-label) po lewej. */
	.phoenix-b2b-panel.pb2b-app .pb2b-list-table td::before {
		content: attr(data-label);
		flex: 0 0 auto;
		font-size: 11px;
		font-weight: 700;
		letter-spacing: .03em;
		text-transform: uppercase;
		color: var(--pb2b-text-muted);
	}
	/* Nazwa = tytuł karty (pełna szerokość, bez etykiety, z dolną kreską). */
	.phoenix-b2b-panel.pb2b-app .pb2b-list-table .pb2b-list-td-name {
		padding: 0 40px 8px 0;
		margin-bottom: 6px;
		border-bottom: 1px solid var(--pb2b-border);
	}
	.phoenix-b2b-panel.pb2b-app .pb2b-list-table .pb2b-list-td-name::before { content: none; }
	.phoenix-b2b-panel.pb2b-app .pb2b-list-table .pb2b-list-td-name a { font-weight: 700; font-size: 14px; }
	.phoenix-b2b-panel.pb2b-app .pb2b-list-table .pb2b-list-td-price { font-weight: 700; color: var(--pb2b-text); }
	.phoenix-b2b-panel.pb2b-app .pb2b-list-table .pb2b-list-qty { width: 96px; }
	/* Akcja (usuń) — w prawym górnym rogu karty. */
	.phoenix-b2b-panel.pb2b-app .pb2b-list-table .pb2b-list-td-act {
		position: absolute;
		top: 10px;
		right: 10px;
		padding: 0;
		justify-content: flex-end;
	}
	.phoenix-b2b-panel.pb2b-app .pb2b-list-table .pb2b-list-td-act::before { content: none; }
}