/*
Skórka logowania/rejestracji dla shortcode [kwiz_account] z wtyczki KWIZ Live.

Zasada: wtyczka pozostaje wizualnie neutralna (ciemny, neonowy motyw
uniwersalny dla dowolnej strony WordPress) — TEN plik nadpisuje wyłącznie
zmienne CSS wtyczki w obrębie strony logowania (klasa .kwiz-account-scope,
dodana w wtyczce specjalnie w tym celu), więc ekran samej gry/hosta
zostaje nietknięty niezależnie od aktywnego motywu.
*/

.kwiz-scope.kwiz-account-scope{
	/* nadpisanie zmiennych, których używa CSS wtyczki (--bg, --panel, --trace itd.) */
	--bg:var(--kwiz-bg, #f5f3ff);
	--bg2:#ffffff;
	--trace:var(--kwiz-purple, #7c4dff);
	--blue:var(--kwiz-blue, #3d8bff);
	--amber:var(--kwiz-orange, #ff8a34);
	--red:var(--kwiz-red, #ff5c5c);
	--ink:var(--kwiz-text, #241f3d);
	--ink-dim:var(--kwiz-muted, #6b6690);
	--panel:#ffffff;
	--line:#ece7ff;

	font-family:var(--font-body, "Nunito", sans-serif);
	font-weight:600;
	background:
		radial-gradient(circle at 10% 10%, rgba(124,77,255,.12), transparent 26%),
		radial-gradient(circle at 90% 15%, rgba(0,212,212,.12), transparent 24%),
		var(--bg);
	border-radius:28px;
	box-shadow:0 18px 50px rgba(90,50,214,.14);
	border:3px solid #ece7ff;
	padding:34px 26px 40px;
}

.kwiz-account-scope .kwiz-eyebrow{
	font-family:var(--font-display, "Baloo 2", sans-serif);
	font:800 12px var(--font-display, "Baloo 2", sans-serif);
	letter-spacing:.02em;
	text-transform:none;
	background:#fff;
	color:var(--trace);
	display:inline-flex;
	padding:8px 13px;
	border-radius:999px;
	box-shadow:0 4px 0 #e3ddff;
}
.kwiz-account-scope .kwiz-eyebrow::before{ box-shadow:0 0 6px var(--trace); }

.kwiz-account-scope .kwiz-h1{
	font-family:var(--font-display, "Baloo 2", sans-serif);
	font-weight:800;
	font-size:30px;
	letter-spacing:-.01em;
	color:var(--kwiz-text, #241f3d);
}

.kwiz-account-scope .kwiz-card{
	background:#fff;
	border:3px solid #ece7ff;
	border-radius:22px;
	padding:26px;
	box-shadow:0 5px 0 rgba(90,50,214,.10);
}

.kwiz-account-scope .kwiz-card label{
	font:800 12px var(--font-body, "Nunito", sans-serif);
	color:var(--kwiz-muted, #6b6690);
	text-transform:none;
	letter-spacing:0;
}

.kwiz-account-scope .kwiz-card input[type="text"],
.kwiz-account-scope .kwiz-card input[type="email"],
.kwiz-account-scope .kwiz-card input[type="password"]{
	font-family:var(--font-body, "Nunito", sans-serif);
	font-weight:700;
	border-radius:14px;
	border:2px solid #eceaf7;
}
.kwiz-account-scope .kwiz-card input:focus{ border-color:var(--trace); }

/* przyciski — ten sam „chrupiący” styl 3D co na reszcie strony */
.kwiz-account-scope .kwiz-btn{
	font-family:var(--font-display, "Baloo 2", sans-serif);
	font-weight:800;
	border-radius:16px;
	transition:transform .09s ease, box-shadow .09s ease;
	position:relative;
}
.kwiz-account-scope .kwiz-btn-primary{
	background:var(--trace);
	color:#fff;
	box-shadow:0 6px 0 var(--kwiz-purple-dark, #5a32d6);
}
.kwiz-account-scope .kwiz-btn-primary:hover{ transform:translateY(-2px); box-shadow:0 8px 0 var(--kwiz-purple-dark, #5a32d6); }
.kwiz-account-scope .kwiz-btn-primary:active{ transform:translateY(4px); box-shadow:0 2px 0 var(--kwiz-purple-dark, #5a32d6); }

/* przycisk „Wyloguj się” na ekranie zalogowanego użytkownika */
.kwiz-account-scope form button[type="submit"]:not(.kwiz-btn-primary){
	font-family:var(--font-body, "Nunito", sans-serif);
	font-weight:800;
	border-radius:14px;
	background:transparent;
	border:2px solid #ece7ff;
	color:var(--kwiz-muted, #6b6690);
	padding:12px 18px;
	cursor:pointer;
}
.kwiz-account-scope form button[type="submit"]:not(.kwiz-btn-primary):hover{
	border-color:var(--trace); color:var(--trace);
}

/* zakładki Logowanie / Rejestracja */
.kwiz-account-scope .kwiz-account-tabs{ gap:10px; }
.kwiz-account-scope .kwiz-account-tab{
	font-family:var(--font-display, "Baloo 2", sans-serif);
	font-weight:700;
	border-radius:14px;
	border:2px solid #ece7ff;
	background:#fff;
	box-shadow:0 4px 0 #ece7ff;
	transition:transform .09s ease;
}
.kwiz-account-scope .kwiz-account-tab:hover{ transform:translateY(-2px); color:var(--trace); }
.kwiz-account-scope .kwiz-account-tab.active{
	background:var(--trace);
	color:#fff;
	border-color:var(--trace);
	box-shadow:0 4px 0 var(--kwiz-purple-dark, #5a32d6);
}

.kwiz-account-scope .kwiz-error{
	background:#fff0f0;
	border:2px solid var(--red);
	border-radius:12px;
	padding:10px 14px;
	font-weight:700;
}

@media (max-width:640px){
	.kwiz-scope.kwiz-account-scope{ padding:26px 18px 32px; border-radius:22px; }
	.kwiz-account-scope .kwiz-h1{ font-size:24px; }
}