/*
 * Phoenix B2B — 2.12.88 — REGISTRATION FINAL (strona rejestracji B2B).
 * =====================================================================
 *
 * Plik SAMOWYSTARCZALNY. Ładowany JAKO OSTATNI w kaskadzie rejestracji
 * (po 2.12.85 i 2.12.87), więc nawet gdyby starsze arkusze nie doszły,
 * strona rejestracji jest w pełni ciemna i poprawna.
 *
 * PRZYCZYNA „BIAŁEJ KARTY NA MOBILE" (root cause, naprawiona tutaj):
 *   2.12.85 i 2.12.87 wymuszały ciemne tło na KONTENERZE karty
 *   (`.pb2b-card` / `.pb2b-auth-card`) oraz na POLACH (`input/select`),
 *   ale NIGDY na samym elemencie <form> (`.phoenix-b2b-form`) ani na
 *   wewnętrznym wrapperze (`.phoenix-b2b-registration`). Motyw / WooCommerce
 *   maluje generyczny `<form>` (np. `.entry-content form`, `.woocommerce form`)
 *   na BIAŁO (tło + ramka + cień = wygląd „białej karty"). Ta biała forma
 *   renderuje się NA WIERZCHU ciemnej karty → użytkownik widzi białą kartę,
 *   mimo że kontener jest ciemny. Logowanie tego nie miało, bo jego <form>
 *   ma inną klasę (`.pb2b-login-form`) i prostszą strukturę.
 *
 *   NAPRAWA (§2): twardo zerujemy tło/ramkę/cień/padding na <form>,
 *   wewnętrznym wrapperze ORAZ na wszystkich warstwach auth — z wysoką
 *   specyficznością i !important, więc wygrywamy z dowolnym motywem.
 *
 * Zakres: WYŁĄCZNIE strona rejestracji (`.phoenix-b2b-panel.pb2b-auth-reg`)
 * oraz modal sukcesu (`.pb2b-reg-success-modal`). CSS-only. NIE dotyka panelu
 * klienta/admina, sklepu, checkoutu ani logowania.
 *
 * Spis treści:
 *   §1  Tło sekcji rejestracji (pełny ciemny premium, jak login)
 *   §2  KONIEC BIAŁEJ KARTY — <form> + wrappery + karta na ciemno (KLUCZOWE)
 *   §3  Inputy / selecty / textarea — ciemne, jasny tekst
 *   §4  Placeholder + focus
 *   §5  Autofill (Safari / iPhone / Chrome) — brak białych/żółtych pól
 *   §6  Zgody — czytelny grid: checkbox po lewej, tekst po prawej
 *   §7  Mobile — formularz w ekranie, duży przycisk, brak łamania słów
 *   §8  Popup sukcesu — premium dark, overlay, wyśrodkowany, iOS-safe
 */

/* Lokalne fallbacki tokenów (gdyby system zmiennych nie był załadowany).
   Tony spójne z LOGOWANIEM, by rejestracja wyglądała identycznie. */
.phoenix-b2b-panel.pb2b-auth-reg {
	--pb2b-reg-bg-1: #0c0d16;
	--pb2b-reg-bg-2: #0f1020;
	--pb2b-reg-field: var(--pb2b-bg-2, #1b1d2a);
	--pb2b-reg-text: var(--pb2b-text, #f2f3fb);
	--pb2b-reg-text-soft: var(--pb2b-text-soft, #c7c9d9);
	--pb2b-reg-text-dim: var(--pb2b-text-dim, #8b8fa6);
	--pb2b-reg-border: rgba(255, 255, 255, .08);
	--pb2b-reg-border-strong: var(--pb2b-border-strong, #353954);
	--pb2b-reg-primary: var(--pb2b-primary, #7c5cff);
	--pb2b-reg-primary-2: var(--pb2b-primary-2, #a78bfa);
	--pb2b-reg-danger: var(--pb2b-danger, #f87171);
}

/* =======================================================================
 * §1 — Tło całej sekcji rejestracji (ciemny premium, jak login)
 * ===================================================================== */
.phoenix-b2b-panel.pb2b-auth-reg,
.pb2b-register-page.phoenix-b2b-panel.pb2b-auth-reg {
	background:
		radial-gradient(1200px 600px at 50% -10%, rgba(124, 92, 255, .14), transparent 60%),
		linear-gradient(180deg, var(--pb2b-reg-bg-1) 0%, var(--pb2b-reg-bg-2) 55%, var(--pb2b-reg-bg-1) 100%) !important;
	color: var(--pb2b-reg-text) !important;
}

/* =======================================================================
 * §2 — KONIEC BIAŁEJ KARTY (root cause fix)
 * Zerujemy WSZYSTKIE warstwy, które motyw/WooCommerce mógł zamalować na
 * biało: <form>, wewnętrzny wrapper rejestracji oraz wrappery auth.
 * Kartę (właściwą) malujemy ciemnym premium gradientem jak login.
 * ===================================================================== */

/* 2a. Element <form> i wrapper rejestracji — ZERO własnego tła/ramki/cienia.
   To jest właściwa naprawa „białej karty": motyw maluje generyczny form,
   tu go neutralizujemy. */
.phoenix-b2b-panel.pb2b-auth-reg form,
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form,
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-registration-form,
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-registration,
.phoenix-b2b-panel.pb2b-auth-reg .woocommerce form,
.phoenix-b2b-panel.pb2b-auth-reg .pb2b-auth-form-wrap,
.phoenix-b2b-panel.pb2b-auth-reg .pb2b-auth-grid,
.phoenix-b2b-panel.pb2b-auth-reg .pb2b-auth-side {
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	border-radius: 0 !important;
}
/* Nie odziedzicz paddingu „kartowego" motywu na samym <form>. */
.phoenix-b2b-panel.pb2b-auth-reg form,
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form,
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-registration {
	padding: 0 !important;
	margin: 0 !important;
}

/* 2b. WŁAŚCIWA karta formularza — ciemna premium (jedyna „karta" na stronie).
   Wysoka specyficzność + !important: wygrywamy z motywem nawet bez load-order. */
.phoenix-b2b-panel.pb2b-auth-reg .pb2b-card,
.phoenix-b2b-panel.pb2b-auth-reg .pb2b-auth-card,
.phoenix-b2b-panel.pb2b-auth-reg .pb2b-auth-card-wide {
	background:
		radial-gradient(circle at top left, rgba(124, 92, 255, .16), transparent 36%),
		linear-gradient(180deg, rgba(28, 30, 46, .97) 0%, rgba(20, 21, 33, .97) 100%) !important;
	border: 1px solid var(--pb2b-reg-border) !important;
	border-radius: 18px !important;
	box-shadow:
		0 24px 80px rgba(0, 0, 0, .5),
		inset 0 1px 0 rgba(255, 255, 255, .04) !important;
	color: var(--pb2b-reg-text) !important;
}

/* 2c. Sekcje formularza i etykiety — jasny tekst (gdyby motyw przyciemniał). */
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-section {
	color: var(--pb2b-reg-text) !important;
}
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field label,
.phoenix-b2b-panel.pb2b-auth-reg .pb2b-auth-form-title,
.phoenix-b2b-panel.pb2b-auth-reg .pb2b-auth-title,
.phoenix-b2b-panel.pb2b-auth-reg .pb2b-auth-lead,
.phoenix-b2b-panel.pb2b-auth-reg h2,
.phoenix-b2b-panel.pb2b-auth-reg h3 {
	color: var(--pb2b-reg-text) !important;
}
.phoenix-b2b-panel.pb2b-auth-reg .pb2b-muted,
.phoenix-b2b-panel.pb2b-auth-reg .pb2b-auth-form-sub {
	color: var(--pb2b-reg-text-soft) !important;
}
.phoenix-b2b-panel.pb2b-auth-reg .required {
	color: var(--pb2b-reg-danger) !important;
}

/* =======================================================================
 * §3 — Inputy / selecty / textarea — ciemne pola, jasny wpisywany tekst
 * ===================================================================== */
.phoenix-b2b-panel.pb2b-auth-reg input[type="text"],
.phoenix-b2b-panel.pb2b-auth-reg input[type="email"],
.phoenix-b2b-panel.pb2b-auth-reg input[type="tel"],
.phoenix-b2b-panel.pb2b-auth-reg input[type="password"],
.phoenix-b2b-panel.pb2b-auth-reg input[type="url"],
.phoenix-b2b-panel.pb2b-auth-reg input[type="number"],
.phoenix-b2b-panel.pb2b-auth-reg select,
.phoenix-b2b-panel.pb2b-auth-reg textarea {
	background-color: var(--pb2b-reg-field) !important;
	color: var(--pb2b-reg-text) !important;
	-webkit-text-fill-color: var(--pb2b-reg-text) !important;
	border: 1px solid var(--pb2b-reg-border-strong) !important;
	border-radius: 12px !important;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .03) !important;
	-webkit-appearance: none;
	appearance: none;
}
/* Ciemne opcje selecta (tam gdzie przeglądarka respektuje). */
.phoenix-b2b-panel.pb2b-auth-reg select option {
	background: var(--pb2b-reg-field);
	color: var(--pb2b-reg-text);
}

/* =======================================================================
 * §4 — Placeholder + focus
 * ===================================================================== */
.phoenix-b2b-panel.pb2b-auth-reg input::placeholder,
.phoenix-b2b-panel.pb2b-auth-reg textarea::placeholder {
	color: var(--pb2b-reg-text-dim) !important;
	opacity: 1 !important;
}
.phoenix-b2b-panel.pb2b-auth-reg input:focus,
.phoenix-b2b-panel.pb2b-auth-reg select:focus,
.phoenix-b2b-panel.pb2b-auth-reg textarea:focus {
	border-color: var(--pb2b-reg-primary-2) !important;
	box-shadow:
		0 0 0 4px rgba(124, 92, 255, .22),
		inset 0 1px 0 rgba(255, 255, 255, .04) !important;
	outline: none !important;
}

/* =======================================================================
 * §5 — AUTOFILL: brak białych/żółtych pól na Safari / iPhone / Chrome
 * Przeglądarka maluje własne tło (-internal-autofill-selected), którego NIE
 * da się nadpisać `background`. Inset box-shadow przykrywa je na ciemny kolor.
 * ===================================================================== */
.phoenix-b2b-panel.pb2b-auth-reg input:-webkit-autofill,
.phoenix-b2b-panel.pb2b-auth-reg input:-webkit-autofill:hover,
.phoenix-b2b-panel.pb2b-auth-reg input:-webkit-autofill:focus,
.phoenix-b2b-panel.pb2b-auth-reg input:-webkit-autofill:active,
.phoenix-b2b-panel.pb2b-auth-reg select:-webkit-autofill,
.phoenix-b2b-panel.pb2b-auth-reg textarea:-webkit-autofill {
	-webkit-text-fill-color: var(--pb2b-reg-text) !important;
	caret-color: var(--pb2b-reg-text) !important;
	-webkit-box-shadow: 0 0 0 1000px var(--pb2b-reg-field) inset !important;
	box-shadow: 0 0 0 1000px var(--pb2b-reg-field) inset !important;
	border: 1px solid var(--pb2b-reg-border-strong) !important;
	border-radius: 12px !important;
	transition: background-color 9999s ease-out 0s, color 9999s ease-out 0s !important;
}
/* Autofill + focus — utrzymaj fioletowy glow, tło dalej ciemne. */
.phoenix-b2b-panel.pb2b-auth-reg input:-webkit-autofill:focus {
	-webkit-box-shadow:
		0 0 0 1000px var(--pb2b-reg-field) inset,
		0 0 0 4px rgba(124, 92, 255, .22) !important;
	box-shadow:
		0 0 0 1000px var(--pb2b-reg-field) inset,
		0 0 0 4px rgba(124, 92, 255, .22) !important;
	border-color: var(--pb2b-reg-primary-2) !important;
}

/* =======================================================================
 * §6 — ZGODY: czytelny grid (checkbox po lewej, tekst po prawej)
 * Markup: <label class="pb2b-consent-row"><input><span class="pb2b-consent-text">…</span></label>
 * Stary kontener `.phoenix-b2b-form-field-checkbox` zostaje (kompatybilność).
 * ===================================================================== */
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field-checkbox {
	background: rgba(255, 255, 255, .03) !important;
	border: 1px solid var(--pb2b-reg-border) !important;
	border-radius: 12px !important;
	padding: 12px 14px !important;
}
.phoenix-b2b-panel.pb2b-auth-reg .pb2b-consent-row,
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field-checkbox label {
	display: grid !important;
	grid-template-columns: 24px minmax(0, 1fr) !important;
	gap: 12px !important;
	align-items: start !important;
	margin: 0 !important;
	cursor: pointer;
}
.phoenix-b2b-panel.pb2b-auth-reg .pb2b-consent-text,
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field-checkbox label {
	color: var(--pb2b-reg-text-soft) !important;
	line-height: 1.5 !important;
	/* KONIEC łamania pojedynczych słów (np. „regul amin"). */
	word-break: normal !important;
	overflow-wrap: break-word !important;
	-webkit-hyphens: none !important;
	hyphens: none !important;
}
.phoenix-b2b-panel.pb2b-auth-reg .pb2b-consent-text {
	display: block;
	min-width: 0; /* pozwala tekstowi zawijać w gridzie zamiast wypychać kolumnę */
}
.phoenix-b2b-panel.pb2b-auth-reg .pb2b-consent-row a,
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field-checkbox a {
	color: var(--pb2b-reg-primary-2) !important;
	text-decoration: underline;
	text-underline-offset: 2px;
	white-space: nowrap; /* link „regulamin" / „politykę prywatności" w jednej linii */
}
.phoenix-b2b-panel.pb2b-auth-reg .pb2b-consent-row a:hover,
.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-field-checkbox a:hover {
	color: #c4b5fd !important;
}
/* Checkbox — duży, fioletowy akcent, nie rozjeżdża layoutu. */
.phoenix-b2b-panel.pb2b-auth-reg input[type="checkbox"] {
	width: 22px !important;
	height: 22px !important;
	margin: 1px 0 0 !important;
	flex: 0 0 22px;
	accent-color: var(--pb2b-reg-primary) !important;
	cursor: pointer;
}

/* =======================================================================
 * §7 — Mobile: formularz w ekranie, duży przycisk, czytelne zgody
 * ===================================================================== */
@media (max-width: 640px) {
	.phoenix-b2b-panel.pb2b-auth-reg .pb2b-auth-card,
	.phoenix-b2b-panel.pb2b-auth-reg .pb2b-auth-card-wide {
		padding: 18px 16px !important;
		border-radius: 14px !important;
	}
	.phoenix-b2b-panel.pb2b-auth-reg .pb2b-auth-title {
		font-size: 22px !important;
		line-height: 1.25 !important;
	}
	.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-section {
		margin: 16px 0 8px !important;
		font-size: 12px !important;
	}
	.phoenix-b2b-panel.pb2b-auth-reg input,
	.phoenix-b2b-panel.pb2b-auth-reg select,
	.phoenix-b2b-panel.pb2b-auth-reg textarea {
		font-size: 16px !important; /* iOS: ≥16px zapobiega auto-zoomowi pola */
		padding: 12px 13px !important;
	}
	.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-actions .pb2b-btn,
	.phoenix-b2b-panel.pb2b-auth-reg .pb2b-btn-block {
		width: 100% !important;
		padding: 14px 18px !important;
		font-size: 16px !important;
	}
	/* Siatka pól: zawsze jedna kolumna. */
	.phoenix-b2b-panel.pb2b-auth-reg .phoenix-b2b-form-row {
		grid-template-columns: 1fr !important;
	}
}

/* =======================================================================
 * §8 — POPUP SUKCESU: premium dark, overlay, wyśrodkowany, iOS-safe
 * ===================================================================== */
.pb2b-reg-success-modal {
	position: fixed !important;
	inset: 0 !important;
	z-index: 999999 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 24px !important;
	/* iOS/Safari: bezpieczne marginesy notcha + płynne wejście. */
	padding: max(24px, env(safe-area-inset-top)) max(24px, env(safe-area-inset-right)) max(24px, env(safe-area-inset-bottom)) max(24px, env(safe-area-inset-left)) !important;
	background: rgba(6, 7, 14, .72) !important;
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	-webkit-overflow-scrolling: touch;
	overflow: auto;
	animation: pb2b-reg-fade .22s ease-out both;
}
.pb2b-reg-success-modal[hidden] { display: none !important; }

.pb2b-reg-success-card {
	width: 100%;
	max-width: 440px;
	margin: auto;
	background:
		radial-gradient(circle at top left, rgba(124, 92, 255, .20), transparent 40%),
		linear-gradient(180deg, rgba(30, 32, 48, .98), rgba(18, 19, 30, .98)) !important;
	border: 1px solid rgba(255, 255, 255, .10) !important;
	border-radius: 20px !important;
	box-shadow: 0 30px 90px rgba(0, 0, 0, .6), inset 0 1px 0 rgba(255, 255, 255, .05) !important;
	color: var(--pb2b-text, #f2f3fb);
	padding: 30px 28px 24px;
	text-align: center;
	animation: pb2b-reg-pop .26s cubic-bezier(.2, .9, .3, 1.2) both;
}
.pb2b-reg-success-ico {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 60px;
	height: 60px;
	border-radius: 50%;
	margin-bottom: 14px;
	color: #c4f7d4;
	background: radial-gradient(circle, rgba(34, 197, 94, .26), rgba(34, 197, 94, .08));
	border: 1px solid rgba(74, 222, 128, .35);
}
.pb2b-reg-success-card h2 {
	margin: 0 0 10px !important;
	font-size: 23px !important;
	font-weight: 700 !important;
	color: #f8fafc !important;
}
.pb2b-reg-success-card p {
	margin: 0 0 10px !important;
	font-size: 14.5px !important;
	line-height: 1.55 !important;
	color: var(--pb2b-text-soft, #c7c9d9) !important;
}
.pb2b-reg-success-redirect {
	margin-top: 14px !important;
	font-size: 13px !important;
	color: var(--pb2b-text-dim, #9aa0b4) !important;
}
.pb2b-reg-success-count {
	display: inline-block;
	min-width: 26px;
	padding: 1px 8px;
	margin-left: 4px;
	border-radius: 999px;
	font-weight: 700;
	color: #ede9fe;
	background: rgba(124, 92, 255, .28);
	border: 1px solid rgba(167, 139, 250, .5);
}
.pb2b-reg-success-actions {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-top: 20px;
}
.pb2b-reg-success-actions .pb2b-btn {
	width: 100%;
	padding: 13px 18px;
	border-radius: 12px;
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
	border: 1px solid transparent;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.pb2b-reg-success-actions .pb2b-btn-primary {
	background: linear-gradient(135deg, var(--pb2b-primary, #7c5cff), var(--pb2b-primary-2, #a78bfa)) !important;
	color: #fff !important;
	box-shadow: 0 10px 26px rgba(124, 92, 255, .4);
}
.pb2b-reg-success-actions .pb2b-btn-primary:hover { filter: brightness(1.06); }
.pb2b-reg-success-close,
.pb2b-reg-success-actions .pb2b-reg-success-close {
	background: transparent !important;
	color: var(--pb2b-text-soft, #c7c9d9) !important;
	border: 1px solid rgba(255, 255, 255, .14) !important;
}
.pb2b-reg-success-close:hover { background: rgba(255, 255, 255, .05) !important; }

/* Gdy modal aktywny (JS dodaje .pb2b-reg-has-modal) — ukryj inline-fallback,
   żeby nie dublować komunikatu. */
.phoenix-b2b-panel.pb2b-reg-has-modal .pb2b-auth-success { display: none !important; }

@keyframes pb2b-reg-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes pb2b-reg-pop {
	from { opacity: 0; transform: translateY(10px) scale(.97); }
	to   { opacity: 1; transform: translateY(0) scale(1); }
}

@media (max-width: 380px) {
	.pb2b-reg-success-card { padding: 24px 18px 18px; }
	.pb2b-reg-success-card h2 { font-size: 20px !important; }
}