/* v2.9.4 PANEL V3.4 SECTIONS UX FINAL — patrz panel-v3-4.css (ostatnia warstwa). */
/**
 * PhoenixB2B — PANEL KLIENTA V3 — KONSOLIDACJA WARSTW.
 *
 * Ten plik zastępuje 7 nakładek panelu + app-mode + theme, połączone w JEDEN
 * plik w DOKŁADNEJ dotychczasowej kolejności kaskady, ze ZDJĘCIEM wszystkich
 * definicji tokenów (--pb2b-*). Tokeny pochodzą teraz WYŁĄCZNIE z
 * panel-v3-tokens.css (ładowany przed tym plikiem). Dzięki temu:
 *   - 7 warstw client-panel* + app-mode + theme  ->  1 plik panel-v3.css,
 *   - zero redefinicji tokenów poza panel-v3-tokens.css,
 *   - zachowane zachowanie wizualne (te same reguły, ta sama kolejność).
 * Zakres: .phoenix-b2b-panel. Logika WooCommerce/admin/Sellasist nietknięta.
 *
 * Źródła (kolejność kaskady): client-panel.css -> app-mode.css -> theme.css ->
 * client-panel-v26 -> v28 -> v286 -> v287 -> v288 -> v289.
 */


/* ===================================================================
 * ŹRÓDŁO: client-panel.css (tokeny zdjęte -> panel-v3-tokens.css)
 * =================================================================== */
/**
 * PhoenixB2B v1.4 — Client Panel (premium dark UI).
 * Scope: .phoenix-b2b-panel (all rules below are nested under this wrapper).
 * Reset is scoped too — does NOT leak into theme / Elementor / WooCommerce.
 */

/* === SCOPED RESET === */
.phoenix-b2b-panel,
.phoenix-b2b-panel * {
	box-sizing: border-box;
}

.phoenix-b2b-panel {
	/* color tokens — dark premium */








	background: var(--pb2b-bg-0);
	color: var(--pb2b-text);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	font-size: 14px;
	line-height: 1.5;
	min-height: 100vh;
}

.phoenix-b2b-panel h1, .phoenix-b2b-panel h2, .phoenix-b2b-panel h3, .phoenix-b2b-panel h4 {
	color: var(--pb2b-text);
	font-weight: 600;
	letter-spacing: -0.01em;
	margin: 0;
}

.phoenix-b2b-panel a {
	color: var(--pb2b-text);
	text-decoration: none;
	transition: color .15s ease;
}
.phoenix-b2b-panel a:hover { color: var(--pb2b-primary-2); }
.phoenix-b2b-panel a.pb2b-link { color: var(--pb2b-primary-2); }
.phoenix-b2b-panel a.pb2b-link:hover { color: #C084FC; text-decoration: underline; }

.phoenix-b2b-panel .pb2b-muted     { color: var(--pb2b-text-muted); }
.phoenix-b2b-panel .pb2b-overline  { font-size: 11px; letter-spacing: .08em; text-transform: uppercase; font-weight: 600; }
.phoenix-b2b-panel .pb2b-tac-right { text-align: right; }

/* ==========================================================
 * APP LAYOUT (sidebar + main)
 * ========================================================== */
.phoenix-b2b-panel.pb2b-app {
	display: grid;
	grid-template-columns: var(--pb2b-sidebar-w) 1fr;
	min-height: 100vh;
	width: 100%;
}

/* Stand-alone mode (used by shortcodes outside the full app) — just dark card surface */
.phoenix-b2b-panel.phoenix-b2b-standalone {
	display: block;
	padding: 24px;
	background: var(--pb2b-bg-0);
	border-radius: var(--pb2b-radius);
}

/* === Sidebar === */
.phoenix-b2b-panel .pb2b-sidebar {
	position: sticky;
	top: 0;
	height: 100vh;
	background: linear-gradient(180deg, var(--pb2b-bg-1) 0%, var(--pb2b-bg-0) 100%);
	border-right: 1px solid var(--pb2b-border);
	display: flex;
	flex-direction: column;
	padding: 18px 14px;
	gap: 14px;
	z-index: 20;
}

.phoenix-b2b-panel .pb2b-sidebar-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 4px 6px 10px;
	border-bottom: 1px solid var(--pb2b-border);
	margin-bottom: 4px;
}
.phoenix-b2b-panel .pb2b-brand {
	display: flex; align-items: center; gap: 10px; min-width: 0;
}
.phoenix-b2b-panel .pb2b-brand-mark {
	width: 36px; height: 36px;
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0 6px 20px rgba(124, 58, 237, 0.35);
	flex: 0 0 36px;
}
.phoenix-b2b-panel .pb2b-brand-mark svg { display: block; width: 100%; height: 100%; }
.phoenix-b2b-panel .pb2b-brand-text { display: flex; flex-direction: column; min-width: 0; }
.phoenix-b2b-panel .pb2b-brand-title { font-weight: 700; font-size: 15px; letter-spacing: -0.01em; }
.phoenix-b2b-panel .pb2b-brand-sub { font-size: 11px; color: var(--pb2b-text-muted); }

.phoenix-b2b-panel .pb2b-sidebar-close {
	display: none;
	background: transparent;
	border: 1px solid var(--pb2b-border);
	border-radius: 8px;
	width: 32px; height: 32px;
	color: var(--pb2b-text);
	cursor: pointer;
	align-items: center;
	justify-content: center;
}
.phoenix-b2b-panel .pb2b-sidebar-close svg { width: 18px; height: 18px; }

.phoenix-b2b-panel .pb2b-nav {
	display: flex; flex-direction: column; gap: 2px;
	flex: 1; min-height: 0;
	overflow-y: auto;
	padding-right: 2px;
}
.phoenix-b2b-panel .pb2b-nav::-webkit-scrollbar { width: 6px; }
.phoenix-b2b-panel .pb2b-nav::-webkit-scrollbar-thumb { background: var(--pb2b-border); border-radius: 4px; }

.phoenix-b2b-panel .pb2b-nav-item {
	position: relative;
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 12px;
	border-radius: 10px;
	color: var(--pb2b-text-soft);
	font-weight: 500;
	transition: background .15s ease, color .15s ease, transform .1s ease;
	font-size: 13.5px;
}
.phoenix-b2b-panel .pb2b-nav-item:hover {
	background: rgba(255,255,255,0.04);
	color: var(--pb2b-text);
}
.phoenix-b2b-panel .pb2b-nav-item.is-active {
	background: linear-gradient(90deg, rgba(124,58,237,0.18) 0%, rgba(59,130,246,0.08) 100%);
	color: #fff;
	box-shadow: inset 0 0 0 1px rgba(168,85,247,0.22);
}
.phoenix-b2b-panel .pb2b-nav-icon {
	display: inline-flex; width: 20px; height: 20px;
	color: var(--pb2b-text-muted);
	flex: 0 0 20px;
}
.phoenix-b2b-panel .pb2b-nav-item.is-active .pb2b-nav-icon { color: var(--pb2b-primary-2); }
.phoenix-b2b-panel .pb2b-nav-icon svg { width: 100%; height: 100%; display: block; }
.phoenix-b2b-panel .pb2b-nav-indicator {
	position: absolute; left: 0; top: 8px; bottom: 8px;
	width: 3px; border-radius: 0 3px 3px 0;
	background: var(--pb2b-accent-grad);
}

.phoenix-b2b-panel .pb2b-sidebar-footer {
	border-top: 1px solid var(--pb2b-border);
	padding-top: 10px;
}
.phoenix-b2b-panel .pb2b-nav-logout:hover {
	background: rgba(239, 68, 68, 0.10);
	color: #FCA5A5;
}

/* Mobile drawer backdrop */
.phoenix-b2b-panel .pb2b-sidebar-backdrop {
	display: none;
	position: fixed;
	inset: 0;
	background: rgba(0,0,0,0.55);
	backdrop-filter: blur(2px);
	z-index: 15;
}
.phoenix-b2b-panel.pb2b-sidebar-open .pb2b-sidebar-backdrop { display: block; }

/* === Main column === */
.phoenix-b2b-panel .pb2b-main {
	min-width: 0;
	display: flex;
	flex-direction: column;
}

/* === Topbar === */
.phoenix-b2b-panel .pb2b-topbar {
	position: sticky;
	top: 0;
	z-index: 10;
	min-height: var(--pb2b-topbar-h);
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 0 24px;
	background: rgba(11, 16, 32, 0.85);
	backdrop-filter: saturate(160%) blur(12px);
	border-bottom: 1px solid var(--pb2b-border);
}
.phoenix-b2b-panel .pb2b-burger {
	display: none;
	background: transparent;
	border: 1px solid var(--pb2b-border);
	border-radius: 8px;
	width: 38px; height: 38px;
	color: var(--pb2b-text);
	cursor: pointer;
	align-items: center;
	justify-content: center;
}
.phoenix-b2b-panel .pb2b-burger svg { width: 20px; height: 20px; }

.phoenix-b2b-panel .pb2b-topbar-title { flex: 1; min-width: 0; }
.phoenix-b2b-panel .pb2b-topbar-h1 {
	font-size: 17px;
	font-weight: 600;
	color: var(--pb2b-text);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.phoenix-b2b-panel .pb2b-topbar-sub {
	font-size: 12px;
	color: var(--pb2b-text-muted);
	margin: 2px 0 0 0;
}

.phoenix-b2b-panel .pb2b-topbar-right {
	display: flex; align-items: center; gap: 10px;
}

.phoenix-b2b-panel .pb2b-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 5px 10px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 500;
	background: rgba(255,255,255,0.04);
	color: var(--pb2b-text-soft);
	border: 1px solid var(--pb2b-border);
	white-space: nowrap;
}
.phoenix-b2b-panel .pb2b-chip-primary {
	background: linear-gradient(135deg, rgba(124,58,237,0.22), rgba(59,130,246,0.16));
	border-color: rgba(168,85,247,0.35);
	color: #fff;
}
.phoenix-b2b-panel .pb2b-chip-soft {
	background: rgba(124,58,237,0.10);
	border-color: rgba(124,58,237,0.22);
	color: #DDD6FE;
}
.phoenix-b2b-panel .pb2b-chip-amount { color: #C4B5FD; font-weight: 700; }

.phoenix-b2b-panel .pb2b-user-chip {
	display: inline-flex; align-items: center; gap: 8px;
	padding: 4px 10px 4px 4px;
	background: var(--pb2b-bg-3);
	border: 1px solid var(--pb2b-border);
	border-radius: 999px;
}
.phoenix-b2b-panel .pb2b-user-avatar {
	width: 28px; height: 28px;
	border-radius: 999px;
	background: var(--pb2b-accent-grad);
	color: #fff;
	font-weight: 700;
	font-size: 12px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.phoenix-b2b-panel .pb2b-user-name {
	font-size: 13px;
	color: var(--pb2b-text);
	font-weight: 500;
	max-width: 160px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* === Content === */
.phoenix-b2b-panel .pb2b-content {
	padding: 24px;
	display: flex;
	flex-direction: column;
	gap: 20px;
	min-width: 0;
}

/* === Cards === */
.phoenix-b2b-panel .pb2b-card {
	background: var(--pb2b-bg-2);
	border: 1px solid var(--pb2b-border);
	border-radius: var(--pb2b-radius);
	overflow: hidden;
	transition: border-color .2s ease, transform .15s ease;
}
.phoenix-b2b-panel .pb2b-card:hover { border-color: var(--pb2b-border-strong); }

.phoenix-b2b-panel .pb2b-card-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 16px 20px;
	border-bottom: 1px solid var(--pb2b-border);
	background: rgba(255,255,255,0.015);
}
.phoenix-b2b-panel .pb2b-card-title {
	font-size: 14px;
	font-weight: 600;
	color: var(--pb2b-text);
}
.phoenix-b2b-panel .pb2b-card-action {
	font-size: 13px;
	color: var(--pb2b-primary-2);
}
.phoenix-b2b-panel .pb2b-card-action:hover { color: #C084FC; }
.phoenix-b2b-panel .pb2b-card-body { padding: 20px; }

.phoenix-b2b-panel .pb2b-info-card {
	background: linear-gradient(135deg, rgba(124,58,237,0.10), rgba(59,130,246,0.05));
	border-color: rgba(168,85,247,0.22);
}
.phoenix-b2b-panel .pb2b-info-row { display: flex; gap: 14px; }
.phoenix-b2b-panel .pb2b-info-icon {
	flex: 0 0 32px; width: 32px; height: 32px;
	display: inline-flex; align-items: center; justify-content: center;
	border-radius: 999px;
	background: rgba(124,58,237,0.25);
	color: var(--pb2b-primary-2);
	font-weight: 700;
}

/* === Grids === */
.phoenix-b2b-panel .pb2b-grid-2 {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px;
}
@media (max-width: 980px) {
	.phoenix-b2b-panel .pb2b-grid-2 { grid-template-columns: 1fr; }
}

/* === Stats === */
.phoenix-b2b-panel .pb2b-stats {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
}
@media (max-width: 1100px) { .phoenix-b2b-panel .pb2b-stats { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px)  { .phoenix-b2b-panel .pb2b-stats { grid-template-columns: 1fr; } }

.phoenix-b2b-panel .pb2b-stat {
	position: relative;
	background: var(--pb2b-bg-2);
	border: 1px solid var(--pb2b-border);
	border-radius: var(--pb2b-radius);
	padding: 18px 20px;
	overflow: hidden;
	transition: transform .15s ease, border-color .15s ease;
}
.phoenix-b2b-panel .pb2b-stat:hover { transform: translateY(-2px); border-color: var(--pb2b-border-strong); }
.phoenix-b2b-panel .pb2b-stat::after {
	content: '';
	position: absolute;
	top: 0; right: 0;
	width: 80px; height: 80px;
	background: radial-gradient(closest-side, rgba(124,58,237,0.18), transparent);
	opacity: .6;
	pointer-events: none;
}
.phoenix-b2b-panel .pb2b-stat-label {
	font-size: 12px;
	color: var(--pb2b-text-muted);
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	margin-bottom: 8px;
}
.phoenix-b2b-panel .pb2b-stat-value {
	font-size: 26px;
	font-weight: 700;
	letter-spacing: -0.02em;
	line-height: 1.15;
	color: var(--pb2b-text);
}
.phoenix-b2b-panel .pb2b-stat-foot { font-size: 12px; margin-top: 6px; }

.phoenix-b2b-panel .pb2b-stat-accent .pb2b-stat-value  { color: var(--pb2b-primary-2); }
.phoenix-b2b-panel .pb2b-stat-success .pb2b-stat-value { color: var(--pb2b-success); }

/* === Quick tiles === */
.phoenix-b2b-panel .pb2b-quick-tiles {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
	gap: 12px;
}
.phoenix-b2b-panel .pb2b-quick-tile {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	padding: 18px 12px;
	background: var(--pb2b-bg-3);
	border: 1px solid var(--pb2b-border);
	border-radius: var(--pb2b-radius-sm);
	color: var(--pb2b-text-soft);
	transition: transform .15s ease, background .15s ease, border-color .15s ease, color .15s ease;
	text-align: center;
}
.phoenix-b2b-panel .pb2b-quick-tile:hover {
	transform: translateY(-2px);
	background: linear-gradient(135deg, rgba(124,58,237,0.16), rgba(59,130,246,0.06));
	border-color: rgba(168,85,247,0.32);
	color: #fff;
}
.phoenix-b2b-panel .pb2b-quick-tile-icon { font-size: 22px; }
.phoenix-b2b-panel .pb2b-quick-tile-label { font-size: 13px; font-weight: 500; }

/* === Tables === */
.phoenix-b2b-panel .pb2b-table-wrap {
	width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}
.phoenix-b2b-panel .pb2b-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 13.5px;
	color: var(--pb2b-text);
}
.phoenix-b2b-panel .pb2b-table thead th {
	text-align: left;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--pb2b-text-muted);
	padding: 10px 14px;
	border-bottom: 1px solid var(--pb2b-border);
	background: rgba(255,255,255,0.02);
}
.phoenix-b2b-panel .pb2b-table tbody td {
	padding: 12px 14px;
	border-bottom: 1px solid var(--pb2b-border);
}
.phoenix-b2b-panel .pb2b-table tbody tr:hover { background: rgba(255,255,255,0.025); }
.phoenix-b2b-panel .pb2b-table tbody tr:last-child td { border-bottom: 0; }

/* Status pills */
.phoenix-b2b-panel .pb2b-status {
	display: inline-flex;
	align-items: center;
	padding: 3px 10px;
	font-size: 11px;
	font-weight: 600;
	border-radius: 999px;
	text-transform: uppercase;
	letter-spacing: .04em;
	background: rgba(148,163,184,0.18);
	color: var(--pb2b-text-soft);
}
.phoenix-b2b-panel .pb2b-status-completed   { background: rgba(34,197,94,0.18);  color: #86EFAC; }
.phoenix-b2b-panel .pb2b-status-processing  { background: rgba(59,130,246,0.18); color: #93C5FD; }
.phoenix-b2b-panel .pb2b-status-on-hold     { background: rgba(245,158,11,0.18); color: #FCD34D; }
.phoenix-b2b-panel .pb2b-status-pending     { background: rgba(148,163,184,0.20); color: #CBD5E1; }
.phoenix-b2b-panel .pb2b-status-cancelled,
.phoenix-b2b-panel .pb2b-status-failed,
.phoenix-b2b-panel .pb2b-status-refunded    { background: rgba(239,68,68,0.18);  color: #FCA5A5; }

/* === Filter chips === */
.phoenix-b2b-panel .pb2b-filter-row {
	display: flex; flex-wrap: wrap; gap: 8px;
	margin-bottom: 16px;
}
.phoenix-b2b-panel .pb2b-filter-chip {
	display: inline-flex; align-items: center; gap: 6px;
	padding: 6px 12px;
	border-radius: 999px;
	background: var(--pb2b-bg-3);
	border: 1px solid var(--pb2b-border);
	color: var(--pb2b-text-soft);
	font-size: 12.5px;
	transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.phoenix-b2b-panel .pb2b-filter-chip:hover { color: #fff; border-color: var(--pb2b-border-strong); }
.phoenix-b2b-panel .pb2b-filter-chip.is-active {
	background: linear-gradient(135deg, rgba(124,58,237,0.30), rgba(59,130,246,0.18));
	border-color: rgba(168,85,247,0.45);
	color: #fff;
}
.phoenix-b2b-panel .pb2b-filter-chip-count {
	min-width: 18px; padding: 0 6px; height: 18px; line-height: 18px;
	font-size: 11px; font-weight: 700;
	background: rgba(255,255,255,0.08);
	border-radius: 999px;
	text-align: center;
}

/* === DL (data list) === */
.phoenix-b2b-panel .pb2b-dl { display: grid; gap: 0; margin: 0; }
.phoenix-b2b-panel .pb2b-dl-row {
	display: grid;
	grid-template-columns: minmax(140px, 220px) 1fr;
	gap: 12px;
	padding: 10px 0;
	border-bottom: 1px dashed var(--pb2b-border);
}
.phoenix-b2b-panel .pb2b-dl-row:last-child { border-bottom: 0; }
.phoenix-b2b-panel .pb2b-dl dt { color: var(--pb2b-text-muted); font-size: 12.5px; }
.phoenix-b2b-panel .pb2b-dl dd { color: var(--pb2b-text); font-weight: 500; margin: 0; word-break: break-word; }

/* === Buttons === */
.phoenix-b2b-panel .pb2b-btn,
.phoenix-b2b-panel a.pb2b-btn,
.phoenix-b2b-panel button.pb2b-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 9px 16px;
	border-radius: 10px;
	font-size: 13.5px;
	font-weight: 600;
	border: 1px solid var(--pb2b-border);
	background: var(--pb2b-bg-3);
	color: var(--pb2b-text);
	cursor: pointer;
	text-decoration: none;
	transition: background .15s ease, transform .1s ease, box-shadow .15s ease, color .15s ease, border-color .15s ease;
	line-height: 1;
	white-space: nowrap;
}
.phoenix-b2b-panel .pb2b-btn:hover,
.phoenix-b2b-panel a.pb2b-btn:hover,
.phoenix-b2b-panel button.pb2b-btn:hover {
	background: var(--pb2b-bg-4);
	border-color: var(--pb2b-border-strong);
	color: #fff;
}
.phoenix-b2b-panel .pb2b-btn:focus-visible { outline: none; box-shadow: var(--pb2b-shadow-glow); }
.phoenix-b2b-panel .pb2b-btn-sm { padding: 6px 12px; font-size: 12.5px; border-radius: 8px; }
.phoenix-b2b-panel .pb2b-btn-block { width: 100%; }

.phoenix-b2b-panel .pb2b-btn-primary,
.phoenix-b2b-panel a.pb2b-btn-primary,
.phoenix-b2b-panel button.pb2b-btn-primary {
	background: var(--pb2b-accent-grad);
	color: #fff;
	border-color: transparent;
	box-shadow: 0 6px 18px rgba(124,58,237,0.35);
}
.phoenix-b2b-panel .pb2b-btn-primary:hover {
	transform: translateY(-1px);
	box-shadow: 0 8px 22px rgba(124,58,237,0.45);
	color: #fff;
}

.phoenix-b2b-panel .pb2b-btn-outline {
	background: transparent;
	border-color: var(--pb2b-border-strong);
}
.phoenix-b2b-panel .pb2b-btn-danger {
	background: rgba(239,68,68,0.12);
	border-color: rgba(239,68,68,0.40);
	color: #FCA5A5;
}
.phoenix-b2b-panel .pb2b-btn-danger:hover { background: rgba(239,68,68,0.20); color: #FECACA; }

.phoenix-b2b-panel .pb2b-btn[disabled],
.phoenix-b2b-panel button.pb2b-btn:disabled {
	opacity: .5; pointer-events: none;
}

/* === Form === */
.phoenix-b2b-panel .pb2b-form {}
.phoenix-b2b-panel .pb2b-form-row {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin-bottom: 14px;
}
.phoenix-b2b-panel .pb2b-form-row label {
	font-size: 13px;
	font-weight: 500;
	color: var(--pb2b-text-soft);
}
.phoenix-b2b-panel .pb2b-form-row input[type="text"],
.phoenix-b2b-panel .pb2b-form-row input[type="email"],
.phoenix-b2b-panel .pb2b-form-row input[type="password"],
.phoenix-b2b-panel .pb2b-form-row input[type="number"],
.phoenix-b2b-panel .pb2b-form-row input[type="tel"],
.phoenix-b2b-panel .pb2b-form-row input[type="file"],
.phoenix-b2b-panel .pb2b-form-row select,
.phoenix-b2b-panel .pb2b-form-row textarea,
.phoenix-b2b-panel .pb2b-textarea-mono {
	width: 100%;
	padding: 10px 12px;
	background: var(--pb2b-bg-3);
	border: 1px solid var(--pb2b-border-strong);
	border-radius: 10px;
	color: var(--pb2b-text);
	font-size: 14px;
	font-family: inherit;
	transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
.phoenix-b2b-panel .pb2b-textarea-mono { font-family: 'SFMono-Regular', Consolas, monospace; font-size: 13px; }
.phoenix-b2b-panel .pb2b-form-row input:focus,
.phoenix-b2b-panel .pb2b-form-row select:focus,
.phoenix-b2b-panel .pb2b-form-row textarea:focus,
.phoenix-b2b-panel .pb2b-textarea-mono:focus {
	outline: none;
	border-color: var(--pb2b-primary-2);
	box-shadow: var(--pb2b-shadow-glow);
	background: var(--pb2b-bg-4);
}
.phoenix-b2b-panel .pb2b-form-row input[type="file"] {
	padding: 8px;
	color: var(--pb2b-text-soft);
}
.phoenix-b2b-panel .pb2b-form-row input::placeholder,
.phoenix-b2b-panel .pb2b-form-row textarea::placeholder {
	color: var(--pb2b-text-dim);
}

.phoenix-b2b-panel .pb2b-form-actions {
	display: flex; gap: 10px; flex-wrap: wrap; padding-top: 4px;
}
.phoenix-b2b-panel .pb2b-inline-form {
	display: flex; align-items: flex-end; gap: 12px; flex-wrap: wrap;
}
.phoenix-b2b-panel .pb2b-form-row-grow { flex: 1; min-width: 240px; margin-bottom: 0; }
.phoenix-b2b-panel .pb2b-inline-result { width: 100%; }

.phoenix-b2b-panel .pb2b-details > summary {
	cursor: pointer;
	color: var(--pb2b-primary-2);
	font-size: 13px;
	margin: 6px 0 10px;
	user-select: none;
}
.phoenix-b2b-panel .pb2b-details > summary:hover { color: #C084FC; }

.phoenix-b2b-panel .pb2b-meta { font-size: 12.5px; margin: 4px 0 12px; }
.phoenix-b2b-panel .pb2b-meta-label { color: var(--pb2b-text-muted); margin-right: 6px; }

/* CSV result block */
.phoenix-b2b-panel .pb2b-result {
	margin-top: 18px;
	padding: 16px;
	background: var(--pb2b-bg-3);
	border-radius: var(--pb2b-radius-sm);
	border: 1px solid var(--pb2b-border);
}
.phoenix-b2b-panel .pb2b-stats { /* csv stats list (reused class) */
	display: flex; gap: 16px; flex-wrap: wrap; padding: 0; margin: 6px 0 10px; list-style: none;
}
.phoenix-b2b-panel .pb2b-stats li {
	font-size: 13px; color: var(--pb2b-text);
	background: var(--pb2b-bg-2);
	padding: 6px 12px; border-radius: 8px; border: 1px solid var(--pb2b-border);
}

/* === Empty states === */
.phoenix-b2b-panel .pb2b-empty {
	text-align: center;
	padding: 36px 20px;
	color: var(--pb2b-text-muted);
}
.phoenix-b2b-panel .pb2b-empty-sm { padding: 22px 12px; }
.phoenix-b2b-panel .pb2b-empty-icon {
	font-size: 38px;
	line-height: 1;
	margin-bottom: 12px;
	opacity: .85;
}
.phoenix-b2b-panel .pb2b-empty h3,
.phoenix-b2b-panel .pb2b-empty h4 {
	color: var(--pb2b-text);
	font-size: 16px;
	margin: 0 0 6px;
}
.phoenix-b2b-panel .pb2b-empty p { margin: 0 0 14px; font-size: 13.5px; }

/* === Banners (promotions) === */
.phoenix-b2b-panel .pb2b-banners { display: flex; flex-direction: column; gap: 10px; }
.phoenix-b2b-panel .pb2b-banner {
	display: flex; gap: 14px; align-items: flex-start;
	padding: 14px 16px;
	border-radius: var(--pb2b-radius-sm);
	border: 1px solid var(--pb2b-border);
	background: var(--pb2b-bg-3);
	color: var(--pb2b-text);
}
.phoenix-b2b-panel .pb2b-banner-icon { font-size: 22px; line-height: 1; }
.phoenix-b2b-panel .pb2b-banner-body strong { display: block; margin-bottom: 4px; }
.phoenix-b2b-panel .pb2b-banner-body div p { margin: 0; color: var(--pb2b-text-soft); font-size: 13.5px; }
.phoenix-b2b-panel .pb2b-banner-success { background: linear-gradient(135deg, rgba(34,197,94,0.14), rgba(34,197,94,0.04)); border-color: rgba(34,197,94,0.32); }
.phoenix-b2b-panel .pb2b-banner-warning { background: linear-gradient(135deg, rgba(245,158,11,0.14), rgba(245,158,11,0.04)); border-color: rgba(245,158,11,0.32); }
.phoenix-b2b-panel .pb2b-banner-danger,
.phoenix-b2b-panel .pb2b-banner-error   { background: linear-gradient(135deg, rgba(239,68,68,0.14), rgba(239,68,68,0.04)); border-color: rgba(239,68,68,0.32); }
.phoenix-b2b-panel .pb2b-banner-info,
.phoenix-b2b-panel .pb2b-banner-primary { background: linear-gradient(135deg, rgba(124,58,237,0.16), rgba(59,130,246,0.06)); border-color: rgba(168,85,247,0.30); }

/* === Discount list === */
.phoenix-b2b-panel .pb2b-discount-list { display: flex; flex-direction: column; gap: 8px; }
.phoenix-b2b-panel .pb2b-discount-row {
	display: flex; justify-content: space-between; align-items: center;
	padding: 12px 14px;
	background: var(--pb2b-bg-3);
	border: 1px solid var(--pb2b-border);
	border-radius: 10px;
}
.phoenix-b2b-panel .pb2b-discount-label { color: var(--pb2b-text); font-weight: 500; }
.phoenix-b2b-panel .pb2b-discount-value { color: var(--pb2b-success); font-weight: 700; font-size: 16px; }

/* === Manager card === */
.phoenix-b2b-panel .pb2b-manager-mini .pb2b-manager-row {
	display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
}
.phoenix-b2b-panel .pb2b-manager-avatar {
	width: 44px; height: 44px; border-radius: 999px;
	background: var(--pb2b-accent-grad);
	color: #fff; font-weight: 700; font-size: 17px;
	display: inline-flex; align-items: center; justify-content: center;
	flex: 0 0 44px;
}
.phoenix-b2b-panel .pb2b-manager-avatar-lg { width: 72px; height: 72px; font-size: 26px; flex: 0 0 72px; }
.phoenix-b2b-panel .pb2b-manager-info { flex: 1; min-width: 240px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; }
.phoenix-b2b-panel .pb2b-manager-info .pb2b-overline { flex-basis: 100%; }

.phoenix-b2b-panel .pb2b-manager-full { display: flex; gap: 18px; align-items: flex-start; flex-wrap: wrap; }
.phoenix-b2b-panel .pb2b-manager-meta { flex: 1; min-width: 240px; }
.phoenix-b2b-panel .pb2b-manager-name { font-size: 20px; margin: 4px 0 12px; }
.phoenix-b2b-panel .pb2b-manager-actions { display: flex; gap: 10px; margin-top: 14px; flex-wrap: wrap; }
.phoenix-b2b-panel .pb2b-dl-inline { margin-top: 6px; }

/* === Doc helpers === */
.phoenix-b2b-panel .pb2b-doc-desc { font-size: 12.5px; }

/* ==========================================================
 * AUTH (login/register split)
 * ========================================================== */
.phoenix-b2b-panel.pb2b-auth {
	min-height: calc(100vh - 80px);
	padding: 32px 20px;
	display: flex; align-items: stretch; justify-content: center;
}
.phoenix-b2b-panel .pb2b-auth-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(360px, 440px);
	gap: 32px;
	max-width: 1100px;
	width: 100%;
	margin: auto;
}
@media (max-width: 900px) {
	.phoenix-b2b-panel .pb2b-auth-grid { grid-template-columns: 1fr; gap: 22px; }
}

.phoenix-b2b-panel .pb2b-auth-side {
	display: flex; flex-direction: column;
	padding: 30px;
	background: linear-gradient(160deg, rgba(124,58,237,0.18) 0%, rgba(59,130,246,0.06) 100%);
	border: 1px solid rgba(168,85,247,0.22);
	border-radius: var(--pb2b-radius);
}
.phoenix-b2b-panel .pb2b-auth-brand {
	display: flex; align-items: center; gap: 12px;
	font-weight: 700; font-size: 18px; color: #fff;
	margin-bottom: 22px;
}
.phoenix-b2b-panel .pb2b-auth-title {
	font-size: 28px; line-height: 1.15; margin: 0 0 12px;
}
.phoenix-b2b-panel .pb2b-auth-lead {
	font-size: 15px; color: var(--pb2b-text-soft); margin: 0 0 22px;
}
.phoenix-b2b-panel .pb2b-auth-benefits {
	list-style: none; padding: 0; margin: 0;
	display: flex; flex-direction: column; gap: 14px;
}
.phoenix-b2b-panel .pb2b-auth-benefits li {
	display: flex; gap: 12px; align-items: flex-start;
}
.phoenix-b2b-panel .pb2b-auth-benefit-ico {
	flex: 0 0 24px; width: 24px; height: 24px;
	display: inline-flex; align-items: center; justify-content: center;
	border-radius: 999px;
	background: rgba(34,197,94,0.22);
	color: #86EFAC;
	font-weight: 700; font-size: 13px;
	margin-top: 1px;
}
.phoenix-b2b-panel .pb2b-auth-benefits strong { display: block; color: var(--pb2b-text); margin-bottom: 2px; }
.phoenix-b2b-panel .pb2b-auth-benefits span { color: var(--pb2b-text-muted); font-size: 13px; }

.phoenix-b2b-panel .pb2b-auth-card {
	padding: 28px;
}
.phoenix-b2b-panel .pb2b-auth-form-title { font-size: 22px; margin: 0 0 6px; }
.phoenix-b2b-panel .pb2b-auth-form-sub { font-size: 13px; margin: 0 0 18px; }

/* style WP login form */
.phoenix-b2b-panel #pb2b-login-form { display: flex; flex-direction: column; gap: 14px; }
.phoenix-b2b-panel #pb2b-login-form p { margin: 0; }
.phoenix-b2b-panel #pb2b-login-form label {
	display: block; margin-bottom: 6px;
	font-size: 13px; font-weight: 500; color: var(--pb2b-text-soft);
}
.phoenix-b2b-panel #pb2b-login-form input[type="text"],
.phoenix-b2b-panel #pb2b-login-form input[type="password"] {
	width: 100%;
	padding: 11px 12px;
	background: var(--pb2b-bg-3);
	border: 1px solid var(--pb2b-border-strong);
	border-radius: 10px;
	color: var(--pb2b-text);
	font-size: 14px;
}
.phoenix-b2b-panel #pb2b-login-form input:focus {
	outline: none;
	border-color: var(--pb2b-primary-2);
	box-shadow: var(--pb2b-shadow-glow);
}
.phoenix-b2b-panel #pb2b-login-form .login-remember { font-size: 13px; color: var(--pb2b-text-soft); }
.phoenix-b2b-panel #pb2b-login-form .login-remember label { display: inline-flex; align-items: center; gap: 8px; margin: 0; }
.phoenix-b2b-panel #pb2b-login-form .login-submit input[type="submit"],
.phoenix-b2b-panel #pb2b-login-form input[name="wp-submit"] {
	width: 100%;
	padding: 11px 16px;
	border-radius: 10px;
	font-size: 14px;
	font-weight: 600;
	border: 0;
	background: var(--pb2b-accent-grad);
	color: #fff;
	cursor: pointer;
	box-shadow: 0 6px 18px rgba(124,58,237,0.35);
	transition: transform .1s ease, box-shadow .15s ease;
}
.phoenix-b2b-panel #pb2b-login-form input[name="wp-submit"]:hover {
	transform: translateY(-1px);
	box-shadow: 0 8px 22px rgba(124,58,237,0.45);
}

.phoenix-b2b-panel .pb2b-auth-extras { margin-top: 8px; font-size: 13px; }
.phoenix-b2b-panel .pb2b-auth-divider {
	position: relative; text-align: center; margin: 22px 0 18px;
	color: var(--pb2b-text-muted); font-size: 12px;
}
.phoenix-b2b-panel .pb2b-auth-divider::before,
.phoenix-b2b-panel .pb2b-auth-divider::after {
	content: '';
	position: absolute; top: 50%;
	width: 42%; height: 1px;
	background: var(--pb2b-border);
}
.phoenix-b2b-panel .pb2b-auth-divider::before { left: 0; }
.phoenix-b2b-panel .pb2b-auth-divider::after { right: 0; }
.phoenix-b2b-panel .pb2b-auth-divider span { padding: 0 12px; background: var(--pb2b-bg-2); position: relative; }

.phoenix-b2b-panel .pb2b-auth-register { text-align: center; }
.phoenix-b2b-panel .pb2b-auth-register-text { color: var(--pb2b-text-soft); font-size: 13.5px; margin: 0 0 10px; }

/* ==========================================================
 * STATE SCREENS (pending / rejected / no-access)
 * ========================================================== */
.phoenix-b2b-panel.pb2b-state {
	min-height: calc(100vh - 80px);
	display: flex; align-items: center; justify-content: center;
	padding: 40px 20px;
}
.phoenix-b2b-panel .pb2b-state-card {
	max-width: 520px;
	text-align: center;
	background: var(--pb2b-bg-2);
	border: 1px solid var(--pb2b-border);
	border-radius: var(--pb2b-radius);
	padding: 36px 30px;
	box-shadow: var(--pb2b-shadow-lg);
}
.phoenix-b2b-panel .pb2b-state-icon {
	width: 72px; height: 72px; border-radius: 999px;
	background: var(--pb2b-bg-3);
	color: var(--pb2b-text-muted);
	display: inline-flex; align-items: center; justify-content: center;
	margin-bottom: 18px;
	border: 1px solid var(--pb2b-border);
}
.phoenix-b2b-panel .pb2b-state-pending .pb2b-state-icon {
	background: rgba(245,158,11,0.14); color: #FCD34D; border-color: rgba(245,158,11,0.30);
}
.phoenix-b2b-panel .pb2b-state-rejected .pb2b-state-icon {
	background: rgba(239,68,68,0.14); color: #FCA5A5; border-color: rgba(239,68,68,0.30);
}
.phoenix-b2b-panel .pb2b-state-title { font-size: 22px; margin: 0 0 10px; }
.phoenix-b2b-panel .pb2b-state-desc { color: var(--pb2b-text-soft); font-size: 15px; margin: 0 0 8px; line-height: 1.5; }
.phoenix-b2b-panel .pb2b-state-meta { color: var(--pb2b-text-muted); font-size: 13px; margin: 0 0 22px; }
.phoenix-b2b-panel .pb2b-state-actions { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }

/* === v1.5 — polish state screens === */
.phoenix-b2b-panel.pb2b-state {
	background:
		radial-gradient(800px circle at 20% 10%, rgba(124,58,237,0.18), transparent 60%),
		radial-gradient(700px circle at 80% 90%, rgba(59,130,246,0.14), transparent 60%),
		var(--pb2b-bg-0);
}
.phoenix-b2b-panel .pb2b-state-card {
	animation: pb2b-state-in .35s cubic-bezier(.2,.8,.2,1);
	background: linear-gradient(180deg, var(--pb2b-bg-3) 0%, var(--pb2b-bg-2) 100%);
	position: relative;
	overflow: hidden;
}
.phoenix-b2b-panel .pb2b-state-card::before {
	content: ''; position: absolute; inset: 0 0 auto 0; height: 3px;
	background: var(--pb2b-accent-grad);
	opacity: .85;
}
.phoenix-b2b-panel .pb2b-state-icon {
	animation: pb2b-state-icon-in .5s cubic-bezier(.2,.8,.2,1) both;
}
.phoenix-b2b-panel .pb2b-state-no-access .pb2b-state-icon {
	background: rgba(56,189,248,0.14); color: #7DD3FC; border-color: rgba(56,189,248,0.30);
}
@keyframes pb2b-state-in {
	from { opacity: 0; transform: translateY(10px) scale(.985); }
	to   { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes pb2b-state-icon-in {
	0%   { transform: scale(.6) rotate(-8deg); opacity: 0; }
	60%  { transform: scale(1.08) rotate(2deg); opacity: 1; }
	100% { transform: scale(1) rotate(0); }
}

/* Auth alert (login form errors) */
.phoenix-b2b-panel .pb2b-form-alert {
	display: flex; gap: 10px; align-items: center;
	padding: 11px 14px;
	border-radius: var(--pb2b-radius-sm);
	margin: 0 0 14px;
	font-size: 13.5px;
}
.phoenix-b2b-panel .pb2b-form-alert-error {
	background: rgba(239,68,68,.12);
	color: #FECACA;
	border: 1px solid rgba(239,68,68,.30);
}
.phoenix-b2b-panel .pb2b-form-alert svg { flex-shrink: 0; }

/* Login form internals (v1.5) */
.phoenix-b2b-panel .pb2b-login-form .pb2b-field { margin-bottom: 14px; }
.phoenix-b2b-panel .pb2b-field-with-icon { position: relative; }
.phoenix-b2b-panel .pb2b-field-icon {
	position: absolute; left: 12px; top: 50%; transform: translateY(-50%);
	color: var(--pb2b-text-muted);
	pointer-events: none;
}
.phoenix-b2b-panel .pb2b-field-with-icon input {
	padding-left: 38px !important;
}
.phoenix-b2b-panel .pb2b-field-toggle {
	position: absolute; right: 6px; top: 50%; transform: translateY(-50%);
	background: transparent; border: none; cursor: pointer;
	color: var(--pb2b-text-muted);
	padding: 6px;
	border-radius: 4px;
}
.phoenix-b2b-panel .pb2b-field-toggle:hover { color: var(--pb2b-text); background: rgba(255,255,255,.04); }
.phoenix-b2b-panel .pb2b-login-row {
	display: flex; align-items: center; justify-content: space-between;
	gap: 10px; flex-wrap: wrap;
	margin-bottom: 16px;
}
.phoenix-b2b-panel .pb2b-checkbox-inline {
	display: inline-flex; align-items: center; gap: 8px;
	cursor: pointer; font-size: 13.5px; color: var(--pb2b-text-soft);
}
.phoenix-b2b-panel .pb2b-checkbox-inline input { accent-color: var(--pb2b-primary); width: 16px; height: 16px; }
.phoenix-b2b-panel .pb2b-login-forgot { font-size: 13px; color: var(--pb2b-primary-2); }
.phoenix-b2b-panel .pb2b-login-submit svg { transition: transform .2s ease; }
.phoenix-b2b-panel .pb2b-login-submit:hover svg { transform: translateX(3px); }

/* App-mode width fix — the panel must not be capped by entry-content */
body.phoenix-b2b-app-mode .phoenix-b2b-panel,
body.phoenix-b2b-app-mode .phoenix-b2b-panel.pb2b-app {
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
}

/* ==========================================================
 * REGISTRATION FORM dark theme (inside .pb2b-auth)
 * ========================================================== */
.phoenix-b2b-panel.pb2b-auth-reg .pb2b-auth-card-wide { max-width: 720px; width: 100%; }
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-registration { color: var(--pb2b-text); }
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-section {
	font-size: 13px; font-weight: 700; color: var(--pb2b-text-soft);
	text-transform: uppercase; letter-spacing: .06em;
	margin: 18px 0 10px 0;
	padding-bottom: 6px;
	border-bottom: 1px solid var(--pb2b-border);
}
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-row {
	display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 10px;
}
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field-full,
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-row > .phoenix-b2b-form-field:only-child { grid-column: 1 / -1; }
@media (max-width: 580px) {
	.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-row { grid-template-columns: 1fr; }
}
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field { display: flex; flex-direction: column; gap: 4px; }
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field label {
	font-size: 13px; font-weight: 600; color: var(--pb2b-text-soft);
}
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field .required { color: var(--pb2b-danger); }
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field input[type="text"],
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field input[type="email"],
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field input[type="tel"],
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field input[type="password"],
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field input[type="url"],
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field input[type="number"],
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field select,
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field textarea {
	background: var(--pb2b-bg-2) !important;
	border: 1px solid var(--pb2b-border-strong) !important;
	border-radius: var(--pb2b-radius-sm) !important;
	color: var(--pb2b-text) !important;
	padding: 10px 12px !important;
	font-size: 14px !important;
	width: 100%;
	transition: border-color .15s ease, box-shadow .15s ease;
}
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field input:focus,
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field select:focus,
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field textarea:focus {
	border-color: var(--pb2b-primary-2) !important;
	box-shadow: var(--pb2b-shadow-glow) !important;
	outline: none;
}
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field input::placeholder { color: var(--pb2b-text-dim); }
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-field-error {
	color: #FCA5A5; font-size: 12px; margin-top: 2px; display: block;
}
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field-checkbox label {
	display: flex; align-items: flex-start; gap: 10px;
	font-size: 13px; color: var(--pb2b-text-soft); font-weight: 400;
	line-height: 1.45;
}
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field-checkbox input[type="checkbox"] {
	margin-top: 2px; accent-color: var(--pb2b-primary); width: 16px; height: 16px; flex-shrink: 0;
}
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-honeypot { position: absolute !important; left: -9999px !important; }
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-actions { margin-top: 22px; }
.phoenix-b2b-panel.pb2b-auth-reg .pb2b-btn-block { width: 100%; }

/* ==========================================================
 * RESPONSIVE — Mobile drawer
 * ========================================================== */
/* v2.8.19 — breakpoint drawera ujednolicony z warstwą v26 (1199.98px),
 * cień TYLKO przy otwartym drawerze (zamknięty już nie „świeci” z lewej). */
@media (max-width: 1199.98px) {
	.phoenix-b2b-panel.pb2b-app {
		grid-template-columns: 1fr;
	}
	.phoenix-b2b-panel .pb2b-sidebar {
		position: fixed;
		top: 0; left: 0;
		width: min(86vw, var(--pb2b-sidebar-w, 260px));
		height: 100vh;
		transform: translateX(-100%);
		transition: transform .25s ease;
		box-shadow: none;
	}
	.phoenix-b2b-panel.pb2b-sidebar-open .pb2b-sidebar { transform: translateX(0); box-shadow: 24px 0 60px rgba(0,0,0,0.45); }
	.phoenix-b2b-panel .pb2b-sidebar-close { display: inline-flex; }
	.phoenix-b2b-panel .pb2b-burger { display: inline-flex; }
}

@media (max-width: 640px) {
	.phoenix-b2b-panel .pb2b-content { padding: 16px; gap: 16px; }
	.phoenix-b2b-panel .pb2b-topbar { padding: 0 14px; }
	.phoenix-b2b-panel .pb2b-card-header { padding: 14px 16px; flex-wrap: wrap; }
	.phoenix-b2b-panel .pb2b-card-body { padding: 16px; }
	.phoenix-b2b-panel .pb2b-topbar-h1 { font-size: 15px; }
	.phoenix-b2b-panel .pb2b-user-name { display: none; }
	.phoenix-b2b-panel .pb2b-topbar-right .pb2b-chip { display: none; }
	.phoenix-b2b-panel .pb2b-stat-value { font-size: 22px; }
	.phoenix-b2b-panel .pb2b-state-card { padding: 26px 18px; }
	.phoenix-b2b-panel .pb2b-dl-row { grid-template-columns: 1fr; gap: 4px; }
	.phoenix-b2b-panel .pb2b-btn { padding: 9px 14px; }
}

/* ==========================================================
 * MICRO ANIMATIONS
 * ========================================================== */
.phoenix-b2b-panel .pb2b-app-loaded .pb2b-content > * {
	animation: pb2bFadeUp .35s ease both;
}
@keyframes pb2bFadeUp {
	from { opacity: 0; transform: translateY(6px); }
	to   { opacity: 1; transform: translateY(0); }
}

.phoenix-b2b-panel .pb2b-loading {
	position: relative; min-height: 60px;
	pointer-events: none; opacity: .75;
}
.phoenix-b2b-panel .pb2b-loading::after {
	content: '';
	position: absolute;
	left: 50%; top: 50%;
	width: 22px; height: 22px;
	margin: -11px 0 0 -11px;
	border-radius: 999px;
	border: 2px solid var(--pb2b-border);
	border-top-color: var(--pb2b-primary-2);
	animation: pb2bSpin .8s linear infinite;
}
@keyframes pb2bSpin { to { transform: rotate(360deg); } }

/* ==========================================================
 * COMPATIBILITY — when our shortcodes (csv import etc.) are
 * embedded directly in theme pages WITHOUT the full panel,
 * we still apply usable dark cards via .phoenix-b2b-standalone.
 * ========================================================== */
.phoenix-b2b-panel.phoenix-b2b-standalone .pb2b-card { background: var(--pb2b-bg-2); }

/* === v2.1 — pasek wykorzystania limitu miesięcznego (dashboard) === */
.phoenix-b2b-panel .pb2b-limit-row { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 8px; font-weight: 600; }
.phoenix-b2b-panel .pb2b-progress { height: 10px; background: var(--pb2b-bg-4); border-radius: 999px; overflow: hidden; }
.phoenix-b2b-panel .pb2b-progress-bar { height: 100%; background: var(--pb2b-accent-grad); border-radius: 999px; transition: width .3s ease; }
.phoenix-b2b-panel .pb2b-progress-bar.is-warning { background: var(--pb2b-warning); }
.phoenix-b2b-panel .pb2b-progress-bar.is-danger { background: var(--pb2b-danger); }
.phoenix-b2b-panel .pb2b-progress-foot { margin-top: 6px; font-size: 12px; }

/* =====================================================================
 * PhoenixB2B v2.3 — menu panelu klienta jak w aplikacji SaaS.
 * Twardo usuwamy podkreślenia linków menu (także przy hover/focus),
 * nawet jeśli motyw narzuca text-decoration: underline na <a>.
 * ===================================================================== */
.phoenix-b2b-panel .pb2b-nav-item,
.phoenix-b2b-panel .pb2b-nav-item:link,
.phoenix-b2b-panel .pb2b-nav-item:visited,
.phoenix-b2b-panel .pb2b-nav-item:hover,
.phoenix-b2b-panel .pb2b-nav-item:focus,
.phoenix-b2b-panel .pb2b-nav-item:active,
.phoenix-b2b-panel .pb2b-nav-item .pb2b-nav-label,
.phoenix-b2b-panel .pb2b-nav-logout,
.phoenix-b2b-panel .pb2b-nav-logout:hover {
	text-decoration: none !important;
	box-shadow: none;
}
.phoenix-b2b-panel .pb2b-nav-item:focus-visible {
	outline: 2px solid var(--pb2b-primary-2, #a855f7);
	outline-offset: 2px;
}
.phoenix-b2b-panel .pb2b-nav-item .pb2b-nav-label { border-bottom: 0 !important; }

/* =====================================================================
 * PhoenixB2B v2.8.8 — POLISH LOGOWANIA / REJESTRACJI B2B
 * Blok dopięty na końcu, aby nadpisać wcześniejsze reguły (kaskada).
 * Część 1 (login) + Część 2 (rejestracja) z briefu upgrade'u.
 * ===================================================================== */

/* --- Wspólne tło + odstępy ekranów auth --- */
.phoenix-b2b-panel.pb2b-auth {
	padding: 80px 20px;
	background:
		radial-gradient(900px circle at 18% 8%, rgba(124,58,237,0.20), transparent 60%),
		radial-gradient(760px circle at 85% 92%, rgba(59,130,246,0.16), transparent 60%),
		var(--pb2b-bg-0);
}
.phoenix-b2b-panel .pb2b-auth-grid {
	max-width: 1180px;
}
@media (max-width: 640px) {
	.phoenix-b2b-panel.pb2b-auth { padding: 48px 16px; }
}

/* --- Karty auth: premium radius + cień --- */
.phoenix-b2b-panel .pb2b-auth-card {
	border-radius: 24px;
	box-shadow: var(--pb2b-shadow-lg);
}
.phoenix-b2b-panel .pb2b-auth-side {
	border-radius: 24px;
}

/* --- LOGIN: inputy 50px, radius 14, dark bg, focus purple, reset obramowań --- */
.phoenix-b2b-panel .pb2b-login-form .pb2b-field label {
	display: block;
	margin-bottom: 6px;
	font-size: 13px;
	font-weight: 600;
	color: var(--pb2b-text-soft);
}
.phoenix-b2b-panel .pb2b-login-form input[type="text"],
.phoenix-b2b-panel .pb2b-login-form input[type="email"],
.phoenix-b2b-panel .pb2b-login-form input[type="password"] {
	-webkit-appearance: none;
	appearance: none;
	width: 100%;
	height: 50px;
	padding: 0 14px;
	background: var(--pb2b-bg-3);
	border: 1px solid var(--pb2b-border-strong);
	border-radius: 14px;
	color: var(--pb2b-text);
	font-size: 14.5px;
	line-height: 1.2;
	transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
	box-shadow: none;
	outline: none;
}
.phoenix-b2b-panel .pb2b-login-form .pb2b-field-with-icon input {
	padding-left: 42px !important;
}
.phoenix-b2b-panel .pb2b-login-form input:focus {
	border-color: var(--pb2b-primary-2);
	box-shadow: var(--pb2b-shadow-glow);
	outline: none;
}
.phoenix-b2b-panel .pb2b-login-form input::placeholder { color: var(--pb2b-text-dim); }
/* iOS/Chrome: usuń żółte tło autofill, utrzymaj ciemny input */
.phoenix-b2b-panel .pb2b-login-form input:-webkit-autofill,
.phoenix-b2b-panel .pb2b-login-form input:-webkit-autofill:focus {
	-webkit-text-fill-color: var(--pb2b-text);
	-webkit-box-shadow: 0 0 0 1000px var(--pb2b-bg-3) inset;
	caret-color: var(--pb2b-text);
}
.phoenix-b2b-panel .pb2b-field-toggle { top: 25px; }

/* --- Linki bez podkreślenia (checkbox / „Nie pamiętasz hasła?") --- */
.phoenix-b2b-panel a.pb2b-link,
.phoenix-b2b-panel a.pb2b-link:hover,
.phoenix-b2b-panel .pb2b-login-forgot,
.phoenix-b2b-panel .pb2b-login-forgot:hover {
	text-decoration: none;
}
.phoenix-b2b-panel .pb2b-login-forgot:hover { color: #C084FC; }

/* --- Przycisk „Zaloguj się": gradient purple→blue, blok --- */
.phoenix-b2b-panel .pb2b-login-submit {
	height: 50px;
	border-radius: 14px;
	background: linear-gradient(135deg, #A855F7 0%, #7C3AED 45%, #3B82F6 100%);
	font-size: 15px;
	font-weight: 600;
	box-shadow: 0 8px 22px rgba(124,58,237,0.40);
}
.phoenix-b2b-panel .pb2b-login-submit:hover {
	transform: translateY(-1px);
	box-shadow: 0 10px 28px rgba(124,58,237,0.50);
}

/* --- „Zarejestruj firmę": premium outline --- */
.phoenix-b2b-panel .pb2b-btn-outline {
	height: 50px;
	border-radius: 14px;
	background: transparent;
	border: 1px solid rgba(168,85,247,0.45);
	color: var(--pb2b-text);
	font-weight: 600;
	transition: border-color .15s ease, background .15s ease, box-shadow .15s ease;
}
.phoenix-b2b-panel .pb2b-btn-outline:hover {
	border-color: var(--pb2b-primary-2);
	background: rgba(168,85,247,0.10);
	box-shadow: var(--pb2b-shadow-glow);
	color: #fff;
}

/* --- Estetyczny alert box błędów (login + rejestracja) --- */
.phoenix-b2b-panel .pb2b-form-alert {
	border-radius: 14px;
	padding: 13px 16px;
	align-items: flex-start;
}

/* =====================================================================
 * REJESTRACJA — szeroka, premium karta 2-kolumnowa
 * ===================================================================== */
.phoenix-b2b-panel.pb2b-auth-reg .pb2b-auth-grid {
	max-width: 1240px;
	grid-template-columns: minmax(0, 360px) minmax(0, 1fr);
}
@media (max-width: 900px) {
	.phoenix-b2b-panel.pb2b-auth-reg .pb2b-auth-grid { grid-template-columns: 1fr; }
}
.phoenix-b2b-panel.pb2b-auth-reg .pb2b-auth-card-wide {
	max-width: none;
	width: 100%;
	border-radius: 24px;
	overflow: hidden; /* brak overflow poziomego */
}
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-registration { max-width: 100%; }

/* Inputy rejestracji: 50px + radius 14 (spójne z loginem) */
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field input[type="text"],
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field input[type="email"],
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field input[type="tel"],
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field input[type="password"],
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field input[type="url"],
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field input[type="number"],
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field select {
	height: 50px !important;
	border-radius: 14px !important;
	padding: 0 14px !important;
	-webkit-appearance: none;
	appearance: none;
	box-shadow: none !important;
}
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field select {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2394A3B8' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 14px center;
	padding-right: 38px !important;
}
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field input:-webkit-autofill {
	-webkit-text-fill-color: var(--pb2b-text);
	-webkit-box-shadow: 0 0 0 1000px var(--pb2b-bg-2) inset;
}

/* Badge nagłówka rejestracji */
.phoenix-b2b-panel .pb2b-auth-badge {
	display: inline-flex; align-items: center; gap: 6px;
	padding: 5px 12px;
	border-radius: 999px;
	background: rgba(168,85,247,0.15);
	border: 1px solid rgba(168,85,247,0.35);
	color: #D8B4FE;
	font-size: 12px; font-weight: 600;
	letter-spacing: .02em;
	margin: 0 0 12px;
}
.phoenix-b2b-panel .pb2b-auth-info {
	display: flex; align-items: center; gap: 8px;
	margin: 14px 0 0;
	font-size: 13px;
	color: var(--pb2b-text-muted);
}
.phoenix-b2b-panel .pb2b-auth-info .dashicons { color: var(--pb2b-info); }

/* Ekran sukcesu rejestracji (wyśrodkowany, z CTA) */
.phoenix-b2b-panel .pb2b-auth-success {
	text-align: center;
	padding: 8px 0 4px;
}
.phoenix-b2b-panel .pb2b-auth-success-ico {
	width: 64px; height: 64px; border-radius: 999px;
	display: inline-flex; align-items: center; justify-content: center;
	background: rgba(34,197,94,0.16);
	color: #86EFAC;
	margin-bottom: 16px;
}
.phoenix-b2b-panel .pb2b-auth-success h2 { font-size: 22px; margin: 0 0 8px; }
.phoenix-b2b-panel .pb2b-auth-success p { color: var(--pb2b-text-soft); margin: 0 0 20px; }

/* =====================================================================
 * PhoenixB2B v2.8.13 — BRANDING + MOBILE ORDER + REJESTRACJA (szersza/niższa)
 * Blok dopięty na końcu (kaskada) — Część 3/4/5 briefu upgrade'u.
 * ===================================================================== */

/* --- Branding: monogram (gdy brak logo) + logo --- */
.phoenix-b2b-panel .pb2b-auth-brand {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 22px;
}
.phoenix-b2b-panel .pb2b-auth-brand-mono {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 12px;
	background: linear-gradient(135deg, #A855F7 0%, #7C3AED 45%, #3B82F6 100%);
	color: #fff;
	font-weight: 800;
	font-size: 20px;
	line-height: 1;
	box-shadow: 0 8px 22px rgba(124,58,237,0.40);
	flex: 0 0 auto;
}
.phoenix-b2b-panel .pb2b-auth-brand-name {
	font-weight: 700;
	font-size: 18px;
	color: #fff;
	letter-spacing: .01em;
}
.phoenix-b2b-panel .pb2b-auth-brand-logo {
	border-radius: 10px;
}

/* --- MOBILE: formularz NAJPIERW, karta benefitów NIŻEJ (login + rejestracja) ---
 * Grid jest jednokolumnowy poniżej breakpointów; reorder przez `order`. */
@media (max-width: 900px) {
	.phoenix-b2b-panel .pb2b-auth-grid { display: grid; }
	.phoenix-b2b-panel .pb2b-auth-form-wrap { order: 0; }
	.phoenix-b2b-panel .pb2b-auth-side { order: 1; }
}

/* --- REJESTRACJA desktop: szersza i niższa (mniej pionowego scrolla) --- */
@media (min-width: 901px) {
	/* Adres: 3 kolumny (kod / miasto / kraj) gdy 3 pola w wierszu. */
	.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-row:has(> .phoenix-b2b-form-field:nth-child(3)) {
		grid-template-columns: 1fr 1fr 1fr;
	}
	/* Inputy nieco niższe (46–48px) — gęstszy formularz. */
	.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field input[type="text"],
	.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field input[type="email"],
	.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field input[type="tel"],
	.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field input[type="password"],
	.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field input[type="url"],
	.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field input[type="number"],
	.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field select {
		height: 47px !important;
	}
	/* Mniejsze odstępy między wierszami → niższa karta. */
	.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-row { gap: 14px; margin-bottom: 12px; }
	.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-section { margin: 14px 0 8px; }
	/* Szersza prawa karta formularza. */
	.phoenix-b2b-panel.pb2b-auth-reg .pb2b-auth-grid {
		max-width: 1280px;
		grid-template-columns: minmax(0, 360px) minmax(0, 1fr);
	}
}

/* Checkboxy estetyczne (zgody) — spójny accent. */
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field-checkbox input[type="checkbox"] {
	accent-color: #A855F7;
}

/* Linki w formularzu rejestracji bez podkreśleń. */
.phoenix-b2b-panel.pb2b-auth-reg a.pb2b-link,
.phoenix-b2b-panel.pb2b-auth-reg a.pb2b-link:hover { text-decoration: none; }

/* ===================================================================
 * ŹRÓDŁO: app-mode.css (tokeny zdjęte -> panel-v3-tokens.css)
 * =================================================================== */
/**
 * PhoenixB2B v1.6 — Tryb aplikacji B2B (frontend).
 *
 * Aktywne tylko gdy <body> ma klasę .phoenix-b2b-app-page (v1.6) lub
 * .phoenix-b2b-app-mode (v1.5, kompatybilność wsteczna).
 *
 * Co robi:
 *   - chowa nagłówek/stopkę/sidebar motywu (i Elementor location:header/footer),
 *   - chowa WSZYSTKIE warianty mini-cart / side-cart / drawer / floating-cart
 *     WooCommerce (xoo-wsc, woofc, wc-blocks, Elementor menu-cart itd.),
 *   - rozciąga kontener na full width + min-height 100vh,
 *   - ustawia ciemne tło zgodne z client-panel.css,
 *   - usuwa marginesy/paddingi, które motyw mógłby dorzucić.
 *
 * Wszystkie reguły scope'owane do body.phoenix-b2b-app-page lub
 * body.phoenix-b2b-app-mode — na innych stronach motyw działa normalnie.
 */

/* ==========================================================
 * BASE — html / body
 * ========================================================== */
html[data-pb2b-app="1"] {
	background: #070B18 !important;
}

body.phoenix-b2b-app-page,
body.phoenix-b2b-app-mode {
	background: #070B18 !important;
	color: #F8FAFC;
	margin: 0 !important;
	padding: 0 !important;
	overflow-x: hidden;
	min-height: 100vh;
}

/* ==========================================================
 * UKRYJ NAGŁÓWEK / STOPKĘ / SIDEBAR MOTYWU
 * ========================================================== */
body.phoenix-b2b-app-page > header,
body.phoenix-b2b-app-page > footer,
body.phoenix-b2b-app-page > .site-header,
body.phoenix-b2b-app-page > .site-footer,
body.phoenix-b2b-app-page .site-header,
body.phoenix-b2b-app-page .site-footer,
body.phoenix-b2b-app-page #site-header,
body.phoenix-b2b-app-page #site-footer,
body.phoenix-b2b-app-page #masthead,
body.phoenix-b2b-app-page #colophon,
body.phoenix-b2b-app-page .header-main,
body.phoenix-b2b-app-page .footer-main,
body.phoenix-b2b-app-page .global-header,
body.phoenix-b2b-app-page .global-footer,
body.phoenix-b2b-app-page .topbar,
body.phoenix-b2b-app-page .top-bar,
body.phoenix-b2b-app-page .header-top,
body.phoenix-b2b-app-page .pre-header,
body.phoenix-b2b-app-page .footer-top,
body.phoenix-b2b-app-page .footer-bottom,

/* Elementor */
body.phoenix-b2b-app-page .elementor-location-header,
body.phoenix-b2b-app-page .elementor-location-footer,
body.phoenix-b2b-app-page [data-elementor-type="header"],
body.phoenix-b2b-app-page [data-elementor-type="footer"],

/* Astra */
body.phoenix-b2b-app-page .ast-above-header,
body.phoenix-b2b-app-page .main-header-bar,
body.phoenix-b2b-app-page .ast-below-header,
body.phoenix-b2b-app-page .ast-small-footer,
body.phoenix-b2b-app-page .footer-adv,
body.phoenix-b2b-app-page .footer-sml-section,

/* GeneratePress */
body.phoenix-b2b-app-page .site-info,
body.phoenix-b2b-app-page .footer-widgets,

/* OceanWP */
body.phoenix-b2b-app-page #site-header-inner,
body.phoenix-b2b-app-page #footer,

/* Hello / Hello Plus */
body.phoenix-b2b-app-page .hello-header,
body.phoenix-b2b-app-page .hello-footer,

/* Storefront */
body.phoenix-b2b-app-page .storefront-handheld-footer-bar,

/* Kadence / Blocksy / Neve */
body.phoenix-b2b-app-page .site-header-wrap,
body.phoenix-b2b-app-page .site-header-row-container-inner,
body.phoenix-b2b-app-page .ct-header,
body.phoenix-b2b-app-page .ct-footer,
body.phoenix-b2b-app-page .header-main-nav,
body.phoenix-b2b-app-page .nv-navbar,

/* Generic sidebars / widgets */
body.phoenix-b2b-app-page .sidebar,
body.phoenix-b2b-app-page #secondary,
body.phoenix-b2b-app-page .widget-area,

/* Breadcrumbs i tytuły stron */
body.phoenix-b2b-app-page .breadcrumb,
body.phoenix-b2b-app-page .breadcrumbs,
body.phoenix-b2b-app-page .page-title,
body.phoenix-b2b-app-page .page-header,
body.phoenix-b2b-app-page .entry-header,
body.phoenix-b2b-app-page .post-thumbnail,
body.phoenix-b2b-app-page .single-featured-image-header,

/* Komentarze */
body.phoenix-b2b-app-page #comments,
body.phoenix-b2b-app-page .comments-area,
body.phoenix-b2b-app-page .nav-links,

/* Kompatybilność wsteczna — selektor v1.5 */
body.phoenix-b2b-app-mode > header,
body.phoenix-b2b-app-mode > footer,
body.phoenix-b2b-app-mode .site-header,
body.phoenix-b2b-app-mode .site-footer,
body.phoenix-b2b-app-mode #masthead,
body.phoenix-b2b-app-mode #colophon,
body.phoenix-b2b-app-mode .header-main,
body.phoenix-b2b-app-mode .footer-main,
body.phoenix-b2b-app-mode .elementor-location-header,
body.phoenix-b2b-app-mode .elementor-location-footer,
body.phoenix-b2b-app-mode .sidebar,
body.phoenix-b2b-app-mode #secondary,
body.phoenix-b2b-app-mode .widget-area,
body.phoenix-b2b-app-mode .breadcrumb,
body.phoenix-b2b-app-mode .page-title,
body.phoenix-b2b-app-mode .entry-header {
	display: none !important;
	visibility: hidden !important;
	height: 0 !important;
	overflow: hidden !important;
	pointer-events: none !important;
}

/* ==========================================================
 * v1.6 — BLOKADA KOSZYKA WOOCOMMERCE (mini-cart / side-cart /
 * drawer / floating / header-cart) NA STRONACH APP-MODE.
 * ========================================================== */
body.phoenix-b2b-app-page .woocommerce-mini-cart,
body.phoenix-b2b-app-page .widget_shopping_cart,
body.phoenix-b2b-app-page .widget_shopping_cart_content,
body.phoenix-b2b-app-page .cart_list,
body.phoenix-b2b-app-page .product_list_widget,
body.phoenix-b2b-app-page .site-header-cart,
body.phoenix-b2b-app-page .cart-widget,
body.phoenix-b2b-app-page .cart-customlocation,
body.phoenix-b2b-app-page .cart-icon,
body.phoenix-b2b-app-page .cart-contents,

/* XooCart */
body.phoenix-b2b-app-page .xoo-wsc-container,
body.phoenix-b2b-app-page .xoo-wsc-modal,
body.phoenix-b2b-app-page .xoo-wsc-basket,
body.phoenix-b2b-app-page .xoo-wsc-bki,
body.phoenix-b2b-app-page .xoo-wsc-cont,
body.phoenix-b2b-app-page .xoo-wsc-sc-bki,
body.phoenix-b2b-app-page .xoo-wsc-opac,

/* WooCommerce Fast Cart */
body.phoenix-b2b-app-page .woofc,
body.phoenix-b2b-app-page .woofc-area,
body.phoenix-b2b-app-page .woofc-icon,
body.phoenix-b2b-app-page .woofc-count,
body.phoenix-b2b-app-page .woofc-overlay,

/* WooCommerce Blocks */
body.phoenix-b2b-app-page .wc-block-mini-cart,
body.phoenix-b2b-app-page .wc-block-mini-cart__drawer,
body.phoenix-b2b-app-page .wp-block-woocommerce-mini-cart,
body.phoenix-b2b-app-page .wp-block-woocommerce-mini-cart-contents,
body.phoenix-b2b-app-page .wc-block-components-drawer,

/* Elementor menu cart */
body.phoenix-b2b-app-page .elementor-menu-cart__container,
body.phoenix-b2b-app-page .elementor-menu-cart__toggle,
body.phoenix-b2b-app-page .elementor-menu-cart__main,
body.phoenix-b2b-app-page .elementor-menu-cart,
body.phoenix-b2b-app-page .elementor-widget-woocommerce-menu-cart,
body.phoenix-b2b-app-page .elementor-widget-wc-mini-cart,

/* Generic floating / drawer / side carts (motywy custom) */
body.phoenix-b2b-app-page .cart-drawer,
body.phoenix-b2b-app-page .side-cart,
body.phoenix-b2b-app-page .floating-cart,
body.phoenix-b2b-app-page .header-cart,
body.phoenix-b2b-app-page .mini-cart,
body.phoenix-b2b-app-page #side-cart,
body.phoenix-b2b-app-page #mini-cart,
body.phoenix-b2b-app-page #cart-drawer,
body.phoenix-b2b-app-page #floating-cart,
body.phoenix-b2b-app-page #header-cart,

/* Kompatybilność wsteczna — selektor v1.5 */
body.phoenix-b2b-app-mode .woocommerce-mini-cart,
body.phoenix-b2b-app-mode .widget_shopping_cart,
body.phoenix-b2b-app-mode .site-header-cart,
body.phoenix-b2b-app-mode .cart-widget,
body.phoenix-b2b-app-mode .xoo-wsc-container,
body.phoenix-b2b-app-mode .xoo-wsc-modal,
body.phoenix-b2b-app-mode .xoo-wsc-basket,
body.phoenix-b2b-app-mode .woofc,
body.phoenix-b2b-app-mode .wc-block-mini-cart,
body.phoenix-b2b-app-mode .wp-block-woocommerce-mini-cart,
body.phoenix-b2b-app-mode .elementor-menu-cart__container,
body.phoenix-b2b-app-mode .elementor-menu-cart__toggle,
body.phoenix-b2b-app-mode .elementor-widget-woocommerce-menu-cart,
body.phoenix-b2b-app-mode .cart-drawer,
body.phoenix-b2b-app-mode .side-cart,
body.phoenix-b2b-app-mode .floating-cart,
body.phoenix-b2b-app-mode .header-cart {
	display: none !important;
	visibility: hidden !important;
	width: 0 !important;
	height: 0 !important;
	max-width: 0 !important;
	max-height: 0 !important;
	min-width: 0 !important;
	min-height: 0 !important;
	overflow: hidden !important;
	pointer-events: none !important;
	opacity: 0 !important;
	position: absolute !important;
	left: -99999px !important;
	top: -99999px !important;
	z-index: -1 !important;
}

/* ==========================================================
 * ROZCIĄGNIJ KONTENER NA FULL WIDTH
 * ========================================================== */
body.phoenix-b2b-app-page #page,
body.phoenix-b2b-app-page .site,
body.phoenix-b2b-app-page #wrapper,
body.phoenix-b2b-app-page .site-content,
body.phoenix-b2b-app-page #content,
body.phoenix-b2b-app-page #primary,
body.phoenix-b2b-app-page .content-area,
body.phoenix-b2b-app-page main,
body.phoenix-b2b-app-page .main,
body.phoenix-b2b-app-page .entry-content,
body.phoenix-b2b-app-page article,
body.phoenix-b2b-app-page .ast-container,
body.phoenix-b2b-app-page .site-main,
body.phoenix-b2b-app-page .post-inner,
body.phoenix-b2b-app-page .container,
body.phoenix-b2b-app-page .container-fluid,
body.phoenix-b2b-app-page .row,
body.phoenix-b2b-app-page .elementor,
body.phoenix-b2b-app-page .elementor-section,
body.phoenix-b2b-app-page .elementor-container,
body.phoenix-b2b-app-page .elementor-widget-wrap,
body.phoenix-b2b-app-page .e-con,
body.phoenix-b2b-app-page .e-con-inner,
body.phoenix-b2b-app-mode #page,
body.phoenix-b2b-app-mode .site,
body.phoenix-b2b-app-mode #wrapper,
body.phoenix-b2b-app-mode .site-content,
body.phoenix-b2b-app-mode #content,
body.phoenix-b2b-app-mode #primary,
body.phoenix-b2b-app-mode .content-area,
body.phoenix-b2b-app-mode main,
body.phoenix-b2b-app-mode .main,
body.phoenix-b2b-app-mode .entry-content,
body.phoenix-b2b-app-mode article,
body.phoenix-b2b-app-mode .ast-container,
body.phoenix-b2b-app-mode .site-main,
body.phoenix-b2b-app-mode .post-inner,
body.phoenix-b2b-app-mode .elementor,
body.phoenix-b2b-app-mode .elementor-section,
body.phoenix-b2b-app-mode .elementor-container,
body.phoenix-b2b-app-mode .elementor-widget-wrap,
body.phoenix-b2b-app-mode .e-con,
body.phoenix-b2b-app-mode .e-con-inner {
	max-width: none !important;
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	border: 0 !important;
	min-height: 100vh;
}

/* Storefront podstawowe nadpisanie szerokości */
body.phoenix-b2b-app-page #page,
body.phoenix-b2b-app-mode #page { display: block !important; }

/* Elementor: kill min-height defaults */
body.phoenix-b2b-app-page .elementor-section,
body.phoenix-b2b-app-page .elementor-section.elementor-section-boxed > .elementor-container,
body.phoenix-b2b-app-mode .elementor-section,
body.phoenix-b2b-app-mode .elementor-section.elementor-section-boxed > .elementor-container { max-width: none !important; }

/* ==========================================================
 * USUŃ BIAŁE PASKI / MARGINESY / RAMKI MOTYWU
 * ========================================================== */
body.phoenix-b2b-app-page .entry-content > .alignfull,
body.phoenix-b2b-app-page .entry-content > .alignwide,
body.phoenix-b2b-app-mode .entry-content > .alignfull,
body.phoenix-b2b-app-mode .entry-content > .alignwide {
	margin-left: 0 !important;
	margin-right: 0 !important;
	width: 100% !important;
	max-width: 100% !important;
}
body.phoenix-b2b-app-page .has-spacing,
body.phoenix-b2b-app-page .single-content,
body.phoenix-b2b-app-page .post-content,
body.phoenix-b2b-app-mode .has-spacing,
body.phoenix-b2b-app-mode .single-content,
body.phoenix-b2b-app-mode .post-content { padding: 0 !important; margin: 0 !important; }

/* Admin bar — jeśli zostawiony */
body.phoenix-b2b-app-page.admin-bar,
body.phoenix-b2b-app-mode.admin-bar { padding-top: 0 !important; }
body.phoenix-b2b-app-page #wpadminbar,
body.phoenix-b2b-app-mode #wpadminbar { background: #0B1020 !important; }

/* Skip-links */
body.phoenix-b2b-app-page .skip-link,
body.phoenix-b2b-app-mode .skip-link { position: absolute !important; left: -9999px !important; }

/* ==========================================================
 * STRONA LOGOWANIA / STANY — pełna wysokość
 * ========================================================== */
body.phoenix-b2b-app-page .phoenix-b2b-panel,
body.phoenix-b2b-app-mode .phoenix-b2b-panel { min-height: 100vh; }

/* ==========================================================
 * RESPONSIVE — zapobiegnij wystawaniu poza viewport
 * ========================================================== */
body.phoenix-b2b-app-page,
body.phoenix-b2b-app-mode { overflow-x: hidden; }

/* ==========================================================
 * NIE ŁAM CHARAKTERYSTYCZNYCH KOMPONENTÓW PANELU
 * ========================================================== */
body.phoenix-b2b-app-page .phoenix-b2b-panel,
body.phoenix-b2b-app-mode .phoenix-b2b-panel { max-width: none; }
body.phoenix-b2b-app-page .phoenix-b2b-panel .pb2b-app,
body.phoenix-b2b-app-mode .phoenix-b2b-panel .pb2b-app { min-height: 100vh; }

/* ===================================================================
 * ŹRÓDŁO: theme.css (tokeny zdjęte -> panel-v3-tokens.css)
 * =================================================================== */
/**
 * PhoenixB2B v2.4 — Motyw jasny/ciemny dla panelu klienta + komponent
 * przełącznika motywu.
 *
 * Zasada:
 *   - Tryb CIEMNY jest domyślny (zmienne zdefiniowane w client-panel.css).
 *   - Tryb JASNY włączany jest atrybutem data-pb2b-theme="light" na wrapperze
 *     .phoenix-b2b-panel. Poniżej nadpisujemy tokeny kolorów oraz nieliczne
 *     twarde tinty (rgba bieli), które na jasnym tle byłyby niewidoczne.
 *
 * Kontrasty: brak czarnego tekstu na ciemnym tle i jasnoszarego na białym;
 * inputy/selecty/checkboxy pozostają czytelne w obu trybach.
 */

/* ==========================================================
 * TŁO TRYBU APLIKACJI ZALEŻNE OD MOTYWU
 * (klasa pb2b-theme-* dokładana do <body> przez Phoenix_B2B_Theme)
 * Specyficzność celowo wyższa niż app-mode.css (które wymusza #070B18).
 * ========================================================== */
html[data-pb2b-app="1"] body.pb2b-theme-light,
html[data-pb2b-app="1"] body.pb2b-theme-light.phoenix-b2b-app-page,
body.pb2b-theme-light.phoenix-b2b-app-page,
body.pb2b-theme-light.phoenix-b2b-app-mode {
	background: #EEF1F8 !important;
	color: #0F172A !important;
}
html[data-pb2b-app="1"]:has(body.pb2b-theme-light),
html[data-pb2b-theme="light"] {
	background: #EEF1F8 !important;
}

/* ==========================================================
 * TOKENY TRYBU JASNEGO
 * ========================================================== */
.phoenix-b2b-panel[data-pb2b-theme="light"] {




	background: var(--pb2b-bg-0);
	color: var(--pb2b-text);
}

/* Sidebar — pełna biel zamiast gradientu ciemnego. */
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-sidebar {
	background: #FFFFFF;
	border-right: 1px solid var(--pb2b-border);
}

/* Topbar — jasna powierzchnia z subtelnym cieniem. */
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-topbar {
	background: rgba(255, 255, 255, 0.92);
	border-bottom: 1px solid var(--pb2b-border);
	backdrop-filter: saturate(160%) blur(8px);
}

/* Karty / tabele / inputy — twarde tinty bieli zamieniamy na ciemne. */
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-table thead th { background: #F3F5FB; }
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-table tbody tr:hover { background: rgba(15, 23, 42, 0.035); }
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-nav-item:hover { background: rgba(15, 23, 42, 0.05); color: var(--pb2b-text); }
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-field-toggle:hover { background: rgba(15, 23, 42, 0.05); }
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-user-chip { background: #F3F5FB; }
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-brand-mark { box-shadow: 0 4px 14px rgba(124, 58, 237, 0.28); }

/* Aktywna zakładka menu — w jasnym trybie czytelny fiolet zamiast bieli. */
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-nav-item.is-active {
	background: rgba(124, 58, 237, 0.10);
	color: var(--pb2b-primary-strong, #6D28D9);
}
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-nav-item.is-active .pb2b-nav-icon { color: var(--pb2b-primary, #7C3AED); }

/* Filtry/chipy: hover nie może bielić tekstu na białym tle. */
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-filter-chip { color: var(--pb2b-text-soft); }
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-filter-chip:hover { color: var(--pb2b-text); background: rgba(15, 23, 42, 0.04); }
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-filter-chip.is-active { color: #fff; }

/* Checkbox/radio/select – wymuś czytelny akcent i tło. */
.phoenix-b2b-panel[data-pb2b-theme="light"] input[type="checkbox"],
.phoenix-b2b-panel[data-pb2b-theme="light"] input[type="radio"] {
	accent-color: var(--pb2b-primary, #7C3AED);
}
.phoenix-b2b-panel[data-pb2b-theme="light"] select {
	background-color: var(--pb2b-bg-3);
	color: var(--pb2b-text);
}
.phoenix-b2b-panel[data-pb2b-theme="light"] select option { background: #fff; color: #0F172A; }

/* Empty states – tła i ramki w jasnym trybie. */
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-empty,
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-shop-empty {
	background: #F6F8FD;
	border-color: var(--pb2b-border);
}

/* ==========================================================
 * KOMPONENT PRZEŁĄCZNIKA MOTYWU (panel klienta)
 * ========================================================== */
.phoenix-b2b-panel .pb2b-theme-toggle {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	padding: 9px 12px;
	background: transparent;
	border: 1px solid var(--pb2b-border);
	border-radius: var(--pb2b-radius-sm, 10px);
	color: var(--pb2b-text-soft);
	cursor: pointer;
	font: inherit;
	font-size: 13px;
	font-weight: 600;
	transition: background .15s ease, border-color .15s ease, color .15s ease;
	-webkit-tap-highlight-color: transparent;
}
.phoenix-b2b-panel .pb2b-theme-toggle:hover {
	color: var(--pb2b-text);
	border-color: var(--pb2b-border-strong);
	background: rgba(124, 58, 237, 0.06);
}
.phoenix-b2b-panel .pb2b-theme-toggle:focus-visible {
	outline: none;
	box-shadow: var(--pb2b-shadow-glow);
	border-color: var(--pb2b-primary-2, #A855F7);
}

.phoenix-b2b-panel .pb2b-theme-toggle-track {
	position: relative;
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	width: 52px;
	height: 26px;
	padding: 0 5px;
	border-radius: 999px;
	background: linear-gradient(135deg, #1E293B, #0B1020);
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
	transition: background .2s ease;
}
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-theme-toggle-track {
	background: linear-gradient(135deg, #FBBF24, #F59E0B);
	box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.12);
}

.phoenix-b2b-panel .pb2b-theme-toggle-ico {
	display: inline-flex;
	width: 16px;
	height: 16px;
	z-index: 1;
	transition: opacity .2s ease, color .2s ease;
}
.phoenix-b2b-panel .pb2b-theme-toggle-ico-moon { color: #C7D2FE; opacity: 1; }
.phoenix-b2b-panel .pb2b-theme-toggle-ico-sun  { color: #FFFFFF; opacity: .35; }
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-theme-toggle-ico-moon { opacity: .35; color: #92400E; }
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-theme-toggle-ico-sun  { opacity: 1; color: #FFFFFF; }

.phoenix-b2b-panel .pb2b-theme-toggle-knob {
	position: absolute;
	top: 50%;
	left: 3px;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.35);
	transform: translateY(-50%);
	transition: transform .22s cubic-bezier(.4, 0, .2, 1);
}
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-theme-toggle-knob {
	transform: translate(26px, -50%);
}

.phoenix-b2b-panel .pb2b-theme-toggle-text { line-height: 1; }
.phoenix-b2b-panel .pb2b-theme-toggle-text-light { display: none; }
.phoenix-b2b-panel .pb2b-theme-toggle-text-dark  { display: inline; }
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-theme-toggle-text-light { display: inline; }
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-theme-toggle-text-dark  { display: none; }

/* Wariant „icon” w topbarze — tylko suwak, bez etykiety. */
.phoenix-b2b-panel .pb2b-topbar .pb2b-theme-toggle {
	width: auto;
	padding: 6px;
	border-color: transparent;
}
.phoenix-b2b-panel .pb2b-topbar .pb2b-theme-toggle .pb2b-theme-toggle-text { display: none; }

/* ==========================================================
 * KOMPONENTY v2.4 — badge menu, dzwonek topbar, hero dashboardu
 * (działają w obu trybach — kolory z tokenów panelu)
 * ========================================================== */

/* Helper — ukryj na mobile. */
@media (max-width: 720px) {
	.phoenix-b2b-panel .pb2b-hide-mobile { display: none !important; }
}

/* Badge powiadomień w menu. */
.phoenix-b2b-panel .pb2b-nav-item { position: relative; }
.phoenix-b2b-panel .pb2b-nav-badge {
	margin-left: auto;
	min-width: 20px;
	height: 20px;
	padding: 0 6px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 11px;
	font-weight: 700;
	line-height: 1;
	color: #fff;
	background: var(--pb2b-primary, #7C3AED);
	border-radius: 999px;
}
.phoenix-b2b-panel .pb2b-nav-badge-alert {
	background: var(--pb2b-danger, #EF4444);
	box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.18);
}
.phoenix-b2b-panel .pb2b-nav-item.is-active .pb2b-nav-badge { background: #fff; color: var(--pb2b-primary-strong, #6D28D9); }

/* Dzwonek powiadomień w topbarze. */
.phoenix-b2b-panel .pb2b-topbar-bell {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 10px;
	color: var(--pb2b-text-soft);
	border: 1px solid var(--pb2b-border);
	background: transparent;
	transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.phoenix-b2b-panel .pb2b-topbar-bell:hover {
	color: var(--pb2b-text);
	background: rgba(124, 58, 237, 0.08);
	border-color: var(--pb2b-border-strong);
}
.phoenix-b2b-panel .pb2b-topbar-bell svg { width: 19px; height: 19px; }
.phoenix-b2b-panel .pb2b-topbar-bell-dot {
	position: absolute;
	top: -5px;
	right: -5px;
	min-width: 18px;
	height: 18px;
	padding: 0 5px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 10px;
	font-weight: 700;
	color: #fff;
	background: var(--pb2b-danger, #EF4444);
	border: 2px solid var(--pb2b-bg-2, #111827);
	border-radius: 999px;
}
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-topbar-bell-dot { border-color: #fff; }

/* Hero powitalny dashboardu. */
.phoenix-b2b-panel .pb2b-hero {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	flex-wrap: wrap;
	padding: 22px 24px;
	margin-bottom: 18px;
	border-radius: var(--pb2b-radius, 14px);
	background:
		radial-gradient(1200px 200px at 0% -40%, rgba(124, 58, 237, 0.22), transparent 60%),
		linear-gradient(135deg, var(--pb2b-bg-2), var(--pb2b-bg-3));
	border: 1px solid var(--pb2b-border);
	box-shadow: var(--pb2b-shadow);
}
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-hero {
	background:
		radial-gradient(1200px 220px at 0% -40%, rgba(124, 58, 237, 0.12), transparent 60%),
		linear-gradient(135deg, #FFFFFF, #F4F6FD);
}
.phoenix-b2b-panel .pb2b-hero-greeting {
	font-size: 13px;
	font-weight: 600;
	color: var(--pb2b-text-muted);
	letter-spacing: .02em;
}
.phoenix-b2b-panel .pb2b-hero-company {
	margin: 2px 0 12px;
	font-size: 26px;
	font-weight: 700;
	letter-spacing: -0.02em;
	color: var(--pb2b-text);
}
.phoenix-b2b-panel .pb2b-hero-meta {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
}
.phoenix-b2b-panel .pb2b-hero-status {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 5px 12px;
	font-size: 12.5px;
	font-weight: 600;
	border-radius: 999px;
	background: rgba(34, 197, 94, 0.14);
	color: var(--pb2b-success, #22C55E);
}
.phoenix-b2b-panel .pb2b-hero-status.is-warn { background: rgba(245, 158, 11, 0.14); color: var(--pb2b-warning, #F59E0B); }
.phoenix-b2b-panel .pb2b-hero-status.is-danger { background: rgba(239, 68, 68, 0.14); color: var(--pb2b-danger, #EF4444); }
.phoenix-b2b-panel .pb2b-hero-status-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: currentColor;
	box-shadow: 0 0 0 4px rgba(34, 197, 94, 0.18);
}
.phoenix-b2b-panel .pb2b-hero-status.is-warn .pb2b-hero-status-dot { box-shadow: 0 0 0 4px rgba(245, 158, 11, 0.18); }
.phoenix-b2b-panel .pb2b-hero-status.is-danger .pb2b-hero-status-dot { box-shadow: 0 0 0 4px rgba(239, 68, 68, 0.18); }
.phoenix-b2b-panel .pb2b-hero-pill {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 5px 12px;
	font-size: 12.5px;
	border-radius: 999px;
	background: var(--pb2b-bg-3);
	border: 1px solid var(--pb2b-border);
	color: var(--pb2b-text-soft);
}
.phoenix-b2b-panel .pb2b-hero-pill strong { color: var(--pb2b-text); }
.phoenix-b2b-panel .pb2b-hero-pill-accent { background: rgba(124, 58, 237, 0.12); border-color: rgba(124, 58, 237, 0.28); }
.phoenix-b2b-panel .pb2b-hero-pill-accent strong { color: var(--pb2b-primary-2, #A855F7); }
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-hero-pill-accent strong { color: var(--pb2b-primary-strong, #6D28D9); }
.phoenix-b2b-panel .pb2b-hero-cta { display: flex; gap: 10px; flex-wrap: wrap; }
@media (max-width: 720px) {
	.phoenix-b2b-panel .pb2b-hero-company { font-size: 21px; }
	.phoenix-b2b-panel .pb2b-hero-cta { width: 100%; }
	.phoenix-b2b-panel .pb2b-hero-cta .pb2b-btn { flex: 1 1 auto; justify-content: center; }
}

/* ===================================================================
 * ŹRÓDŁO: client-panel-v26.css (tokeny zdjęte -> panel-v3-tokens.css)
 * =================================================================== */
/**
 * PhoenixB2B v2.6 — warstwa naprawcza panelu klienta.
 *
 * Cele:
 *  1. Layout: sidebar 260px + content pełnej szerokości, brak sztucznych
 *     max-width, brak białych pasów, responsywność (PC/laptop/tablet/mobile).
 *  2. Spójny motyw jasny/ciemny dla WSZYSTKICH sekcji (również osadzonych
 *     shortcode'ów: sklep, quick-order, kategorie, ulubione, listy).
 *  3. Jednolity system komponentów: pb2b-app-card / -grid / -table / -button /
 *     -input / -badge / -empty / -toast / -section-header.
 *  4. Nowe elementy v2.6: koszyk w topbarze, pasek koszyka w sklepie, pasek
 *     flow w Katalogu, karty kategorii, dane firmy, toast.
 *
 * Wszystko scope'owane do .phoenix-b2b-panel i korzysta z tokenów --pb2b-*,
 * więc automatycznie podąża za trybem jasnym/ciemnym (data-pb2b-theme).
 *
 * @since 2.6.0
 */

/* ==========================================================
 * 1. LAYOUT — pełna szerokość, brak ucięć i białych pasów
 * ========================================================== */
.phoenix-b2b-panel.pb2b-app {
	display: grid;
	grid-template-columns: var(--pb2b-sidebar-w, 260px) minmax(0, 1fr);
	width: 100%;
	max-width: none;
	min-height: 100vh;
}

.phoenix-b2b-panel .pb2b-main {
	min-width: 0;
	width: 100%;
	max-width: none;
}

.phoenix-b2b-panel .pb2b-content {
	width: 100%;
	max-width: none;
	min-width: 0;
}

/* Karty/sekcje wewnątrz contentu nigdy nie zwężają się sztucznie. */
.phoenix-b2b-panel .pb2b-content > *,
.phoenix-b2b-panel .pb2b-card,
.phoenix-b2b-panel .pb2b-app-card {
	width: 100%;
	max-width: none;
}

/* Osadzone shortcody (sklep, quick-order, kategorie, ulubione, listy)
 * dostają pełną szerokość — kasujemy max-width z frontend.css/innych warstw. */
.phoenix-b2b-panel .pb2b-shop,
.phoenix-b2b-panel .phoenix-b2b-qo,
.phoenix-b2b-panel .pb2b-cats,
.phoenix-b2b-panel .pb2b-category-index,
.phoenix-b2b-panel .pb2b-lists,
.phoenix-b2b-panel .pb2b-favorites,
.phoenix-b2b-panel .pb2b-quick-order-embed,
.phoenix-b2b-panel .pb2b-quick-order-embed > * {
	width: 100% !important;
	max-width: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	float: none !important;
}

/* Brak białych pasów: tło osadzonych komponentów = tło panelu. */
.phoenix-b2b-panel .pb2b-shop,
.phoenix-b2b-panel .phoenix-b2b-qo {
	background: transparent !important;
}

/* ==========================================================
 * 2. SPÓJNY MOTYW DLA QUICK-ORDER (frontend.css ma twarde kolory)
 * ========================================================== */
.phoenix-b2b-panel .phoenix-b2b-qo {
	color: var(--pb2b-text);
}
.phoenix-b2b-panel .phoenix-b2b-qo-table {
	width: 100%;
	border-collapse: collapse;
	background: var(--pb2b-bg-2);
	border: 1px solid var(--pb2b-border);
	border-radius: var(--pb2b-radius-sm);
	overflow: hidden;
}
.phoenix-b2b-panel .phoenix-b2b-qo-table th,
.phoenix-b2b-panel .phoenix-b2b-qo-table td {
	color: var(--pb2b-text);
	border-bottom: 1px solid var(--pb2b-border);
	padding: 10px 12px;
	text-align: left;
}
.phoenix-b2b-panel .phoenix-b2b-qo-table thead th {
	background: var(--pb2b-bg-3);
	color: var(--pb2b-text-soft);
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: .04em;
}
.phoenix-b2b-panel .phoenix-b2b-qo-table tbody tr:hover { background: var(--pb2b-bg-3); }
.phoenix-b2b-panel .phoenix-b2b-qo-search-input,
.phoenix-b2b-panel .phoenix-b2b-qo-cat,
.phoenix-b2b-panel .phoenix-b2b-qo-qty {
	background: var(--pb2b-bg-3);
	color: var(--pb2b-text);
	border: 1px solid var(--pb2b-border-strong);
	border-radius: var(--pb2b-radius-xs);
	padding: 8px 10px;
}
.phoenix-b2b-panel .phoenix-b2b-qo-search-input::placeholder { color: var(--pb2b-text-dim); }
.phoenix-b2b-panel .phoenix-b2b-qo code,
.phoenix-b2b-panel .phoenix-b2b-qo .pb2b-qo-col-sku code {
	background: var(--pb2b-bg-4);
	color: var(--pb2b-text-soft);
	padding: 2px 6px;
	border-radius: 6px;
}
/* Przyciski WooCommerce „button" w quick-order → spójny styl. */
.phoenix-b2b-panel .phoenix-b2b-qo .button,
.phoenix-b2b-panel .phoenix-b2b-qo button.button {
	background: var(--pb2b-bg-4) !important;
	color: var(--pb2b-text) !important;
	border: 1px solid var(--pb2b-border-strong) !important;
	border-radius: var(--pb2b-radius-xs) !important;
	box-shadow: none !important;
	text-shadow: none !important;
}
.phoenix-b2b-panel .phoenix-b2b-qo .phoenix-b2b-qo-add-single {
	background: var(--pb2b-primary) !important;
	border-color: var(--pb2b-primary) !important;
	color: #fff !important;
}
.phoenix-b2b-panel .phoenix-b2b-qo-stock-in  { color: var(--pb2b-success); }
.phoenix-b2b-panel .phoenix-b2b-qo-stock-out { color: var(--pb2b-danger); }

/* Tabele „surowe" tylko na mobile dostają poziomy scroll. */
.phoenix-b2b-panel .pb2b-app-table-wrap,
.phoenix-b2b-panel .pb2b-table-wrap { overflow-x: visible; }
@media (max-width: 720px) {
	.phoenix-b2b-panel .pb2b-app-table-wrap,
	.phoenix-b2b-panel .pb2b-table-wrap,
	.phoenix-b2b-panel .phoenix-b2b-qo-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

/* ==========================================================
 * 3. SYSTEM KOMPONENTÓW (pb2b-app-*)
 * ========================================================== */
.phoenix-b2b-panel .pb2b-app-card {
	background: var(--pb2b-bg-2);
	border: 1px solid var(--pb2b-border);
	border-radius: var(--pb2b-radius);
	box-shadow: var(--pb2b-shadow-sm);
	overflow: hidden;
}
.phoenix-b2b-panel .pb2b-app-card.pb2b-card-flush > .pb2b-app-card-body { padding: 0; }
.phoenix-b2b-panel .pb2b-app-card-body { padding: 20px; }

.phoenix-b2b-panel .pb2b-app-section-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 16px 20px;
	border-bottom: 1px solid var(--pb2b-border);
	background: var(--pb2b-bg-1);
}
.phoenix-b2b-panel .pb2b-app-section-title { font-size: 15px; font-weight: 600; color: var(--pb2b-text); margin: 0; }

.phoenix-b2b-panel .pb2b-app-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 16px;
}
.phoenix-b2b-panel .pb2b-app-grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
@media (max-width: 880px) { .phoenix-b2b-panel .pb2b-app-grid-2 { grid-template-columns: 1fr; } }

.phoenix-b2b-panel .pb2b-app-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 13.5px;
}
.phoenix-b2b-panel .pb2b-app-table th,
.phoenix-b2b-panel .pb2b-app-table td {
	padding: 11px 12px;
	border-bottom: 1px solid var(--pb2b-border);
	color: var(--pb2b-text);
	text-align: left;
}
.phoenix-b2b-panel .pb2b-app-table thead th {
	color: var(--pb2b-text-soft);
	font-size: 11.5px;
	text-transform: uppercase;
	letter-spacing: .05em;
	background: var(--pb2b-bg-1);
}
.phoenix-b2b-panel .pb2b-app-table tfoot th { color: var(--pb2b-text); font-weight: 700; }
.phoenix-b2b-panel .pb2b-app-table tbody tr:hover { background: var(--pb2b-bg-3); }

.phoenix-b2b-panel .pb2b-app-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 10px 16px;
	border-radius: var(--pb2b-radius-xs);
	border: 1px solid var(--pb2b-border-strong);
	background: var(--pb2b-bg-3);
	color: var(--pb2b-text);
	font-size: 13.5px;
	font-weight: 600;
	cursor: pointer;
	transition: background .15s ease, border-color .15s ease, transform .1s ease;
	text-decoration: none;
	line-height: 1.2;
}
.phoenix-b2b-panel .pb2b-app-button:hover { background: var(--pb2b-bg-4); color: var(--pb2b-text); transform: translateY(-1px); }
.phoenix-b2b-panel .pb2b-app-button:active { transform: translateY(0); }
.phoenix-b2b-panel .pb2b-app-button[disabled] { opacity: .55; cursor: not-allowed; transform: none; }
.phoenix-b2b-panel .pb2b-app-button-primary {
	background: var(--pb2b-primary);
	border-color: var(--pb2b-primary);
	color: #fff;
}
.phoenix-b2b-panel .pb2b-app-button-primary:hover { background: var(--pb2b-primary-2); border-color: var(--pb2b-primary-2); color: #fff; }
.phoenix-b2b-panel .pb2b-app-button-ghost { background: transparent; }
.phoenix-b2b-panel .pb2b-app-button-ghost:hover { background: var(--pb2b-bg-3); }
.phoenix-b2b-panel .pb2b-app-button-link {
	background: transparent;
	border-color: transparent;
	color: var(--pb2b-primary-2);
	padding-left: 6px;
	padding-right: 6px;
}
.phoenix-b2b-panel .pb2b-app-button-link:hover { background: transparent; text-decoration: underline; color: #C084FC; }
.phoenix-b2b-panel .pb2b-app-button-sm { padding: 7px 12px; font-size: 12.5px; }

.phoenix-b2b-panel .pb2b-app-input,
.phoenix-b2b-panel .pb2b-app-select,
.phoenix-b2b-panel .pb2b-app-textarea {
	width: 100%;
	background: var(--pb2b-bg-3);
	color: var(--pb2b-text);
	border: 1px solid var(--pb2b-border-strong);
	border-radius: var(--pb2b-radius-xs);
	padding: 10px 12px;
	font-size: 13.5px;
}
.phoenix-b2b-panel .pb2b-app-input::placeholder,
.phoenix-b2b-panel .pb2b-app-textarea::placeholder { color: var(--pb2b-text-dim); }
.phoenix-b2b-panel .pb2b-app-input:focus,
.phoenix-b2b-panel .pb2b-app-select:focus,
.phoenix-b2b-panel .pb2b-app-textarea:focus {
	outline: none;
	border-color: var(--pb2b-primary);
	box-shadow: var(--pb2b-shadow-glow);
}

.phoenix-b2b-panel .pb2b-app-badge {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 4px 10px;
	border-radius: 999px;
	font-size: 11.5px;
	font-weight: 600;
	background: rgba(124, 58, 237, 0.14);
	color: var(--pb2b-primary-2);
	border: 1px solid rgba(124, 58, 237, 0.28);
}
.phoenix-b2b-panel .pb2b-app-badge-success { background: rgba(34, 197, 94, 0.14); color: var(--pb2b-success); border-color: rgba(34,197,94,0.30); }
.phoenix-b2b-panel .pb2b-app-badge-warning { background: rgba(245, 158, 11, 0.14); color: var(--pb2b-warning); border-color: rgba(245,158,11,0.30); }
.phoenix-b2b-panel .pb2b-app-badge-muted   { background: var(--pb2b-bg-4); color: var(--pb2b-text-muted); border-color: var(--pb2b-border); }

.phoenix-b2b-panel .pb2b-app-empty {
	text-align: center;
	padding: 44px 20px;
	color: var(--pb2b-text-muted);
}
.phoenix-b2b-panel .pb2b-app-empty-icon { color: var(--pb2b-text-dim); display: inline-flex; margin-bottom: 12px; }
.phoenix-b2b-panel .pb2b-app-empty h4 { color: var(--pb2b-text); margin: 0 0 6px; font-size: 15px; }
.phoenix-b2b-panel .pb2b-app-empty p { margin: 0 0 16px; }

/* ==========================================================
 * 4. TOAST (globalny, niezależny od motywu strony)
 * ========================================================== */
.pb2b-app-toast-wrap {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 100000;
	display: flex;
	flex-direction: column;
	gap: 10px;
	max-width: min(92vw, 360px);
}
.pb2b-app-toast {
	background: #111827;
	color: #F8FAFC;
	border: 1px solid rgba(255,255,255,0.12);
	border-left: 4px solid #7C3AED;
	border-radius: 10px;
	padding: 12px 14px;
	font-size: 13.5px;
	box-shadow: 0 12px 32px rgba(0,0,0,0.35);
	opacity: 0;
	transform: translateY(12px);
	transition: opacity .2s ease, transform .2s ease;
}
.pb2b-app-toast.is-show { opacity: 1; transform: translateY(0); }
.pb2b-app-toast.is-success { border-left-color: #22C55E; }
.pb2b-app-toast.is-error   { border-left-color: #EF4444; }
.pb2b-app-toast.is-warning { border-left-color: #F59E0B; }

/* ==========================================================
 * 5. KOSZYK W TOPBARZE
 * ========================================================== */
.phoenix-b2b-panel .pb2b-topbar-cart {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	padding: 6px 12px 6px 10px;
	border-radius: 999px;
	border: 1px solid var(--pb2b-border);
	background: var(--pb2b-bg-3);
	color: var(--pb2b-text);
	text-decoration: none;
	transition: border-color .15s ease, background .15s ease;
}
.phoenix-b2b-panel .pb2b-topbar-cart:hover { border-color: var(--pb2b-border-strong); background: var(--pb2b-bg-4); color: var(--pb2b-text); }
.phoenix-b2b-panel .pb2b-topbar-cart.has-items { border-color: rgba(124,58,237,0.45); }
.phoenix-b2b-panel .pb2b-topbar-cart-ico { width: 20px; height: 20px; color: var(--pb2b-primary-2); display: inline-flex; }
.phoenix-b2b-panel .pb2b-topbar-cart-ico svg { width: 100%; height: 100%; }
.phoenix-b2b-panel .pb2b-topbar-cart-meta { display: flex; flex-direction: column; line-height: 1.1; }
.phoenix-b2b-panel .pb2b-topbar-cart-count { font-weight: 700; font-size: 13px; }
.phoenix-b2b-panel .pb2b-topbar-cart-total { font-size: 11px; color: var(--pb2b-text-muted); }
.phoenix-b2b-panel .pb2b-topbar-cart-total:empty { display: none; }
@media (max-width: 600px) {
	.phoenix-b2b-panel .pb2b-topbar-cart-meta { display: none; }
}

/* ==========================================================
 * 6. PASEK KOSZYKA W SKLEPIE / FLOW W KATALOGU
 * ========================================================== */
.phoenix-b2b-panel .pb2b-shop-cartbar,
.phoenix-b2b-panel .pb2b-catalog-flowbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 12px;
	padding: 14px 20px;
	background: var(--pb2b-bg-1);
	border-bottom: 1px solid var(--pb2b-border);
}
.phoenix-b2b-panel .pb2b-shop-cartbar-info,
.phoenix-b2b-panel .pb2b-catalog-flowbar-info {
	display: flex;
	align-items: center;
	gap: 14px;
	flex-wrap: wrap;
	color: var(--pb2b-text-soft);
}
.phoenix-b2b-panel .pb2b-shop-cartbar-ico { color: var(--pb2b-primary-2); display: inline-flex; }
.phoenix-b2b-panel .pb2b-shop-cartbar-text strong,
.phoenix-b2b-panel .pb2b-catalog-flowbar-info strong { color: var(--pb2b-text); font-size: 16px; }
.phoenix-b2b-panel .pb2b-shop-cartbar-total,
.phoenix-b2b-panel .pb2b-catalog-flowbar-sum {
	font-weight: 700;
	color: var(--pb2b-text);
}
.phoenix-b2b-panel .pb2b-shop-cartbar-actions,
.phoenix-b2b-panel .pb2b-catalog-flowbar-actions {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
}
.phoenix-b2b-panel .pb2b-catalog-flowbar-pill {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 5px 12px;
	border-radius: 999px;
	background: var(--pb2b-bg-3);
	border: 1px solid var(--pb2b-border);
	font-size: 12.5px;
	color: var(--pb2b-text-soft);
}
.phoenix-b2b-panel .pb2b-catalog-flowbar-pill strong { font-size: 13px; }

/* ==========================================================
 * 7. KARTY KATEGORII (panel-wewnętrzne, link → sklep z filtrem)
 * ========================================================== */
.phoenix-b2b-panel .pb2b-cat-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 16px;
}
.phoenix-b2b-panel .pb2b-cat-tile {
	display: flex;
	flex-direction: column;
	background: var(--pb2b-bg-2);
	border: 1px solid var(--pb2b-border);
	border-radius: var(--pb2b-radius);
	overflow: hidden;
	text-decoration: none;
	color: var(--pb2b-text);
	transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.phoenix-b2b-panel .pb2b-cat-tile:hover {
	transform: translateY(-3px);
	border-color: var(--pb2b-border-strong);
	box-shadow: var(--pb2b-shadow);
	color: var(--pb2b-text);
}
.phoenix-b2b-panel .pb2b-cat-tile-media {
	position: relative;
	aspect-ratio: 16 / 10;
	background: var(--pb2b-bg-4) center/cover no-repeat;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--pb2b-text-dim);
}
.phoenix-b2b-panel .pb2b-cat-tile-count {
	position: absolute;
	top: 10px;
	left: 10px;
	padding: 3px 10px;
	border-radius: 999px;
	background: rgba(7, 11, 24, 0.72);
	color: #fff;
	font-size: 11.5px;
	font-weight: 600;
	backdrop-filter: blur(4px);
}
.phoenix-b2b-panel .pb2b-cat-tile-body { padding: 14px 16px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.phoenix-b2b-panel .pb2b-cat-tile-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.phoenix-b2b-panel .pb2b-cat-tile-name { font-weight: 600; font-size: 14.5px; }
.phoenix-b2b-panel .pb2b-cat-tile-arrow { color: var(--pb2b-primary-2); display: inline-flex; transition: transform .15s ease; }
.phoenix-b2b-panel .pb2b-cat-tile:hover .pb2b-cat-tile-arrow { transform: translateX(3px); }
.phoenix-b2b-panel .pb2b-cat-tile-desc { font-size: 12.5px; color: var(--pb2b-text-muted); line-height: 1.5; }
/* Premium dopieszczenie kafli kategorii (v2.8.19): równe, czyste, czytelne. */
.phoenix-b2b-panel .pb2b-cat-tile-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.phoenix-b2b-panel .pb2b-cat-tile-media { background-color: var(--pb2b-bg-4); }
.phoenix-b2b-panel .pb2b-cat-tile-count { z-index: 2; }
.phoenix-b2b-panel .pb2b-cat-tile:hover .pb2b-cat-tile-media { filter: saturate(1.04) brightness(1.02); }

/* ==========================================================
 * 8. DANE FIRMY (rozszerzone)
 * ========================================================== */
.phoenix-b2b-panel .pb2b-company-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
}
@media (max-width: 880px) { .phoenix-b2b-panel .pb2b-company-grid { grid-template-columns: 1fr; } }
.phoenix-b2b-panel .pb2b-dl { display: flex; flex-direction: column; gap: 0; margin: 0; }
.phoenix-b2b-panel .pb2b-dl-row {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	padding: 9px 0;
	border-bottom: 1px solid var(--pb2b-border);
}
.phoenix-b2b-panel .pb2b-dl-row:last-child { border-bottom: 0; }
.phoenix-b2b-panel .pb2b-dl-row dt { color: var(--pb2b-text-muted); font-size: 13px; }
.phoenix-b2b-panel .pb2b-dl-row dd { color: var(--pb2b-text); font-size: 13.5px; font-weight: 500; text-align: right; margin: 0; }
.phoenix-b2b-panel .pb2b-limit-bar {
	height: 8px;
	border-radius: 999px;
	background: var(--pb2b-bg-4);
	overflow: hidden;
	margin-top: 8px;
}
.phoenix-b2b-panel .pb2b-limit-bar span {
	display: block;
	height: 100%;
	background: var(--pb2b-accent-grad);
	border-radius: 999px;
}
.phoenix-b2b-panel .pb2b-limit-bar.is-over span { background: var(--pb2b-danger); }

/* Modal/box prośby o zmianę danych */
.phoenix-b2b-panel .pb2b-rdc-box {
	margin-top: 14px;
	padding: 16px;
	border: 1px dashed var(--pb2b-border-strong);
	border-radius: var(--pb2b-radius-sm);
	background: var(--pb2b-bg-1);
}
.phoenix-b2b-panel .pb2b-rdc-box[hidden] { display: none; }
.phoenix-b2b-panel .pb2b-rdc-actions { display: flex; gap: 8px; margin-top: 12px; }

.phoenix-b2b-panel .pb2b-notice {
	padding: 12px 14px;
	border-radius: var(--pb2b-radius-xs);
	font-size: 13.5px;
	margin-bottom: 16px;
}
.phoenix-b2b-panel .pb2b-notice-success { background: rgba(34,197,94,0.12); color: var(--pb2b-success); border: 1px solid rgba(34,197,94,0.30); }
.phoenix-b2b-panel .pb2b-notice-error   { background: rgba(239,68,68,0.12); color: var(--pb2b-danger); border: 1px solid rgba(239,68,68,0.30); }

/* ==========================================================
 * 9. POWIADOMIENIA — usuń agresywne zielenie, spójne kolory
 * ========================================================== */
.phoenix-b2b-panel .pb2b-notif-type {
	background: var(--pb2b-bg-4);
	color: var(--pb2b-text-soft);
	border: 1px solid var(--pb2b-border);
	padding: 2px 9px;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 600;
}
.phoenix-b2b-panel .pb2b-notif-type-order   { background: rgba(124,58,237,0.16); color: var(--pb2b-primary-2); border-color: rgba(124,58,237,0.30); }
.phoenix-b2b-panel .pb2b-notif-type-account { background: rgba(56,189,248,0.16); color: var(--pb2b-info); border-color: rgba(56,189,248,0.30); }
.phoenix-b2b-panel .pb2b-notif.is-unread { box-shadow: inset 3px 0 0 var(--pb2b-primary); }
.phoenix-b2b-panel .pb2b-notif-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.phoenix-b2b-panel .pb2b-notif {
	display: flex;
	gap: 14px;
	justify-content: space-between;
	padding: 14px 16px;
	background: var(--pb2b-bg-2);
	border: 1px solid var(--pb2b-border);
	border-radius: var(--pb2b-radius-sm);
}
.phoenix-b2b-panel .pb2b-notif-top { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; }
.phoenix-b2b-panel .pb2b-notif-date { font-size: 11.5px; color: var(--pb2b-text-dim); }
.phoenix-b2b-panel .pb2b-notif-title { font-weight: 600; color: var(--pb2b-text); }
.phoenix-b2b-panel .pb2b-notif-body { font-size: 13px; color: var(--pb2b-text-soft); margin-top: 4px; }
.phoenix-b2b-panel .pb2b-notif-actions { display: flex; flex-direction: column; gap: 6px; align-items: flex-end; white-space: nowrap; }

/* ==========================================================
 * 10. RESPONSYWNOŚĆ — sidebar drawer
 * v2.8.19: stary, zduplikowany blok @media 1024px / min-1025px USUNIĘTY.
 * Powodował konflikt w zakresie 1025–1199px (część reguł desktop, część
 * drawer). Jedyny, kanoniczny zestaw breakpointów jest niżej:
 *   >=1200px       → grid sidebar + content, burger ukryty
 *   <=1199.98px    → sidebar jako off-canvas drawer + backdrop
 *   <=767px        → tryb app-like
 * ========================================================== */

/* ==========================================================================
 * UPGRADE 2.8.17 — MOBILE-FIRST / APP-LIKE LAYER
 * Spójny, stabilny panel klienta B2B pod PC / tablet / mobile.
 * Breakpointy:
 *   desktop  >= 1200px : sidebar + content
 *   tablet   768–1199  : sidebar jako drawer, content full width
 *   mobile   <= 767    : app-like, drawer, karty
 * Wszystko scope'owane do .phoenix-b2b-panel; korzysta z tokenów --pb2b-*.
 * ========================================================================== */

/* --- iOS / Safari safe-area + reset poziomego scrolla globalnie --- */
.phoenix-b2b-panel.pb2b-app {
	overflow-x: clip;            /* żaden element nie wypycha layoutu w bok */
	max-width: 100vw;
}
.phoenix-b2b-panel .pb2b-content {
	overflow-x: clip;
	padding-bottom: calc(24px + env(safe-area-inset-bottom, 0px));
}
.phoenix-b2b-panel * { min-width: 0; }            /* flex/grid: pozwól się kurczyć */
.phoenix-b2b-panel img,
.phoenix-b2b-panel table,
.phoenix-b2b-panel video { max-width: 100%; }

/* --- CZĘŚĆ 1: TOPBAR / BURGER — zawsze widoczny, nigdy biały na białym --- */
.phoenix-b2b-panel .pb2b-burger {
	width: 40px; height: 40px;
	display: inline-flex; align-items: center; justify-content: center;
	border-radius: 10px;
	background: var(--pb2b-bg-3);
	border: 1px solid var(--pb2b-border-strong);
	color: var(--pb2b-text);
	box-shadow: var(--pb2b-shadow-sm);
	cursor: pointer;
	flex: 0 0 auto;
}
.phoenix-b2b-panel .pb2b-burger:hover { background: var(--pb2b-bg-4); color: var(--pb2b-text); }
.phoenix-b2b-panel .pb2b-burger:focus-visible { outline: 2px solid var(--pb2b-primary-2); outline-offset: 2px; }
.phoenix-b2b-panel .pb2b-burger svg { width: 22px; height: 22px; stroke: currentColor; }
/* W trybie jasnym burger jako wyraźny, ciemny ikon na jasnoszarym tle
 * (NIE biały na białym — to był zgłoszony „niewidoczny przycisk"). */
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-burger {
	background: #EEF1F8;
	border-color: #CBD5E1;
	color: #0F172A;
}
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-burger:hover { background: #E2E8F0; }

/* Topbar: bezpieczny obszar i równe wyrównanie ikon prawej strony. */
.phoenix-b2b-panel .pb2b-topbar {
	padding-top: env(safe-area-inset-top, 0px);
	gap: 10px;
}
.phoenix-b2b-panel .pb2b-topbar-right { gap: 8px; flex-wrap: nowrap; }

/* B2B badge / dzwonek / koszyk — okrągłe, równe, wyśrodkowane ikony 40px. */
.phoenix-b2b-panel .pb2b-topbar-bell,
.phoenix-b2b-panel .pb2b-theme-toggle.is-icon,
.phoenix-b2b-panel .pb2b-topbar-cart.is-empty {
	width: 40px; height: 40px;
	display: inline-flex; align-items: center; justify-content: center;
	border-radius: 999px;
	flex: 0 0 auto;
	position: relative;
}
.phoenix-b2b-panel .pb2b-topbar-bell {
	background: var(--pb2b-bg-3);
	border: 1px solid var(--pb2b-border);
	color: var(--pb2b-text-soft);
}
.phoenix-b2b-panel .pb2b-topbar-bell:hover { background: var(--pb2b-bg-4); color: var(--pb2b-text); }
.phoenix-b2b-panel .pb2b-topbar-bell svg { width: 19px; height: 19px; }
/* Badge na dzwonku — równe kółko, nie ucięte. */
.phoenix-b2b-panel .pb2b-topbar-bell-dot {
	position: absolute; top: -3px; right: -3px;
	min-width: 17px; height: 17px; padding: 0 4px;
	display: inline-flex; align-items: center; justify-content: center;
	border-radius: 999px;
	background: var(--pb2b-danger); color: #fff;
	font-size: 10px; font-weight: 700; line-height: 1;
	border: 2px solid var(--pb2b-bg-0);
	box-sizing: border-box;
}
/* „B2B" avatar — równe, idealnie okrągłe kółko, wyśrodkowany tekst. */
.phoenix-b2b-panel .pb2b-user-avatar {
	flex: 0 0 auto;
	width: 34px; height: 34px;
	display: inline-flex; align-items: center; justify-content: center;
	border-radius: 999px;
	line-height: 1; font-size: 12.5px; font-weight: 700;
	text-transform: uppercase;
}
.phoenix-b2b-panel .pb2b-user-chip { flex: 0 0 auto; align-items: center; }
/* Prawa strona topbaru — ikony/koszyk/dzwonek/avatar w jednej, równej linii. */
.phoenix-b2b-panel .pb2b-topbar-right { align-items: center; }
.phoenix-b2b-panel .pb2b-topbar-right > * { flex: 0 0 auto; }

/* --- CZĘŚĆ 1: usuń dziwny cień / poświatę z lewej (czyste karty) --- */
.phoenix-b2b-panel .pb2b-hero,
.phoenix-b2b-panel .pb2b-stat,
.phoenix-b2b-panel .pb2b-card,
.phoenix-b2b-panel .pb2b-app-card {
	box-shadow: var(--pb2b-shadow-sm);
}
.phoenix-b2b-panel .pb2b-stat-accent,
.phoenix-b2b-panel .pb2b-stat-success { box-shadow: var(--pb2b-shadow-sm); }

/* --- CZĘŚĆ 2: DASHBOARD — premium hero + statystyki + szybkie akcje --- */
.phoenix-b2b-panel .pb2b-hero {
	background: linear-gradient(135deg, rgba(124,58,237,0.16), rgba(59,130,246,0.10)), var(--pb2b-bg-2);
	border: 1px solid var(--pb2b-border);
	border-radius: var(--pb2b-radius);
	padding: 22px 24px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	flex-wrap: wrap;
}
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-hero {
	background: linear-gradient(135deg, rgba(124,58,237,0.08), rgba(59,130,246,0.05)), #FFFFFF;
}
.phoenix-b2b-panel .pb2b-hero-greeting { color: var(--pb2b-text-muted); font-size: 13.5px; }
.phoenix-b2b-panel .pb2b-hero-company { color: var(--pb2b-text); font-size: 22px; font-weight: 700; margin: 2px 0 10px; line-height: 1.15; }
.phoenix-b2b-panel .pb2b-hero-meta { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.phoenix-b2b-panel .pb2b-hero-status {
	display: inline-flex; align-items: center; gap: 7px;
	padding: 5px 12px; border-radius: 999px; font-size: 12.5px; font-weight: 600;
	background: rgba(34,197,94,0.14); color: var(--pb2b-success); border: 1px solid rgba(34,197,94,0.30);
}
.phoenix-b2b-panel .pb2b-hero-status.is-warn { background: rgba(245,158,11,0.14); color: var(--pb2b-warning); border-color: rgba(245,158,11,0.30); }
.phoenix-b2b-panel .pb2b-hero-status.is-danger { background: rgba(239,68,68,0.14); color: var(--pb2b-danger); border-color: rgba(239,68,68,0.30); }
.phoenix-b2b-panel .pb2b-hero-status-dot { width: 8px; height: 8px; border-radius: 999px; background: currentColor; }
.phoenix-b2b-panel .pb2b-hero-pill {
	display: inline-flex; align-items: center; gap: 5px;
	padding: 5px 12px; border-radius: 999px; font-size: 12.5px;
	background: var(--pb2b-bg-3); border: 1px solid var(--pb2b-border); color: var(--pb2b-text-soft);
}
.phoenix-b2b-panel .pb2b-hero-pill-accent { background: rgba(124,58,237,0.16); border-color: rgba(124,58,237,0.30); color: var(--pb2b-primary-2); }
.phoenix-b2b-panel .pb2b-hero-cta { display: flex; gap: 10px; flex-wrap: wrap; }
.phoenix-b2b-panel .pb2b-hero-cta .pb2b-btn { flex: 1 1 auto; min-width: 180px; justify-content: center; text-align: center; }

/* Statystyki — czytelne kafelki. */
.phoenix-b2b-panel .pb2b-stats {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 16px;
}
.phoenix-b2b-panel .pb2b-stat {
	background: var(--pb2b-bg-2);
	border: 1px solid var(--pb2b-border);
	border-radius: var(--pb2b-radius-sm);
	padding: 16px 18px;
}
.phoenix-b2b-panel .pb2b-stat-label { color: var(--pb2b-text-muted); font-size: 12.5px; }
.phoenix-b2b-panel .pb2b-stat-value { color: var(--pb2b-text); font-size: 24px; font-weight: 700; margin-top: 4px; line-height: 1.1; }
.phoenix-b2b-panel .pb2b-stat-foot { font-size: 11.5px; margin-top: 4px; }

/* Szybkie akcje — równe kafle. */
.phoenix-b2b-panel .pb2b-quick-tiles {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 12px;
}
.phoenix-b2b-panel .pb2b-quick-tile {
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px;
	padding: 16px 10px; min-height: 92px;
	background: var(--pb2b-bg-3); border: 1px solid var(--pb2b-border); border-radius: var(--pb2b-radius-sm);
	color: var(--pb2b-text); text-decoration: none; text-align: center;
	transition: transform .12s ease, border-color .12s ease, background .12s ease;
}
.phoenix-b2b-panel .pb2b-quick-tile:hover { transform: translateY(-2px); border-color: var(--pb2b-border-strong); background: var(--pb2b-bg-4); color: var(--pb2b-text); }
.phoenix-b2b-panel .pb2b-quick-tile-icon { font-size: 22px; line-height: 1; }
.phoenix-b2b-panel .pb2b-quick-tile-label { font-size: 12.5px; font-weight: 500; }
.phoenix-b2b-panel .pb2b-grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }

/* --- CZĘŚĆ 7: SKLEP B2B w panelu — toolbar full width na mobile --- */
.phoenix-b2b-panel .pb2b-shop-toolbar { gap: 10px; flex-wrap: wrap; }
.phoenix-b2b-panel .pb2b-shop-search { flex: 1 1 100%; }
.phoenix-b2b-panel .pb2b-shop-search-input { width: 100%; }

/* --- CZĘŚĆ 8: KATEGORIE — 2/3/4 w rzędzie, mniejsze premium kafle --- */
.phoenix-b2b-panel .pb2b-cat-grid {
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 14px;
}
.phoenix-b2b-panel .pb2b-cat-tile-media { aspect-ratio: 16 / 9; }

/* --- CZĘŚĆ 4: KOSZYK — stepper, karty mobile, sticky summary --- */
.phoenix-b2b-panel .pb2b-cart-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 320px;
	gap: 20px;
	align-items: start;
}
.phoenix-b2b-panel .pb2b-cart-table { font-size: 13.5px; }
.phoenix-b2b-panel .pb2b-cart-thumb {
	display: inline-flex; width: 54px; height: 54px; border-radius: 10px; overflow: hidden;
	background: var(--pb2b-bg-4); border: 1px solid var(--pb2b-border);
}
.phoenix-b2b-panel .pb2b-cart-thumb img { width: 100%; height: 100%; object-fit: cover; }
.phoenix-b2b-panel .pb2b-cart-name { color: var(--pb2b-text); font-weight: 600; text-decoration: none; display: block; }
.phoenix-b2b-panel .pb2b-cart-name:hover { color: var(--pb2b-primary-2); }
.phoenix-b2b-panel .pb2b-cart-sku { display: block; color: var(--pb2b-text-muted); font-size: 12px; margin-top: 3px; }
.phoenix-b2b-panel .pb2b-cart-row.is-busy { opacity: .55; }
.phoenix-b2b-panel .pb2b-cart-row.is-removing { opacity: 0; transition: opacity .18s ease; }
.phoenix-b2b-panel .pb2b-cart-remove {
	display: inline-flex; align-items: center; justify-content: center;
	width: 34px; height: 34px; border-radius: 8px;
	background: transparent; border: 1px solid var(--pb2b-border); color: var(--pb2b-text-muted); cursor: pointer;
	transition: background .12s ease, color .12s ease, border-color .12s ease;
}
.phoenix-b2b-panel .pb2b-cart-remove:hover { background: rgba(239,68,68,0.12); color: var(--pb2b-danger); border-color: rgba(239,68,68,0.30); }

/* Stepper +/- */
.phoenix-b2b-panel .pb2b-stepper {
	display: inline-flex; align-items: center;
	border: 1px solid var(--pb2b-border-strong); border-radius: 999px; overflow: hidden;
	background: var(--pb2b-bg-3);
}
.phoenix-b2b-panel .pb2b-stepper-btn {
	width: 32px; height: 32px; border: 0; background: transparent; color: var(--pb2b-text);
	font-size: 18px; line-height: 1; cursor: pointer; display: inline-flex; align-items: center; justify-content: center;
}
.phoenix-b2b-panel .pb2b-stepper-btn:hover { background: var(--pb2b-bg-4); }
.phoenix-b2b-panel .pb2b-stepper-input {
	width: 46px; text-align: center; border: 0; background: transparent; color: var(--pb2b-text);
	font-size: 13.5px; font-weight: 600; -moz-appearance: textfield;
}
.phoenix-b2b-panel .pb2b-stepper-input::-webkit-outer-spin-button,
.phoenix-b2b-panel .pb2b-stepper-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

/* Podsumowanie koszyka */
.phoenix-b2b-panel .pb2b-cart-summary-inner {
	background: var(--pb2b-bg-1); border: 1px solid var(--pb2b-border); border-radius: var(--pb2b-radius-sm);
	padding: 18px; position: sticky; top: calc(var(--pb2b-topbar-h, 64px) + 16px);
}
.phoenix-b2b-panel .pb2b-cart-summary-title { margin: 0 0 12px; font-size: 14px; color: var(--pb2b-text); font-weight: 700; }
.phoenix-b2b-panel .pb2b-cart-summary-row { display: flex; justify-content: space-between; gap: 12px; padding: 7px 0; color: var(--pb2b-text-soft); font-size: 13.5px; }
.phoenix-b2b-panel .pb2b-cart-summary-total { border-top: 1px solid var(--pb2b-border); margin-top: 4px; padding-top: 12px; font-size: 15px; }
.phoenix-b2b-panel .pb2b-cart-summary-total strong { color: var(--pb2b-text); font-size: 17px; }
.phoenix-b2b-panel .pb2b-cart-summary-actions { display: flex; flex-direction: column; gap: 8px; margin-top: 14px; }
.phoenix-b2b-panel .pb2b-cart-summary-actions .pb2b-app-button { width: 100%; }
.phoenix-b2b-panel .pb2b-cart-summary-note { font-size: 11.5px; margin: 12px 0 0; }

/* ==========================================================================
 * GENERYCZNA KONWERSJA TABEL → KARTY na mobile (zero poziomego scrolla).
 * Działa dla tabel z atrybutami data-label oraz bez nich (graceful).
 * Koszyk ma własny layout kart poniżej (wykluczony tutaj).
 * ========================================================================== */
@media (max-width: 767px) {
	.phoenix-b2b-panel .pb2b-app-table-wrap,
	.phoenix-b2b-panel .pb2b-table-wrap,
	.phoenix-b2b-panel .pb2b-shop-table-wrap,
	.phoenix-b2b-panel .phoenix-b2b-qo-table-wrap { overflow-x: visible; }

	.phoenix-b2b-panel .pb2b-app-table:not(.pb2b-cart-table),
	.phoenix-b2b-panel .pb2b-table,
	.phoenix-b2b-panel .pb2b-shop-table,
	.phoenix-b2b-panel .phoenix-b2b-qo-table { display: block; width: 100%; border: 0; }

	.phoenix-b2b-panel .pb2b-app-table:not(.pb2b-cart-table) thead,
	.phoenix-b2b-panel .pb2b-table thead,
	.phoenix-b2b-panel .pb2b-shop-table thead,
	.phoenix-b2b-panel .phoenix-b2b-qo-table thead { display: none; }

	.phoenix-b2b-panel .pb2b-app-table:not(.pb2b-cart-table) tbody,
	.phoenix-b2b-panel .pb2b-table tbody,
	.phoenix-b2b-panel .pb2b-shop-table tbody,
	.phoenix-b2b-panel .phoenix-b2b-qo-table tbody { display: block; }

	.phoenix-b2b-panel .pb2b-app-table:not(.pb2b-cart-table) tbody tr,
	.phoenix-b2b-panel .pb2b-table tbody tr,
	.phoenix-b2b-panel .pb2b-shop-table tbody tr,
	.phoenix-b2b-panel .phoenix-b2b-qo-table tbody tr {
		display: block;
		background: var(--pb2b-bg-2);
		border: 1px solid var(--pb2b-border);
		border-radius: var(--pb2b-radius-sm);
		padding: 12px 14px;
		margin-bottom: 12px;
	}

	.phoenix-b2b-panel .pb2b-app-table:not(.pb2b-cart-table) tbody td,
	.phoenix-b2b-panel .pb2b-table tbody td,
	.phoenix-b2b-panel .pb2b-shop-table tbody td,
	.phoenix-b2b-panel .phoenix-b2b-qo-table tbody td {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 14px;
		padding: 6px 0;
		border: 0;
		text-align: right;
		width: 100%;
	}
	.phoenix-b2b-panel .pb2b-app-table:not(.pb2b-cart-table) tbody td:empty { display: none; }

	.phoenix-b2b-panel .pb2b-app-table:not(.pb2b-cart-table) tbody td::before,
	.phoenix-b2b-panel .pb2b-table tbody td[data-label]::before,
	.phoenix-b2b-panel .pb2b-shop-table tbody td[data-label]::before,
	.phoenix-b2b-panel .phoenix-b2b-qo-table tbody td[data-label]::before {
		content: attr(data-label);
		color: var(--pb2b-text-muted);
		font-size: 11.5px;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: .03em;
		text-align: left;
		flex: 0 0 auto;
	}
	/* Komórki z miniaturą / akcjami — bez sztywnego label, na całą szerokość. */
	.phoenix-b2b-panel .pb2b-shop-table tbody td.pb2b-col-thumb,
	.phoenix-b2b-panel .pb2b-shop-table tbody td.pb2b-col-actions { justify-content: flex-start; }
	.phoenix-b2b-panel .pb2b-shop-table tbody td.pb2b-col-thumb::before,
	.phoenix-b2b-panel .pb2b-shop-table tbody td.pb2b-col-actions::before { content: ""; }
}

/* ==========================================================================
 * TABLET 768–1199 : drawer + content pełnej szerokości
 * ========================================================================== */
@media (max-width: 1199.98px) {
	.phoenix-b2b-panel.pb2b-app { grid-template-columns: 1fr; }
	.phoenix-b2b-panel .pb2b-sidebar {
		position: fixed; top: 0; left: 0; bottom: 0;
		width: min(86vw, var(--pb2b-sidebar-w, 260px));
		transform: translateX(-100%);
		transition: transform .25s ease;
		z-index: 60;
		box-shadow: none;
		padding-top: env(safe-area-inset-top, 0px);
		padding-bottom: env(safe-area-inset-bottom, 0px);
	}
	.phoenix-b2b-panel.pb2b-sidebar-open .pb2b-sidebar { transform: translateX(0); box-shadow: var(--pb2b-shadow-lg); }
	.phoenix-b2b-panel .pb2b-burger { display: inline-flex !important; }
	/* Backdrop drawer */
	.phoenix-b2b-panel .pb2b-sidebar-backdrop {
		position: fixed; inset: 0; background: rgba(7,11,24,0.55);
		opacity: 0; visibility: hidden; transition: opacity .2s ease, visibility .2s ease; z-index: 55;
	}
	.phoenix-b2b-panel.pb2b-sidebar-open .pb2b-sidebar-backdrop { opacity: 1; visibility: visible; }
	.phoenix-b2b-panel .pb2b-cart-layout { grid-template-columns: 1fr; }
	.phoenix-b2b-panel .pb2b-cat-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 1200px) {
	.phoenix-b2b-panel.pb2b-app { grid-template-columns: var(--pb2b-sidebar-w, 260px) minmax(0, 1fr); }
	.phoenix-b2b-panel .pb2b-burger { display: none !important; }
	.phoenix-b2b-panel .pb2b-sidebar-close { display: none; }
	.phoenix-b2b-panel .pb2b-sidebar-backdrop { display: none; }
}

/* ==========================================================================
 * MOBILE <= 767 : app-like
 * ========================================================================== */
@media (max-width: 767px) {
	.phoenix-b2b-panel .pb2b-content { padding: 16px; gap: 16px; }
	.phoenix-b2b-panel .pb2b-topbar { padding: 0 14px; min-height: 56px; }
	.phoenix-b2b-panel .pb2b-topbar-h1 { font-size: 16px; }
	.phoenix-b2b-panel .pb2b-user-name { display: none; }      /* tylko avatar na mobile */
	.phoenix-b2b-panel .pb2b-user-chip { padding: 3px; }

	/* Dashboard: statystyki 2 w rzędzie, szybkie akcje 2 w rzędzie. */
	.phoenix-b2b-panel .pb2b-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
	.phoenix-b2b-panel .pb2b-quick-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.phoenix-b2b-panel .pb2b-grid-2 { grid-template-columns: 1fr; gap: 16px; }
	.phoenix-b2b-panel .pb2b-hero { padding: 18px; }
	.phoenix-b2b-panel .pb2b-hero-company { font-size: 19px; }
	.phoenix-b2b-panel .pb2b-hero-cta { width: 100%; }
	.phoenix-b2b-panel .pb2b-hero-cta .pb2b-btn { min-width: 0; flex: 1 1 calc(50% - 5px); }

	/* Kategorie: 2 w rzędzie. */
	.phoenix-b2b-panel .pb2b-cat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
	.phoenix-b2b-panel .pb2b-cat-tile-media { aspect-ratio: 1 / 1; }
	.phoenix-b2b-panel .pb2b-cat-tile-body { padding: 10px 12px; }
	.phoenix-b2b-panel .pb2b-cat-tile-name { font-size: 13px; }
	.phoenix-b2b-panel .pb2b-cat-tile-desc { display: none; }   /* mniej szumu na małych kaflach */

	/* Flowbar / cartbar: pełna szerokość, przyciski 2 w rzędzie / stacked. */
	.phoenix-b2b-panel .pb2b-shop-cartbar,
	.phoenix-b2b-panel .pb2b-catalog-flowbar { padding: 12px 14px; }
	.phoenix-b2b-panel .pb2b-shop-cartbar-actions,
	.phoenix-b2b-panel .pb2b-catalog-flowbar-actions { width: 100%; }
	.phoenix-b2b-panel .pb2b-shop-cartbar-actions .pb2b-app-button,
	.phoenix-b2b-panel .pb2b-catalog-flowbar-actions .pb2b-app-button { flex: 1 1 calc(50% - 4px); justify-content: center; }

	/* Sklep B2B w panelu: 2 produkty w rzędzie. */
	.phoenix-b2b-panel .pb2b-shop-grid,
	.phoenix-b2b-panel .pb2b-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; }

	/* Quick-order: szukajka i select pełnej szerokości. */
	.phoenix-b2b-panel .phoenix-b2b-qo-search-input,
	.phoenix-b2b-panel .phoenix-b2b-qo-cat { width: 100% !important; }

	/* KOSZYK mobile: karty zamiast tabeli. */
	.phoenix-b2b-panel .pb2b-cart-table,
	.phoenix-b2b-panel .pb2b-cart-table tbody { display: block; width: 100%; }
	.phoenix-b2b-panel .pb2b-cart-table thead { display: none; }
	.phoenix-b2b-panel .pb2b-cart-row {
		display: grid;
		grid-template-columns: 56px 1fr auto;
		grid-template-areas:
			"thumb name   rm"
			"thumb price  price"
			"qty   qty    val";
		gap: 8px 12px;
		align-items: center;
		background: var(--pb2b-bg-2);
		border: 1px solid var(--pb2b-border);
		border-radius: var(--pb2b-radius-sm);
		padding: 12px;
		margin-bottom: 12px;
	}
	.phoenix-b2b-panel .pb2b-cart-cell-thumb { grid-area: thumb; }
	.phoenix-b2b-panel .pb2b-cart-cell-name  { grid-area: name; }
	.phoenix-b2b-panel .pb2b-cart-cell-price { grid-area: price; justify-content: flex-start; }
	.phoenix-b2b-panel .pb2b-cart-cell-qty   { grid-area: qty; }
	.phoenix-b2b-panel .pb2b-cart-cell-val   { grid-area: val; text-align: right; }
	.phoenix-b2b-panel .pb2b-cart-cell-rm    { grid-area: rm; justify-self: end; }
	.phoenix-b2b-panel .pb2b-cart-table td { display: flex; align-items: center; padding: 0; border: 0; }
	.phoenix-b2b-panel .pb2b-cart-cell-price[data-label]::before,
	.phoenix-b2b-panel .pb2b-cart-cell-val[data-label]::before {
		content: attr(data-label) ": ";
		color: var(--pb2b-text-muted); font-size: 11.5px; font-weight: 600; margin-right: 6px;
	}
	.phoenix-b2b-panel .pb2b-cart-cell-qty[data-label]::before { content: ""; }
	.phoenix-b2b-panel .pb2b-cart-thumb { width: 56px; height: 56px; }

	/* Sticky podsumowanie koszyka u dołu ekranu (app-like). */
	.phoenix-b2b-panel .pb2b-cart-summary-inner {
		position: sticky;
		bottom: 0; top: auto;
		margin-top: 4px;
		border-radius: var(--pb2b-radius);
		box-shadow: 0 -8px 24px rgba(0,0,0,0.25);
		padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px));
	}

	/* Toolbar sklepu: szukajka full width, „Szukaj" pod spodem, sort osobno. */
	.phoenix-b2b-panel .pb2b-shop-toolbar-right { width: 100%; display: flex; gap: 8px; }
	.phoenix-b2b-panel .pb2b-shop-toolbar-right > * { flex: 1 1 auto; }

	/* Toast: pełna szerokość u dołu. */
	.pb2b-app-toast-wrap { left: 12px; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom, 0px)); max-width: none; }
}

/* ==========================================================================
 * MAŁY MOBILE <= 380 : zejdź z kategorii do 1–2 i zmniejsz odstępy
 * ========================================================================== */
@media (max-width: 380px) {
	.phoenix-b2b-panel .pb2b-stats { grid-template-columns: 1fr 1fr; }
	.phoenix-b2b-panel .pb2b-stat-value { font-size: 20px; }
}

/* ==========================================================================
 * CZĘŚĆ 10 — LIGHT/DARK domknięcie: czytelność tekstu na każdym tle.
 * ========================================================================== */
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-cart-thumb { background: #EEF1F8; }
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-stepper { background: #F1F4FB; }
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-quick-tile { background: #F1F4FB; }
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-cat-tile-count { background: rgba(15,23,42,0.72); }
/* Nigdy biały tekst na białym: wymuś token tekstu w obu trybach. */
.phoenix-b2b-panel .pb2b-app-card,
.phoenix-b2b-panel .pb2b-card,
.phoenix-b2b-panel .pb2b-hero { color: var(--pb2b-text); }

/* ==========================================================================
 * v2.8.20 — SKLEP / WYSZUKIWARKA / QUICK-ORDER w PANELU pod mobile.
 * Naprawia „wielki pasek Szukaj, małe pole": input pełnej szerokości i wysoki,
 * „Szukaj" pełnej szerokości pod spodem; pola quick-order wygodne pod palec.
 * Ulubione renderują się teraz kanonicznym kafelkiem (siatka 2/rząd niżej).
 * ========================================================================== */
@media (max-width: 767px) {
	.phoenix-b2b-panel .pb2b-shop-toolbar { flex-direction: column; align-items: stretch; gap: 10px; }
	.phoenix-b2b-panel .pb2b-shop-search { flex: 1 1 100%; width: 100%; flex-wrap: wrap; gap: 8px; }
	.phoenix-b2b-panel .pb2b-shop-search-input { flex: 1 1 100%; width: 100%; height: 50px; min-height: 50px; font-size: 16px; }
	.phoenix-b2b-panel .pb2b-shop-search .pb2b-shop-btn { flex: 1 1 100%; width: 100%; height: 46px; min-height: 46px; justify-content: center; }
	.phoenix-b2b-panel .pb2b-shop-toolbar-right { width: 100%; display: flex; gap: 8px; align-items: stretch; }
	.phoenix-b2b-panel .pb2b-shop-toolbar-right > * { flex: 1 1 auto; }
	.phoenix-b2b-panel .pb2b-shop-orderby { width: 100%; min-height: 44px; font-size: 15px; }

	/* Quick-order / katalog: pole szukania, select kategorii i ilość wygodne. */
	.phoenix-b2b-panel .phoenix-b2b-qo-search-input,
	.phoenix-b2b-panel .phoenix-b2b-qo-cat { width: 100% !important; height: 48px; min-height: 48px; font-size: 16px; }
	.phoenix-b2b-panel .phoenix-b2b-qo-qty { height: 44px; min-height: 44px; font-size: 16px; width: 88px; max-width: 100%; }

	/* Ulubione: spójna siatka kafelków (2/rząd) — bez tabeli. */
	.phoenix-b2b-panel .pb2b-favorites-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; }
}

/* ==========================================================================
 * v2.8.21 Client Panel Shell Final
 * Finalne, zakresowane do .phoenix-b2b-panel poprawki UX panelu klienta:
 *   1) branding (logo / monogram, zero „PhoenixB2B"),
 *   2) burger / menu button (nigdy biały pusty box),
 *   3) topbar + „B2B" badge (równe, okrągłe, wyśrodkowane),
 *   4) dashboard premium polish (spacing, brak pustej przerwy na dole),
 *   5) RÓWNE kafelki produktów wszędzie (dashboard / najczęściej / ostatnio /
 *      sklep / ulubione) — naprawa kolizji .pb2b-card (dashboard) z kafelkiem.
 * Plik ładuje się jako ostatni → wygrywa kaskadę. Nic poza .phoenix-b2b-panel.
 * ========================================================================== */

/* --- 1. BRANDING: logo lub monogram (gradient marki), bez litery „P" --- */
.phoenix-b2b-panel .pb2b-brand-mark {
	width: 38px; height: 38px;
	flex: 0 0 38px;
	border-radius: 11px;
	overflow: hidden;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.phoenix-b2b-panel .pb2b-brand-mark-mono {
	background: linear-gradient(135deg, #A855F7 0%, #7C3AED 50%, #3B82F6 100%);
	box-shadow: 0 6px 18px rgba(124, 58, 237, 0.32);
}
.phoenix-b2b-panel .pb2b-brand-mono {
	color: #fff;
	font-size: 16px;
	font-weight: 800;
	line-height: 1;
	letter-spacing: -0.01em;
	text-transform: uppercase;
}
.phoenix-b2b-panel .pb2b-brand-mark-logo { background: transparent; box-shadow: none; }
.phoenix-b2b-panel .pb2b-brand-logo-img {
	width: 100%; height: 100%;
	object-fit: contain;
	display: block;
}
.phoenix-b2b-panel .pb2b-brand-title {
	font-weight: 700; font-size: 15px; letter-spacing: -0.01em;
	color: var(--pb2b-text);
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* --- 2. BURGER / MENU BUTTON — zawsze widoczny przycisk, nigdy biały box --- */
.phoenix-b2b-panel .pb2b-burger {
	width: 44px; height: 44px;
	display: inline-flex; align-items: center; justify-content: center;
	border-radius: 14px;
	flex: 0 0 auto;
	cursor: pointer;
	/* DARK (domyślny motyw panelu): wyraźna powierzchnia + jasna ikona. */
	background: rgba(255, 255, 255, 0.06);
	border: 1px solid rgba(255, 255, 255, 0.18);
	color: #F8FAFC;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.35), inset 0 0 0 1px rgba(255,255,255,0.02);
	transition: background .15s ease, border-color .15s ease, color .15s ease, transform .12s ease;
}
.phoenix-b2b-panel .pb2b-burger:hover { background: rgba(255, 255, 255, 0.12); border-color: rgba(255,255,255,0.28); color: #fff; }
.phoenix-b2b-panel .pb2b-burger:active { transform: scale(0.96); }
.phoenix-b2b-panel .pb2b-burger:focus-visible { outline: 2px solid var(--pb2b-primary-2); outline-offset: 2px; }
.phoenix-b2b-panel .pb2b-burger svg {
	width: 22px; height: 22px;
	stroke: currentColor; fill: none;
	display: block;
}
/* LIGHT: ciemna ikona na jasnoszarym tle (nigdy biały na białym). */
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-burger {
	background: #EEF1F8;
	border-color: #CBD5E1;
	color: #0F172A;
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.10);
}
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-burger:hover { background: #E2E8F0; border-color: #94A3B8; color: #0F172A; }
/* Fallback gdyby SVG się nie wyrenderował: narysuj hamburgera przez ::before
 * (3 kreski). Pojawia się WYŁĄCZNIE, gdy w przycisku nie ma elementu <svg>. */
.phoenix-b2b-panel .pb2b-burger:not(:has(svg))::before {
	content: "";
	width: 20px; height: 2px;
	border-radius: 2px;
	background: currentColor;
	box-shadow: 0 -6px 0 currentColor, 0 6px 0 currentColor;
}

/* --- 3. TOPBAR + „B2B" BADGE — równe, okrągłe, wyśrodkowane ikony --- */
.phoenix-b2b-panel .pb2b-topbar {
	display: flex;
	align-items: center;
	gap: 10px;
	overflow: visible;
}
.phoenix-b2b-panel .pb2b-topbar-right {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: nowrap;
}
.phoenix-b2b-panel .pb2b-topbar-right > * { flex: 0 0 auto; }
/* Wszystkie okrągłe kontrolki topbaru ten sam wymiar optyczny (40px). */
.phoenix-b2b-panel .pb2b-topbar-bell,
.phoenix-b2b-panel .pb2b-theme-toggle.is-icon,
.phoenix-b2b-panel .pb2b-topbar-cart.is-empty {
	width: 40px; height: 40px;
	display: inline-flex; align-items: center; justify-content: center;
	border-radius: 999px;
	position: relative;
}
/* „B2B" badge / avatar firmy w prawym górnym rogu — idealne kółko, gradient,
 * wyśrodkowany tekst, bez ucięć i bez zniekształceń na mobile. */
.phoenix-b2b-panel .pb2b-user-chip {
	display: inline-flex; align-items: center; gap: 8px;
	background: transparent; border: 0; padding: 0;
}
.phoenix-b2b-panel .pb2b-user-avatar {
	width: 40px; height: 40px;
	flex: 0 0 40px;
	display: inline-flex; align-items: center; justify-content: center;
	border-radius: 999px;
	background: linear-gradient(135deg, #A855F7 0%, #7C3AED 50%, #3B82F6 100%);
	color: #fff;
	font-size: 13px; font-weight: 800; line-height: 1;
	letter-spacing: 0.01em;
	text-transform: uppercase;
	box-shadow: 0 4px 12px rgba(124, 58, 237, 0.30);
	border: 1px solid rgba(255, 255, 255, 0.18);
	overflow: hidden;
	box-sizing: border-box;
}
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-user-avatar { border-color: rgba(15, 23, 42, 0.08); }

/* --- 4. DASHBOARD POLISH — spacing premium + brak pustej przerwy na dole --- */
.phoenix-b2b-panel .pb2b-content {
	gap: 22px;
	padding-bottom: calc(24px + env(safe-area-inset-bottom, 0px));
}
/* Żadnych sztucznych min-height na sekcjach — to powodowało pustą przerwę. */
.phoenix-b2b-panel .pb2b-content > * { min-height: 0; }
.phoenix-b2b-panel .pb2b-content > *:last-child { margin-bottom: 0; }
/* Karty sekcji dashboardu (Szybkie akcje, Ostatnie zamówienia, listy bloków). */
.phoenix-b2b-panel .pb2b-content > .pb2b-card,
.phoenix-b2b-panel .pb2b-content > .pb2b-app-card {
	min-height: 0;
	height: auto;
}
/* Symetryczny, czysty cień — bez „poświaty z lewej”. */
.phoenix-b2b-panel .pb2b-hero,
.phoenix-b2b-panel .pb2b-stat,
.phoenix-b2b-panel .pb2b-content > .pb2b-card,
.phoenix-b2b-panel .pb2b-content > .pb2b-app-card {
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.18), 0 8px 24px rgba(0, 0, 0, 0.10);
}
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-hero,
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-stat,
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-content > .pb2b-card,
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-content > .pb2b-app-card {
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05), 0 10px 26px rgba(15, 23, 42, 0.06);
}
/* Bloki „Najczęściej kupowane” / „Ostatnio oglądane” w sekcjach — bez nadmiaru. */
.phoenix-b2b-panel .pb2b-app-card .pb2b-shop,
.phoenix-b2b-panel .pb2b-card-body .pb2b-shop { min-height: 0; }
.phoenix-b2b-panel .pb2b-shop-note { margin: 0 0 12px; }

/* --- 5. RÓWNE KAFELKI PRODUKTÓW (single source of truth w panelu) ---------
 * Problem: .pb2b-card jest używane też przez karty dashboardu, a reguły
 * .phoenix-b2b-panel .pb2b-card / .pb2b-card-title / .pb2b-card-body (0,2,0)
 * nadpisywały kafelek produktu. Zakresujemy kafelek do gridu produktowego
 * (.pb2b-card-grid) ze specyficznością (0,3,0+), więc wygrywa. Dodatkowo
 * wyrównujemy legacy .pb2b-shop-card.
 * --------------------------------------------------------------------------*/
.phoenix-b2b-panel .pb2b-card-grid,
.phoenix-b2b-panel .pb2b-shop-grid,
.phoenix-b2b-panel .pb2b-favorites-grid { align-items: stretch; }

/* Kafelek = kolumna na pełną wysokość komórki gridu (równe wiersze). */
.phoenix-b2b-panel .pb2b-card-grid .pb2b-card {
	display: flex;
	flex-direction: column;
	height: 100%;
	/* v2.10.7: tokeny zamiast twardego #fff — karta podąża za light/dark.
	 * To była PRZYCZYNA białych kart w dark mode: reguła (0,3,0) wygrywała
	 * z warstwą tokenów pb2b-listing (0,1,0), wymuszając białe tło. */
	background: var(--pb2b-product-card-bg, var(--pb2b-bg-2));
	border: 1px solid var(--pb2b-product-card-border, var(--pb2b-border));
	border-radius: 18px;
	overflow: hidden;
}
.phoenix-b2b-panel .pb2b-card-grid .pb2b-card:hover { border-color: var(--pb2b-border-strong, var(--pb2b-border)); }

/* Media: stały kwadrat (aspect-ratio) — nie rozjeżdża kart. */
.phoenix-b2b-panel .pb2b-card-grid .pb2b-card-media {
	aspect-ratio: 1 / 1;
	flex: 0 0 auto;
}

/* Body: kolumna, akcje dopychane do dołu. Nadpisuje padding 20px dashboardu. */
.phoenix-b2b-panel .pb2b-card-grid .pb2b-card-body {
	display: flex;
	flex-direction: column;
	gap: 7px;
	padding: 14px 16px 16px;
	flex: 1 1 auto;
	background: transparent;
	border: 0;
}

/* SKU: stała wysokość, jedna linia. */
.phoenix-b2b-panel .pb2b-card-grid .pb2b-card-sku {
	min-height: 15px;
	font-size: 11px; font-weight: 600;
	text-transform: uppercase; letter-spacing: .05em;
	color: var(--pb2b-product-card-sku, var(--pb2b-text-muted));
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* Tytuł: max 2 linie, STAŁA wysokość (równe karty mimo różnych nazw). */
.phoenix-b2b-panel .pb2b-card-grid .pb2b-card-title {
	font-size: 14.5px;
	font-weight: 600;
	line-height: 1.34;
	color: var(--pb2b-product-card-text, var(--pb2b-text));
	display: -webkit-box;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	height: 2.68em;            /* 2 linie × 1.34 — twardo równe */
	min-height: 2.68em;
}
.phoenix-b2b-panel .pb2b-card-grid .pb2b-card-title:hover { color: var(--pb2b-primary-strong, var(--pb2b-primary-2, #a78bfa)); }

/* Wiersz ceny / MOQ: stała minimalna wysokość, NIE dopychany (margin-top:0). */
.phoenix-b2b-panel .pb2b-card-grid .pb2b-card-pricing {
	margin-top: 0;
	min-height: 38px;
	padding-top: 6px;
	align-items: center;
}

/* Kalkulator zysku: kompaktowy; gdy go brak, akcje i tak są na dole. */
.phoenix-b2b-panel .pb2b-card-grid .pb2b-card-calc { margin-top: 6px; }

/* Akcje ZAWSZE przy dole — równa pozycja przycisków w każdej karcie. */
.phoenix-b2b-panel .pb2b-card-grid .pb2b-card-actions {
	margin-top: auto;
	padding-top: 12px;
}

/* Legacy kafelek (.pb2b-shop-card) — ta sama logika równych wysokości. */
.phoenix-b2b-panel .pb2b-shop-grid .pb2b-shop-card {
	display: flex;
	flex-direction: column;
	height: 100%;
}
.phoenix-b2b-panel .pb2b-shop-grid .pb2b-shop-card-body {
	display: flex; flex-direction: column; gap: 6px;
	flex: 1 1 auto;
}
.phoenix-b2b-panel .pb2b-shop-grid .pb2b-shop-card-title {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 2.6em;
	line-height: 1.3;
}
.phoenix-b2b-panel .pb2b-shop-grid .pb2b-shop-card-price { margin-top: auto; }
.phoenix-b2b-panel .pb2b-shop-grid .pb2b-shop-card-actions { margin-top: 10px; }

/* Siatka produktowa: PC 4 kolumny, tablet 3, mobile 2 (bez ucięć). */
@media (min-width: 1200px) {
	.phoenix-b2b-panel .pb2b-card-grid,
	.phoenix-b2b-panel .pb2b-shop-grid,
	.phoenix-b2b-panel .pb2b-favorites-grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: 16px;
	}
}
@media (min-width: 768px) and (max-width: 1199.98px) {
	.phoenix-b2b-panel .pb2b-card-grid,
	.phoenix-b2b-panel .pb2b-shop-grid,
	.phoenix-b2b-panel .pb2b-favorites-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 14px;
	}
}
@media (max-width: 767px) {
	/* Mobile: 2 produkty w rzędzie tam, gdzie jest grid produktowy. */
	.phoenix-b2b-panel .pb2b-card-grid,
	.phoenix-b2b-panel .pb2b-shop-grid,
	.phoenix-b2b-panel .pb2b-favorites-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		gap: 10px !important;
	}
	/* Na małym ekranie zwarte body i mniejszy tytuł — nadal równe. */
	.phoenix-b2b-panel .pb2b-card-grid .pb2b-card-body { padding: 12px 12px 14px; gap: 6px; }
	.phoenix-b2b-panel .pb2b-card-grid .pb2b-card-title { font-size: 13.5px; }
	.phoenix-b2b-panel .pb2b-card-grid .pb2b-card-price-value { font-size: 18px; }
}

/* Drobny porządek: drawer nie zostawia overlay/cienia po zamknięciu. */
.phoenix-b2b-panel:not(.pb2b-sidebar-open) .pb2b-sidebar-backdrop {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}
@media (min-width: 1200px) {
	.phoenix-b2b-panel .pb2b-sidebar-backdrop { display: none !important; }
}

/* ==========================================================================
 * v2.8.22 Client Panel Commerce Flow
 * Sklep / Katalog / Koszyk / Zamówienie w panelu (mobile + PC). Zakres:
 * tylko .phoenix-b2b-panel. Nie dotyka frontowego sklepu / kategorii / Woo
 * poza osadzonym checkoutem panelu.
 * ========================================================================== */

/* --- CZĘŚĆ 2: SKLEP W PANELU — prosty toolbar mobile, jeden przycisk Filtry ---
 * Duplikat „Filtry" usunięty w shop-v22.js. Zostaje natywny przycisk z toolbaru.
 * Search: pole pełnej szerokości + kompaktowy przycisk (nie dominujący klocek). */
@media (max-width: 767px) {
	.phoenix-b2b-panel .pb2b-shop-toolbar { gap: 8px; }
	.phoenix-b2b-panel .pb2b-shop-search {
		display: flex; align-items: stretch; gap: 8px; width: 100%;
		flex-wrap: nowrap;                 /* input + przycisk w jednej linii */
	}
	.phoenix-b2b-panel .pb2b-shop-search-input {
		flex: 1 1 auto; width: auto; min-width: 0;
		height: 46px; min-height: 46px; font-size: 16px;
	}
	/* „Szukaj" jako kompaktowy przycisk obok pola, nie pełnej szerokości. */
	.phoenix-b2b-panel .pb2b-shop-search .pb2b-shop-btn {
		flex: 0 0 auto; width: auto; min-width: 52px;
		height: 46px; min-height: 46px; padding: 0 16px; justify-content: center;
	}
	/* Pasek: jeden przycisk Filtry + sortowanie obok siebie. */
	.phoenix-b2b-panel .pb2b-shop-toolbar-right {
		display: flex; gap: 8px; width: 100%; align-items: stretch;
	}
	.phoenix-b2b-panel .pb2b-shop-filter-toggle { flex: 0 0 auto; min-height: 44px; }
	.phoenix-b2b-panel .pb2b-shop-orderby { flex: 1 1 auto; width: auto; min-height: 44px; font-size: 15px; }
	/* Ukryty, niepotrzebny duplikat (gdyby jakiś motyw go dorzucił). */
	.phoenix-b2b-panel .pb2b-shop-filters-toggle { display: none !important; }
}

/* --- CZĘŚĆ 3: KATALOG B2B — kompaktowe karty hurtowe (quick-order embed) ---
 * Bez podkreśleń nazw, bez surowego HTML, bez wielkich pustych przestrzeni.
 * Mobile: wiersze tabeli → zwarte karty katalogowe. PC: czytelna tabela. */
.phoenix-b2b-panel .pb2b-quick-order-embed { min-height: 0; }
.phoenix-b2b-panel .phoenix-b2b-qo-col-name a,
.phoenix-b2b-panel .phoenix-b2b-qo-row a { text-decoration: none !important; }
.phoenix-b2b-panel .phoenix-b2b-qo-col-name a { color: var(--pb2b-text); font-weight: 600; }
.phoenix-b2b-panel .phoenix-b2b-qo-col-name a:hover { color: var(--pb2b-primary-2); }
.phoenix-b2b-panel .phoenix-b2b-qo-col-sku code {
	display: inline-block; background: var(--pb2b-bg-3); border: 1px solid var(--pb2b-border);
	border-radius: 6px; padding: 1px 7px; font-size: 11.5px; color: var(--pb2b-text-soft);
}
.phoenix-b2b-panel .pb2b-qo-col-thumb img {
	width: 56px; height: 56px; object-fit: contain; border-radius: 8px;
	background: #fff; border: 1px solid var(--pb2b-border);
}
.phoenix-b2b-panel .phoenix-b2b-qo-stock { font-size: 12px; font-weight: 600; }
.phoenix-b2b-panel .phoenix-b2b-qo-stock-in { color: var(--pb2b-success); }
.phoenix-b2b-panel .phoenix-b2b-qo-stock-out { color: var(--pb2b-danger); }
.phoenix-b2b-panel .phoenix-b2b-qo-qty {
	height: 40px; width: 84px; max-width: 100%; text-align: center;
	border-radius: 8px; border: 1px solid var(--pb2b-border-strong);
	background: var(--pb2b-bg-3); color: var(--pb2b-text); font-weight: 600;
}
.phoenix-b2b-panel .phoenix-b2b-qo-add-single,
.phoenix-b2b-panel .phoenix-b2b-qo-view {
	display: inline-flex; align-items: center; justify-content: center;
	height: 40px; padding: 0 16px; border-radius: 999px; font-weight: 700; font-size: 13px;
	border: 1px solid transparent; cursor: pointer; text-decoration: none !important;
	background: linear-gradient(135deg, #7c3aed, #6d28d9); color: #fff;
}
.phoenix-b2b-panel .phoenix-b2b-qo-view {
	background: transparent; color: var(--pb2b-text); border-color: var(--pb2b-border-strong);
}

@media (max-width: 767px) {
	/* Wiersz katalogu = zwarta karta (override generycznego konwertera tabel). */
	.phoenix-b2b-panel .phoenix-b2b-qo-table tbody tr {
		display: grid;
		grid-template-columns: 26px 56px 1fr auto;
		grid-template-areas:
			"check thumb name   name"
			"check thumb sku    stock"
			"price price qty    action";
		gap: 6px 10px;
		align-items: center;
		background: var(--pb2b-bg-2);
		border: 1px solid var(--pb2b-border);
		border-radius: var(--pb2b-radius-sm);
		padding: 12px;
		margin-bottom: 10px;
	}
	.phoenix-b2b-panel .phoenix-b2b-qo-table tbody td {
		display: flex; align-items: center; padding: 0; border: 0; width: auto; text-align: left;
	}
	/* Usuń etykiety data-label w karcie katalogu (czysty wygląd). */
	.phoenix-b2b-panel .phoenix-b2b-qo-table tbody td::before { content: none !important; }
	.phoenix-b2b-panel .pb2b-qo-col-check  { grid-area: check; justify-content: center; }
	.phoenix-b2b-panel .pb2b-qo-col-thumb  { grid-area: thumb; }
	.phoenix-b2b-panel .pb2b-qo-col-name   { grid-area: name; flex-direction: column; align-items: flex-start; gap: 2px; }
	.phoenix-b2b-panel .pb2b-qo-col-name a { display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.3; }
	.phoenix-b2b-panel .pb2b-qo-col-sku    { grid-area: sku; }
	.phoenix-b2b-panel .pb2b-qo-col-stock  { grid-area: stock; justify-content: flex-end; }
	.phoenix-b2b-panel .pb2b-qo-col-price  { grid-area: price; font-weight: 700; color: var(--pb2b-text); }
	.phoenix-b2b-panel .pb2b-qo-col-qty    { grid-area: qty; justify-content: flex-end; }
	.phoenix-b2b-panel .pb2b-qo-col-action { grid-area: action; justify-content: flex-end; }
	.phoenix-b2b-panel .pb2b-qo-col-action .button,
	.phoenix-b2b-panel .pb2b-qo-col-action .phoenix-b2b-qo-add-single { width: 100%; }
	/* small meta pod nazwą (MOQ / karton / wariant) — drobne, bez rozpychania. */
	.phoenix-b2b-panel .pb2b-qo-units-carton,
	.phoenix-b2b-panel .pb2b-qo-moq,
	.phoenix-b2b-panel .pb2b-qo-variable { font-size: 11px; color: var(--pb2b-text-muted); }
}

/* --- CZĘŚĆ 5: ZAMÓWIENIE — wrapper B2B nad checkoutem WooCommerce ---
 * Stylujemy WYŁĄCZNIE checkout osadzony w panelu (.pb2b-checkout-woo). Nie
 * ruszamy globalnej strony /checkout/. Czytelność w dark/light, mobile-friendly,
 * brak poziomego scrolla. Płatności i pola Woo działają jak zwykle. */
.phoenix-b2b-panel .pb2b-checkout-company {
	display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
	padding: 14px 16px; margin-bottom: 16px;
	background: var(--pb2b-bg-2); border: 1px solid var(--pb2b-border); border-radius: var(--pb2b-radius-sm);
}
.phoenix-b2b-panel .pb2b-checkout-company-ico {
	width: 38px; height: 38px; flex: 0 0 38px; display: inline-flex; align-items: center; justify-content: center;
	border-radius: 10px; background: var(--pb2b-bg-3); color: var(--pb2b-primary-2);
}
.phoenix-b2b-panel .pb2b-checkout-company-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.phoenix-b2b-panel .pb2b-checkout-company-text strong { color: var(--pb2b-text); }
.phoenix-b2b-panel .pb2b-checkout-company > .pb2b-app-button { margin-left: auto; }
.phoenix-b2b-panel .pb2b-checkout-fallback { margin-top: 14px; font-size: 12.5px; }

/* Czytelność: wymuś kolor tekstu/etykiet checkoutu na tle panelu. */
.phoenix-b2b-panel .pb2b-checkout-woo,
.phoenix-b2b-panel .pb2b-checkout-woo label,
.phoenix-b2b-panel .pb2b-checkout-woo h3,
.phoenix-b2b-panel .pb2b-checkout-woo .woocommerce-billing-fields h3,
.phoenix-b2b-panel .pb2b-checkout-woo .woocommerce-additional-fields h3,
.phoenix-b2b-panel .pb2b-checkout-woo #order_review_heading { color: var(--pb2b-text); }

/* Układ: dane klienta + podsumowanie. PC obok siebie, mobile jeden pod drugim. */
.phoenix-b2b-panel .pb2b-checkout-woo .woocommerce { width: 100%; }
.phoenix-b2b-panel .pb2b-checkout-woo form.checkout { display: block; width: 100%; }
@media (min-width: 992px) {
	.phoenix-b2b-panel .pb2b-checkout-woo form.checkout {
		display: grid; grid-template-columns: minmax(0,1fr) 380px; gap: 24px; align-items: start;
	}
	.phoenix-b2b-panel .pb2b-checkout-woo #customer_details { grid-column: 1; }
	.phoenix-b2b-panel .pb2b-checkout-woo #order_review,
	.phoenix-b2b-panel .pb2b-checkout-woo #order_review_heading { grid-column: 2; }
	.phoenix-b2b-panel .pb2b-checkout-woo #customer_details .col-1,
	.phoenix-b2b-panel .pb2b-checkout-woo #customer_details .col-2 { width: 100%; float: none; }
}

/* Pola formularza — czytelne, wygodne pod palec, spójne z motywem. */
.phoenix-b2b-panel .pb2b-checkout-woo .form-row { margin: 0 0 12px; padding: 0; }
.phoenix-b2b-panel .pb2b-checkout-woo .input-text,
.phoenix-b2b-panel .pb2b-checkout-woo select,
.phoenix-b2b-panel .pb2b-checkout-woo textarea {
	width: 100%; box-sizing: border-box;
	min-height: 46px; padding: 10px 12px; font-size: 15px;
	background: #fff; color: #16161d;
	border: 1px solid var(--pb2b-border-strong); border-radius: 10px;
}
.phoenix-b2b-panel .pb2b-checkout-woo textarea { min-height: 90px; }

/* Karty: dane klienta, podsumowanie, płatność. */
.phoenix-b2b-panel .pb2b-checkout-woo #customer_details,
.phoenix-b2b-panel .pb2b-checkout-woo .woocommerce-checkout-review-order,
.phoenix-b2b-panel .pb2b-checkout-woo #payment {
	background: var(--pb2b-bg-2); border: 1px solid var(--pb2b-border);
	border-radius: var(--pb2b-radius); padding: 18px;
}
.phoenix-b2b-panel .pb2b-checkout-woo #payment { background: var(--pb2b-bg-1); margin-top: 14px; }

/* Tabela podsumowania — czytelna, bez poziomego scrolla. */
.phoenix-b2b-panel .pb2b-checkout-woo .woocommerce-checkout-review-order-table {
	width: 100%; border-collapse: collapse; font-size: 14px; color: var(--pb2b-text);
}
.phoenix-b2b-panel .pb2b-checkout-woo .woocommerce-checkout-review-order-table th,
.phoenix-b2b-panel .pb2b-checkout-woo .woocommerce-checkout-review-order-table td {
	padding: 8px 4px; border-bottom: 1px solid var(--pb2b-border); text-align: right;
}
.phoenix-b2b-panel .pb2b-checkout-woo .woocommerce-checkout-review-order-table .product-name { text-align: left; }

/* Przycisk „Kup teraz / Zamawiam" — premium, pełna szerokość. */
.phoenix-b2b-panel .pb2b-checkout-woo #place_order {
	width: 100%; min-height: 50px; border: 0; border-radius: 999px; cursor: pointer;
	font-size: 15px; font-weight: 800; color: #fff;
	background: linear-gradient(135deg, #7c3aed, #6d28d9);
	box-shadow: 0 8px 20px rgba(109,40,217,.30);
}
.phoenix-b2b-panel .pb2b-checkout-woo #place_order:hover { transform: translateY(-1px); }

/* Light mode: pola checkoutu pozostają czytelne (białe pole, ciemny tekst). */
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-checkout-woo .input-text,
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-checkout-woo select,
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-checkout-woo textarea {
	background: #fff; color: #0F172A; border-color: #CBD5E1;
}

/* Brak poziomego scrolla w całej sekcji commerce. */
.phoenix-b2b-panel .pb2b-checkout-woo,
.phoenix-b2b-panel .pb2b-quick-order-embed { overflow-x: clip; }

/* ==========================================================================
 * v2.8.23 Client Panel Final QA — spójność wszystkich sekcji
 * Zakres: wyłącznie .phoenix-b2b-panel. Ujednolicenie tokenów, buttonów, kart,
 * empty states, powiadomień; brak przypadkowych kolorów, raw stylów i scrolla.
 * ========================================================================== */

/* --- CZĘŚĆ 6: SYSTEM DESIGN TOKENÓW (semantyczne aliasy, jeden zestaw) --- */
.phoenix-b2b-panel {
}

/* --- Reset natywnego <button> używanego jako akcja-link (np. „Oznacz wszystkie")
 *     — to usuwa „niebieski button" UA z fioletowym tekstem. --- */
.phoenix-b2b-panel button.pb2b-card-action,
.phoenix-b2b-panel button.pb2b-link {
	-webkit-appearance: none; appearance: none;
	background: transparent; border: 0; box-shadow: none;
	padding: 0; margin: 0; cursor: pointer; font: inherit;
}
.phoenix-b2b-panel .pb2b-card-action { color: var(--pb2b-primary-2); font-weight: 600; }
.phoenix-b2b-panel .pb2b-card-action:hover { color: #C084FC; }
.phoenix-b2b-panel .pb2b-link-danger { color: var(--pb2b-danger) !important; }
.phoenix-b2b-panel .pb2b-link-danger:hover { color: #F87171 !important; }

/* --- Ujednolicenie DWÓCH systemów kart (.pb2b-card ↔ .pb2b-app-card) --- */
.phoenix-b2b-panel .pb2b-card,
.phoenix-b2b-panel .pb2b-app-card {
	background: var(--pb2b-bg-2);
	border: 1px solid var(--pb2b-border);
	border-radius: var(--pb2b-radius);
}
.phoenix-b2b-panel .pb2b-card-header,
.phoenix-b2b-panel .pb2b-app-section-header {
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	padding: 16px 20px; border-bottom: 1px solid var(--pb2b-border);
}
.phoenix-b2b-panel .pb2b-card-title,
.phoenix-b2b-panel .pb2b-app-section-title {
	font-size: 15px; font-weight: 600; color: var(--pb2b-text); margin: 0;
	display: flex; align-items: center; gap: 8px;
}
.phoenix-b2b-panel .pb2b-card-body,
.phoenix-b2b-panel .pb2b-app-card-body { padding: 20px; }
.phoenix-b2b-panel .pb2b-app-card.pb2b-card-flush > .pb2b-app-card-body { padding: 0; }

/* --- Ujednolicenie DWÓCH systemów buttonów (.pb2b-btn ↔ .pb2b-app-button) ---
 *     Ta sama wysokość, kształt i paleta. Primary = purple (nie niebieski). --- */
.phoenix-b2b-panel .pb2b-btn,
.phoenix-b2b-panel a.pb2b-btn,
.phoenix-b2b-panel button.pb2b-btn,
.phoenix-b2b-panel .pb2b-app-button {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	min-height: 42px; padding: 9px 18px;
	border-radius: 999px; border: 1px solid var(--pb2b-border-strong);
	background: var(--pb2b-bg-3); color: var(--pb2b-text);
	font-size: 13.5px; font-weight: 700; line-height: 1; text-decoration: none !important;
	cursor: pointer; transition: background .15s ease, border-color .15s ease, color .15s ease, transform .12s ease, box-shadow .15s ease;
}
.phoenix-b2b-panel .pb2b-btn-primary,
.phoenix-b2b-panel .pb2b-app-button-primary {
	background: linear-gradient(135deg, var(--pb2b-c-primary-2), var(--pb2b-c-primary));
	border-color: transparent; color: #fff;
	box-shadow: 0 6px 16px rgba(109,40,217,.26);
}
.phoenix-b2b-panel .pb2b-btn-primary:hover,
.phoenix-b2b-panel .pb2b-app-button-primary:hover {
	color: #fff; transform: translateY(-1px); box-shadow: 0 10px 22px rgba(109,40,217,.34);
}
.phoenix-b2b-panel .pb2b-btn-outline,
.phoenix-b2b-panel .pb2b-app-button-ghost {
	background: transparent; color: var(--pb2b-text); border-color: var(--pb2b-border-strong);
}
.phoenix-b2b-panel .pb2b-btn-outline:hover,
.phoenix-b2b-panel .pb2b-app-button-ghost:hover { background: var(--pb2b-bg-3); color: var(--pb2b-text); }
.phoenix-b2b-panel .pb2b-app-button-link {
	background: transparent !important; border-color: transparent !important; box-shadow: none !important;
	color: var(--pb2b-primary-2); min-height: 0; padding: 6px 8px;
}
.phoenix-b2b-panel .pb2b-btn-sm,
.phoenix-b2b-panel .pb2b-app-button-sm { min-height: 36px; padding: 7px 14px; font-size: 12.5px; }
.phoenix-b2b-panel .pb2b-btn[disabled],
.phoenix-b2b-panel .pb2b-app-button[disabled],
.phoenix-b2b-panel .pb2b-app-button:disabled { opacity: .55; cursor: not-allowed; transform: none; box-shadow: none; }

/* --- CZĘŚĆ 1: POWIADOMIENIA — spójna paleta, premium karty/chipsy --- */
.phoenix-b2b-panel .pb2b-notif-filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.phoenix-b2b-panel .pb2b-notif-filters .pb2b-chip { cursor: pointer; }
.phoenix-b2b-panel .pb2b-notif {
	display: flex; gap: 14px; justify-content: space-between;
	padding: 14px 16px; background: var(--pb2b-bg-2);
	border: 1px solid var(--pb2b-border); border-radius: var(--pb2b-radius-sm);
}
.phoenix-b2b-panel .pb2b-notif.is-read { opacity: .72; }
.phoenix-b2b-panel .pb2b-notif.is-unread { box-shadow: inset 3px 0 0 var(--pb2b-c-primary); }
.phoenix-b2b-panel .pb2b-notif-main { min-width: 0; flex: 1 1 auto; }
/* Chip typu — bazowo neutralny; każdy typ ma intencjonalny, spójny kolor. */
.phoenix-b2b-panel .pb2b-notif-type {
	display: inline-flex; align-items: center; padding: 2px 9px; border-radius: 999px;
	font-size: 11px; font-weight: 700; letter-spacing: .02em;
	background: var(--pb2b-bg-4); color: var(--pb2b-text-soft); border: 1px solid var(--pb2b-border);
}
.phoenix-b2b-panel .pb2b-notif-type-promotion        { background: rgba(124,58,237,.16); color: var(--pb2b-c-primary-2); border-color: rgba(124,58,237,.30); }
.phoenix-b2b-panel .pb2b-notif-type-document         { background: rgba(59,130,246,.16); color: #93C5FD;                border-color: rgba(59,130,246,.30); }
.phoenix-b2b-panel .pb2b-notif-type-order_status     { background: rgba(56,189,248,.16); color: var(--pb2b-info);        border-color: rgba(56,189,248,.30); }
.phoenix-b2b-panel .pb2b-notif-type-account_approved { background: rgba(34,197,94,.16);  color: var(--pb2b-c-success);    border-color: rgba(34,197,94,.30); }
.phoenix-b2b-panel .pb2b-notif-type-monthly_limit    { background: rgba(245,158,11,.16); color: var(--pb2b-c-warning);    border-color: rgba(245,158,11,.30); }
.phoenix-b2b-panel .pb2b-notif-type-saved_cart       { background: var(--pb2b-bg-4);     color: var(--pb2b-text-soft);    border-color: var(--pb2b-border); }
.phoenix-b2b-panel .pb2b-notif-type-info             { background: rgba(56,189,248,.14); color: var(--pb2b-info);        border-color: rgba(56,189,248,.26); }
.phoenix-b2b-panel .pb2b-notif-title { font-weight: 600; color: var(--pb2b-text); }
.phoenix-b2b-panel .pb2b-notif-body { font-size: 13px; color: var(--pb2b-text-soft); margin-top: 4px; }
.phoenix-b2b-panel .pb2b-notif-body p { margin: 0 0 6px; }
.phoenix-b2b-panel .pb2b-notif-body p:last-child { margin-bottom: 0; }
.phoenix-b2b-panel .pb2b-notif-date { font-size: 11.5px; color: var(--pb2b-text-dim); }
.phoenix-b2b-panel .pb2b-notif-actions { display: flex; flex-direction: column; gap: 6px; align-items: flex-end; white-space: nowrap; }

/* --- CZĘŚĆ 7: empty states premium (ujednolicenie .pb2b-empty ↔ .pb2b-app-empty) --- */
.phoenix-b2b-panel .pb2b-empty,
.phoenix-b2b-panel .pb2b-app-empty {
	display: flex; flex-direction: column; align-items: center; text-align: center;
	padding: 40px 20px;
}
.phoenix-b2b-panel .pb2b-empty-icon,
.phoenix-b2b-panel .pb2b-app-empty-icon {
	display: inline-flex; align-items: center; justify-content: center;
	width: 64px; height: 64px; margin-bottom: 14px;
	border-radius: 999px;
	background: var(--pb2b-bg-3); border: 1px solid var(--pb2b-border);
	color: var(--pb2b-primary-2);
}
.phoenix-b2b-panel .pb2b-empty-sm { padding: 24px 14px; }
.phoenix-b2b-panel .pb2b-empty h3, .phoenix-b2b-panel .pb2b-empty h4,
.phoenix-b2b-panel .pb2b-app-empty h4 { color: var(--pb2b-text); margin: 0 0 6px; font-size: 15px; }
.phoenix-b2b-panel .pb2b-empty p, .phoenix-b2b-panel .pb2b-app-empty p {
	color: var(--pb2b-text-muted); margin: 0 0 16px; font-size: 13.5px; max-width: 420px;
}

/* --- Pille statusów (zamówienia / dokumenty / koszyki) spójne kolory --- */
.phoenix-b2b-panel .pb2b-status,
.phoenix-b2b-panel .pb2b-pill {
	display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px;
	border-radius: 999px; font-size: 11.5px; font-weight: 700; line-height: 1.4;
	background: var(--pb2b-bg-4); color: var(--pb2b-text-soft); border: 1px solid var(--pb2b-border);
}
.phoenix-b2b-panel .pb2b-status-completed,
.phoenix-b2b-panel .pb2b-status-paid     { background: rgba(34,197,94,.14);  color: var(--pb2b-c-success); border-color: rgba(34,197,94,.30); }
.phoenix-b2b-panel .pb2b-status-processing,
.phoenix-b2b-panel .pb2b-status-on-hold  { background: rgba(245,158,11,.14); color: var(--pb2b-c-warning); border-color: rgba(245,158,11,.30); }
.phoenix-b2b-panel .pb2b-status-pending  { background: rgba(56,189,248,.14); color: var(--pb2b-info);      border-color: rgba(56,189,248,.30); }
.phoenix-b2b-panel .pb2b-status-cancelled,
.phoenix-b2b-panel .pb2b-status-failed,
.phoenix-b2b-panel .pb2b-status-refunded { background: rgba(239,68,68,.14);  color: var(--pb2b-c-danger);  border-color: rgba(239,68,68,.30); }

/* --- CZĘŚĆ 7: nigdy podkreślone linki w kartach; nigdy biały na białym --- */
.phoenix-b2b-panel .pb2b-card a:not(.pb2b-app-button-link),
.phoenix-b2b-panel .pb2b-app-card a:not(.pb2b-app-button-link),
.phoenix-b2b-panel .pb2b-cat-tile,
.phoenix-b2b-panel .pb2b-discount-label { text-decoration: none; }
.phoenix-b2b-panel .pb2b-cat-tile { color: var(--pb2b-text); }

/* --- CZĘŚĆ 2: kategorie — pewność 2/4 kolumny + brak podkreśleń --- */
.phoenix-b2b-panel .pb2b-cat-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 14px; }
@media (max-width: 1199.98px) { .phoenix-b2b-panel .pb2b-cat-grid { grid-template-columns: repeat(3, minmax(0,1fr)); } }
@media (max-width: 767px)     { .phoenix-b2b-panel .pb2b-cat-grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; } }

/* --- CZĘŚĆ 7: twardo brak poziomego scrolla w panelu --- */
.phoenix-b2b-panel,
.phoenix-b2b-panel .pb2b-content { max-width: 100%; overflow-x: clip; }

/* --- Mobile: powiadomienia — akcje w jednej linii pod treścią --- */
@media (max-width: 767px) {
	.phoenix-b2b-panel .pb2b-notif { flex-direction: column; gap: 10px; }
	.phoenix-b2b-panel .pb2b-notif-actions { flex-direction: row; align-items: center; gap: 14px; }
	.phoenix-b2b-panel .pb2b-card-header,
	.phoenix-b2b-panel .pb2b-app-section-header { flex-wrap: wrap; gap: 10px; }
}


/* ==========================================================================
 * v2.8.24 FINAL TOPBAR BRANDING CARDS
 * Ostatni blok w pliku = wygrywa kaskadą przy równej specyficzności.
 * Wszystko zakresowane pod .phoenix-b2b-panel (nie rusza katalogu/koszyka/
 * checkoutu/importu/Sellasist/kategorii frontowych/admina/logowania).
 * ========================================================================== */

/* --- 1. BURGER (lewy górny róg) — nigdy pusty box, zawsze widoczna ikona ----
 * 48x48, radius 16, tło zależne od motywu, border, subtelny cień. Kolor ikony
 * ustawiony jawnie per-motyw (svg = stroke: currentColor), więc nigdy biały
 * na białym. NIE ustawiamy tu display — widocznością steruje media query
 * (mobile: inline-flex, >=1200px: none). */
.phoenix-b2b-panel .pb2b-burger {
	width: 48px;
	height: 48px;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	padding: 0;
	border-radius: 16px;
	cursor: pointer;
	/* DARK (domyślny motyw panelu): jasna ikona na ciemnej powierzchni. */
	background: rgba(255, 255, 255, 0.08);
	border: 1px solid rgba(255, 255, 255, 0.20);
	color: #F8FAFC;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.35), inset 0 0 0 1px rgba(255, 255, 255, 0.03);
	transition: background .15s ease, border-color .15s ease, color .15s ease, transform .12s ease;
	-webkit-appearance: none;
	appearance: none;
}
.phoenix-b2b-panel .pb2b-burger:hover { background: rgba(255, 255, 255, 0.14); border-color: rgba(255, 255, 255, 0.30); color: #ffffff; }
.phoenix-b2b-panel .pb2b-burger:active { transform: scale(0.96); }
.phoenix-b2b-panel .pb2b-burger:focus-visible { outline: 2px solid var(--pb2b-primary-2, #6366F1); outline-offset: 2px; }
/* Ikona SVG — jawny rozmiar i kolor, zawsze renderowana wewnątrz przycisku. */
.phoenix-b2b-panel .pb2b-burger svg {
	width: 24px;
	height: 24px;
	display: block;
	stroke: currentColor;
	fill: none;
	pointer-events: none;
}
/* LIGHT: ciemna ikona na jasnoszarym tle (nigdy biały na białym). */
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-burger {
	background: #EEF1F8;
	border-color: #CBD5E1;
	color: #0F172A;
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.10);
}
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-burger:hover { background: #E2E8F0; border-color: #94A3B8; color: #0F172A; }
/* Fallback: gdyby SVG się nie wyrenderował, rysujemy hamburgera (3 kreski)
 * przez ::before. Pojawia się WYŁĄCZNIE, gdy w przycisku nie ma <svg>. */
.phoenix-b2b-panel .pb2b-burger:not(:has(svg))::before {
	content: "";
	width: 22px;
	height: 2px;
	border-radius: 2px;
	background: currentColor;
	box-shadow: 0 -7px 0 currentColor, 0 7px 0 currentColor;
}

/* --- 2. BRANDING SIDEBARA — monogram nigdy „P" (twardo z markupu PHP) ------- */
.phoenix-b2b-panel .pb2b-brand-title { white-space: normal; }
.phoenix-b2b-panel .pb2b-brand-mono { text-transform: uppercase; }

/* --- 3. RÓWNE KAFELKI PRODUKTÓW — jeden wspólny model wysokości -------------
 * Specyficzność (0,3,0)+ pod .pb2b-card-grid/.pb2b-shop-grid/.pb2b-favorites-grid
 * bije .pb2b-card-X z product-card.css niezależnie od kolejności ładowania.
 * Obejmuje: dashboard, sklep w panelu, najczęściej kupowane, ostatnio oglądane,
 * ulubione. Kalkulator zysku jest w normalnym flow i nie rozjeżdża wysokości,
 * bo akcje są dopychane do dołu (margin-top:auto). */
.phoenix-b2b-panel .pb2b-card-grid,
.phoenix-b2b-panel .pb2b-shop-grid,
.phoenix-b2b-panel .pb2b-favorites-grid,
.phoenix-b2b-panel .pb2b-shop-main .pb2b-card-grid { align-items: stretch; }

.phoenix-b2b-panel .pb2b-card-grid .pb2b-card,
.phoenix-b2b-panel .pb2b-shop-grid .pb2b-card,
.phoenix-b2b-panel .pb2b-favorites-grid .pb2b-card {
	display: flex;
	flex-direction: column;
	height: 100%;
	align-self: stretch;
}
/* Obrazek: stały kwadrat — identyczny dla każdej karty. */
.phoenix-b2b-panel .pb2b-card-grid .pb2b-card-media,
.phoenix-b2b-panel .pb2b-shop-grid .pb2b-card-media,
.phoenix-b2b-panel .pb2b-favorites-grid .pb2b-card-media {
	aspect-ratio: 1 / 1;
	flex: 0 0 auto;
	width: 100%;
	overflow: hidden;
}
.phoenix-b2b-panel .pb2b-card-grid .pb2b-card-image,
.phoenix-b2b-panel .pb2b-shop-grid .pb2b-card-image,
.phoenix-b2b-panel .pb2b-favorites-grid .pb2b-card-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
/* Body: rośnie i pozwala dopiąć akcje do dołu. */
.phoenix-b2b-panel .pb2b-card-grid .pb2b-card-body,
.phoenix-b2b-panel .pb2b-shop-grid .pb2b-card-body,
.phoenix-b2b-panel .pb2b-favorites-grid .pb2b-card-body {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-height: 0;
}
/* SKU: stały obszar (nie skacze, gdy brak SKU). */
.phoenix-b2b-panel .pb2b-card-grid .pb2b-card-sku,
.phoenix-b2b-panel .pb2b-shop-grid .pb2b-card-sku,
.phoenix-b2b-panel .pb2b-favorites-grid .pb2b-card-sku {
	min-height: 16px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
/* Nazwa: dokładnie 2 linie (klamra), stała wysokość obszaru. */
.phoenix-b2b-panel .pb2b-card-grid .pb2b-card-title,
.phoenix-b2b-panel .pb2b-shop-grid .pb2b-card-title,
.phoenix-b2b-panel .pb2b-favorites-grid .pb2b-card-title {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	line-height: 1.35;
	min-height: 2.7em;
}
/* Cena / „Cena na zapytanie" / „Dostępne po zalogowaniu" — stały obszar. */
.phoenix-b2b-panel .pb2b-card-grid .pb2b-card-pricing,
.phoenix-b2b-panel .pb2b-shop-grid .pb2b-card-pricing,
.phoenix-b2b-panel .pb2b-favorites-grid .pb2b-card-pricing {
	margin-top: 0;
	min-height: 40px;
}
/* Kalkulator zysku: normalny flow, nie rozpycha wysokości. */
.phoenix-b2b-panel .pb2b-card-grid .pb2b-card-calc,
.phoenix-b2b-panel .pb2b-shop-grid .pb2b-card-calc,
.phoenix-b2b-panel .pb2b-favorites-grid .pb2b-card-calc {
	margin-top: 8px;
	flex: 0 0 auto;
}
/* Akcje: zawsze przy dole karty. */
.phoenix-b2b-panel .pb2b-card-grid .pb2b-card-actions,
.phoenix-b2b-panel .pb2b-shop-grid .pb2b-card-actions,
.phoenix-b2b-panel .pb2b-favorites-grid .pb2b-card-actions {
	margin-top: auto;
	padding-top: 12px;
}
/* Legacy karta (gdyby stary system był włączony). */
.phoenix-b2b-panel .pb2b-card-grid .pb2b-shop-card {
	display: flex;
	flex-direction: column;
	height: 100%;
}
.phoenix-b2b-panel .pb2b-card-grid .pb2b-shop-card .pb2b-shop-card-actions { margin-top: auto; }

/* --- 4. DASHBOARD POLISH — bez pustej dziury na dole, bez dziwnych min-height
 * Tniemy tylko odstępy/min-height; NIE przemalowujemy barw (zostają z motywu).
 * Child-combinator (>) celuje wyłącznie w kontenery dashboardu, nie w kafelki
 * produktów (.pb2b-card wewnątrz .pb2b-card-grid). */
.phoenix-b2b-panel .pb2b-content { padding-bottom: 24px; }
.phoenix-b2b-panel .pb2b-content > *:last-child { margin-bottom: 0; }
.phoenix-b2b-panel .pb2b-content > .pb2b-card,
.phoenix-b2b-panel .pb2b-content > .pb2b-app-card,
.phoenix-b2b-panel .pb2b-content > .pb2b-hero,
.phoenix-b2b-panel .pb2b-content > .pb2b-stats,
.phoenix-b2b-panel .pb2b-content > .pb2b-app-section { min-height: 0; }

/* --- 5. MOBILE — statystyki i szybkie akcje 2 w rzędzie, zero poziomego scrolla */
@media (max-width: 767.98px) {
	.phoenix-b2b-panel .pb2b-stats { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 12px; }
	.phoenix-b2b-panel .pb2b-quick-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 12px; }
	.phoenix-b2b-panel .pb2b-grid-2 { grid-template-columns: 1fr; }
	.phoenix-b2b-panel .pb2b-card-grid,
	.phoenix-b2b-panel .pb2b-shop-grid,
	.phoenix-b2b-panel .pb2b-favorites-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; }
	.phoenix-b2b-panel,
	.phoenix-b2b-panel .pb2b-main,
	.phoenix-b2b-panel .pb2b-content { overflow-x: clip; max-width: 100%; }
	.phoenix-b2b-panel .pb2b-content { padding-bottom: 16px; }
}
/* Bardzo wąskie ekrany: kafelki w jednej kolumnie. */
@media (max-width: 359.98px) {
	.phoenix-b2b-panel .pb2b-card-grid,
	.phoenix-b2b-panel .pb2b-shop-grid,
	.phoenix-b2b-panel .pb2b-favorites-grid { grid-template-columns: 1fr !important; }
}
/* v2.8.24 — koniec bloku FINAL TOPBAR BRANDING CARDS */

/* ===================================================================
 * ŹRÓDŁO: client-panel-v28.css (tokeny zdjęte -> panel-v3-tokens.css)
 * =================================================================== */
/* ==========================================================================
 * PhoenixB2B v2.8.25 — CLIENT PANEL „COMMERCE FLOW" LAYER
 *
 * Doszlifowanie flow zakupowego w panelu klienta: Sklep / Katalog / Koszyk /
 * Zamówienie / Szybkie zamówienie. Warstwa nakładana PO client-panel-v26.css,
 * więc wygrywa w kaskadzie. WSZYSTKO scope'owane do `.phoenix-b2b-panel`
 * i oparte na tokenach --pb2b-* (działa w trybie ciemnym i jasnym).
 *
 * Czego ten plik NIE rusza: topbar, branding, dashboard, kategorie frontu,
 * login/register, import, admin, Sellasist, metody płatności WooCommerce.
 *
 * Spis:
 *   1. Stepper ilości +/- w katalogu / szybkim zamówieniu
 *   2. SKU jako chip (katalog + koszyk)
 *   3. „Zapytaj o cenę" (brak ceny w katalogu)
 *   4. Sklep B2B — kompaktowy pasek wyszukiwania (button „Szukaj" nie dominuje)
 *   5. Równe kafelki produktów
 *   6. Katalog — porządek na desktopie (linki bez podkreśleń, kolumna ilości)
 *   7. Katalog / szybkie zamówienie — mobilna karta produktu (premium)
 *   8. Koszyk — drobne poprawki SKU/usuń
 *   9. Bezpieczniki: brak poziomego scrolla w sekcjach commerce
 * ========================================================================== */

/* ==========================================================================
 * 1. STEPPER ILOŚCI +/- (katalog hurtowy / szybkie zamówienie)
 * Markup z render_row(): .pb2b-qo-stepper [−] [input.phoenix-b2b-qo-qty] [+].
 * Spójny wizualnie ze stepperem w koszyku (.pb2b-stepper).
 * ========================================================================== */
.phoenix-b2b-panel .pb2b-qo-stepper {
	display: inline-flex;
	align-items: center;
	border: 1px solid var(--pb2b-border-strong);
	border-radius: 999px;
	overflow: hidden;
	background: var(--pb2b-bg-3);
	max-width: 100%;
}
.phoenix-b2b-panel .pb2b-qo-stepper-btn {
	flex: 0 0 auto;
	width: 34px;
	height: 38px;
	border: 0;
	background: transparent;
	color: var(--pb2b-text);
	font-size: 18px;
	line-height: 1;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: background .12s ease;
	-webkit-appearance: none;
	appearance: none;
}
.phoenix-b2b-panel .pb2b-qo-stepper-btn:hover { background: var(--pb2b-bg-4); }
.phoenix-b2b-panel .pb2b-qo-stepper-btn:active { background: var(--pb2b-bg-4); }

/* Input pomiędzy przyciskami — bez własnej ramki/tła (nadpisuje styl z v26,
 * gdzie .phoenix-b2b-qo-qty miało border/tło jako samodzielne pole). */
.phoenix-b2b-panel .pb2b-qo-stepper .phoenix-b2b-qo-qty {
	flex: 1 1 auto;
	width: 48px;
	min-width: 40px;
	max-width: 64px;
	height: 38px;
	margin: 0;
	padding: 0 4px;
	text-align: center;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	color: var(--pb2b-text);
	font-size: 14px;
	font-weight: 600;
	-moz-appearance: textfield;
}
.phoenix-b2b-panel .pb2b-qo-stepper .phoenix-b2b-qo-qty:focus { outline: none; box-shadow: none; }
.phoenix-b2b-panel .pb2b-qo-stepper .phoenix-b2b-qo-qty::-webkit-outer-spin-button,
.phoenix-b2b-panel .pb2b-qo-stepper .phoenix-b2b-qo-qty::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}
.phoenix-b2b-panel .pb2b-qo-qty-na { color: var(--pb2b-text-dim); }

/* ==========================================================================
 * 2. SKU JAKO CHIP — nie rozbity na wiele linii, czytelny pojedynczy „badge".
 * Katalog: <code> w kolumnie SKU. Koszyk: .pb2b-cart-sku.
 * ========================================================================== */
.phoenix-b2b-panel .phoenix-b2b-qo .pb2b-qo-col-sku code {
	display: inline-block;
	max-width: 100%;
	padding: 3px 9px;
	border-radius: 999px;
	background: var(--pb2b-bg-4);
	border: 1px solid var(--pb2b-border);
	color: var(--pb2b-text-soft);
	font-size: 12px;
	line-height: 1.4;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	vertical-align: middle;
}
.phoenix-b2b-panel .pb2b-cart-sku {
	display: inline-flex;
	align-items: center;
	width: auto;
	max-width: 100%;
	margin-top: 5px;
	padding: 3px 9px;
	border-radius: 999px;
	background: var(--pb2b-bg-4);
	border: 1px solid var(--pb2b-border);
	color: var(--pb2b-text-muted);
	font-size: 11.5px;
	line-height: 1.4;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* ==========================================================================
 * 3. „ZAPYTAJ O CENĘ" — gdy produkt nie ma ceny (zamiast pustego / 0,00 zł).
 * ========================================================================== */
.phoenix-b2b-panel .pb2b-qo-price-na {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 4px 10px;
	border-radius: 999px;
	background: rgba(124, 58, 237, 0.12);
	border: 1px solid rgba(124, 58, 237, 0.28);
	color: var(--pb2b-primary-2);
	font-size: 12.5px;
	font-weight: 600;
	white-space: nowrap;
}

/* ==========================================================================
 * 4. SKLEP B2B — KOMPAKTOWY PASEK WYSZUKIWANIA NA MOBILE
 * Cel z briefu: „search input wygodny", „button Szukaj nie może dominować".
 * Pole zostaje szerokie i wysokie (16px = brak auto-zoomu iOS), a przycisk
 * „Szukaj" jest kompaktowy obok pola (Enter też uruchamia wyszukiwanie).
 * Scope do panelu → strona /sklep-b2b/ poza panelem zachowuje swój układ.
 * ========================================================================== */
@media (max-width: 767px) {
	.phoenix-b2b-panel .pb2b-shop .pb2b-shop-search {
		flex-wrap: nowrap;
		gap: 8px;
		align-items: stretch;
	}
	.phoenix-b2b-panel .pb2b-shop .pb2b-shop-search .pb2b-shop-search-input {
		flex: 1 1 auto;
		width: auto;
		min-width: 0;
		height: 48px;
		min-height: 48px;
		font-size: 16px;
	}
	/* „Szukaj" jako kompaktowy, drugorzędny przycisk — nie pełna szerokość. */
	.phoenix-b2b-panel .pb2b-shop .pb2b-shop-search .pb2b-shop-btn {
		flex: 0 0 auto;
		width: auto;
		min-width: 0;
		height: 48px;
		min-height: 48px;
		padding: 0 16px;
		font-size: 14px;
		white-space: nowrap;
		background: var(--pb2b-bg-3);
		color: var(--pb2b-text);
		border: 1px solid var(--pb2b-border-strong);
	}
	.phoenix-b2b-panel .pb2b-shop .pb2b-shop-search .pb2b-shop-btn:hover {
		background: var(--pb2b-bg-4);
		color: var(--pb2b-text);
	}

	/* Toolbar dolny: jeden przycisk „Filtry" + sort jako select w równym rzędzie. */
	.phoenix-b2b-panel .pb2b-shop .pb2b-shop-toolbar-right {
		width: 100%;
		display: flex;
		gap: 8px;
		align-items: stretch;
	}
	.phoenix-b2b-panel .pb2b-shop .pb2b-shop-toolbar-right > * { flex: 1 1 auto; }
	.phoenix-b2b-panel .pb2b-shop .pb2b-shop-filter-toggle,
	.phoenix-b2b-panel .pb2b-shop .pb2b-shop-orderby {
		min-height: 44px;
		font-size: 14px;
	}
	.phoenix-b2b-panel .pb2b-shop .pb2b-shop-view-toggle { flex: 0 0 auto; }
}

/* ==========================================================================
 * 5. RÓWNE KAFELKI PRODUKTÓW — karta wypełnia wysokość rzędu, akcje na dole.
 * Działa dla siatki sklepu (.pb2b-shop-grid) i siatek kart (.pb2b-card-grid:
 * najczęściej kupowane / ostatnio oglądane / dashboard listy). Tylko kafelki
 * będące bezpośrednim dzieckiem siatki → nie rusza zwykłych kart panelu.
 * ========================================================================== */
.phoenix-b2b-panel .pb2b-shop-grid { align-items: stretch; }
.phoenix-b2b-panel .pb2b-shop-grid > .pb2b-card,
.phoenix-b2b-panel .pb2b-card-grid > .pb2b-card {
	height: 100%;
	display: flex;
	flex-direction: column;
}
.phoenix-b2b-panel .pb2b-shop-grid > .pb2b-card .pb2b-card-body,
.phoenix-b2b-panel .pb2b-card-grid > .pb2b-card .pb2b-card-body {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
}
.phoenix-b2b-panel .pb2b-shop-grid > .pb2b-card .pb2b-card-actions,
.phoenix-b2b-panel .pb2b-card-grid > .pb2b-card .pb2b-card-actions {
	margin-top: auto;
}

/* ==========================================================================
 * 6. KATALOG / SZYBKIE ZAMÓWIENIE — PORZĄDEK NA DESKTOPIE
 * - linki produktów bez podkreślenia (czysty, hurtowy wygląd),
 * - kolumna ilości szersza, by zmieścić stepper,
 * - pole wyszukiwarki i select kategorii wygodne (wyższe).
 * ========================================================================== */
.phoenix-b2b-panel .phoenix-b2b-qo .pb2b-qo-col-name a,
.phoenix-b2b-panel .phoenix-b2b-qo-table a { text-decoration: none; }
.phoenix-b2b-panel .phoenix-b2b-qo .pb2b-qo-col-name a:hover { color: var(--pb2b-primary-2); }
.phoenix-b2b-panel .phoenix-b2b-qo-table .pb2b-qo-col-qty { min-width: 132px; }
.phoenix-b2b-panel .phoenix-b2b-qo-search-input,
.phoenix-b2b-panel .phoenix-b2b-qo-cat {
	min-height: 42px;
}

/* Toolbar katalogu: szukajka + kategoria czytelnie w jednym rzędzie (desktop),
 * jedna kolumna na mobile (obsłużone niżej w @media). */
.phoenix-b2b-panel .phoenix-b2b-qo-toolbar {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
	margin-bottom: 14px;
}
.phoenix-b2b-panel .phoenix-b2b-qo-search { flex: 1 1 280px; }
.phoenix-b2b-panel .phoenix-b2b-qo-search-input { width: 100%; }

/* ==========================================================================
 * 7. KATALOG / SZYBKIE ZAMÓWIENIE — MOBILNA KARTA PRODUKTU (premium)
 * Nadpisuje układ z v26: cena dostaje własny, pełny rząd (długie ceny się
 * mieszczą), a ilość (stepper) + akcja „Dodaj" są w czytelnym dolnym rzędzie.
 * Nazwy obszarów (check/thumb/name/sku/stock/price/qty/action) zgodne z v26,
 * więc mapowanie .pb2b-qo-col-* → grid-area działa dalej.
 * ========================================================================== */
@media (max-width: 767px) {
	.phoenix-b2b-panel .phoenix-b2b-qo-table tbody tr {
		grid-template-columns: 22px 56px 1fr auto;
		grid-template-areas:
			"check thumb name   name"
			"check thumb sku    stock"
			"price price price  price"
			"qty   qty   qty    action";
		gap: 8px 10px;
		padding: 12px 14px;
	}
	/* Cena: własny rząd, oddzielona linią — czytelna i nigdy nie ucięta. */
	.phoenix-b2b-panel .phoenix-b2b-qo-table .pb2b-qo-col-price {
		justify-content: flex-start;
		margin-top: 2px;
		padding-top: 8px;
		border-top: 1px solid var(--pb2b-border);
		font-size: 15px;
	}
	/* Stepper na całą szerokość rzędu ilości, akcja kompaktowo po prawej. */
	.phoenix-b2b-panel .phoenix-b2b-qo-table .pb2b-qo-col-qty { justify-content: flex-start; }
	.phoenix-b2b-panel .phoenix-b2b-qo-table .pb2b-qo-col-qty .pb2b-qo-stepper {
		width: 100%;
		max-width: 200px;
		justify-content: space-between;
	}
	.phoenix-b2b-panel .phoenix-b2b-qo-table .pb2b-qo-col-qty .pb2b-qo-stepper .phoenix-b2b-qo-qty {
		flex: 1 1 auto;
		max-width: none;
	}
	.phoenix-b2b-panel .phoenix-b2b-qo-table .pb2b-qo-col-action { justify-content: flex-end; }
	.phoenix-b2b-panel .phoenix-b2b-qo-table .pb2b-qo-col-action .phoenix-b2b-qo-add-single,
	.phoenix-b2b-panel .phoenix-b2b-qo-table .pb2b-qo-col-action .button {
		width: auto;
		min-width: 96px;
		padding: 0 18px;
	}
	/* Stock wyrównany do prawej w swoim wierszu. */
	.phoenix-b2b-panel .phoenix-b2b-qo-table .pb2b-qo-col-stock { justify-content: flex-end; }
	/* Nazwa: maks. 2 linie (clamp już w v26) + drobny margines. */
	.phoenix-b2b-panel .phoenix-b2b-qo-table .pb2b-qo-col-name { gap: 4px; }

	/* Mobilny toolbar katalogu: szukajka i kategoria pełnej szerokości. */
	.phoenix-b2b-panel .phoenix-b2b-qo-toolbar { flex-direction: column; align-items: stretch; gap: 8px; }
	.phoenix-b2b-panel .phoenix-b2b-qo-search { flex: 1 1 100%; }
	.phoenix-b2b-panel .phoenix-b2b-qo-search-input,
	.phoenix-b2b-panel .phoenix-b2b-qo-cat {
		width: 100% !important;
		height: 48px;
		min-height: 48px;
		font-size: 16px;
	}
	.phoenix-b2b-panel .phoenix-b2b-qo-filter { width: 100%; }
}

/* ==========================================================================
 * 8. KOSZYK — drobne poprawki (przycisk usuń zawsze wyraźny; SKU chip wyżej).
 * Layout koszyka pochodzi z v26 — tu tylko wzmocnienie czytelności „usuń".
 * ========================================================================== */
.phoenix-b2b-panel .pb2b-cart-remove svg { width: 18px; height: 18px; }
.phoenix-b2b-panel .pb2b-cart-remove:focus-visible {
	outline: 2px solid var(--pb2b-primary-2);
	outline-offset: 2px;
}
@media (max-width: 767px) {
	/* Na mobile „usuń" jako wyraźny, dotykalny przycisk w rogu karty. */
	.phoenix-b2b-panel .pb2b-cart-cell-rm .pb2b-cart-remove {
		width: 38px;
		height: 38px;
	}
}

/* ==========================================================================
 * 9. BEZPIECZNIKI: BRAK POZIOMEGO SCROLLA W SEKCJACH COMMERCE
 * ========================================================================== */
.phoenix-b2b-panel [data-pb2b-shop-wrap],
.phoenix-b2b-panel [data-pb2b-catalog-flow],
.phoenix-b2b-panel [data-pb2b-cart-section],
.phoenix-b2b-panel [data-pb2b-checkout-section] {
	max-width: 100%;
	overflow-x: clip;
}
.phoenix-b2b-panel .phoenix-b2b-qo,
.phoenix-b2b-panel .phoenix-b2b-qo-results { max-width: 100%; }
@media (max-width: 767px) {
	/* Wyniki katalogu nie potrzebują poziomego scrolla — to karty, nie tabela. */
	.phoenix-b2b-panel .phoenix-b2b-qo-results,
	.phoenix-b2b-panel .phoenix-b2b-qo-table-wrap { overflow-x: visible; }
}

/* ===================================================================
 * ŹRÓDŁO: client-panel-v286.css (tokeny zdjęte -> panel-v3-tokens.css)
 * =================================================================== */
/* ==========================================================================
 * v2.8.26 CLIENT PANEL APP V2 FOUNDATION
 *
 * Fundament „panel klienta jak aplikacja B2B" (mobile + PC). Warstwa nakładana
 * PO client-panel-v26.css i client-panel-v28.css, więc wygrywa w kaskadzie.
 * WSZYSTKO scope'owane do `.phoenix-b2b-panel` — zero globalnego psucia
 * body / motywu / Elementora. Oparte na tokenach --pb2b-* (działa w trybie
 * ciemnym i jasnym; przełącznik ustawia data-pb2b-theme na root panelu).
 *
 * Czego ten plik NIE rusza (logika): checkout, koszyk (logika), katalog
 * (logika), Sellasist, import, admin, kategorie frontu, login/register.
 *
 * Spis:
 *   0. TOKENY: page-x (gutter), odstępy, aliasy semantyczne, wysokość headera
 *   1. APP SHELL V2 (shell / header / content / section / section-inner / card)
 *   2. SYSTEM SPACINGU (gutter contentu, sekcje, karty flush, brak edge-to-edge)
 *   3. MOBILE HEADER V2 (72px, premium burger, kompaktowy koszyk, powitanie)
 *   4. HEADER PC (topbar profesjonalny, koszyk z wartością, profil + powitanie)
 *   5. DRAWER / MENU (brand SPJTRADE B2B, blur, safe-area, aktywna sekcja)
 *   6. FOOTER PANELU (szybkie linki + wersja, lekki na mobile)
 *   7. PWA / APP-LIKE (prompt „dodaj do ekranu głównego", standalone, safe-area)
 *   8. LIGHT / DARK — bezpieczniki kontrastu fundamentu
 * ========================================================================== */

/* v2.8.26 CLIENT PANEL APP V2 FOUNDATION */

/* ==========================================================================
 * 0. TOKENY FUNDAMENTU
 * page-x = jeden, wspólny gutter boczny dla całego panelu:
 *   mobile 16px → tablet 24px → PC 32px (zgodnie z briefem).
 * Aliasy semantyczne (bg/surface/surface-soft/muted) mapujemy na istniejącą
 * skalę --pb2b-bg-* / --pb2b-text-* — dzięki temu AUTOMATYCZNIE podążają za
 * trybem jasnym/ciemnym (skala bazowa jest nadpisywana w theme.css).
 * ========================================================================== */
.phoenix-b2b-panel {

	/* Aliasy semantyczne (zgodne z briefem): bg / surface / surface-soft /
	 * border / text / muted / primary / success / warning / danger.
	 * border, text, primary, success, warning, danger już istnieją w bazie. */
}
@media (min-width: 768px) {
	.phoenix-b2b-panel {
	}
}
@media (min-width: 1200px) {
	.phoenix-b2b-panel {
	}
}

/* ==========================================================================
 * 1. APP SHELL V2
 * Finalne wrappery aplikacji. Stare klasy (.pb2b-app/.pb2b-topbar/.pb2b-content)
 * zostają — tu dodajemy warstwę .pb2b-app-* (na tych samych elementach) + nowe
 * komponenty sekcji, których mogą używać kolejne ekrany.
 * ========================================================================== */
.phoenix-b2b-panel.pb2b-app-shell {
	width: 100%;
	max-width: 100%;
	overflow-x: clip;             /* twarde „nigdy poziomego scrolla" */
}

/* Header aplikacji = istniejący topbar (ta sama warstwa). */
.phoenix-b2b-panel .pb2b-app-header {
	position: sticky;
	top: 0;
	z-index: 30;
}

/* Content aplikacji = istniejący main panelu. Gutter sterowany page-x. */
.phoenix-b2b-panel .pb2b-app-content {
	width: 100%;
	min-width: 0;
}

/* Uniwersalna sekcja panelu — spójny gutter + odstęp. Każdy nowy ekran może
 * po prostu owinąć treść w .pb2b-section > .pb2b-section-inner i dostać
 * poprawne marginesy bez kombinowania. */
.phoenix-b2b-panel .pb2b-section {
	width: 100%;
	max-width: 100%;
}
.phoenix-b2b-panel .pb2b-section + .pb2b-section { margin-top: var(--pb2b-section-gap); }
.phoenix-b2b-panel .pb2b-section-inner {
	padding-left: var(--pb2b-page-x);
	padding-right: var(--pb2b-page-x);
}
.phoenix-b2b-panel .pb2b-section-card {
	background: var(--pb2b-surface);
	border: 1px solid var(--pb2b-border);
	border-radius: var(--pb2b-radius, 14px);
	padding: var(--pb2b-card-pad);
	box-shadow: var(--pb2b-shadow-sm);
}

/* ==========================================================================
 * 2. SYSTEM SPACINGU — nic nie dotyka ściany, brak poziomego scrolla
 * ========================================================================== */

/* (a) Gutter kolumny contentu — jedno źródło prawdy = page-x.
 * Nadpisuje twarde 24px/16px z warstw bazowych. */
.phoenix-b2b-panel .pb2b-content,
.phoenix-b2b-panel .pb2b-app-content {
	padding-left: var(--pb2b-page-x);
	padding-right: var(--pb2b-page-x);
}

/* (b) Karty „flush" (Sklep B2B, Katalog B2B) mają body bez paddingu (pasek
 * koszyka/flow celowo full-bleed). To powodowało „2269 produktów" oraz toolbar
 * przyklejone do ściany. Oddajemy body wspólny gutter boczny — pasek na górze
 * (cartbar/flowbar) zostaje pełnej szerokości i dostaje TEN SAM gutter, więc
 * licznik i toolbar wyrównują się do jednej krawędzi. */
.phoenix-b2b-panel .pb2b-app-card.pb2b-card-flush > .pb2b-app-card-body {
	padding-left: var(--pb2b-page-x);
	padding-right: var(--pb2b-page-x);
	padding-bottom: var(--pb2b-page-x);
}
.phoenix-b2b-panel .pb2b-shop-cartbar,
.phoenix-b2b-panel .pb2b-catalog-flowbar {
	padding-left: var(--pb2b-page-x);
	padding-right: var(--pb2b-page-x);
}

/* (c) Osadzony sklep: nagłówek/notka/toolbar/licznik nigdy nie dotykają ściany
 * (gutter daje już body, tu tylko pilnujemy, że nic nie ma ujemnego marginesu). */
.phoenix-b2b-panel .pb2b-shop-head,
.phoenix-b2b-panel .pb2b-shop-note,
.phoenix-b2b-panel .pb2b-shop-toolbar,
.phoenix-b2b-panel .pb2b-shop-bar,
.phoenix-b2b-panel .pb2b-shop-results {
	margin-left: 0;
	margin-right: 0;
}
/* Licznik produktów: czytelny i nigdy „wklejony" w lewą krawędź. */
.phoenix-b2b-panel .pb2b-shop-bar { padding-top: 2px; }
.phoenix-b2b-panel .pb2b-shop-count { color: var(--pb2b-muted); }

/* (d) Globalny bezpiecznik: panel i jego główne kontenery nie wychodzą poza
 * viewport (klucz dla mobile + PWA). */
.phoenix-b2b-panel,
.phoenix-b2b-panel .pb2b-main,
.phoenix-b2b-panel .pb2b-content,
.phoenix-b2b-panel .pb2b-app-content {
	max-width: 100%;
}
.phoenix-b2b-panel .pb2b-content,
.phoenix-b2b-panel .pb2b-app-content { overflow-x: clip; }

/* ==========================================================================
 * 3. MOBILE HEADER V2 (≤1199.98px — tryb z drawerem)
 * Cel: app-like header ~72px, lekki premium burger 44×44, kompaktowy koszyk
 * z badge, tytuł sekcji, powitanie zamiast dominującego „B2B".
 * ========================================================================== */
@media (max-width: 1199.98px) {
	.phoenix-b2b-panel .pb2b-topbar,
	.phoenix-b2b-panel .pb2b-app-header {
		min-height: var(--pb2b-app-header-h);
		gap: 10px;
		padding-left: var(--pb2b-page-x);
		padding-right: var(--pb2b-page-x);
		padding-top: env(safe-area-inset-top, 0px);   /* notch / status bar w PWA */
	}

	/* Burger: lekki, premium, mniej toporny (44×44, r14, subtelne tło/border). */
	.phoenix-b2b-panel .pb2b-burger {
		width: 44px;
		height: 44px;
		border-radius: 14px;
		background: var(--pb2b-surface-soft);
		border: 1px solid var(--pb2b-border);
		color: var(--pb2b-text);
		box-shadow: none;
	}
	.phoenix-b2b-panel .pb2b-burger:hover {
		background: var(--pb2b-bg-4);
		border-color: var(--pb2b-border-strong);
	}
	.phoenix-b2b-panel .pb2b-burger svg { width: 20px; height: 20px; }

	/* Tytuł aktualnej sekcji obok burgera — jedna linia, ucięcie wielokropkiem. */
	.phoenix-b2b-panel .pb2b-topbar-title { min-width: 0; }
	.phoenix-b2b-panel .pb2b-topbar-h1 {
		font-size: 16px;
		font-weight: 700;
		letter-spacing: -0.01em;
	}
	/* Podtytuł (nazwa firmy) chowamy na mobile — jest w powitaniu/profilu. */
	.phoenix-b2b-panel .pb2b-topbar-sub { display: none; }

	/* Prawa strona: maksymalnie zwarta, równe odstępy — bez „5 kółek". */
	.phoenix-b2b-panel .pb2b-topbar-right { gap: 8px; }

	/* Koszyk w headerze = ikona (40×40) + badge z liczbą. Kwota jest w cartbarze
	 * pod headerem (Sklep) — w samej ikonie jej nie wciskamy. */
	.phoenix-b2b-panel .pb2b-topbar-cart {
		width: 40px;
		height: 40px;
		padding: 0;
		justify-content: center;
		position: relative;
		background: var(--pb2b-surface-soft);
		border: 1px solid var(--pb2b-border);
		border-radius: 999px;
	}
	.phoenix-b2b-panel .pb2b-topbar-cart.has-items { border-color: rgba(124, 58, 237, 0.45); }
	.phoenix-b2b-panel .pb2b-topbar-cart-meta { display: none; }
	.phoenix-b2b-panel .pb2b-topbar-cart-ico { width: 20px; height: 20px; }
	/* Badge liczby pozycji w rogu ikony koszyka (osobny element, JS aktualizuje
	 * go przez [data-pb2b-cart-count]). Widoczny tylko na mobile. */
	.phoenix-b2b-panel .pb2b-topbar-cart-badge {
		position: absolute;
		top: -4px;
		right: -4px;
		min-width: 18px;
		height: 18px;
		padding: 0 5px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		border-radius: 999px;
		background: var(--pb2b-primary);
		color: #fff;
		font-size: 10px;
		font-weight: 800;
		line-height: 1;
		border: 2px solid var(--pb2b-bg-1);
		box-sizing: border-box;
	}
	.phoenix-b2b-panel .pb2b-topbar-cart.is-empty .pb2b-topbar-cart-badge { display: none; }

	/* Powitanie „Witaj 👋 {imię}" — kompaktowo, tylko ikona/imię, bez ozdób. */
	.phoenix-b2b-panel .pb2b-greeting { display: none; }      /* na mobile profil = avatar */
	.phoenix-b2b-panel .pb2b-user-name { display: none; }      /* avatar wystarcza */
	.phoenix-b2b-panel .pb2b-user-chip { padding: 0; }
	.phoenix-b2b-panel .pb2b-user-avatar { width: 40px; height: 40px; flex: 0 0 40px; }

	/* „B2B"/grupa: NIE jako duży fioletowy przycisk dominujący header.
	 * Na mobile chowamy chip grupy (status jest w profilu/dropdownie). */
	.phoenix-b2b-panel .pb2b-topbar-right .pb2b-chip { display: none; }

	/* Badge na desktopowym koszyku nie pokazujemy (jest meta) — patrz sekcja 4. */
}

/* Badge koszyka domyślnie ukryty (pokazujemy go wyłącznie na mobile powyżej). */
.phoenix-b2b-panel .pb2b-topbar-cart-badge { display: none; }

/* ==========================================================================
 * 4. HEADER PC (≥1200px — sidebar + topbar)
 * Topbar profesjonalny: po lewej tytuł sekcji, po prawej koszyk (ilość +
 * wartość), powiadomienia, profil z powitaniem, tryb jasny/ciemny.
 * ========================================================================== */
@media (min-width: 1200px) {
	.phoenix-b2b-panel .pb2b-topbar,
	.phoenix-b2b-panel .pb2b-app-header {
		min-height: var(--pb2b-app-header-h);
		padding-left: var(--pb2b-page-x);
		padding-right: var(--pb2b-page-x);
		gap: 16px;
	}
	.phoenix-b2b-panel .pb2b-topbar-right { gap: 10px; }

	/* Koszyk w topbarze: ikona + liczba pozycji + wartość (meta widoczna). */
	.phoenix-b2b-panel .pb2b-topbar-cart-meta { display: flex; }
	.phoenix-b2b-panel .pb2b-topbar-cart-total:empty { display: none; }

	/* Profil z powitaniem „Witaj 👋 {nazwa}" — dwie linie, czytelnie. */
	.phoenix-b2b-panel .pb2b-user-chip {
		gap: 10px;
		padding: 4px 12px 4px 4px;
		background: var(--pb2b-surface-soft);
		border: 1px solid var(--pb2b-border);
		border-radius: 999px;
	}
	.phoenix-b2b-panel .pb2b-user-name {
		display: flex;
		flex-direction: column;
		line-height: 1.2;
		max-width: 200px;
	}
	.phoenix-b2b-panel .pb2b-greeting {
		display: block;
		font-size: 11px;
		font-weight: 600;
		color: var(--pb2b-muted);
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	.phoenix-b2b-panel .pb2b-greeting-name {
		font-size: 13px;
		font-weight: 700;
		color: var(--pb2b-text);
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
}

/* Grupa/„B2B" jako subtelny chip statusowy (nie dominujący) — wszędzie. */
.phoenix-b2b-panel .pb2b-topbar-right .pb2b-chip-primary {
	background: var(--pb2b-surface-soft);
	border: 1px solid var(--pb2b-border);
	color: var(--pb2b-text-soft);
	font-weight: 600;
}
.phoenix-b2b-panel .pb2b-topbar-right .pb2b-chip-primary .pb2b-chip-amount {
	color: var(--pb2b-primary-2);
	font-weight: 700;
}

/* Avatar profilu — czysty, spójny w obu trybach, inicjał (nie wielkie „B2B"). */
.phoenix-b2b-panel .pb2b-user-avatar {
	background: var(--pb2b-accent-grad);
	box-shadow: 0 2px 8px rgba(124, 58, 237, 0.28);
	border: 1px solid var(--pb2b-border-strong);
}

/* ==========================================================================
 * 5. DRAWER / MENU
 * Brand SPJTRADE B2B (z ustawień), blur overlay, aktywna sekcja czytelna,
 * scroll bez chowania ostatnich pozycji pod paskiem Safari (safe-area).
 * ========================================================================== */
@media (max-width: 1199.98px) {
	/* Szerokość drawera 82–86vw (już w bazie min(86vw,260px)) — domykamy do 84vw. */
	.phoenix-b2b-panel .pb2b-sidebar {
		width: min(84vw, 320px);
		padding-top: calc(16px + env(safe-area-inset-top, 0px));
	}
	/* Nawigacja: płynny scroll + zapas na dole, by ostatnia pozycja nie chowała
	 * się pod paskiem URL / gestem Safari. */
	.phoenix-b2b-panel .pb2b-nav {
		-webkit-overflow-scrolling: touch;
		overscroll-behavior: contain;
		padding-bottom: 8px;
	}
	.phoenix-b2b-panel .pb2b-sidebar-footer {
		padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px));
	}
	/* Przycisk zamknięcia drawera — wyraźny, dotykalny. */
	.phoenix-b2b-panel .pb2b-sidebar-close {
		width: 38px;
		height: 38px;
		border-radius: 12px;
		background: var(--pb2b-surface-soft);
	}
}

/* Overlay/backdrop — profesjonalny blur (mocniejszy niż bazowe 2px). */
.phoenix-b2b-panel .pb2b-sidebar-backdrop {
	background: rgba(2, 6, 23, 0.55);
	-webkit-backdrop-filter: saturate(140%) blur(6px);
	backdrop-filter: saturate(140%) blur(6px);
}
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-sidebar-backdrop {
	background: rgba(15, 23, 42, 0.40);
}

/* Aktywna sekcja w menu — czytelna w obu trybach. */
.phoenix-b2b-panel .pb2b-nav-item.is-active { font-weight: 600; }

/* ==========================================================================
 * 6. FOOTER PANELU — szybkie linki + wersja. Na dole contentu, nie sticky.
 * ========================================================================== */
.phoenix-b2b-panel .pb2b-app-footer {
	margin-top: var(--pb2b-section-gap);
	padding: 18px var(--pb2b-page-x) calc(20px + env(safe-area-inset-bottom, 0px));
	border-top: 1px solid var(--pb2b-border);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 10px 18px;
	color: var(--pb2b-muted);
}
.phoenix-b2b-panel .pb2b-app-footer-links {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 18px;
}
.phoenix-b2b-panel .pb2b-app-footer-link {
	color: var(--pb2b-text-soft);
	font-size: 13px;
	font-weight: 500;
	text-decoration: none;
	white-space: nowrap;
}
.phoenix-b2b-panel .pb2b-app-footer-link:hover { color: var(--pb2b-primary-2); }
.phoenix-b2b-panel .pb2b-app-footer-brand {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 12px;
	color: var(--pb2b-muted);
}
.phoenix-b2b-panel .pb2b-app-footer-brand strong { color: var(--pb2b-text-soft); font-weight: 700; }
.phoenix-b2b-panel .pb2b-app-footer-ver {
	font-size: 11px;
	padding: 2px 8px;
	border-radius: 999px;
	background: var(--pb2b-surface-soft);
	border: 1px solid var(--pb2b-border);
}
@media (max-width: 640px) {
	.phoenix-b2b-panel .pb2b-app-footer {
		flex-direction: column;
		align-items: flex-start;
		padding-top: 14px;
		gap: 10px;
	}
	.phoenix-b2b-panel .pb2b-app-footer-links { gap: 4px 16px; }
}

/* ==========================================================================
 * 7. PWA / APP-LIKE MODE
 * Prompt „Dodaj panel do ekranu głównego" + zachowanie standalone + safe-area.
 * Prompt jest opcjonalny, nieinwazyjny, z możliwością zamknięcia (logika w JS).
 * ========================================================================== */

/* Wysokość aplikacji: dvh tam gdzie wspierane (Safari URL bar) z fallbackiem. */
.phoenix-b2b-panel.pb2b-app { min-height: 100vh; }
@supports (min-height: 100dvh) {
	.phoenix-b2b-panel.pb2b-app { min-height: 100dvh; }
}

/* Prompt instalacji — karta na dole ekranu, tylko mobile, domyślnie ukryta
 * (JS dokłada .is-visible gdy ma sens: nie w trybie standalone, nie po zamknięciu). */
.phoenix-b2b-panel .pb2b-pwa-prompt {
	display: none;
	position: fixed;
	left: 12px;
	right: 12px;
	bottom: calc(12px + env(safe-area-inset-bottom, 0px));
	z-index: 60;
	padding: 14px 14px 14px 16px;
	border-radius: 16px;
	background: var(--pb2b-surface);
	border: 1px solid var(--pb2b-border-strong);
	box-shadow: 0 16px 40px rgba(0, 0, 0, 0.35);
	color: var(--pb2b-text);
	align-items: center;
	gap: 12px;
}
.phoenix-b2b-panel .pb2b-pwa-prompt.is-visible { display: flex; }
.phoenix-b2b-panel .pb2b-pwa-prompt-ico {
	flex: 0 0 40px;
	width: 40px;
	height: 40px;
	border-radius: 11px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--pb2b-accent-grad);
	color: #fff;
}
.phoenix-b2b-panel .pb2b-pwa-prompt-ico svg { width: 22px; height: 22px; }
.phoenix-b2b-panel .pb2b-pwa-prompt-body { flex: 1 1 auto; min-width: 0; }
.phoenix-b2b-panel .pb2b-pwa-prompt-title { font-size: 14px; font-weight: 700; }
.phoenix-b2b-panel .pb2b-pwa-prompt-text { font-size: 12.5px; color: var(--pb2b-muted); margin-top: 2px; }
.phoenix-b2b-panel .pb2b-pwa-prompt-actions { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; }
.phoenix-b2b-panel .pb2b-pwa-install {
	border: 0;
	border-radius: 10px;
	padding: 9px 14px;
	font: inherit;
	font-size: 13px;
	font-weight: 700;
	color: #fff;
	background: var(--pb2b-primary);
	cursor: pointer;
	white-space: nowrap;
}
.phoenix-b2b-panel .pb2b-pwa-install:hover { background: var(--pb2b-primary-2); }
.phoenix-b2b-panel .pb2b-pwa-dismiss {
	border: 1px solid var(--pb2b-border);
	background: transparent;
	color: var(--pb2b-muted);
	width: 34px;
	height: 34px;
	border-radius: 10px;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
}
.phoenix-b2b-panel .pb2b-pwa-dismiss:hover { color: var(--pb2b-text); background: var(--pb2b-surface-soft); }
.phoenix-b2b-panel .pb2b-pwa-dismiss svg { width: 16px; height: 16px; }
/* Wariant iOS: zamiast przycisku „Instaluj" pokazujemy krótką instrukcję
 * (Udostępnij → Dodaj do ekranu głównego). JS przełącza .is-ios. */
.phoenix-b2b-panel .pb2b-pwa-prompt .pb2b-pwa-install { display: inline-flex; }
.phoenix-b2b-panel .pb2b-pwa-prompt.is-ios .pb2b-pwa-install { display: none; }
.phoenix-b2b-panel .pb2b-pwa-ios-hint { display: none; }
.phoenix-b2b-panel .pb2b-pwa-prompt.is-ios .pb2b-pwa-ios-hint { display: inline; }

/* Tryb standalone (po dodaniu do ekranu głównego): drobne dopieszczenia. */
@media (display-mode: standalone) {
	.phoenix-b2b-panel .pb2b-pwa-prompt { display: none !important; }
}

/* ==========================================================================
 * 8. LIGHT / DARK — bezpieczniki kontrastu fundamentu
 * Komponenty fundamentu czytają tokeny, więc tryb jasny działa „za darmo".
 * Tu tylko twarde tinty, które na jasnym tle wymagają korekty.
 * ========================================================================== */
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-topbar-cart-badge { border-color: #FFFFFF; }
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-pwa-prompt {
	box-shadow: 0 16px 40px rgba(15, 23, 42, 0.18);
}
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-burger {
	background: #EEF1F8;
	border-color: #CBD5E1;
	color: #0F172A;
}
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-burger:hover { background: #E2E8F0; border-color: #94A3B8; }
/* Avatar/badge nie mogą zniknąć na bieli — gradient + biały tekst zostają. */
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-user-avatar { border-color: rgba(15, 23, 42, 0.10); }

/* Reduced motion — uszanuj preferencje (drawer/animacje contentu). */
@media (prefers-reduced-motion: reduce) {
	.phoenix-b2b-panel .pb2b-sidebar,
	.phoenix-b2b-panel .pb2b-pwa-prompt,
	.phoenix-b2b-panel .pb2b-burger { transition: none !important; }
}

/* ===================================================================
 * ŹRÓDŁO: client-panel-v287.css (tokeny zdjęte -> panel-v3-tokens.css)
 * =================================================================== */
/* =====================================================================
 * PhoenixB2B — v2.8.27 COMMERCE FLOW V2
 * ---------------------------------------------------------------------
 * Warstwa nakładana NA v286 (ładowana ostatnia → wygrywa w kaskadzie).
 * Zakres: WYŁĄCZNIE flow zakupowy w panelu klienta `.phoenix-b2b-panel`:
 *   - Sklep B2B  : siatka 2 kol. (mobile) / 3 / 4 (PC), bottom-sheet filtry,
 *                  pasek koszyka V2, kompaktowy kafelek.
 *   - Katalog B2B: flowbar jako pille + akcje (sticky na PC). Compact order
 *                  rows na mobile pochodzą już z v28 — tu tylko flowbar/hint.
 *   - Koszyk     : pozycje jako karty (mobile) / wiersze + split (PC),
 *                  jeden render `.pb2b-cart-line` (hooki JS z v26 bez zmian).
 * Nie rusza checkoutu, admina, importu, Sellasist, kategorii frontu ani
 * samodzielnej strony /sklep-b2b/ (scope panelu). Kolory z tokenów:
 *   panel    → --pb2b-*   (cartbar / flowbar / koszyk)
 *   wnętrze  → --s-*      (siatka / filtry sklepu, remapowane na --pb2b-* w panelu)
 * Wszędzie fallbacky w var(), żeby było bezpiecznie też bez tokenów.
 * ===================================================================== */

/* =====================================================================
 * 1. SKLEP — SIATKA PRODUKTÓW: 2 kol. mobile / 3 tablet / 4 PC.
 *    To kluczowa poprawka: bazowa reguła sklepu daje auto-fill minmax(220px),
 *    co na telefonie spada do 1 kolumny. Wymuszamy stałą liczbę kolumn.
 *    Wysoka specyficzność + !important → wygrywa nawet nad shop-v22 (gdyby
 *    został dociągnięty przez baner) i nad bazowym shop.css.
 * ===================================================================== */
.phoenix-b2b-panel .pb2b-shop .pb2b-shop-grid.pb2b-card-grid,
.phoenix-b2b-panel .pb2b-shop .pb2b-card-grid {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	gap: 13px !important;
	align-items: stretch;
}
@media (min-width: 768px) {
	.phoenix-b2b-panel .pb2b-shop .pb2b-shop-grid.pb2b-card-grid,
	.phoenix-b2b-panel .pb2b-shop .pb2b-card-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
		gap: 16px !important;
	}
}
@media (min-width: 1200px) {
	.phoenix-b2b-panel .pb2b-shop .pb2b-shop-grid.pb2b-card-grid,
	.phoenix-b2b-panel .pb2b-shop .pb2b-card-grid {
		grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
		gap: 18px !important;
	}
}

/* Wynik / licznik produktów — nie dotyka krawędzi (delikatny oddech). */
.phoenix-b2b-panel .pb2b-shop .pb2b-shop-resultbar {
	padding: 2px 2px 0;
}
.phoenix-b2b-panel .pb2b-shop .pb2b-shop-count {
	font-weight: 600;
}

/* =====================================================================
 * 2. SKLEP PC — wyśrodkowana treść, sensowny max-width (1500–1560px).
 *    W panelu kontener sklepu jest pełnej szerokości; tu go ograniczamy.
 * ===================================================================== */
@media (min-width: 1024px) {
	.phoenix-b2b-panel .pb2b-shop {
		max-width: 1560px;
		margin-inline: auto;
	}
}

/* =====================================================================
 * 3. SKLEP — FILTRY JAKO BOTTOM-SHEET NA MOBILE/TABLECIE (≤900px).
 *    Bazowo sklep wysuwa filtry z lewej (translateX). Zmieniamy na panel
 *    dolny (translateY) — wygodniejszy kciukiem. Przełącznik klasy
 *    `.pb2b-filters-open` na [data-pb2b-shop] obsługuje istniejący shop.js;
 *    overlay, przycisk zamknij i ESC działają bez zmian.
 * ===================================================================== */
@media (max-width: 900px) {
	.phoenix-b2b-panel .pb2b-shop .pb2b-shop-filters {
		top: auto;
		left: 0;
		right: 0;
		bottom: 0;
		width: auto;
		max-width: none;
		max-height: 85vh;
		margin: 0;
		border-radius: 18px 18px 0 0;
		box-shadow: 0 -12px 40px rgba(15, 23, 42, .28);
		transform: translateY(100%);
		transition: transform .28s cubic-bezier(.4, 0, .2, 1);
		padding-top: 14px;
	}
	.phoenix-b2b-panel .pb2b-shop.pb2b-filters-open .pb2b-shop-filters {
		transform: translateY(0);
	}
	/* Uchwyt „grabber" u góry arkusza. */
	.phoenix-b2b-panel .pb2b-shop .pb2b-shop-filters-head {
		position: relative;
		padding-top: 10px;
	}
	.phoenix-b2b-panel .pb2b-shop .pb2b-shop-filters-head::before {
		content: "";
		position: absolute;
		top: -4px;
		left: 50%;
		transform: translateX(-50%);
		width: 40px;
		height: 4px;
		border-radius: 999px;
		background: var(--s-border-strong, #cbd5e1);
	}
}

/* Tylko JEDEN przycisk „Filtry": chowamy ewentualny starszy (l.mn.) duplikat. */
.phoenix-b2b-panel .pb2b-shop .pb2b-shop-filters-toggle {
	display: none !important;
}

/* =====================================================================
 * 4. SKLEP — PASEK KOSZYKA V2 (cartbar nad listą produktów).
 *    Licznik „X poz. w koszyku" + wartość + akcje Koszyk / Zamówienie.
 *    Poza `.pb2b-shop` → tokeny panelu (--pb2b-*).
 * ===================================================================== */
.phoenix-b2b-panel .pb2b-shop-cartbar-v2 {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
	margin: 0 0 14px;
	padding: 12px 16px;
	background: var(--pb2b-surface, #fff);
	border: 1px solid var(--pb2b-border, #e2e8f0);
	border-radius: var(--pb2b-radius, 14px);
}
.phoenix-b2b-panel .pb2b-shop-cartbar-info {
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
}
.phoenix-b2b-panel .pb2b-shop-cartbar-ico {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 11px;
	background: var(--pb2b-bg-4, #eef1f8);
	color: var(--pb2b-primary-2, #6d28d9);
}
.phoenix-b2b-panel .pb2b-shop-cartbar-text {
	display: flex;
	flex-direction: column;
	gap: 1px;
	min-width: 0;
}
.phoenix-b2b-panel .pb2b-shop-cartbar-count {
	display: flex;
	align-items: baseline;
	gap: 5px;
}
.phoenix-b2b-panel .pb2b-shop-cartbar-count strong {
	font-size: 15px;
	font-weight: 700;
	color: var(--pb2b-text, #0f172a);
}
.phoenix-b2b-panel .pb2b-shop-cartbar-count-lbl {
	font-size: 12.5px;
	color: var(--pb2b-text-muted, #64748b);
}
.phoenix-b2b-panel .pb2b-shop-cartbar-total {
	font-size: 14px;
	font-weight: 600;
	color: var(--pb2b-text, #0f172a);
}
.phoenix-b2b-panel .pb2b-shop-cartbar-total:empty {
	display: none;
}
.phoenix-b2b-panel .pb2b-shop-cartbar-actions {
	display: flex;
	gap: 8px;
	flex: 0 0 auto;
}
/* Stan pusty: pasek zostaje (JS nie przełącza tu is-empty), tylko spokojniejszy. */
.phoenix-b2b-panel .pb2b-shop-cartbar-v2.is-empty .pb2b-shop-cartbar-total {
	display: none;
}
.phoenix-b2b-panel .pb2b-shop-cartbar-v2.is-empty .pb2b-shop-cartbar-ico {
	opacity: .65;
}
@media (max-width: 560px) {
	.phoenix-b2b-panel .pb2b-shop-cartbar-v2 {
		padding: 12px 14px;
	}
	.phoenix-b2b-panel .pb2b-shop-cartbar-actions {
		width: 100%;
	}
	.phoenix-b2b-panel .pb2b-shop-cartbar-btn {
		flex: 1 1 0;
		min-width: 0;
	}
}

/* =====================================================================
 * 5. KAFELEK PRODUKTU — KOMPAKT NA MOBILE (scope: tylko w sklepie).
 *    Równe wysokości i „akcje na dole" robi już v28; tutaj: kalkulator
 *    marży schowany na mobile (nie rozdyma karty), nazwa max 2 linie,
 *    drobniejszy SKU. Nie ruszamy kafelków dashboardu (scope .pb2b-shop).
 * ===================================================================== */
@media (max-width: 767px) {
	.phoenix-b2b-panel .pb2b-shop .pb2b-card .pb2b-card-calc {
		display: none !important;
	}
	.phoenix-b2b-panel .pb2b-shop .pb2b-card .pb2b-card-title {
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		overflow: hidden;
		min-height: 0;
	}
	.phoenix-b2b-panel .pb2b-shop .pb2b-card .pb2b-card-sku {
		font-size: 11.5px;
	}
}

/* =====================================================================
 * 6. KATALOG B2B — FLOWBAR V2 (pille + akcje), sticky na PC.
 *    Compact order rows (lista produktów) pochodzą z v28 — bez zmian.
 * ===================================================================== */
.phoenix-b2b-panel .pb2b-catalog-flowbar-v2 {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
	padding: 12px 16px;
	background: var(--pb2b-surface, #fff);
	border-bottom: 1px solid var(--pb2b-border, #e2e8f0);
}
.phoenix-b2b-panel .pb2b-catalog-flowbar-info {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
	min-width: 0;
}
.phoenix-b2b-panel .pb2b-catalog-flowbar-pill {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 5px 11px;
	border-radius: 999px;
	background: var(--pb2b-bg-4, #eef1f8);
	border: 1px solid var(--pb2b-border, #e2e8f0);
	font-size: 12.5px;
	white-space: nowrap;
	max-width: 100%;
}
.phoenix-b2b-panel .pb2b-catalog-flowbar-pill-lbl {
	color: var(--pb2b-text-muted, #64748b);
}
.phoenix-b2b-panel .pb2b-catalog-flowbar-pill strong {
	color: var(--pb2b-text, #0f172a);
	font-weight: 700;
}
.phoenix-b2b-panel .pb2b-catalog-flowbar-pill-val {
	color: var(--pb2b-primary-2, #6d28d9);
	font-weight: 600;
}
.phoenix-b2b-panel .pb2b-catalog-flowbar-pill-val:empty {
	display: none;
}
.phoenix-b2b-panel .pb2b-catalog-flowbar-actions {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	flex: 0 0 auto;
}
.phoenix-b2b-panel .pb2b-catalog-hint {
	margin: 0 0 12px;
	font-size: 13px;
	line-height: 1.45;
}
@media (min-width: 1024px) {
	.phoenix-b2b-panel .pb2b-catalog-flowbar-v2 {
		position: sticky;
		top: 0;
		z-index: 30;
		border-radius: var(--pb2b-radius, 14px) var(--pb2b-radius, 14px) 0 0;
	}
}
@media (max-width: 600px) {
	.phoenix-b2b-panel .pb2b-catalog-flowbar-v2 {
		padding: 10px 12px;
		gap: 8px;
	}
	.phoenix-b2b-panel .pb2b-catalog-flowbar-pill {
		flex: 1 1 auto;
		justify-content: center;
	}
	.phoenix-b2b-panel .pb2b-catalog-flowbar-actions {
		width: 100%;
	}
	.phoenix-b2b-panel .pb2b-catalog-flowbar-actions .pb2b-app-button {
		flex: 1 1 0;
		min-width: 0;
	}
}

/* =====================================================================
 * 7. KOSZYK V2 — jeden render `.pb2b-cart-line`.
 *    MOBILE: karta z grid-areas. PC (≥1024): wiersz „jak tabela" + split
 *    (lista | podsumowanie). Stepper/summary dziedziczą style z v26.
 *    UWAGA: stany .is-busy/.is-removing w v26 celowały w .pb2b-cart-row —
 *    nowy element to .pb2b-cart-line, więc definiujemy je tutaj.
 * ===================================================================== */

/* Layout: 1 kolumna do 1023px, split od 1024px. */
.phoenix-b2b-panel .pb2b-cart-layout {
	display: grid;
	grid-template-columns: 1fr;
	gap: 16px;
	align-items: start;
}
@media (min-width: 1024px) {
	.phoenix-b2b-panel .pb2b-cart-layout {
		grid-template-columns: minmax(0, 1fr) 320px;
		gap: 20px;
	}
	.phoenix-b2b-panel .pb2b-cart-summary-inner {
		position: sticky;
		top: 16px;
	}
}

/* Lista pozycji. */
.phoenix-b2b-panel .pb2b-cart-list {
	display: flex;
	flex-direction: column;
	gap: 12px;
	min-width: 0;
}

/* Nagłówek kolumn — tylko na PC. */
.phoenix-b2b-panel .pb2b-cart-line-head {
	display: none;
}

/* Pojedyncza pozycja — MOBILE (karta). */
.phoenix-b2b-panel .pb2b-cart-line {
	display: grid;
	grid-template-columns: 56px minmax(0, 1fr) 40px;
	grid-template-areas:
		"media main   remove"
		"price price  price"
		"qty   qty    value";
	gap: 10px 12px;
	max-width: 100%;
	padding: 16px;
	background: var(--pb2b-surface, #fff);
	border: 1px solid var(--pb2b-border, #e2e8f0);
	border-radius: var(--pb2b-radius, 14px);
}
.phoenix-b2b-panel .pb2b-cart-line.is-busy {
	opacity: .55;
	pointer-events: none;
}
.phoenix-b2b-panel .pb2b-cart-line.is-removing {
	opacity: 0;
	transform: translateX(8px);
	transition: opacity .18s ease, transform .18s ease;
}

.phoenix-b2b-panel .pb2b-cart-line-media {
	grid-area: media;
	align-self: start;
}
.phoenix-b2b-panel .pb2b-cart-line-thumb {
	display: block;
	width: 56px;
	height: 56px;
	border-radius: 10px;
	overflow: hidden;
	background: var(--pb2b-bg-4, #eef1f8);
}
.phoenix-b2b-panel .pb2b-cart-line-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.phoenix-b2b-panel .pb2b-cart-line-thumb-empty {
	border: 1px dashed var(--pb2b-border, #e2e8f0);
}

.phoenix-b2b-panel .pb2b-cart-line-main {
	grid-area: main;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 5px;
	align-self: start;
}
.phoenix-b2b-panel .pb2b-cart-line-title {
	font-weight: 600;
	color: var(--pb2b-text, #0f172a);
	text-decoration: none;
	line-height: 1.3;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.phoenix-b2b-panel .pb2b-cart-line-title:hover {
	color: var(--pb2b-primary-2, #6d28d9);
}
.phoenix-b2b-panel .pb2b-cart-line-sku {
	align-self: flex-start;
	max-width: 100%;
	padding: 3px 9px;
	border-radius: 999px;
	background: var(--pb2b-bg-4, #eef1f8);
	border: 1px solid var(--pb2b-border, #e2e8f0);
	color: var(--pb2b-text-muted, #64748b);
	font-size: 11.5px;
	line-height: 1.4;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.phoenix-b2b-panel .pb2b-cart-line-remove {
	grid-area: remove;
	align-self: start;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	padding: 0;
	border-radius: 10px;
	background: transparent;
	border: 1px solid var(--pb2b-border, #e2e8f0);
	color: var(--pb2b-text-muted, #64748b);
	cursor: pointer;
	transition: color .15s ease, border-color .15s ease, background .15s ease;
}
.phoenix-b2b-panel .pb2b-cart-line-remove:hover {
	color: var(--pb2b-danger, #dc2626);
	border-color: var(--pb2b-danger, #dc2626);
	background: rgba(220, 38, 38, .08);
}

.phoenix-b2b-panel .pb2b-cart-line-price {
	grid-area: price;
	display: flex;
	align-items: baseline;
	gap: 8px;
}
.phoenix-b2b-panel .pb2b-cart-line-price-val {
	font-weight: 600;
	color: var(--pb2b-text, #0f172a);
}
.phoenix-b2b-panel .pb2b-cart-line-qty {
	grid-area: qty;
	display: flex;
	align-items: center;
	gap: 8px;
	min-width: 0;
}
.phoenix-b2b-panel .pb2b-cart-line-value {
	grid-area: value;
	display: flex;
	align-items: baseline;
	justify-content: flex-end;
	gap: 8px;
	text-align: right;
}
.phoenix-b2b-panel .pb2b-cart-line-value strong {
	font-weight: 700;
	color: var(--pb2b-text, #0f172a);
}
.phoenix-b2b-panel .pb2b-cart-line-lbl {
	font-size: 11.5px;
	font-weight: 600;
	color: var(--pb2b-text-muted, #64748b);
	text-transform: uppercase;
	letter-spacing: .03em;
}

/* Pojedyncza pozycja — PC (≥1024): jeden wiersz „jak tabela". */
@media (min-width: 1024px) {
	.phoenix-b2b-panel .pb2b-cart-list {
		gap: 0;
		border: 1px solid var(--pb2b-border, #e2e8f0);
		border-radius: var(--pb2b-radius, 14px);
		overflow: hidden;
		background: var(--pb2b-surface, #fff);
	}
	.phoenix-b2b-panel .pb2b-cart-line-head {
		display: grid;
		grid-template-columns: 60px minmax(0, 1fr) 130px 132px 110px 44px;
		gap: 14px;
		align-items: center;
		padding: 12px 16px;
		background: var(--pb2b-bg-3, #f1f4fb);
		border-bottom: 1px solid var(--pb2b-border, #e2e8f0);
		font-size: 11.5px;
		font-weight: 700;
		letter-spacing: .03em;
		text-transform: uppercase;
		color: var(--pb2b-text-muted, #64748b);
	}
	.phoenix-b2b-panel .pb2b-cart-line-head-prod { grid-column: 1 / 3; }
	.phoenix-b2b-panel .pb2b-cart-line-head-price { grid-column: 3; text-align: right; }
	.phoenix-b2b-panel .pb2b-cart-line-head-qty { grid-column: 4; text-align: center; }
	.phoenix-b2b-panel .pb2b-cart-line-head-val { grid-column: 5; text-align: right; }
	.phoenix-b2b-panel .pb2b-cart-line-head-rm { grid-column: 6; }

	.phoenix-b2b-panel .pb2b-cart-line {
		grid-template-columns: 60px minmax(0, 1fr) 130px 132px 110px 44px;
		grid-template-areas: "media main price qty value remove";
		gap: 14px;
		align-items: center;
		padding: 14px 16px;
		border: 0;
		border-bottom: 1px solid var(--pb2b-border, #e2e8f0);
		border-radius: 0;
		background: transparent;
	}
	.phoenix-b2b-panel .pb2b-cart-list > .pb2b-cart-line:last-child {
		border-bottom: 0;
	}
	.phoenix-b2b-panel .pb2b-cart-line-media,
	.phoenix-b2b-panel .pb2b-cart-line-main,
	.phoenix-b2b-panel .pb2b-cart-line-remove {
		align-self: center;
	}
	.phoenix-b2b-panel .pb2b-cart-line-thumb {
		width: 60px;
		height: 60px;
	}
	.phoenix-b2b-panel .pb2b-cart-line-title {
		-webkit-line-clamp: 2;
	}
	.phoenix-b2b-panel .pb2b-cart-line-lbl {
		display: none;
	}
	.phoenix-b2b-panel .pb2b-cart-line-price {
		justify-content: flex-end;
		text-align: right;
	}
	.phoenix-b2b-panel .pb2b-cart-line-qty {
		justify-content: center;
	}
}

/* =====================================================================
 * 8. ZABEZPIECZENIA — brak poziomego scrolla, redukcja ruchu.
 * ===================================================================== */
.phoenix-b2b-panel .pb2b-cart-line,
.phoenix-b2b-panel .pb2b-cart-list,
.phoenix-b2b-panel .pb2b-shop-cartbar-v2,
.phoenix-b2b-panel .pb2b-catalog-flowbar-v2 {
	max-width: 100%;
}

@media (prefers-reduced-motion: reduce) {
	.phoenix-b2b-panel .pb2b-shop .pb2b-shop-filters,
	.phoenix-b2b-panel .pb2b-cart-line.is-removing,
	.phoenix-b2b-panel .pb2b-cart-line-remove {
		transition: none;
	}
}

/* =====================================================================
 * 9. SKLEP — „Szukaj" jako przycisk-ikona na bardzo wąskich ekranach (≤380px).
 *    Do 767px v28 robi go już kompaktowym obok pola; tu, na najmniejszych
 *    telefonach, zamieniamy etykietę na lupę, by oszczędzić szerokość pola.
 * ===================================================================== */
@media (max-width: 380px) {
	.phoenix-b2b-panel .pb2b-shop .pb2b-shop-search .pb2b-shop-btn {
		flex: 0 0 auto;
		width: 48px;
		min-width: 48px;
		padding: 0;
		font-size: 0;
		line-height: 0;
	}
	.phoenix-b2b-panel .pb2b-shop .pb2b-shop-search .pb2b-shop-btn::before {
		content: "";
		display: block;
		width: 20px;
		height: 20px;
		margin: 0 auto;
		background: currentColor;
		-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23000'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Ccircle%20cx='11'%20cy='11'%20r='7'/%3E%3Cpath%20d='m21%2021-4.3-4.3'/%3E%3C/svg%3E") center / contain no-repeat;
		mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23000'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Ccircle%20cx='11'%20cy='11'%20r='7'/%3E%3Cpath%20d='m21%2021-4.3-4.3'/%3E%3C/svg%3E") center / contain no-repeat;
	}
}

/* ===================================================================
 * ŹRÓDŁO: client-panel-v288.css (tokeny zdjęte -> panel-v3-tokens.css)
 * =================================================================== */
/* ==========================================================================
 * v2.8.28 CLIENT PANEL FINAL QA
 *
 * Warstwa nakładana NA v287 (ładowana ostatnia → wygrywa w kaskadzie).
 * Zakres: WYŁĄCZNIE panel klienta `.phoenix-b2b-panel`. Zero globalnego psucia
 * body / motywu / Elementora / strony /sklep-b2b/. Wszystko na tokenach
 * --pb2b-* (light/dark „za darmo", bo skala bazowa jest nadpisywana w theme.css).
 *
 * Czego NIE rusza (logika): checkout WooCommerce (płatności/dostawy/podatki),
 * koszyk (logika), katalog (logika), Sellasist, import, admin, kategorie
 * frontu, login/register. To warstwa wyłącznie wizualna + drobne UX.
 *
 * Spis:
 *   0.  TOKENY FINAL QA (semantyczne aliasy: background/card/card-soft/border/
 *       text/muted/primary/success/warning/danger — jeden zestaw dla sekcji)
 *   1.  WSPÓLNE KOMPONENTY (button-danger, chip, subtitle)
 *   2.  CHECKOUT / ORDER V2 (nagłówek, kroki, raport problemów, woo wrap,
 *       notice'y, ekran sukcesu)
 *   3.  HISTORIA ZAMÓWIEŃ (karty mobile / tabela PC, akcje)
 *   4.  POWIADOMIENIA (chipsy, lista, neutralne pille typów)
 *   5.  ZAPISANE KOSZYKI (formularz zapisu)
 *   6.  DANE FIRMY (subtitle, company-note)
 *   7.  SHORTCODE'Y W KARTACH (ulubione / cennik / import / listy) — neutralizacja
 *   8.  LIGHT/DARK — bezpieczniki kontrastu (nigdy czarne w light, nigdy
 *       przypadkowy niebieski button), brak poziomego scrolla
 * ========================================================================== */

/* v2.8.28 CLIENT PANEL FINAL QA */

/* ==========================================================================
 * 0. TOKENY FINAL QA — jeden, spójny zestaw aliasów semantycznych.
 *    Mapujemy na istniejącą skalę bazową (--pb2b-bg-* / --pb2b-text-*), więc
 *    automatycznie podążają za motywem. Dorzucamy success/warning/danger jako
 *    semantyczne aliasy, których brakowało w jednym miejscu.
 * ========================================================================== */
.phoenix-b2b-panel {
	/* success/warning/danger/primary już istnieją w bazie; ustalamy też tekst
	 * „na tincie" osobno dla light (patrz sekcja 8). */
}

/* ==========================================================================
 * 1. WSPÓLNE KOMPONENTY
 * ========================================================================== */

/* Brakujący wariant: button „danger" (usuwanie). Spójny z app-button. */
.phoenix-b2b-panel .pb2b-app-button-danger {
	background: rgba(239, 68, 68, 0.12);
	border: 1px solid rgba(239, 68, 68, 0.34);
	color: var(--pb2b-danger-ink);
}
.phoenix-b2b-panel .pb2b-app-button-danger:hover {
	background: var(--pb2b-danger, #EF4444);
	border-color: var(--pb2b-danger, #EF4444);
	color: #fff;
}

/* Ikony w buttonach (np. „Wróć do koszyka", manager) — równe wyrównanie. */
.phoenix-b2b-panel .pb2b-app-button svg { flex: 0 0 auto; }
.phoenix-b2b-panel .pb2b-app-button { display: inline-flex; align-items: center; gap: 8px; }

/* Chipsy (filtry) — premium, spójne; aktywny = klasa zarządzana przez JS
 * (pb2b-chip-primary). Definiujemy też stan hover/aktywny czytelnie. */
.phoenix-b2b-panel .pb2b-chip {
	cursor: pointer;
	border: 1px solid var(--pb2b-border);
	background: var(--pb2b-card-soft);
	color: var(--pb2b-text-soft);
	border-radius: 999px;
	padding: 6px 14px;
	font-size: 12.5px;
	font-weight: 600;
	line-height: 1.4;
	transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.phoenix-b2b-panel .pb2b-chip:hover {
	color: var(--pb2b-text);
	border-color: var(--pb2b-border-strong);
}
.phoenix-b2b-panel .pb2b-chip.pb2b-chip-primary,
.phoenix-b2b-panel .pb2b-chip.is-active {
	background: var(--pb2b-primary, #7C3AED);
	border-color: var(--pb2b-primary, #7C3AED);
	color: #fff;
}

/* Brakujący wariant odznaki: primary (np. licznik nieprzeczytanych). */
.phoenix-b2b-panel .pb2b-app-badge-primary {
	background: rgba(124, 58, 237, 0.16);
	color: var(--pb2b-primary-2, #A855F7);
	border-color: rgba(124, 58, 237, 0.34);
}

/* Podtytuł sekcji (np. „Adres rozliczeniowy" w Danych firmy). */
.phoenix-b2b-panel .pb2b-app-subtitle {
	margin: 0 0 8px;
	font-size: 13px;
	font-weight: 700;
	color: var(--pb2b-text-muted);
	text-transform: uppercase;
	letter-spacing: .03em;
}
.phoenix-b2b-panel .pb2b-app-subtitle-spaced { margin-top: 18px; }

/* ==========================================================================
 * 2. CHECKOUT / ORDER V2
 * ========================================================================== */

/* --- 2a. Nagłówek: tytuł + suma + „wróć do koszyka" --- */
.phoenix-b2b-panel .pb2b-checkout-head { align-items: center; }
.phoenix-b2b-panel .pb2b-checkout-head-main {
	display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap; min-width: 0;
}
.phoenix-b2b-panel .pb2b-checkout-head-sum {
	display: inline-flex; align-items: baseline; gap: 6px; font-size: 13.5px;
}
.phoenix-b2b-panel .pb2b-checkout-head-sum strong { color: var(--pb2b-text); font-size: 15px; }
.phoenix-b2b-panel .pb2b-checkout-back { margin-left: auto; }

/* --- 2b. Pasek kroków (wizualny przewodnik) --- */
.phoenix-b2b-panel .pb2b-checkout-steps {
	list-style: none; margin: 0 0 18px; padding: 0;
	display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px;
}
.phoenix-b2b-panel .pb2b-checkout-step {
	display: flex; align-items: center; gap: 8px; min-width: 0;
	padding: 10px 12px;
	background: var(--pb2b-card-soft);
	border: 1px solid var(--pb2b-border);
	border-radius: var(--pb2b-radius-sm, 10px);
	color: var(--pb2b-text-muted);
	font-size: 12.5px; font-weight: 600;
}
.phoenix-b2b-panel .pb2b-checkout-step-no {
	flex: 0 0 auto; width: 22px; height: 22px;
	display: inline-flex; align-items: center; justify-content: center;
	border-radius: 999px; font-size: 12px; font-weight: 800;
	background: var(--pb2b-bg-4); color: var(--pb2b-text-soft);
}
.phoenix-b2b-panel .pb2b-checkout-step-txt { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.phoenix-b2b-panel .pb2b-checkout-step.is-active {
	background: rgba(124, 58, 237, 0.12);
	border-color: rgba(124, 58, 237, 0.34);
	color: var(--pb2b-text);
}
.phoenix-b2b-panel .pb2b-checkout-step.is-active .pb2b-checkout-step-no {
	background: var(--pb2b-primary, #7C3AED); color: #fff;
}
.phoenix-b2b-panel .pb2b-checkout-step.is-done .pb2b-checkout-step-no {
	background: rgba(34, 197, 94, 0.18); color: var(--pb2b-success-ink);
}
@media (max-width: 767px) {
	.phoenix-b2b-panel .pb2b-checkout-steps { grid-template-columns: repeat(2, 1fr); }
}

/* --- 2c. Raport problemów koszyka --- */
.phoenix-b2b-panel .pb2b-checkout-issues {
	margin: 0 0 18px; padding: 16px;
	background: rgba(245, 158, 11, 0.10);
	border: 1px solid rgba(245, 158, 11, 0.34);
	border-radius: var(--pb2b-radius, 14px);
}
.phoenix-b2b-panel .pb2b-checkout-issues-head { display: flex; gap: 12px; align-items: flex-start; }
.phoenix-b2b-panel .pb2b-checkout-issues-ico {
	flex: 0 0 auto; color: var(--pb2b-warning-ink);
}
.phoenix-b2b-panel .pb2b-checkout-issues-head h4 { margin: 0 0 2px; font-size: 15px; color: var(--pb2b-text); }
.phoenix-b2b-panel .pb2b-checkout-issues-head p { margin: 0; font-size: 13px; }
.phoenix-b2b-panel .pb2b-checkout-issues-list {
	list-style: none; margin: 14px 0 0; padding: 0;
	display: flex; flex-direction: column; gap: 8px;
}
.phoenix-b2b-panel .pb2b-checkout-issue {
	display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap;
	padding: 10px 12px;
	background: var(--pb2b-card);
	border: 1px solid var(--pb2b-border);
	border-left: 3px solid var(--pb2b-warning, #F59E0B);
	border-radius: var(--pb2b-radius-sm, 10px);
}
.phoenix-b2b-panel .pb2b-checkout-issue.pb2b-issue-remove { border-left-color: var(--pb2b-danger, #EF4444); }
.phoenix-b2b-panel .pb2b-checkout-issue-name { font-weight: 700; color: var(--pb2b-text); }
.phoenix-b2b-panel .pb2b-checkout-issue-msg { font-size: 13px; color: var(--pb2b-text-muted); }
.phoenix-b2b-panel .pb2b-checkout-issues-actions {
	display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px;
}

/* --- 2d. WooCommerce checkout — domyka layout z v26 (split) + drobny polish.
 *      Nie zmieniamy logiki; tylko spójny wygląd kart i nagłówków. --- */
.phoenix-b2b-panel .pb2b-checkout-app .woocommerce-billing-fields > h3,
.phoenix-b2b-panel .pb2b-checkout-app .woocommerce-shipping-fields > h3,
.phoenix-b2b-panel .pb2b-checkout-app #order_review_heading {
	font-size: 16px; font-weight: 800; margin: 0 0 12px; color: var(--pb2b-text);
}
/* Podsumowanie „przyklejone" na PC (sticky), aby było widoczne przy długim formularzu. */
@media (min-width: 992px) {
	.phoenix-b2b-panel .pb2b-checkout-app #order_review { position: sticky; top: calc(var(--pb2b-app-header-h, 64px) + 12px); }
}

/* --- 2e. Notice'y WooCommerce w panelu (błędy/sukces) — estetyczne, nie „raw" --- */
.phoenix-b2b-panel .pb2b-checkout-woo .woocommerce-NoticeGroup,
.phoenix-b2b-panel .pb2b-checkout-woo .woocommerce-error,
.phoenix-b2b-panel .pb2b-checkout-woo .woocommerce-message,
.phoenix-b2b-panel .pb2b-checkout-woo .woocommerce-info {
	list-style: none; margin: 0 0 16px; padding: 14px 16px;
	border-radius: var(--pb2b-radius-sm, 10px); font-size: 13.5px;
	border: 1px solid var(--pb2b-border);
}
.phoenix-b2b-panel .pb2b-checkout-woo ul.woocommerce-error {
	background: rgba(239, 68, 68, 0.10); border-color: rgba(239, 68, 68, 0.34); color: var(--pb2b-danger-ink);
}
.phoenix-b2b-panel .pb2b-checkout-woo ul.woocommerce-error li { margin: 0; }
.phoenix-b2b-panel .pb2b-checkout-woo .woocommerce-message {
	background: rgba(34, 197, 94, 0.10); border-color: rgba(34, 197, 94, 0.34); color: var(--pb2b-success-ink);
}
.phoenix-b2b-panel .pb2b-checkout-woo .woocommerce-info {
	background: rgba(56, 189, 248, 0.10); border-color: rgba(56, 189, 248, 0.34); color: var(--pb2b-text);
}

/* --- 2f. Ekran sukcesu --- */
.phoenix-b2b-panel .pb2b-checkout-success .pb2b-success-hero { text-align: center; padding: 8px 0 4px; }
.phoenix-b2b-panel .pb2b-success-mark {
	display: inline-flex; align-items: center; justify-content: center;
	width: 64px; height: 64px; border-radius: 999px; margin-bottom: 12px;
	background: rgba(34, 197, 94, 0.16); color: var(--pb2b-success-ink);
	border: 1px solid rgba(34, 197, 94, 0.34);
}
.phoenix-b2b-panel .pb2b-success-hero h3 { margin: 0 0 6px; font-size: 19px; color: var(--pb2b-text); }
.phoenix-b2b-panel .pb2b-success-hero p { margin: 0 auto; max-width: 460px; font-size: 13.5px; }
.phoenix-b2b-panel .pb2b-success-summary {
	margin: 18px auto 0; max-width: 460px;
	background: var(--pb2b-card-soft); border: 1px solid var(--pb2b-border);
	border-radius: var(--pb2b-radius, 14px); padding: 6px 16px;
}
.phoenix-b2b-panel .pb2b-success-row {
	display: flex; align-items: center; justify-content: space-between; gap: 14px;
	padding: 10px 0; border-bottom: 1px solid var(--pb2b-border);
}
.phoenix-b2b-panel .pb2b-success-row:last-child { border-bottom: 0; }
.phoenix-b2b-panel .pb2b-success-label { color: var(--pb2b-text-muted); font-size: 13px; }
.phoenix-b2b-panel .pb2b-success-value { color: var(--pb2b-text); font-weight: 700; text-align: right; }
.phoenix-b2b-panel .pb2b-success-row-total .pb2b-success-value { font-size: 17px; }
.phoenix-b2b-panel .pb2b-success-actions {
	display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; margin: 18px 0 0;
}
.phoenix-b2b-panel .pb2b-checkout-success .pb2b-checkout-fallback { text-align: center; }

/* ==========================================================================
 * 3. HISTORIA ZAMÓWIEŃ — karty (mobile, konwersja v26) / tabela (PC).
 *    Akcje w komórce „pb2b-col-actions" — wyrównanie i zawijanie buttonów.
 * ========================================================================== */
.phoenix-b2b-panel .pb2b-app-table td.pb2b-col-actions { white-space: normal; }
@media (max-width: 767px) {
	/* W trybie kart: komórka akcji na całą szerokość, button wyrazisty. */
	.phoenix-b2b-panel .pb2b-app-table:not(.pb2b-cart-table) td.pb2b-col-actions { justify-content: flex-start; }
	.phoenix-b2b-panel .pb2b-app-table:not(.pb2b-cart-table) td.pb2b-col-actions::before { content: ""; }
	.phoenix-b2b-panel .pb2b-app-table:not(.pb2b-cart-table) td.pb2b-col-actions .pb2b-app-button { width: 100%; justify-content: center; }
	.phoenix-b2b-panel .pb2b-orders-table td.pb2b-col-actions .pb2b-app-button,
	.phoenix-b2b-panel .pb2b-app-table td.pb2b-col-actions .pb2b-app-button + .pb2b-app-button { margin-top: 8px; }
}

/* ==========================================================================
 * 4. POWIADOMIENIA — chipsy + lista; pille typów neutralne (bez losowych kolorów)
 * ========================================================================== */
.phoenix-b2b-panel .pb2b-notif-filters {
	display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px;
}
.phoenix-b2b-panel .pb2b-notif-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.phoenix-b2b-panel .pb2b-notif {
	display: flex; gap: 14px; align-items: flex-start; justify-content: space-between;
	padding: 14px 16px;
	background: var(--pb2b-card); border: 1px solid var(--pb2b-border);
	border-radius: var(--pb2b-radius, 14px);
}
.phoenix-b2b-panel .pb2b-notif.is-unread { border-left: 3px solid var(--pb2b-primary, #7C3AED); }
.phoenix-b2b-panel .pb2b-notif-main { min-width: 0; flex: 1; }
.phoenix-b2b-panel .pb2b-notif-top { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 4px; }
/* Pille typu: jednolity, neutralny chip z tokenów (nie losowe kolory). */
.phoenix-b2b-panel .pb2b-notif-type {
	display: inline-flex; align-items: center; padding: 2px 9px; border-radius: 999px;
	font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em;
	background: var(--pb2b-card-soft); color: var(--pb2b-text-soft); border: 1px solid var(--pb2b-border);
}
.phoenix-b2b-panel .pb2b-notif-date { font-size: 11.5px; color: var(--pb2b-text-muted); }
.phoenix-b2b-panel .pb2b-notif-title { font-weight: 700; color: var(--pb2b-text); }
.phoenix-b2b-panel .pb2b-notif-body { font-size: 13.5px; color: var(--pb2b-text-muted); margin-top: 2px; }
.phoenix-b2b-panel .pb2b-notif-body p { margin: 0 0 6px; }
.phoenix-b2b-panel .pb2b-notif-actions { display: flex; flex-direction: column; gap: 8px; align-items: flex-end; flex: 0 0 auto; }
.phoenix-b2b-panel .pb2b-link-danger { color: var(--pb2b-danger-ink); }
@media (max-width: 767px) {
	.phoenix-b2b-panel .pb2b-notif { flex-direction: column; gap: 10px; }
	.phoenix-b2b-panel .pb2b-notif-actions { flex-direction: row; align-items: center; gap: 16px; }
}

/* ==========================================================================
 * 5. ZAPISANE KOSZYKI — formularz zapisu spójny z app-input/app-button
 * ========================================================================== */
.phoenix-b2b-panel .pb2b-savecart-form {
	display: flex; gap: 12px; align-items: flex-end; flex-wrap: wrap;
}
.phoenix-b2b-panel .pb2b-savecart-field { flex: 1 1 240px; min-width: 0; }
.phoenix-b2b-panel .pb2b-savecart-field label {
	display: block; font-size: 12.5px; font-weight: 600; color: var(--pb2b-text-muted); margin-bottom: 6px;
}
.phoenix-b2b-panel .pb2b-savecart-result { flex: 1 0 100%; font-size: 13px; }
.phoenix-b2b-panel .pb2b-savecart-result.phoenix-b2b-success { color: var(--pb2b-success-ink); }
.phoenix-b2b-panel .pb2b-savecart-result.phoenix-b2b-error { color: var(--pb2b-danger-ink); }

/* ==========================================================================
 * 6. DANE FIRMY — company-note (zamiast inline style)
 * ========================================================================== */
.phoenix-b2b-panel .pb2b-company-note { display: flex; gap: 14px; align-items: flex-start; }
.phoenix-b2b-panel .pb2b-company-note-ico { margin: 0; color: var(--pb2b-primary-2, #A855F7); }
.phoenix-b2b-panel .pb2b-company-note-body { flex: 1; min-width: 0; }
.phoenix-b2b-panel .pb2b-company-note-body strong { color: var(--pb2b-text); }

/* ==========================================================================
 * 7. SHORTCODE'Y W KARTACH (ulubione / cennik / import / listy zakupowe)
 *    Output shortcode'ów bywa „obcy". Neutralizujemy najczęstsze przypadki:
 *    tabele → karty na mobile, brak surowych niebieskich buttonów, brak scrolla.
 *    Zakres ściśle wnętrze .pb2b-app-card-body w panelu.
 * ========================================================================== */
@media (max-width: 767px) {
	.phoenix-b2b-panel .pb2b-app-card-body table:not(.pb2b-cart-table):not(.woocommerce-checkout-review-order-table) {
		display: block; width: 100%; border: 0;
	}
	.phoenix-b2b-panel .pb2b-app-card-body table:not(.pb2b-cart-table):not(.woocommerce-checkout-review-order-table) thead { display: none; }
	.phoenix-b2b-panel .pb2b-app-card-body table:not(.pb2b-cart-table):not(.woocommerce-checkout-review-order-table) tbody,
	.phoenix-b2b-panel .pb2b-app-card-body table:not(.pb2b-cart-table):not(.woocommerce-checkout-review-order-table) tr,
	.phoenix-b2b-panel .pb2b-app-card-body table:not(.pb2b-cart-table):not(.woocommerce-checkout-review-order-table) td { display: block; width: 100%; }
	.phoenix-b2b-panel .pb2b-app-card-body table:not(.pb2b-cart-table):not(.woocommerce-checkout-review-order-table) tr {
		background: var(--pb2b-card); border: 1px solid var(--pb2b-border);
		border-radius: var(--pb2b-radius-sm, 10px); padding: 12px 14px; margin-bottom: 12px;
	}
}
/* Brak poziomego scrolla wewnątrz shortcode'owych kart. */
.phoenix-b2b-panel .pb2b-app-card-body { max-width: 100%; }
.phoenix-b2b-panel .pb2b-app-card-body > * { max-width: 100%; }

/* ==========================================================================
 * 8. LIGHT / DARK — bezpieczniki kontrastu (CZĘŚĆ 4 + 6 briefu)
 *    - nigdy czarne tło sekcji w light,
 *    - nigdy przypadkowy niebieski button,
 *    - czytelny tekst „na tincie".
 * ========================================================================== */

/* Wszystkie karty sekcji czytają tokeny (light = jasne tło, dark = ciemne). */
.phoenix-b2b-panel .pb2b-card,
.phoenix-b2b-panel .pb2b-app-card { background: var(--pb2b-card); border-color: var(--pb2b-border); }

/* Light: ciemniejszy „ink" na tintach, aby success/warning/danger były czytelne. */
.phoenix-b2b-panel[data-pb2b-theme="light"] {
}
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-status-completed,
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-status-paid     { color: #15803D; }
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-status-processing,
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-status-on-hold  { color: #B45309; }
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-status-cancelled,
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-status-failed,
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-status-refunded { color: #B91C1C; }

/* Light: notice'y i panele problemów — tekst wystarczająco ciemny. */
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-checkout-issue-name,
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-checkout-issues-head h4,
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-success-value { color: var(--pb2b-text); }

/* Light: pola checkoutu (białe pole, ciemny tekst) — już ustawione w v26,
 * dorzucamy placeholder i select option dla pewności. */
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-checkout-woo .input-text::placeholder,
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-checkout-woo textarea::placeholder { color: #64748B; }
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-checkout-woo select option { background: #fff; color: #0F172A; }

/* Twardo: nigdy poziomego scrolla w całym panelu (FINAL). */
.phoenix-b2b-panel,
.phoenix-b2b-panel .pb2b-content,
.phoenix-b2b-panel .pb2b-app-content { max-width: 100%; overflow-x: clip; }

/* Sekcje, które delegują do shortcode'ów, nie mogą wprowadzać czarnych den. */
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-app-card-body { color: var(--pb2b-text); }

/* ===================================================================
 * ŹRÓDŁO: client-panel-v289.css (tokeny zdjęte -> panel-v3-tokens.css)
 * =================================================================== */
/* ==========================================================================
 * v2.8.29 CLIENT PANEL V2 FINAL HOTFIX
 *
 * Warstwa FINALNA — ładowana PO v288 (czyli ostatnia w kaskadzie panelu) i
 * dlatego rozstrzyga ewentualne konflikty wcześniejszych warstw. Zakres ściśle
 * `.phoenix-b2b-panel` — zero globalnego psucia body / motywu / Elementora /
 * strony /sklep-b2b/. Wszystko na tokenach --pb2b-* (light/dark „za darmo").
 *
 * Czego NIE rusza (logika): checkout WooCommerce (płatności/dostawy/podatki),
 * koszyk (logika), katalog (logika), Sellasist, import, admin, kategorie
 * frontu, login/register, reguły cenowe. To warstwa porządkująco-wizualna +
 * style nowego, bogatego raportu problemów koszyka w sekcji „Zamówienie".
 *
 * Spis:
 *   0. TOKENY — brakujące aliasy z briefu (card-radius / card-padding) + scal.
 *   1. GLOBALNY APP SPACING — gutter, max-width PC, brak edge-to-edge/scrolla.
 *   2. HEADER V2 FINAL — premium burger, kompaktowy koszyk, profil zamiast B2B.
 *   3. SKLEP B2B — oddech licznika/toolbara (dopięcie v287/v28).
 *   4. KATALOG B2B — flowbar/pille + compact rows (dopięcie).
 *   5. KOSZYK — „Zapytaj o cenę" + SKU chip ellipsis (dopięcie v287).
 *   6. ZAMÓWIENIE / CHECKOUT — bogaty raport problemów (NOWE), woo-block, admin.
 *   7. PRICE LOGIC — spójny wygląd „Zapytaj o cenę" / „Dostępne po zalogowaniu".
 *   8. LIGHT / DARK — bezpieczniki kontrastu nowych elementów.
 *   9. FOOTER / APP FEEL — lekki footer, brak wielkiej pustki na dole.
 * ========================================================================== */

/* v2.8.29 CLIENT PANEL V2 FINAL HOTFIX */

/* ==========================================================================
 * 0. TOKENY — uzupełnij aliasy nazwane w briefie, mapując na istniejące.
 *    (W kodzie używamy obu nazw; teraz są spójne i działają w light/dark.)
 * ========================================================================== */
.phoenix-b2b-panel {
	/* Maks. szerokość kolumny treści na bardzo szerokich ekranach (brief: 1500–1560). */
}

/* ==========================================================================
 * 1. GLOBALNY APP SPACING
 * ========================================================================== */

/* (a) Twardo: nigdy poziomego scrolla w całym panelu. */
.phoenix-b2b-panel,
.phoenix-b2b-panel .pb2b-main,
.phoenix-b2b-panel .pb2b-content,
.phoenix-b2b-panel .pb2b-app-content {
	max-width: 100%;
	overflow-x: clip;
}

/* (b) Każdy „flush" pasek (cartbar/flowbar) i karta sekcji dostają wspólny
 *     gutter — nic nie dotyka ściany (dopięcie do v286, gdyby coś uciekło). */
.phoenix-b2b-panel .pb2b-app-content > .pb2b-app-card,
.phoenix-b2b-panel .pb2b-section,
.phoenix-b2b-panel .pb2b-checkout-card,
.phoenix-b2b-panel .pb2b-cart-card {
	max-width: 100%;
}

/* (c) PC: ograniczamy szerokość kolumny treści i centrujemy, żeby na szerokich
 *     monitorach nie było „oceanu pustki". Sidebar/topbar zostają jak są. */
@media (min-width: 1500px) {
	.phoenix-b2b-panel .pb2b-app-content {
		max-width: var(--pb2b-content-max);
		margin-inline: auto;
	}
}

/* (d) Mobile: minimalny, spójny gutter 16px dla treści (dopięcie). */
@media (max-width: 1199.98px) {
	.phoenix-b2b-panel .pb2b-app-content,
	.phoenix-b2b-panel .pb2b-content {
		padding-left: var(--pb2b-page-x, 16px);
		padding-right: var(--pb2b-page-x, 16px);
	}
}

/* ==========================================================================
 * 2. HEADER V2 FINAL — mniej przeładowany, bardziej premium.
 * ========================================================================== */

/* (a) Burger: dopięcie do 42px, r14, subtelne tło/border, czytelna ikona. */
@media (max-width: 1199.98px) {
	.phoenix-b2b-panel .pb2b-burger {
		width: 42px;
		height: 42px;
		border-radius: 14px;
		background: var(--pb2b-surface-soft);
		border: 1px solid var(--pb2b-border);
		color: var(--pb2b-text);
		box-shadow: none;
	}
	.phoenix-b2b-panel .pb2b-burger svg {
		width: 19px;
		height: 19px;
		stroke: currentColor;
	}
}

/* (b) Profil: avatar PREMIUM (mniej krzykliwy niż mocny fiolet) — subtelne
 *     tinto + inicjał w kolorze marki. To zastępuje wrażenie „wielkiego B2B". */
.phoenix-b2b-panel .pb2b-user-avatar {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(135deg, rgba(124, 58, 237, 0.16), rgba(168, 85, 247, 0.16));
	color: var(--pb2b-primary-2, #A855F7);
	border: 1px solid var(--pb2b-border-strong);
	box-shadow: none;
	font-weight: 800;
	letter-spacing: .01em;
}

/* (c) „B2B"/grupa nigdy nie dominuje headera (dopięcie do v286). */
.phoenix-b2b-panel .pb2b-topbar-right .pb2b-chip-primary {
	background: var(--pb2b-surface-soft);
	border: 1px solid var(--pb2b-border);
	color: var(--pb2b-text-soft);
	font-weight: 600;
}

/* (d) Koszyk w headerze (mobile): czytelny badge z liczbą; ikona kontrastowa. */
@media (max-width: 1199.98px) {
	.phoenix-b2b-panel .pb2b-topbar-cart {
		background: var(--pb2b-surface-soft);
		border: 1px solid var(--pb2b-border);
		color: var(--pb2b-text);
	}
	.phoenix-b2b-panel .pb2b-topbar-cart-ico svg { stroke: currentColor; }
	.phoenix-b2b-panel .pb2b-topbar-cart-badge { display: inline-flex; }
}

/* (e) Light/dark: żadnych białych ikon na białym tle w topbarze. */
.phoenix-b2b-panel .pb2b-topbar-bell,
.phoenix-b2b-panel .pb2b-topbar-cart {
	color: var(--pb2b-text);
}
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-burger svg,
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-topbar-bell svg,
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-topbar-cart-ico svg {
	color: var(--pb2b-text);
	stroke: currentColor;
}

/* ==========================================================================
 * 3. SKLEP B2B — oddech licznika i toolbara (dopięcie do v287/v28).
 * ========================================================================== */

/* Licznik „X produktów" nigdy nie przykleja się do lewej ściany. */
.phoenix-b2b-panel .pb2b-shop .pb2b-shop-resultbar {
	padding: 4px 2px 2px;
}
.phoenix-b2b-panel .pb2b-shop .pb2b-shop-count {
	display: inline-block;
	padding-left: 2px;
	color: var(--pb2b-text-soft);
	font-weight: 600;
}

/* Toolbar (search + sort + filtry) — równy oddech między elementami. */
.phoenix-b2b-panel .pb2b-shop .pb2b-shop-toolbar {
	gap: 10px;
}
@media (max-width: 767px) {
	.phoenix-b2b-panel .pb2b-shop .pb2b-shop-toolbar { gap: 10px; }
	.phoenix-b2b-panel .pb2b-shop .pb2b-shop-search { gap: 8px; }
}

/* Tylko jeden przycisk „Filtry" (twarde wyłączenie ewentualnego duplikatu). */
.phoenix-b2b-panel .pb2b-shop .pb2b-shop-filters-toggle { display: none !important; }

/* ==========================================================================
 * 4. KATALOG B2B — flowbar pille + compact rows (dopięcie).
 * ========================================================================== */

/* Nazwa produktu w katalogu nie jest podkreślonym linkiem (dopięcie v26). */
.phoenix-b2b-panel .phoenix-b2b-qo-row a,
.phoenix-b2b-panel .pb2b-qo-col-name a {
	text-decoration: none;
}

/* SKU w katalogu jako chip z ellipsis (dopięcie v28, gdy markup to <span>). */
.phoenix-b2b-panel .pb2b-qo-col-sku span,
.phoenix-b2b-panel .pb2b-qo-col-sku code {
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* Pille flowbara zawijają się ładnie na małych ekranach (dopięcie). */
@media (max-width: 600px) {
	.phoenix-b2b-panel .pb2b-catalog-flowbar-pill { min-width: 0; }
}

/* ==========================================================================
 * 5. KOSZYK — „Zapytaj o cenę" + SKU chip ellipsis (dopięcie v287).
 * ========================================================================== */

/* Brak ceny → etykieta zamiast 0,00 zł (wartość + cena jednostkowa). */
.phoenix-b2b-panel .pb2b-cart-line-quote {
	color: var(--pb2b-primary-2, #A855F7) !important;
	font-weight: 700;
	font-size: 13px;
}

/* SKU chip w koszyku — wartość ucinana wielokropkiem (nie rozbija layoutu). */
.phoenix-b2b-panel .pb2b-cart-line-sku {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	max-width: 100%;
	padding: 3px 9px;
	border-radius: 999px;
	background: var(--pb2b-bg-4, #eef1f8);
	border: 1px solid var(--pb2b-border);
	color: var(--pb2b-text-muted);
	font-size: 11.5px;
	line-height: 1.4;
	white-space: nowrap;
	overflow: hidden;
}
.phoenix-b2b-panel .pb2b-cart-line-sku-val {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* Przycisk usuń — zawsze wyraźny i dotykalny (dopięcie v287). */
.phoenix-b2b-panel .pb2b-cart-line-remove {
	min-width: 38px;
	min-height: 38px;
}
.phoenix-b2b-panel .pb2b-cart-line-remove svg { width: 18px; height: 18px; }

/* ==========================================================================
 * 6. ZAMÓWIENIE / CHECKOUT — bogaty raport problemów (NOWE w 2.8.29).
 *    Karta problemu: miniatura + nazwa + tag(kind) + SKU + komunikat + akcje.
 *    Cztery rodzaje: blocking (danger) / quote_required (primary) /
 *    fixable_qty (warning) / warning (slate).
 * ========================================================================== */

/* Kontener problemów — neutralny „attention". Wariant soft = tylko ostrzeżenia. */
.phoenix-b2b-panel .pb2b-checkout-issues.pb2b-issues-soft {
	background: var(--pb2b-card-soft);
	border-color: var(--pb2b-border);
}

/* Każda grupa problemów to osobna lista; odstęp między grupami. */
.phoenix-b2b-panel .pb2b-checkout-issues-list + .pb2b-checkout-issues-list {
	margin-top: 8px;
}

/* Karta problemu — przebudowa z prostego wiersza (v288) na media + info. */
.phoenix-b2b-panel .pb2b-checkout-issue {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	flex-wrap: nowrap;
	padding: 12px 14px;
	background: var(--pb2b-card);
	border: 1px solid var(--pb2b-border);
	border-left: 3px solid var(--pb2b-border-strong);
	border-radius: var(--pb2b-radius-sm, 10px);
}

/* Kolory lewej krawędzi wg rodzaju problemu. */
.phoenix-b2b-panel .pb2b-checkout-issue.pb2b-issue-blocking { border-left-color: var(--pb2b-danger, #EF4444); }
.phoenix-b2b-panel .pb2b-checkout-issue.pb2b-issue-quote_required { border-left-color: var(--pb2b-primary, #7C3AED); }
.phoenix-b2b-panel .pb2b-checkout-issue.pb2b-issue-fixable_qty { border-left-color: var(--pb2b-warning, #F59E0B); }
.phoenix-b2b-panel .pb2b-checkout-issue.pb2b-issue-warning { border-left-color: var(--pb2b-text-dim, #64748B); }

/* Miniatura produktu (48×48), placeholder dla braku zdjęcia. */
.phoenix-b2b-panel .pb2b-issue-media {
	flex: 0 0 auto;
	width: 48px;
	height: 48px;
	border-radius: 10px;
	overflow: hidden;
	background: var(--pb2b-bg-4, #eef1f8);
}
.phoenix-b2b-panel .pb2b-issue-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.phoenix-b2b-panel .pb2b-issue-media-empty {
	display: block;
	width: 100%;
	height: 100%;
	border: 1px dashed var(--pb2b-border);
	border-radius: 10px;
}

/* Treść problemu. */
.phoenix-b2b-panel .pb2b-issue-info {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 5px;
}
.phoenix-b2b-panel .pb2b-issue-top {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
}
.phoenix-b2b-panel .pb2b-checkout-issue-name {
	font-weight: 700;
	color: var(--pb2b-text);
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
}
.phoenix-b2b-panel .pb2b-checkout-issue-msg {
	font-size: 13px;
	color: var(--pb2b-text-muted);
	line-height: 1.45;
}

/* Tag rodzaju problemu (chip). */
.phoenix-b2b-panel .pb2b-issue-tag {
	display: inline-flex;
	align-items: center;
	padding: 2px 9px;
	border-radius: 999px;
	font-size: 10.5px;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .03em;
	border: 1px solid var(--pb2b-border);
	background: var(--pb2b-card-soft);
	color: var(--pb2b-text-soft);
	white-space: nowrap;
	flex: 0 0 auto;
}
.phoenix-b2b-panel .pb2b-issue-tag-blocking {
	background: rgba(239, 68, 68, 0.12);
	border-color: rgba(239, 68, 68, 0.34);
	color: var(--pb2b-danger-ink, #DC2626);
}
.phoenix-b2b-panel .pb2b-issue-tag-quote_required {
	background: rgba(124, 58, 237, 0.12);
	border-color: rgba(124, 58, 237, 0.34);
	color: var(--pb2b-primary-2, #A855F7);
}
.phoenix-b2b-panel .pb2b-issue-tag-fixable_qty {
	background: rgba(245, 158, 11, 0.14);
	border-color: rgba(245, 158, 11, 0.34);
	color: var(--pb2b-warning-ink, #B45309);
}

/* SKU pod nazwą — chip z ellipsis. */
.phoenix-b2b-panel .pb2b-issue-sku {
	align-self: flex-start;
	max-width: 100%;
	padding: 2px 9px;
	border-radius: 999px;
	background: var(--pb2b-bg-4, #eef1f8);
	border: 1px solid var(--pb2b-border);
	color: var(--pb2b-text-muted);
	font-size: 11px;
	line-height: 1.4;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* Akcje per-pozycja: linki/przyciski w jednej linii, zawijają się. */
.phoenix-b2b-panel .pb2b-issue-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 14px;
	margin-top: 2px;
}
.phoenix-b2b-panel .pb2b-issue-act {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 0;
	border: 0;
	background: none;
	color: var(--pb2b-primary-2, #A855F7);
	font-size: 12.5px;
	font-weight: 600;
	cursor: pointer;
	text-decoration: none;
	line-height: 1.3;
}
.phoenix-b2b-panel .pb2b-issue-act:hover { text-decoration: underline; }
.phoenix-b2b-panel .pb2b-issue-act-remove { color: var(--pb2b-danger-ink, #DC2626); }
.phoenix-b2b-panel .pb2b-issue-act-quote { color: var(--pb2b-primary-2, #A855F7); }

/* Wąskie ekrany: miniatura nieco mniejsza, akcje pełną szerokością. */
@media (max-width: 480px) {
	.phoenix-b2b-panel .pb2b-issue-media { width: 42px; height: 42px; }
	.phoenix-b2b-panel .pb2b-checkout-issue { padding: 12px; gap: 10px; }
}

/* Notka trybu testu administratora. */
.phoenix-b2b-panel .pb2b-checkout-admnote {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin: 0 0 16px;
	padding: 12px 14px;
	border-radius: var(--pb2b-radius-sm, 10px);
	background: rgba(56, 189, 248, 0.10);
	border: 1px solid rgba(56, 189, 248, 0.34);
	color: var(--pb2b-text);
	font-size: 13px;
	line-height: 1.45;
}
.phoenix-b2b-panel .pb2b-checkout-admnote-ico { flex: 0 0 auto; color: #0EA5E9; margin-top: 1px; }

/* Panelowy blok „cart-errors" (bezpiecznik, gdy Woo i tak rzuci ekran błędów). */
.phoenix-b2b-panel .pb2b-checkout-woo-block {
	margin: 0 0 16px;
	padding: 16px;
	background: rgba(239, 68, 68, 0.08);
	border: 1px solid rgba(239, 68, 68, 0.30);
	border-radius: var(--pb2b-radius, 14px);
}
.phoenix-b2b-panel .pb2b-checkout-woo-block-head { display: flex; gap: 12px; align-items: flex-start; margin-bottom: 8px; }
.phoenix-b2b-panel .pb2b-checkout-woo-block-ico { flex: 0 0 auto; color: var(--pb2b-danger-ink, #DC2626); }
.phoenix-b2b-panel .pb2b-checkout-woo-block-head h4 { margin: 0 0 2px; font-size: 15px; color: var(--pb2b-text); }
.phoenix-b2b-panel .pb2b-checkout-woo-block-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 12px; }
.phoenix-b2b-panel .pb2b-checkout-woo-block .woocommerce-error { margin: 0; }

/* ==========================================================================
 * 7. PRICE LOGIC — spójny wygląd etykiet ceny w panelu.
 *    (Karty produktów: „Zapytaj o cenę" / „Dostępne po zalogowaniu" stylowane
 *    już w product-card.css; tu pilnujemy spójności w koszyku/checkoucie.)
 * ========================================================================== */
.phoenix-b2b-panel .pb2b-card-price-na,
.phoenix-b2b-panel .pb2b-qo-price-na {
	font-weight: 600;
}

/* ==========================================================================
 * 8. LIGHT / DARK — bezpieczniki kontrastu nowych elementów.
 * ========================================================================== */
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-checkout-issue {
	background: #fff;
}
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-checkout-issue-name,
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-checkout-woo-block-head h4 {
	color: var(--pb2b-text);
}
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-issue-tag-blocking { color: #B91C1C; }
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-issue-tag-fixable_qty { color: #B45309; }
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-issue-act-remove { color: #B91C1C; }
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-cart-line-quote { color: #6D28D9 !important; }

/* Avatar w light mode — czytelny inicjał na jasnym tincie. */
.phoenix-b2b-panel[data-pb2b-theme="light"] .pb2b-user-avatar {
	color: #6D28D9;
	background: linear-gradient(135deg, rgba(124, 58, 237, 0.12), rgba(168, 85, 247, 0.12));
}

/* ==========================================================================
 * 9. FOOTER / APP FEEL — lekki, bez wielkiej pustki na dole (dopięcie v286).
 * ========================================================================== */
.phoenix-b2b-panel .pb2b-app-footer-links {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 18px;
}
@media (max-width: 600px) {
	.phoenix-b2b-panel .pb2b-app-footer-links { gap: 8px 14px; }
}

/* Treść nie kończy się „nagle": delikatny dolny oddech contentu na mobile,
 * ale BEZ ogromnej pustki (tylko jeśli sekcja jest krótsza niż ekran). */
@media (max-width: 1199.98px) {
	.phoenix-b2b-panel .pb2b-app-content { padding-bottom: 8px; }
}

/* =====================================================================
 * 2.11.25 (pkt 6) — KATALOG B2B: gęsta karta mobilna (szybkie skanowanie 1800+).
 * Samodzielny, finalny override (ładowany jako ostatnia reguła qo w łańcuchu
 * panelu → wygrywa w kaskadzie, bez zależności od wcześniejszych warstw).
 * Cel z briefu: mniejsze zdjęcie, mniejsza wysokość, mniej pustej przestrzeni,
 * więcej produktów widocznych na ekranie. Bez zmian w markupie/JS/perf.
 * ===================================================================== */
@media (max-width: 767px) {
	.phoenix-b2b-panel .phoenix-b2b-qo-table tbody tr {
		display: grid;
		grid-template-columns: 20px 46px 1fr auto;
		grid-template-areas:
			"check thumb name   name"
			"check thumb sku    stock"
			"price price price  price"
			"qty   qty   qty    action";
		gap: 5px 9px;
		align-items: center;
		background: var(--pb2b-bg-2);
		border: 1px solid var(--pb2b-border);
		border-radius: var(--pb2b-radius-sm);
		padding: 9px 11px;
		margin-bottom: 8px;
	}
	.phoenix-b2b-panel .phoenix-b2b-qo-table tbody td {
		display: flex; align-items: center; padding: 0; border: 0; width: auto; text-align: left;
	}
	.phoenix-b2b-panel .phoenix-b2b-qo-table tbody td::before { content: none !important; }
	.phoenix-b2b-panel .pb2b-qo-col-check  { grid-area: check; justify-content: center; }
	.phoenix-b2b-panel .pb2b-qo-col-thumb  { grid-area: thumb; }
	.phoenix-b2b-panel .pb2b-qo-col-name   { grid-area: name; flex-direction: column; align-items: flex-start; gap: 1px; }
	.phoenix-b2b-panel .pb2b-qo-col-name a { display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 13px; line-height: 1.25; }
	.phoenix-b2b-panel .pb2b-qo-col-sku    { grid-area: sku; }
	.phoenix-b2b-panel .pb2b-qo-col-stock  { grid-area: stock; justify-content: flex-end; }
	.phoenix-b2b-panel .pb2b-qo-col-price  { grid-area: price; justify-content: flex-start; margin-top: 1px; padding-top: 6px; border-top: 1px solid var(--pb2b-border); font-weight: 700; font-size: 14px; color: var(--pb2b-text); }
	.phoenix-b2b-panel .pb2b-qo-col-qty    { grid-area: qty; justify-content: flex-start; }
	.phoenix-b2b-panel .pb2b-qo-col-action { grid-area: action; justify-content: flex-end; }
	/* Zdjęcie katalogu: zwarte 46px (zamiast pełnowymiarowego stacka). */
	.phoenix-b2b-panel .pb2b-qo-col-thumb img { width: 46px; height: 46px; }
	/* Stepper ilości + akcja „Dodaj" — niższe, kompaktowe. */
	.phoenix-b2b-panel .phoenix-b2b-qo-qty { height: 36px; width: 76px; }
	.phoenix-b2b-panel .phoenix-b2b-qo-table .pb2b-qo-col-qty .pb2b-qo-stepper { width: 100%; max-width: 180px; justify-content: space-between; }
	.phoenix-b2b-panel .phoenix-b2b-qo-table .pb2b-qo-col-action .phoenix-b2b-qo-add-single,
	.phoenix-b2b-panel .phoenix-b2b-qo-table .pb2b-qo-col-action .button { height: 36px; min-width: 84px; padding: 0 14px; }
}

/* =====================================================================
 * 2.11.25 (pkt 1) — AUTH: bezpieczny górny odstęp w trybie standalone PWA.
 * Na screenach nagłówek karty („Zaloguj się" / „Załóż konto") bywał przycięty
 * pod status barem. Dokładamy safe-area-inset do górnego paddingu wrappera auth
 * (login + rejestracja współdzielą .pb2b-auth). Finalna reguła → wygrywa.
 * ===================================================================== */
.phoenix-b2b-panel.pb2b-auth {
	padding-top: max(32px, calc(env(safe-area-inset-top, 0px) + 20px));
}

/* =====================================================================
 * 2.11.26 (pkt 1) — AUTH RECOVERY (przypomnienie/reset hasła): wąska,
 * wyśrodkowana karta (brak panelu benefitów). Reużywa .pb2b-auth-card.
 * ===================================================================== */
.phoenix-b2b-panel .pb2b-auth-grid-narrow {
	grid-template-columns: minmax(0, 480px);
	justify-content: center;
	max-width: 480px;
}
.phoenix-b2b-panel.pb2b-auth-recovery .pb2b-auth-card { padding: 28px; }
.phoenix-b2b-panel.pb2b-auth-recovery .pb2b-auth-brand { margin-bottom: 18px; }

/* =====================================================================
 * 2.11.27 — AUTH / STATE: spójny, czytelny motyw aplikacji (PWA).
 * Ekrany login / rejestracja / reset hasła / pending / rejected /
 * no-access / staff-redirect mają wymuszony ciemny motyw
 * (data-pb2b-theme="dark" + data-pb2b-theme-lock="1" w JS). Poniższe reguły
 * GWARANTUJĄ czytelny kontrast nagłówków/etykiet/tekstów niezależnie od
 * ewentualnych starszych arkuszy. Zakres ŚCIŚLE .pb2b-auth / .pb2b-state —
 * bez wpływu na panel klienta, sklep czy panel admina.
 * ===================================================================== */
.phoenix-b2b-panel.pb2b-auth,
.phoenix-b2b-panel.pb2b-state {
	background:
		radial-gradient(900px circle at 18% 8%, rgba(124,58,237,0.20), transparent 60%),
		radial-gradient(760px circle at 85% 92%, rgba(59,130,246,0.16), transparent 60%),
		#070B18;
	color: #F8FAFC;
}
/* Karty auth/stanów — zawsze ciemna powierzchnia */
.phoenix-b2b-panel.pb2b-auth .pb2b-auth-card,
.phoenix-b2b-panel.pb2b-state .pb2b-state-card {
	background: #111827;
	border: 1px solid rgba(148,163,184,0.16);
}
/* Nagłówki — jasne, czytelne na ciemnej karcie (root-fix niewidocznego tytułu) */
.phoenix-b2b-panel.pb2b-auth .pb2b-auth-title,
.phoenix-b2b-panel.pb2b-auth .pb2b-auth-form-title,
.phoenix-b2b-panel.pb2b-state .pb2b-state-title {
	color: #F8FAFC !important;
}
/* Teksty wiodące / podtytuły / muted */
.phoenix-b2b-panel.pb2b-auth .pb2b-auth-lead,
.phoenix-b2b-panel.pb2b-auth .pb2b-auth-form-sub,
.phoenix-b2b-panel.pb2b-auth .pb2b-muted,
.phoenix-b2b-panel.pb2b-state .pb2b-state-desc {
	color: #CBD5E1 !important;
}
.phoenix-b2b-panel.pb2b-auth .pb2b-auth-register-text,
.phoenix-b2b-panel.pb2b-state .pb2b-state-meta {
	color: #94A3B8 !important;
}
/* Etykiety pól logowania + „Zapamiętaj mnie" */
.phoenix-b2b-panel.pb2b-auth .pb2b-field label,
.phoenix-b2b-panel.pb2b-auth .pb2b-login-form .pb2b-field label,
.phoenix-b2b-panel.pb2b-auth .pb2b-checkbox-inline span {
	color: #CBD5E1 !important;
}
/* Inputy logowania — ciemne tło, jasny tekst */
.phoenix-b2b-panel.pb2b-auth .pb2b-login-form input[type="text"],
.phoenix-b2b-panel.pb2b-auth .pb2b-login-form input[type="email"],
.phoenix-b2b-panel.pb2b-auth .pb2b-login-form input[type="password"] {
	background: #0B1220 !important;
	border-color: rgba(148,163,184,0.22) !important;
	color: #F8FAFC !important;
}
.phoenix-b2b-panel.pb2b-auth .pb2b-login-form input::placeholder { color: #64748B !important; }
.phoenix-b2b-panel.pb2b-auth .pb2b-field-icon { color: #94A3B8; }
/* Przycisk główny (Zaloguj / akcje) — gradient purpura→błękit, biały tekst */
.phoenix-b2b-panel.pb2b-auth .pb2b-btn-primary,
.phoenix-b2b-panel.pb2b-auth .pb2b-login-submit,
.phoenix-b2b-panel.pb2b-state .pb2b-btn-primary {
	background: linear-gradient(135deg, #A855F7 0%, #7C3AED 45%, #3B82F6 100%) !important;
	color: #fff !important;
	border-color: transparent !important;
}
/* Przyciski outline (Zarejestruj / Wyloguj) — czytelne na ciemnym */
.phoenix-b2b-panel.pb2b-auth .pb2b-btn-outline,
.phoenix-b2b-panel.pb2b-state .pb2b-btn-outline {
	color: #F8FAFC !important;
	border-color: rgba(168,85,247,0.45) !important;
	background: transparent !important;
}
/* Divider „lub" — chip spójny z ciemną kartą */
.phoenix-b2b-panel.pb2b-auth .pb2b-auth-divider span {
	background: #111827 !important;
	color: #94A3B8 !important;
}
/* Link powrotu do logowania pod kartą stanu */
.phoenix-b2b-panel.pb2b-state .pb2b-state-back { margin: 14px 0 0; font-size: 13px; }
.phoenix-b2b-panel.pb2b-state .pb2b-state-back a { color: #C4B5FD; text-decoration: none; }
.phoenix-b2b-panel.pb2b-state .pb2b-state-back a:hover { color: #DDD6FE; }