/*
 * Phoenix B2B — 2.12.89 — REGISTRATION WORKING FINAL (strona rejestracji B2B).
 * =====================================================================
 *
 * CEL: rejestracja ma wyglądać 1:1 jak panel LOGOWANIA i mieć ZAWSZE
 * widoczny wpisywany tekst — niezależnie od motywu, cache i stanu tokenów.
 *
 * DLACZEGO TEN PLIK ISTNIEJE (root cause, naprawiony tutaj):
 *   1. Wrapper rejestracji ma klasę `.pb2b-auth`, więc DZIEDZICZY ciemną
 *      kartę/tło/nagłówki z panel-v3.css. ALE reguła INPUTÓW logowania w
 *      panel-v3 jest zawężona do `.pb2b-login-form input`, a formularz
 *      rejestracji używa `.phoenix-b2b-form-*`. Dlatego pola rejestracji NIE
 *      dostawały stylu logowania i wpadały w bazę z frontend.css
 *      (`.phoenix-b2b-form-field input { color: var(--pb2b-text); background:
 *      var(--pb2b-bg); }`). Gdy tokeny rozwiązywały się do złego motywu →
 *      ciemne pole + ciemny (niewidoczny) tekst albo biała karta.
 *   2. Poprzednie nakładki (2.12.85/87/88) używały `var()` zależnych od
 *      tokenów oraz NIE miały panel-v3 w zależnościach (niegwarantowana
 *      kolejność kaskady).
 *
 *   NAPRAWA: ten arkusz jest ZALEŻNY od panel-v3 (ładuje się PO nim) i
 *   TWARDO koduje paletę logowania (hex z `.pb2b-auth`), bez `var()` dla
 *   krytycznych właściwości (tło pola, kolor tekstu, -webkit-text-fill-color,
 *   caret). Dzięki temu wynik jest deterministyczny.
 *
 * PALETA = LOGOWANIE (panel-v3.css `.phoenix-b2b-panel.pb2b-auth`):
 *   tło strony  : radial(#7C3AED) + radial(#3B82F6) + #070B18
 *   karta       : #111827, border rgba(148,163,184,.16)
 *   tytuł       : #F8FAFC ; lead/sub/muted : #CBD5E1 ; meta : #94A3B8
 *   input       : tło #0B1220, border rgba(148,163,184,.22), tekst #F8FAFC
 *   focus       : border #A855F7, glow rgba(124,58,237,.22)
 *   przycisk     : linear-gradient(135deg,#A855F7,#7C3AED,#3B82F6), tekst #fff
 *   link        : #C4B5FD (hover #DDD6FE)
 *
 * ZAKRES: WYŁĄCZNIE strona rejestracji — `.pb2b-register-page`
 * (= `.phoenix-b2b-panel.pb2b-auth-reg`) oraz modal `.pb2b-reg-success-modal`.
 * CSS-only. NIE dotyka logowania, panelu klienta/admina, sklepu, checkoutu.
 *
 * Spis treści:
 *   §1  Tło sekcji + brak poziomego scrolla
 *   §2  KONIEC BIAŁEJ KARTY — <form> + wrappery transparentne, karta ciemna
 *   §3  Nagłówki / etykiety / teksty (jasne, jak login)
 *   §4  Inputy / select / textarea — ciemne, TWARDO jasny tekst
 *   §5  Placeholder + focus
 *   §6  Autofill (Safari / iPhone / Chrome) — bez białych/żółtych pól
 *   §7  Przyciski (gradient logowania) + linki
 *   §8  Zgody — czytelny grid (checkbox po lewej, tekst po prawej)
 *   §9  Mobile (max 767px) — premium, w ekranie
 *   §10 Popup sukcesu — premium dark, overlay, iOS-safe
 */

/* =======================================================================
 * §1 — Tło całej sekcji rejestracji = tło logowania (1:1) + brak h-scrolla
 * ===================================================================== */
.phoenix-b2b-panel.pb2b-register-page,
.pb2b-register-page.phoenix-b2b-panel.pb2b-auth-reg {
	background:
		radial-gradient(900px circle at 18% 8%, rgba(124, 58, 237, .20), transparent 60%),
		radial-gradient(760px circle at 85% 92%, rgba(59, 130, 246, .16), transparent 60%),
		#070B18 !important;
	color: #F8FAFC !important;
	overflow-x: hidden !important;        /* zero poziomego scrolla na mobile */
	max-width: 100% !important;
}

/* =======================================================================
 * §2 — KONIEC BIAŁEJ KARTY (root cause fix)
 * Zerujemy WSZYSTKIE warstwy, które motyw/WooCommerce mógł zamalować na
 * biało (<form>, wrapper rejestracji, warstwy auth). Jedyna „karta" na
 * stronie to ciemna `.pb2b-auth-card`.
 * ===================================================================== */
.phoenix-b2b-panel.pb2b-register-page form,
.phoenix-b2b-panel.pb2b-register-page .phoenix-b2b-form,
.phoenix-b2b-panel.pb2b-register-page .phoenix-b2b-registration-form,
.phoenix-b2b-panel.pb2b-register-page .phoenix-b2b-registration,
.phoenix-b2b-panel.pb2b-register-page .woocommerce form,
.phoenix-b2b-panel.pb2b-register-page .pb2b-auth-form-wrap,
.phoenix-b2b-panel.pb2b-register-page .pb2b-auth-grid,
.phoenix-b2b-panel.pb2b-register-page .pb2b-auth-side {
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	border-radius: 0 !important;
}
.phoenix-b2b-panel.pb2b-register-page form,
.phoenix-b2b-panel.pb2b-register-page .phoenix-b2b-form,
.phoenix-b2b-panel.pb2b-register-page .phoenix-b2b-registration {
	padding: 0 !important;
	margin: 0 !important;
}

/* WŁAŚCIWA karta — ciemna, jak login (#111827) */
.phoenix-b2b-panel.pb2b-register-page .pb2b-card,
.phoenix-b2b-panel.pb2b-register-page .pb2b-auth-card,
.phoenix-b2b-panel.pb2b-register-page .pb2b-auth-card-wide {
	background: #111827 !important;
	border: 1px solid rgba(148, 163, 184, .16) !important;
	border-radius: 16px !important;
	box-shadow:
		0 24px 80px rgba(0, 0, 0, .5),
		inset 0 1px 0 rgba(255, 255, 255, .04) !important;
	color: #F8FAFC !important;
}

/* =======================================================================
 * §3 — Nagłówki / etykiety / teksty (jasne — paleta logowania)
 * ===================================================================== */
.phoenix-b2b-panel.pb2b-register-page .pb2b-auth-title,
.phoenix-b2b-panel.pb2b-register-page .pb2b-auth-form-title,
.phoenix-b2b-panel.pb2b-register-page h2,
.phoenix-b2b-panel.pb2b-register-page h3,
.phoenix-b2b-panel.pb2b-register-page .phoenix-b2b-form-section {
	color: #F8FAFC !important;
}
.phoenix-b2b-panel.pb2b-register-page .phoenix-b2b-form-field label,
.phoenix-b2b-panel.pb2b-register-page .pb2b-auth-lead,
.phoenix-b2b-panel.pb2b-register-page .pb2b-muted,
.phoenix-b2b-panel.pb2b-register-page .pb2b-auth-form-sub {
	color: #CBD5E1 !important;
}
.phoenix-b2b-panel.pb2b-register-page .pb2b-auth-info,
.phoenix-b2b-panel.pb2b-register-page .pb2b-auth-badge {
	color: #94A3B8 !important;
}
.phoenix-b2b-panel.pb2b-register-page .required {
	color: #F87171 !important;
}
/* Sekcja-separator jak w panelu (subtelna linia pod nagłówkiem grupy) */
.phoenix-b2b-panel.pb2b-register-page .phoenix-b2b-form-section {
	border-bottom: 1px solid rgba(148, 163, 184, .14) !important;
}

/* =======================================================================
 * §4 — INPUTY / SELECT / TEXTAREA — ciemne pola, TWARDO jasny wpisywany tekst
 * Wysoka specyficzność (.phoenix-b2b-form-field input[type=…]) + !important
 * wygrywa z frontend.css i motywem. Kolory hex (bez var) = deterministyczne.
 * ===================================================================== */
.phoenix-b2b-panel.pb2b-register-page input[type="text"],
.phoenix-b2b-panel.pb2b-register-page input[type="email"],
.phoenix-b2b-panel.pb2b-register-page input[type="tel"],
.phoenix-b2b-panel.pb2b-register-page input[type="password"],
.phoenix-b2b-panel.pb2b-register-page input[type="url"],
.phoenix-b2b-panel.pb2b-register-page input[type="number"],
.phoenix-b2b-panel.pb2b-register-page select,
.phoenix-b2b-panel.pb2b-register-page textarea,
.phoenix-b2b-panel.pb2b-register-page .phoenix-b2b-form-field input[type="text"],
.phoenix-b2b-panel.pb2b-register-page .phoenix-b2b-form-field input[type="email"],
.phoenix-b2b-panel.pb2b-register-page .phoenix-b2b-form-field input[type="tel"],
.phoenix-b2b-panel.pb2b-register-page .phoenix-b2b-form-field input[type="password"],
.phoenix-b2b-panel.pb2b-register-page .phoenix-b2b-form-field select,
.phoenix-b2b-panel.pb2b-register-page .phoenix-b2b-form-field textarea {
	background-color: #0B1220 !important;
	background-image: none !important;
	color: #F8FAFC !important;
	-webkit-text-fill-color: #F8FAFC !important;   /* KRYTYCZNE: tekst zawsze jasny */
	caret-color: #60A5FA !important;
	border: 1px solid rgba(148, 163, 184, .22) !important;
	border-radius: 12px !important;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .03) !important;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
/* Ciemne opcje selecta (tam, gdzie przeglądarka respektuje) */
.phoenix-b2b-panel.pb2b-register-page select option {
	background: #0B1220 !important;
	color: #F8FAFC !important;
}
/* Strzałka selecta widoczna na ciemnym (własna, bo appearance:none) */
.phoenix-b2b-panel.pb2b-register-page select {
	background-image:
		url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2394A3B8' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>") !important;
	background-repeat: no-repeat !important;
	background-position: right 12px center !important;
	padding-right: 38px !important;
}

/* =======================================================================
 * §5 — Placeholder + focus
 * ===================================================================== */
.phoenix-b2b-panel.pb2b-register-page input::placeholder,
.phoenix-b2b-panel.pb2b-register-page textarea::placeholder {
	color: rgba(203, 213, 225, .72) !important;
	-webkit-text-fill-color: rgba(203, 213, 225, .72) !important;
	opacity: 1 !important;
}
.phoenix-b2b-panel.pb2b-register-page input:focus,
.phoenix-b2b-panel.pb2b-register-page select:focus,
.phoenix-b2b-panel.pb2b-register-page textarea:focus {
	border-color: #A855F7 !important;
	box-shadow:
		0 0 0 4px rgba(124, 58, 237, .22),
		inset 0 1px 0 rgba(255, 255, 255, .04) !important;
	outline: none !important;
}

/* =======================================================================
 * §6 — 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 ciemnym kolorem.
 * ===================================================================== */
.phoenix-b2b-panel.pb2b-register-page input:-webkit-autofill,
.phoenix-b2b-panel.pb2b-register-page input:-webkit-autofill:hover,
.phoenix-b2b-panel.pb2b-register-page input:-webkit-autofill:focus,
.phoenix-b2b-panel.pb2b-register-page input:-webkit-autofill:active,
.phoenix-b2b-panel.pb2b-register-page select:-webkit-autofill,
.phoenix-b2b-panel.pb2b-register-page textarea:-webkit-autofill {
	-webkit-text-fill-color: #F8FAFC !important;
	caret-color: #60A5FA !important;
	-webkit-box-shadow: 0 0 0 1000px #0B1220 inset !important;
	box-shadow: 0 0 0 1000px #0B1220 inset !important;
	border: 1px solid rgba(148, 163, 184, .22) !important;
	border-radius: 12px !important;
	transition: background-color 9999s ease-out 0s, color 9999s ease-out 0s !important;
}
.phoenix-b2b-panel.pb2b-register-page input:-webkit-autofill:focus {
	-webkit-box-shadow:
		0 0 0 1000px #0B1220 inset,
		0 0 0 4px rgba(124, 58, 237, .22) !important;
	box-shadow:
		0 0 0 1000px #0B1220 inset,
		0 0 0 4px rgba(124, 58, 237, .22) !important;
	border-color: #A855F7 !important;
}

/* =======================================================================
 * §7 — Przyciski (gradient logowania) + linki fioletowe
 * ===================================================================== */
.phoenix-b2b-panel.pb2b-register-page .pb2b-btn-primary,
.phoenix-b2b-panel.pb2b-register-page .phoenix-b2b-form-actions .pb2b-btn-primary {
	background: linear-gradient(135deg, #A855F7 0%, #7C3AED 45%, #3B82F6 100%) !important;
	color: #fff !important;
	border: 1px solid transparent !important;
	box-shadow: 0 10px 26px rgba(124, 58, 237, .35) !important;
}
.phoenix-b2b-panel.pb2b-register-page .pb2b-btn-primary:hover {
	filter: brightness(1.06);
}
.phoenix-b2b-panel.pb2b-register-page .pb2b-btn-outline {
	color: #F8FAFC !important;
	border: 1px solid rgba(168, 85, 247, .45) !important;
	background: transparent !important;
}
.phoenix-b2b-panel.pb2b-register-page .pb2b-link,
.phoenix-b2b-panel.pb2b-register-page a.pb2b-link {
	color: #C4B5FD !important;
	text-decoration: none !important;
}
.phoenix-b2b-panel.pb2b-register-page .pb2b-link:hover {
	color: #DDD6FE !important;
}

/* =======================================================================
 * §8 — ZGODY: czytelny grid (checkbox po lewej, tekst po prawej)
 * Markup: <label class="pb2b-consent-row"><input><span class="pb2b-consent-text">…</span></label>
 * KONIEC łamania słów typu „regul amin" / dziwnych podziałów linków.
 * ===================================================================== */
.phoenix-b2b-panel.pb2b-register-page .phoenix-b2b-form-field-checkbox {
	background: rgba(255, 255, 255, .03) !important;
	border: 1px solid rgba(148, 163, 184, .16) !important;
	border-radius: 12px !important;
	padding: 12px 14px !important;
}
.phoenix-b2b-panel.pb2b-register-page .pb2b-consent-row,
.phoenix-b2b-panel.pb2b-register-page .form-row.terms,
.phoenix-b2b-panel.pb2b-register-page .woocommerce-form__label-for-checkbox,
.phoenix-b2b-panel.pb2b-register-page .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-register-page .pb2b-consent-text,
.phoenix-b2b-panel.pb2b-register-page .pb2b-consent-row span,
.phoenix-b2b-panel.pb2b-register-page .woocommerce-form__label-for-checkbox span,
.phoenix-b2b-panel.pb2b-register-page .phoenix-b2b-form-field-checkbox label {
	color: #CBD5E1 !important;
	line-height: 1.45 !important;
	min-width: 0;                     /* pozwala zawijać w gridzie zamiast wypychać kolumnę */
	word-break: normal !important;
	overflow-wrap: normal !important;
	-webkit-hyphens: none !important;
	hyphens: none !important;
}
.phoenix-b2b-panel.pb2b-register-page .pb2b-consent-text {
	display: block;
}
.phoenix-b2b-panel.pb2b-register-page .pb2b-consent-row a,
.phoenix-b2b-panel.pb2b-register-page .woocommerce-form__label-for-checkbox a,
.phoenix-b2b-panel.pb2b-register-page .phoenix-b2b-form-field-checkbox a {
	color: #C4B5FD !important;
	text-decoration: none !important;
	white-space: nowrap;              /* „regulamin" / „politykę prywatności" w jednej linii */
}
.phoenix-b2b-panel.pb2b-register-page .pb2b-consent-row a:hover,
.phoenix-b2b-panel.pb2b-register-page .phoenix-b2b-form-field-checkbox a:hover {
	color: #DDD6FE !important;
}
/* Checkbox — duży, fioletowy akcent, stała szerokość kolumny */
.phoenix-b2b-panel.pb2b-register-page input[type="checkbox"] {
	width: 22px !important;
	height: 22px !important;
	margin: 0 !important;
	flex: 0 0 22px;
	accent-color: #7C3AED !important;
	cursor: pointer;
}

/* =======================================================================
 * §9 — MOBILE (max 767px): premium, w ekranie, duży przycisk
 * ===================================================================== */
@media (max-width: 767px) {
	.phoenix-b2b-panel.pb2b-register-page .pb2b-auth-card,
	.phoenix-b2b-panel.pb2b-register-page .pb2b-auth-card-wide {
		padding: 18px 16px !important;
		border-radius: 14px !important;
	}
	.phoenix-b2b-panel.pb2b-register-page .pb2b-auth-title {
		font-size: 22px !important;
		line-height: 1.25 !important;
	}
	.phoenix-b2b-panel.pb2b-register-page .phoenix-b2b-form-section {
		margin: 16px 0 8px !important;
		font-size: 12px !important;
	}
	/* Pola: 1 kolumna, wysokość ~54–60px, iOS bez auto-zoomu (≥16px) */
	.phoenix-b2b-panel.pb2b-register-page .phoenix-b2b-form-row {
		grid-template-columns: 1fr !important;
		gap: 14px !important;
		margin-bottom: 12px !important;
	}
	.phoenix-b2b-panel.pb2b-register-page input[type="text"],
	.phoenix-b2b-panel.pb2b-register-page input[type="email"],
	.phoenix-b2b-panel.pb2b-register-page input[type="tel"],
	.phoenix-b2b-panel.pb2b-register-page input[type="password"],
	.phoenix-b2b-panel.pb2b-register-page select,
	.phoenix-b2b-panel.pb2b-register-page textarea {
		font-size: 16px !important;
		padding: 16px 14px !important;   /* ≈ 56px wysokości pola */
		min-height: 54px !important;
	}
	.phoenix-b2b-panel.pb2b-register-page .phoenix-b2b-form-actions .pb2b-btn,
	.phoenix-b2b-panel.pb2b-register-page .pb2b-btn-block {
		width: 100% !important;
		padding: 16px 18px !important;
		font-size: 16px !important;
	}
}

/* =======================================================================
 * §10 — 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: 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, 58, 237, .20), transparent 40%),
		#111827 !important;
	border: 1px solid rgba(148, 163, 184, .16) !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: #F8FAFC;
	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: #CBD5E1 !important;
}
.pb2b-reg-success-extra {
	color: #E2E8F0 !important;
	font-weight: 600 !important;
}
.pb2b-reg-success-redirect {
	margin-top: 14px !important;
	font-size: 13px !important;
	color: #94A3B8 !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, 58, 237, .28);
	border: 1px solid rgba(168, 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: 14px 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, #A855F7 0%, #7C3AED 45%, #3B82F6 100%) !important;
	color: #fff !important;
	box-shadow: 0 10px 26px rgba(124, 58, 237, .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: #CBD5E1 !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 */
.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; }
}

@media (prefers-reduced-motion: reduce) {
	.pb2b-reg-success-modal,
	.pb2b-reg-success-card { animation: none !important; }
}