/**
 * M2 Sensei — login screen (warm porcelain).
 * Neutrals follow sensei.css's V2.2 warm-paper ramp (no pure #fff, warm ink)
 * to cut glare; keep the two files' ramps in sync.
 * Accent vars (--sn-a1/--sn-a2/--sn-soft/--sn-ring) and --sn-login-mark
 * (site initial) are injected inline by PHP after this file.
 */

:root {
	--sn-a1: #7c3aed;
	--sn-a2: #4f46e5;
	--sn-soft: #6d28d9;
	--sn-ring: rgba(124, 58, 237, .25);
	--sn-bg: #efece4;
	--sn-surface: rgba(252, 250, 244, .92);
	--sn-border: #e3ded1;
	--sn-border-strong: #cfc8b8;
	--sn-field: #fcfaf4;
	--sn-text: #322f27;
	--sn-muted: #635e50;
	--sn-dim: #8f887a;
}

body.login {
	background:
		radial-gradient(600px 420px at 18% 8%, var(--sn-ring), transparent 65%),
		radial-gradient(700px 480px at 85% 92%, rgba(6, 182, 212, .12), transparent 65%),
		radial-gradient(500px 400px at 70% 20%, rgba(236, 72, 153, .08), transparent 65%),
		var(--sn-bg);
	font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Inter", "Segoe UI", Roboto, sans-serif;
	-webkit-font-smoothing: antialiased;
}

#login { width: 380px; padding-top: 6vh; }

/* Logo: gradient tile with the site initial */
body.login h1 a {
	position: relative;
	width: 84px;
	height: 84px;
	background-image: none;
	background: linear-gradient(135deg, var(--sn-a1), var(--sn-a2));
	border-radius: 24px;
	box-shadow: 0 12px 40px var(--sn-ring);
	text-indent: 0;
	font-size: 0;
	overflow: hidden;
	transition: transform .2s ease, box-shadow .2s ease;
}
body.login h1 a:hover { transform: translateY(-2px); box-shadow: 0 16px 48px var(--sn-ring); }
@media (prefers-reduced-motion: no-preference) {
	body.login h1 { animation: sn-float 7s ease-in-out infinite; }
}
@keyframes sn-float {
	0%, 100% { transform: translateY(0); }
	50%      { transform: translateY(-5px); }
}
body.login h1 a::after {
	content: var(--sn-login-mark, "\2726");
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 38px;
	font-weight: 700;
	color: #fff;
	letter-spacing: -.02em;
}

/* The form card */
body.login form,
body.login #loginform {
	background: var(--sn-surface);
	-webkit-backdrop-filter: blur(18px);
	backdrop-filter: blur(18px);
	border: 1px solid var(--sn-border);
	border-radius: 18px;
	box-shadow: 0 24px 80px rgba(63, 56, 40, .12);
	padding: 28px;
	margin-top: 24px;
}
body.login form .forgetmenot { margin-top: 6px; }
body.login label { color: var(--sn-muted); font-size: 13px; }

body.login input[type="text"],
body.login input[type="password"],
body.login input[type="email"],
body.login input[type="number"] {
	background: var(--sn-field);
	border: 1px solid var(--sn-border-strong);
	color: var(--sn-text);
	border-radius: 10px;
	box-shadow: none;
	padding: 6px 12px;
	min-height: 44px;
	font-size: 15px;
	transition: border-color .15s ease, box-shadow .15s ease;
}
body.login input[type="text"]:focus,
body.login input[type="password"]:focus,
body.login input[type="email"]:focus,
body.login input[type="number"]:focus {
	border-color: var(--sn-a1);
	box-shadow: 0 0 0 3px var(--sn-ring);
	outline: none;
	color: var(--sn-text);
}
body.login input[type="checkbox"] {
	background: var(--sn-field);
	border: 1px solid var(--sn-border-strong);
	box-shadow: none;
}
body.login input[type="checkbox"]:checked {
	background: linear-gradient(135deg, var(--sn-a1), var(--sn-a2));
	border-color: transparent;
}
body.login input[type="checkbox"]:checked::before {
	content: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2020%2020%22%3E%3Cpath%20d%3D%22M14.83%204.89l1.34.94-5.81%208.38h-.9L5.78%209.67l1.34-1.25%202.57%202.4z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E");
}
body.login .button.wp-hide-pw { color: var(--sn-dim); }
body.login .button.wp-hide-pw:hover,
body.login .button.wp-hide-pw:focus { color: var(--sn-text); box-shadow: none; border-color: transparent; }

body.login .button-primary,
body.login .button-primary:focus {
	width: 100%;
	background: linear-gradient(135deg, var(--sn-a1), var(--sn-a2));
	border: 0;
	border-radius: 10px;
	color: #fff;
	min-height: 44px;
	font-size: 15px;
	font-weight: 600;
	text-shadow: none;
	box-shadow: 0 6px 20px var(--sn-ring);
	transition: filter .15s ease, transform .1s ease;
	float: none;
	margin-top: 12px;
}
body.login .button-primary:hover { filter: brightness(1.08) saturate(1.1); }
body.login .button-primary:active { transform: translateY(1px); }
body.login .button-primary:focus { box-shadow: 0 0 0 3px var(--sn-ring); }

/* Messages / errors */
body.login .message,
body.login .notice,
body.login #login_error {
	background: var(--sn-surface);
	border: 1px solid var(--sn-border);
	border-left: 4px solid var(--sn-a1);
	border-radius: 10px;
	color: var(--sn-text);
	box-shadow: 0 8px 30px rgba(63, 56, 40, .08);
}
body.login #login_error { border-left-color: #e11d48; }
body.login .message a, body.login #login_error a { color: var(--sn-soft); }

/* Below-form links */
body.login #nav, body.login #backtoblog { text-align: center; }
body.login #nav a, body.login #backtoblog a { color: var(--sn-dim); transition: color .15s ease; }
body.login #nav a:hover, body.login #backtoblog a:hover { color: var(--sn-soft); }
body.login .privacy-policy-page-link a { color: var(--sn-dim); }

/* Language switcher */
body.login .language-switcher { color: var(--sn-dim); }
body.login .language-switcher select {
	background-color: var(--sn-field);
	border: 1px solid var(--sn-border-strong);
	color: var(--sn-muted);
	border-radius: 8px;
}
body.login .language-switcher .button { border-radius: 8px; }

@media (prefers-reduced-motion: reduce) {
	body.login *, body.login *::before, body.login *::after {
		animation-duration: .01ms !important;
		transition-duration: .01ms !important;
	}
}