/* v2.9.7 PANEL V3.7 FINAL POLISH */
/**
 * PhoenixB2B / SPJTRADE B2B — PANEL KLIENTA V3.7 — FINAL POLISH + UI/UX + THEME FIX.
 *
 * Warstwa FINALNA, ladowana JAKO OSTATNIA (po panel-v3-6.css). Przy rownej
 * specyficznosci (.phoenix-b2b-panel + jedna/dwie klasy) wygrywa w kaskadzie
 * dzieki kolejnosci ladowania — bez wojny !important (poza miejscami, gdzie
 * gwarancja jest krytyczna: czytelnosc tekstu, brak podkreslen, wartosc koszyka
 * w headerze, usuniecie paska pod headerem).
 *
 * Zakres SCISLE `.phoenix-b2b-panel`. Wszystkie kolory/tla/cienie pochodza z
 * tokenow (panel-v3-tokens.css) -> light i dark „za darmo", zero hardcode.
 */

/* =========================================================================
 * 0) FUNDAMENT — pudelkowanie + twarde gwarancje braku poziomego scrolla.
 * ========================================================================= */
.phoenix-b2b-panel,
.phoenix-b2b-panel *,
.phoenix-b2b-panel *::before,
.phoenix-b2b-panel *::after { box-sizing: border-box; }

.phoenix-b2b-panel { max-width: 100%; }
.phoenix-b2b-panel .pb2b-content { overflow-x: hidden; }
.phoenix-b2b-panel img,
.phoenix-b2b-panel svg,
.phoenix-b2b-panel video,
.phoenix-b2b-panel canvas { max-width: 100%; }
.phoenix-b2b-panel pre,
.phoenix-b2b-panel code { white-space: pre-wrap; word-break: break-word; }
.phoenix-b2b-panel .pb2b-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* =========================================================================
 * 1) PODKRESLENIA — twarde wylaczenie w nawigacji / akcjach / karcie konta.
 * ========================================================================= */
.phoenix-b2b-panel a { text-decoration: none; }
.phoenix-b2b-panel .pb2b-nav-item,
.phoenix-b2b-panel .pb2b-nav-item:hover,
.phoenix-b2b-panel .pb2b-nav-item:focus,
.phoenix-b2b-panel .pb2b-side-account-link,
.phoenix-b2b-panel .pb2b-side-account-link:hover,
.phoenix-b2b-panel .pb2b-side-account-link:focus,
.phoenix-b2b-panel .pb2b-account-link,
.phoenix-b2b-panel .pb2b-account-link:hover,
.phoenix-b2b-panel .pb2b-bottom-nav-item,
.phoenix-b2b-panel .pb2b-bottom-nav-item:hover,
.phoenix-b2b-panel .pb2b-btn,
.phoenix-b2b-panel .pb2b-btn:hover,
.phoenix-b2b-panel .pb2b-card-action,
.phoenix-b2b-panel .pb2b-card-action:hover,
.phoenix-b2b-panel .pb2b-quick-tile,
.phoenix-b2b-panel .pb2b-quick-tile:hover,
.phoenix-b2b-panel .pb2b-app-footer-link,
.phoenix-b2b-panel .pb2b-app-footer-link:hover,
.phoenix-b2b-panel .pb2b-sidebar-foot-brand,
.phoenix-b2b-panel .pb2b-chip,
.phoenix-b2b-panel .pb2b-topbar-cart,
.phoenix-b2b-panel .pb2b-topbar-cart:hover,
.phoenix-b2b-panel .pb2b-topbar-bell,
.phoenix-b2b-panel .pb2b-brand,
.phoenix-b2b-panel .pb2b-account-toggle { text-decoration: none !important; }

/* =========================================================================
 * 2) SIDEBAR — pasek gorny (mobile): bez brandu „SPJTRADE B2B", sam krzyzyk.
 *    Na PC (>=1200) brand zostaje jako tozsamosc aplikacji w stalej kolumnie.
 * ========================================================================= */
@media (max-width: 1199px) {
	.phoenix-b2b-panel .pb2b-sidebar-topbar {
		display: flex; align-items: center; justify-content: flex-end;
		padding: 10px 12px 4px; min-height: 0;
	}
	.phoenix-b2b-panel .pb2b-sidebar-topbar .pb2b-brand,
	.phoenix-b2b-panel .pb2b-sidebar-topbar .pb2b-brand-compact { display: none !important; }
}

/* Krzyzyk zamykania: mniejszy, estetyczny, idealnie wysrodkowany. */
.phoenix-b2b-panel .pb2b-sidebar-close {
	width: 34px; height: 34px; flex: 0 0 34px; padding: 0;
	display: inline-flex; align-items: center; justify-content: center;
	border-radius: 10px;
	border: 1px solid var(--pb2b-border);
	background: var(--pb2b-bg-3);
	color: var(--pb2b-text-muted);
	transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.phoenix-b2b-panel .pb2b-sidebar-close:hover { background: var(--pb2b-bg-4); color: var(--pb2b-text); border-color: var(--pb2b-border-strong); }
.phoenix-b2b-panel .pb2b-sidebar-close:focus-visible { outline: none; box-shadow: var(--pb2b-shadow-focus); }
.phoenix-b2b-panel .pb2b-sidebar-close svg { width: 16px; height: 16px; display: block; stroke: currentColor; }
.phoenix-b2b-panel .pb2b-sidebar-close:empty::before { content: "\00d7"; font-size: 20px; line-height: 1; }

/* =========================================================================
 * 3) KARTA KONTA (hero) — szersza, bardziej pozioma, „wyrozniona karta usera".
 * ========================================================================= */
.phoenix-b2b-panel .pb2b-side-account-hero {
	margin: 0 10px 12px;
	padding: 15px;
	background: linear-gradient(158deg,
		color-mix(in srgb, var(--pb2b-primary) 11%, var(--pb2b-bg-2)) 0%,
		var(--pb2b-bg-2) 60%);
	border: 1px solid color-mix(in srgb, var(--pb2b-primary) 24%, var(--pb2b-border));
	border-radius: var(--pb2b-radius);
	box-shadow: var(--pb2b-shadow-sm);
}
.phoenix-b2b-panel .pb2b-side-account-hero .pb2b-side-account-top {
	display: flex; align-items: center; gap: 13px; min-width: 0;
}
.phoenix-b2b-panel .pb2b-side-account-hero .pb2b-side-account-avatar {
	width: 50px; height: 50px; flex: 0 0 50px;
	display: inline-flex; align-items: center; justify-content: center;
	border-radius: 50%;
	background: var(--pb2b-accent-grad);
	color: var(--pb2b-primary-contrast);
	font-size: 20px; font-weight: 800; line-height: 1; text-transform: uppercase;
	box-shadow: 0 8px 18px color-mix(in srgb, var(--pb2b-primary) 38%, transparent);
}
.phoenix-b2b-panel .pb2b-side-account-hero .pb2b-side-account-id {
	display: flex; flex-direction: column; gap: 4px; min-width: 0;
}
.phoenix-b2b-panel .pb2b-side-account-hero .pb2b-side-account-name {
	font-size: 16px; font-weight: 800; line-height: 1.15;
	color: var(--pb2b-text-strong) !important;
	overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.phoenix-b2b-panel .pb2b-side-account-hero .pb2b-side-account-company {
	font-size: 12px; font-weight: 500;
	color: var(--pb2b-text-muted) !important;
	overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.phoenix-b2b-panel .pb2b-side-account-hero .pb2b-side-account-status {
	align-self: flex-start;
	display: inline-flex; align-items: center; gap: 6px;
	margin-top: 1px; padding: 3px 9px;
	border-radius: 999px;
	background: var(--pb2b-success-soft);
	color: var(--pb2b-success-ink) !important;
	font-size: 11px; font-weight: 700; line-height: 1;
}
.phoenix-b2b-panel .pb2b-side-account-hero .pb2b-side-account-status-dot {
	width: 7px; height: 7px; flex: 0 0 7px; border-radius: 50%;
	background: var(--pb2b-success); box-shadow: none;
}
.phoenix-b2b-panel .pb2b-side-account-hero .pb2b-side-account-actions {
	display: grid; grid-template-columns: 1fr 1fr; gap: 8px;
	margin-top: 14px; padding-top: 14px;
	border-top: 1px solid var(--pb2b-border);
}
.phoenix-b2b-panel .pb2b-side-account-hero .pb2b-side-account-link {
	position: relative;
	display: flex; flex-direction: column; align-items: flex-start; gap: 7px;
	padding: 11px; min-height: 64px;
	background: var(--pb2b-bg-2);
	border: 1px solid var(--pb2b-border);
	border-radius: var(--pb2b-radius-sm);
	color: var(--pb2b-text) !important;
	font-size: 12px; font-weight: 600; line-height: 1.15;
	transition: background .15s ease, border-color .15s ease, transform .08s ease;
}
.phoenix-b2b-panel .pb2b-side-account-hero .pb2b-side-account-link:hover {
	background: var(--pb2b-bg-3);
	border-color: color-mix(in srgb, var(--pb2b-primary) 45%, var(--pb2b-border));
	transform: translateY(-1px);
}
.phoenix-b2b-panel .pb2b-side-account-hero .pb2b-side-account-link:focus-visible { outline: none; box-shadow: var(--pb2b-shadow-focus); }
.phoenix-b2b-panel .pb2b-side-account-hero .pb2b-side-account-link-ico {
	width: 20px; height: 20px; flex: 0 0 20px; color: var(--pb2b-primary);
}
.phoenix-b2b-panel .pb2b-side-account-hero .pb2b-side-account-link-ico svg { width: 20px; height: 20px; display: block; }
.phoenix-b2b-panel .pb2b-side-account-hero .pb2b-side-account-link-badge {
	position: absolute; top: 8px; right: 8px;
	min-width: 18px; height: 18px; padding: 0 5px;
	display: inline-flex; align-items: center; justify-content: center;
	border-radius: 999px; background: var(--pb2b-danger); color: #fff;
	font-size: 10px; font-weight: 800; line-height: 1;
}
.phoenix-b2b-panel .pb2b-side-account-hero .pb2b-side-account-logout {
	grid-column: 1 / -1;
	flex-direction: row; align-items: center; justify-content: center; gap: 8px;
	min-height: 0; padding: 11px 12px;
	background: var(--pb2b-danger-soft);
	border-color: color-mix(in srgb, var(--pb2b-danger) 28%, var(--pb2b-border));
	color: var(--pb2b-danger-ink) !important;
	font-size: 12.5px; font-weight: 700;
}
.phoenix-b2b-panel .pb2b-side-account-hero .pb2b-side-account-logout:hover {
	background: color-mix(in srgb, var(--pb2b-danger) 16%, var(--pb2b-bg-2));
	border-color: color-mix(in srgb, var(--pb2b-danger) 45%, var(--pb2b-border));
	transform: none;
}
.phoenix-b2b-panel .pb2b-side-account-hero .pb2b-side-account-logout .pb2b-side-account-link-ico {
	width: 18px; height: 18px; flex: 0 0 18px; color: var(--pb2b-danger-ink);
}
.phoenix-b2b-panel .pb2b-side-account-hero .pb2b-side-account-logout .pb2b-side-account-link-ico svg { width: 18px; height: 18px; }

/* =========================================================================
 * 4) SIDEBAR NAV — odstepy, separatory grup, hierarchia, aktywny stan, scrollbar.
 * ========================================================================= */
.phoenix-b2b-panel .pb2b-nav-grouped { padding: 2px 10px 10px; }
.phoenix-b2b-panel .pb2b-nav-group + .pb2b-nav-group {
	margin-top: 12px; padding-top: 12px;
	border-top: 1px solid var(--pb2b-border);
}
.phoenix-b2b-panel .pb2b-nav-group-pinned { padding-bottom: 2px; }
.phoenix-b2b-panel .pb2b-nav-group-title {
	padding: 2px 10px 7px;
	font-size: 10.5px; font-weight: 800; letter-spacing: .7px; text-transform: uppercase;
	color: var(--pb2b-text-dim);
}
.phoenix-b2b-panel .pb2b-nav-item {
	position: relative;
	display: flex; align-items: center; gap: 11px;
	padding: 9px 11px; margin: 1px 0;
	border-radius: var(--pb2b-radius-sm);
	color: var(--pb2b-text-soft);
	font-size: 13.5px; font-weight: 600; line-height: 1.1;
	transition: background .14s ease, color .14s ease;
}
.phoenix-b2b-panel .pb2b-nav-item .pb2b-nav-icon { width: 20px; height: 20px; flex: 0 0 20px; display: inline-flex; align-items: center; justify-content: center; color: var(--pb2b-text-muted); }
.phoenix-b2b-panel .pb2b-nav-item .pb2b-nav-icon svg { width: 20px; height: 20px; display: block; }
.phoenix-b2b-panel .pb2b-nav-item .pb2b-nav-label { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.phoenix-b2b-panel .pb2b-nav-item:hover { background: var(--pb2b-bg-3); color: var(--pb2b-text); }
.phoenix-b2b-panel .pb2b-nav-item:hover .pb2b-nav-icon { color: var(--pb2b-primary); }
.phoenix-b2b-panel .pb2b-nav-item:focus-visible { outline: none; box-shadow: var(--pb2b-shadow-focus); }
.phoenix-b2b-panel .pb2b-nav-item.is-active {
	background: var(--pb2b-primary-soft);
	color: var(--pb2b-primary-strong);
	box-shadow: inset 3px 0 0 0 var(--pb2b-primary);
}
.phoenix-b2b-panel .pb2b-nav-item.is-active .pb2b-nav-icon { color: var(--pb2b-primary-strong); }
.phoenix-b2b-panel .pb2b-nav-item.is-active .pb2b-nav-label { font-weight: 700; }
.phoenix-b2b-panel .pb2b-nav-indicator { display: none; }
.phoenix-b2b-panel .pb2b-nav-badge {
	margin-left: auto; min-width: 18px; height: 18px; padding: 0 6px;
	display: inline-flex; align-items: center; justify-content: center;
	border-radius: 999px; background: var(--pb2b-primary); color: var(--pb2b-primary-contrast);
	font-size: 10.5px; font-weight: 800; line-height: 1;
}
.phoenix-b2b-panel .pb2b-nav-badge-alert { background: var(--pb2b-danger); }

.phoenix-b2b-panel .pb2b-sidebar {
	scrollbar-width: thin;
	scrollbar-color: color-mix(in srgb, var(--pb2b-primary) 75%, transparent) transparent;
}
.phoenix-b2b-panel .pb2b-sidebar::-webkit-scrollbar { width: 9px; }
.phoenix-b2b-panel .pb2b-sidebar::-webkit-scrollbar-track { background: transparent; margin: 6px 0; }
.phoenix-b2b-panel .pb2b-sidebar::-webkit-scrollbar-thumb {
	background: color-mix(in srgb, var(--pb2b-primary) 60%, transparent);
	border: 2px solid transparent; border-radius: 999px; background-clip: padding-box; min-height: 42px;
}
.phoenix-b2b-panel .pb2b-sidebar:hover::-webkit-scrollbar-thumb { background: var(--pb2b-primary); background-clip: padding-box; }

.phoenix-b2b-panel .pb2b-sidebar-footer { padding: 8px 14px 16px; }
.phoenix-b2b-panel .pb2b-sidebar-foot-brand {
	margin-top: 0; padding-top: 12px;
	border-top: 1px solid var(--pb2b-border);
	justify-content: center;
}
.phoenix-b2b-panel .pb2b-sidebar-foot-brand-name { color: var(--pb2b-text-muted); }
.phoenix-b2b-panel .pb2b-sidebar-foot-brand-ver { color: var(--pb2b-text-dim); }

/* =========================================================================
 * 5) HEADER — koszyk (ilosc + wartosc) W HEADERZE; pasek pod headerem usuniety.
 * ========================================================================= */

/* Mini-cartbar pod headerem usuniety jako glowna forma (wartosc jest w headerze). */
.phoenix-b2b-panel .pb2b-mini-cartbar { display: none !important; }

/* Header — oddech i bezpieczne wyrownanie. Safe-area (top/padding-top) z v3-3 NIE ruszamy. */
.phoenix-b2b-panel .pb2b-app-header { gap: 8px; flex-wrap: nowrap; }
.phoenix-b2b-panel .pb2b-topbar-title { flex: 1 1 auto; min-width: 0; }
.phoenix-b2b-panel .pb2b-topbar-h1 { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--pb2b-text-strong); }
.phoenix-b2b-panel .pb2b-topbar-sub { color: var(--pb2b-text-muted); }
.phoenix-b2b-panel .pb2b-topbar-right { gap: 8px; align-items: center; flex-wrap: nowrap; }

/* Koszyk w headerze — kompaktowy pill (baza, wspolna dla mobile i PC). */
.phoenix-b2b-panel .pb2b-topbar-cart {
	position: relative;
	display: inline-flex; align-items: center; gap: 8px;
	padding: 7px 12px; border-radius: 999px;
	background: var(--pb2b-bg-3);
	border: 1px solid var(--pb2b-border);
	color: var(--pb2b-text);
	transition: background .15s ease, border-color .15s ease;
}
.phoenix-b2b-panel .pb2b-topbar-cart:hover { background: var(--pb2b-bg-4); border-color: var(--pb2b-border-strong); }
.phoenix-b2b-panel .pb2b-topbar-cart:focus-visible { outline: none; box-shadow: var(--pb2b-shadow-focus); }
.phoenix-b2b-panel .pb2b-topbar-cart.has-items { border-color: color-mix(in srgb, var(--pb2b-primary) 45%, var(--pb2b-border)); }
.phoenix-b2b-panel .pb2b-topbar-cart-ico { width: 19px; height: 19px; flex: 0 0 19px; display: inline-flex; color: var(--pb2b-primary-2); }
.phoenix-b2b-panel .pb2b-topbar-cart-ico svg { width: 19px; height: 19px; display: block; }

/* MOBILE/TABLET (<=1199) — wartosc w pillu; ilosc realizuje inline badge. */
@media (max-width: 1199px) {
	.phoenix-b2b-panel .pb2b-topbar-cart-meta { display: flex !important; flex-direction: row; align-items: center; line-height: 1; }
	.phoenix-b2b-panel .pb2b-topbar-cart-count { display: none !important; }
	.phoenix-b2b-panel .pb2b-topbar-cart-total {
		display: inline !important; font-size: 12.5px; font-weight: 800;
		color: var(--pb2b-text-strong); white-space: nowrap;
	}
	.phoenix-b2b-panel .pb2b-topbar-cart-total * { color: inherit; font-size: inherit; font-weight: inherit; }
	.phoenix-b2b-panel .pb2b-topbar-cart-total:empty { display: none !important; }
	.phoenix-b2b-panel .pb2b-topbar-cart-badge {
		position: static !important; display: inline-flex !important;
		align-items: center; justify-content: center;
		min-width: 18px; height: 18px; padding: 0 5px; margin: 0; border: 0; inset: auto;
		border-radius: 999px; background: var(--pb2b-primary); color: var(--pb2b-primary-contrast);
		font-size: 11px; font-weight: 800; line-height: 1;
	}
	/* Pusty koszyk — sama ikona, bez badge i kwoty. */
	.phoenix-b2b-panel .pb2b-topbar-cart.is-empty { padding: 8px; }
	.phoenix-b2b-panel .pb2b-topbar-cart.is-empty .pb2b-topbar-cart-badge,
	.phoenix-b2b-panel .pb2b-topbar-cart.is-empty .pb2b-topbar-cart-meta { display: none !important; }

	/* Wygodne, ale kompaktowe ikony — header oddycha juz na 390px. */
	.phoenix-b2b-panel .pb2b-burger { width: 38px; height: 38px; }
	.phoenix-b2b-panel .pb2b-topbar-bell { width: 36px; height: 36px; }
	/* Podtytul (nazwa firmy) nie zabiera miejsca w waskim headerze — jest w karcie konta. */
	.phoenix-b2b-panel .pb2b-topbar-sub { display: none; }
}
@media (max-width: 430px) {
	.phoenix-b2b-panel .pb2b-app-header { gap: 6px; }
	.phoenix-b2b-panel .pb2b-topbar-right { gap: 6px; }
	.phoenix-b2b-panel .pb2b-topbar-cart { padding: 6px 10px; gap: 7px; }
	.phoenix-b2b-panel .pb2b-topbar-cart-total { font-size: 12px; }
}

/* =========================================================================
 * 6) LIGHT / DARK — globalna naprawa kontrastu (wszystkie kolory z tokenow).
 * ========================================================================= */

/* Powitanie + chip konta (PC) — zawsze czytelne w obu motywach. */
.phoenix-b2b-panel .pb2b-account-toggle { color: var(--pb2b-text); }
.phoenix-b2b-panel .pb2b-account-id .pb2b-greeting { color: var(--pb2b-text-muted) !important; }
.phoenix-b2b-panel .pb2b-account-id .pb2b-greeting-name { color: var(--pb2b-text-strong) !important; }
.phoenix-b2b-panel .pb2b-user-avatar,
.phoenix-b2b-panel .pb2b-account-avatar-lg { color: var(--pb2b-primary-contrast); }
.phoenix-b2b-panel .pb2b-account-caret { color: var(--pb2b-text-muted); }

/* Dropdown konta (PC) — powierzchnia + teksty z tokenow. */
.phoenix-b2b-panel .pb2b-account-menu { background: var(--pb2b-bg-2); border: 1px solid var(--pb2b-border); box-shadow: var(--pb2b-shadow-lg); }
.phoenix-b2b-panel .pb2b-account-head { border-bottom: 1px solid var(--pb2b-border); }
.phoenix-b2b-panel .pb2b-account-head-name { color: var(--pb2b-text-strong) !important; }
.phoenix-b2b-panel .pb2b-account-head-company { color: var(--pb2b-text-muted) !important; }
.phoenix-b2b-panel .pb2b-account-status { color: var(--pb2b-success-ink) !important; }
.phoenix-b2b-panel .pb2b-account-link { color: var(--pb2b-text) !important; }
.phoenix-b2b-panel .pb2b-account-link .pb2b-account-link-ico { color: var(--pb2b-text-muted); }
.phoenix-b2b-panel .pb2b-account-link:hover { background: var(--pb2b-bg-3); }
.phoenix-b2b-panel .pb2b-account-link:hover .pb2b-account-link-ico { color: var(--pb2b-primary); }
.phoenix-b2b-panel .pb2b-account-logout,
.phoenix-b2b-panel .pb2b-account-logout .pb2b-account-link-ico { color: var(--pb2b-danger-ink) !important; }
.phoenix-b2b-panel .pb2b-account-logout:hover { background: var(--pb2b-danger-soft); }

/* Generyczne teksty/tytuly — gwarancja kontrastu (light i dark). */
.phoenix-b2b-panel .pb2b-card-title,
.phoenix-b2b-panel .pb2b-section-title,
.phoenix-b2b-panel .pb2b-section-head-title,
.phoenix-b2b-panel .pb2b-hero-company { color: var(--pb2b-text-strong); }
.phoenix-b2b-panel .pb2b-section-sub,
.phoenix-b2b-panel .pb2b-section-head-desc,
.phoenix-b2b-panel .pb2b-card-sub,
.phoenix-b2b-panel .pb2b-muted,
.phoenix-b2b-panel .pb2b-stat-foot { color: var(--pb2b-text-muted); }

/* Pola formularzy — spojne tlo/tekst/ramka/placeholder w obu motywach (bez !important,
 * by bardziej szczegolowe reguly WooCommerce w osadzonym checkoutcie nadal wygrywaly). */
.phoenix-b2b-panel input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="submit"]):not([type="button"]),
.phoenix-b2b-panel select,
.phoenix-b2b-panel textarea {
	background-color: var(--pb2b-bg-3);
	color: var(--pb2b-text);
	border: 1px solid var(--pb2b-border);
	border-radius: var(--pb2b-radius-xs);
}
.phoenix-b2b-panel input::placeholder,
.phoenix-b2b-panel textarea::placeholder { color: var(--pb2b-text-dim); opacity: 1; }
.phoenix-b2b-panel input:focus,
.phoenix-b2b-panel select:focus,
.phoenix-b2b-panel textarea:focus {
	outline: none;
	border-color: color-mix(in srgb, var(--pb2b-primary) 55%, var(--pb2b-border));
	box-shadow: var(--pb2b-shadow-focus);
}

/* Chipsy / pigulki. */
.phoenix-b2b-panel .pb2b-chip { background: var(--pb2b-bg-3); color: var(--pb2b-text); border: 1px solid var(--pb2b-border); }
.phoenix-b2b-panel .pb2b-chip-primary { background: var(--pb2b-primary-soft); color: var(--pb2b-primary-strong); border-color: color-mix(in srgb, var(--pb2b-primary) 30%, var(--pb2b-border)); }
.phoenix-b2b-panel .pb2b-chip-amount { color: inherit; font-weight: 800; }

/* =========================================================================
 * 7) DASHBOARD — wiecej oddechu + premium hero/statystyki/kafle/karty.
 * ========================================================================= */
.phoenix-b2b-panel .pb2b-content { gap: var(--pb2b-section-gap); }

.phoenix-b2b-panel .pb2b-hero {
	padding: clamp(18px, 3vw, 28px);
	border-radius: var(--pb2b-radius);
	border: 1px solid color-mix(in srgb, var(--pb2b-primary) 18%, var(--pb2b-border));
	background: linear-gradient(150deg,
		color-mix(in srgb, var(--pb2b-primary) 12%, var(--pb2b-bg-2)) 0%,
		var(--pb2b-bg-2) 62%);
	box-shadow: var(--pb2b-shadow);
}
.phoenix-b2b-panel .pb2b-hero-greeting { color: var(--pb2b-text-muted); font-weight: 600; }
.phoenix-b2b-panel .pb2b-hero-company { font-size: clamp(20px, 3.5vw, 26px); font-weight: 800; line-height: 1.1; }
.phoenix-b2b-panel .pb2b-hero-meta { gap: 8px; flex-wrap: wrap; }
.phoenix-b2b-panel .pb2b-hero-pill { background: var(--pb2b-bg-3); color: var(--pb2b-text); border: 1px solid var(--pb2b-border); border-radius: 999px; }
.phoenix-b2b-panel .pb2b-hero-pill-accent { background: var(--pb2b-primary-soft); color: var(--pb2b-primary-strong); border-color: color-mix(in srgb, var(--pb2b-primary) 30%, var(--pb2b-border)); }
.phoenix-b2b-panel .pb2b-hero-status { color: var(--pb2b-text); }
.phoenix-b2b-panel .pb2b-hero-cta { gap: 10px; flex-wrap: wrap; }

/* Statystyki — rowne, premium karty. */
.phoenix-b2b-panel .pb2b-stats { gap: var(--pb2b-section-gap); }
.phoenix-b2b-panel .pb2b-stat {
	display: flex; flex-direction: column; gap: 6px;
	padding: 16px 18px; min-height: 106px;
	border-radius: var(--pb2b-radius);
	background: var(--pb2b-card);
	border: 1px solid var(--pb2b-border);
	box-shadow: var(--pb2b-shadow-sm);
}
.phoenix-b2b-panel .pb2b-stat-label { color: var(--pb2b-text-muted); font-size: 12px; font-weight: 600; }
.phoenix-b2b-panel .pb2b-stat-value { color: var(--pb2b-text-strong); font-size: clamp(22px, 3.5vw, 28px); font-weight: 800; line-height: 1.05; }
.phoenix-b2b-panel .pb2b-stat-foot { color: var(--pb2b-text-muted); font-size: 11.5px; }
.phoenix-b2b-panel .pb2b-stat-accent { box-shadow: inset 3px 0 0 0 var(--pb2b-primary), var(--pb2b-shadow-sm); }
.phoenix-b2b-panel .pb2b-stat-success { box-shadow: inset 3px 0 0 0 var(--pb2b-success), var(--pb2b-shadow-sm); }

/* Karty + naglowki. */
.phoenix-b2b-panel .pb2b-card { background: var(--pb2b-card); border: 1px solid var(--pb2b-border); border-radius: var(--pb2b-radius); box-shadow: var(--pb2b-shadow-sm); }
.phoenix-b2b-panel .pb2b-card-header { padding: 16px 18px; border-bottom: 1px solid var(--pb2b-border); }
.phoenix-b2b-panel .pb2b-card-title { font-size: 15px; font-weight: 800; }
.phoenix-b2b-panel .pb2b-card-action { color: var(--pb2b-primary-strong); font-weight: 700; font-size: 13px; }
.phoenix-b2b-panel .pb2b-card-body { padding: 18px; }

/* Kafle szybkich akcji — rowne, premium, z mikro-uniesieniem. */
.phoenix-b2b-panel .pb2b-quick-tiles { gap: 10px; }
.phoenix-b2b-panel .pb2b-quick-tile {
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; text-align: center;
	padding: 16px 12px; min-height: 94px;
	border-radius: var(--pb2b-radius-sm);
	background: var(--pb2b-bg-3);
	border: 1px solid var(--pb2b-border);
	color: var(--pb2b-text); font-weight: 600;
	transition: background .15s ease, border-color .15s ease, transform .08s ease, box-shadow .15s ease;
}
.phoenix-b2b-panel .pb2b-quick-tile:hover {
	background: var(--pb2b-bg-2);
	border-color: color-mix(in srgb, var(--pb2b-primary) 40%, var(--pb2b-border));
	transform: translateY(-2px);
	box-shadow: var(--pb2b-shadow-sm);
}
.phoenix-b2b-panel .pb2b-quick-tile:focus-visible { outline: none; box-shadow: var(--pb2b-shadow-focus); }
.phoenix-b2b-panel .pb2b-quick-tile-icon { color: var(--pb2b-primary); }
.phoenix-b2b-panel .pb2b-quick-tile-label { color: var(--pb2b-text); font-size: 12.5px; }

/* Banery promocyjne na dashboardzie — czytelne w obu motywach. */
.phoenix-b2b-panel .pb2b-banner { background: var(--pb2b-card); border: 1px solid var(--pb2b-border); border-radius: var(--pb2b-radius); }
.phoenix-b2b-panel .pb2b-banner-body strong { color: var(--pb2b-text-strong); }
.phoenix-b2b-panel .pb2b-banner-icon { color: var(--pb2b-primary); }

/* =========================================================================
 * 8) RESZTA SEKCJI — przyciski, tabele, empty-state, stopka (spojnosc UI).
 * ========================================================================= */
.phoenix-b2b-panel .pb2b-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	padding: 11px 18px; border-radius: var(--pb2b-radius-sm);
	font-weight: 700; font-size: 14px; line-height: 1; cursor: pointer;
	border: 1px solid transparent;
	transition: background .15s ease, border-color .15s ease, filter .15s ease, transform .08s ease;
}
.phoenix-b2b-panel .pb2b-btn:active { transform: translateY(1px); }
.phoenix-b2b-panel .pb2b-btn:focus-visible { outline: none; box-shadow: var(--pb2b-shadow-focus); }
.phoenix-b2b-panel .pb2b-btn-primary { background: var(--pb2b-primary); color: var(--pb2b-primary-contrast); }
.phoenix-b2b-panel .pb2b-btn-primary:hover { background: var(--pb2b-primary-hover); color: var(--pb2b-primary-contrast); }
.phoenix-b2b-panel .pb2b-btn-outline { background: transparent; border-color: var(--pb2b-border-strong); color: var(--pb2b-text); }
.phoenix-b2b-panel .pb2b-btn-outline:hover { background: var(--pb2b-bg-3); border-color: color-mix(in srgb, var(--pb2b-primary) 45%, var(--pb2b-border)); }

.phoenix-b2b-panel .pb2b-table { width: 100%; border-collapse: collapse; }
.phoenix-b2b-panel .pb2b-table th { color: var(--pb2b-text-muted); font-weight: 700; }
.phoenix-b2b-panel .pb2b-table td { color: var(--pb2b-text); border-color: var(--pb2b-border); }

.phoenix-b2b-panel .pb2b-empty h4 { color: var(--pb2b-text-strong); }
.phoenix-b2b-panel .pb2b-empty p { color: var(--pb2b-text-muted); }
.phoenix-b2b-panel .pb2b-empty-icon { color: var(--pb2b-text-dim); }

.phoenix-b2b-panel .pb2b-app-footer { border-top: 1px solid var(--pb2b-border); }
.phoenix-b2b-panel .pb2b-app-footer-link { color: var(--pb2b-text-muted); }
.phoenix-b2b-panel .pb2b-app-footer-link:hover { color: var(--pb2b-text); }
.phoenix-b2b-panel .pb2b-app-footer-brand strong { color: var(--pb2b-text); }
.phoenix-b2b-panel .pb2b-app-footer-ver { color: var(--pb2b-text-dim); }

/* =========================================================================
 * 9) DESKTOP (>=1200) — drobny polish stalej kolumny + chip koszyka.
 * ========================================================================= */
@media (min-width: 1200px) {
	/* Na PC w pillu koszyka pokazujemy ilosc + kwote (stack), badge nie jest potrzebny. */
	.phoenix-b2b-panel .pb2b-topbar-cart-meta { display: flex; flex-direction: column; line-height: 1.1; align-items: flex-start; }
	.phoenix-b2b-panel .pb2b-topbar-cart-count { display: block; font-weight: 800; font-size: 13px; color: var(--pb2b-text-strong); white-space: nowrap; }
	.phoenix-b2b-panel .pb2b-topbar-cart-total { font-size: 11px; color: var(--pb2b-text-muted); white-space: nowrap; }
	.phoenix-b2b-panel .pb2b-topbar-cart-total:empty { display: none; }
	.phoenix-b2b-panel .pb2b-topbar-cart-badge { display: none; }
}