/*
 * Fairways Club Manager v3.27.0 — the sign-in and password pages (wp-login.php: log in, Lost
 * password, Choose a new password, password saved). FCM_Login_Brand loads it after WordPress's
 * login styles. DESIGN.md tokens only (Clubhouse Night page, a raised card with a gold hairline,
 * input-on-dark fields, the gold pill as the one primary button); the --fcm-l-* values are printed
 * from FCM_Brand::tokens() and the fallbacks here are the same values.
 */

body.login {
	--fcm-l-night: #0F1F10;          /* surface-dark */
	--fcm-l-raised: #132213;         /* a dark card, one stop lighter */
	--fcm-l-input: #19301F;          /* input-on-dark */
	--fcm-l-paper: #FAFBF9;          /* on-surface-dark */
	--fcm-l-muted: #8A9A8E;          /* on-surface-muted: small text on dark */
	--fcm-l-gold: #C8A84B;           /* secondary */
	--fcm-l-gold-light: #E2C97E;     /* brand-gold-light */
	--fcm-l-green-mid: #2D7A3E;      /* tertiary */
	--fcm-l-error: #A13B2E;          /* error: borders */
	--fcm-l-error-on-dark: #C5887F;  /* error text on dark */
	--fcm-l-hairline: rgba(200, 168, 75, 0.18);
	--fcm-l-ring: rgba(200, 168, 75, 0.12);
	--fcm-l-sans: Inter, "Helvetica Neue", Helvetica, Arial, sans-serif;
	--fcm-l-serif: "Playfair Display", Georgia, "Times New Roman", serif;

	background: var(--fcm-l-night);
	color: var(--fcm-l-paper);
	font-family: var(--fcm-l-sans);
	font-size: 15px;
	line-height: 1.5;
	min-height: 100%;
	height: auto;
	-webkit-font-smoothing: antialiased;
}

body.login a {
	color: var(--fcm-l-paper);
	text-decoration: underline;
	text-decoration-color: var(--fcm-l-hairline);
	text-underline-offset: 3px;
}

body.login a:hover,
body.login a:active {
	color: var(--fcm-l-gold);
	text-decoration-color: currentColor;
}

body.login a:focus-visible,
body.login .button:focus-visible,
body.login input[type="checkbox"]:focus-visible {
	outline: 2px solid var(--fcm-l-gold);
	outline-offset: 2px;
	box-shadow: none;
}

body.login a:focus {
	color: var(--fcm-l-gold);
	box-shadow: none;
}

/* ── The frame ── */

body.login #login {
	box-sizing: border-box;
	width: 100%;
	max-width: 392px;
	padding: 48px 16px 32px;
	margin: 0 auto;
}

/* The badge instead of the WordPress logo, linked to the club's home page. */
body.login h1.wp-login-logo a,
body.login h1 a {
	background-image: var(--fcm-l-badge) !important;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	width: 104px;
	height: 104px;
	margin: 0 auto 28px;
	border-radius: 50%;
	color: transparent;
	text-indent: -9999px;
	overflow: hidden;
}

body.login h1 a:focus-visible {
	outline-offset: 4px;
}

/* ── The card ── */

body.login form,
body.login #login form {
	margin: 0 0 24px;
	padding: 28px 24px;
	background: var(--fcm-l-raised);
	border: 1px solid var(--fcm-l-hairline);
	border-radius: 14px;
	box-shadow: none;
	overflow: visible;
}

body.login label {
	color: var(--fcm-l-paper);
	font-size: 14px;
	font-weight: 500;
	margin-bottom: 6px;
}

body.login form p,
body.login form .description,
body.login .indicator-hint {
	color: var(--fcm-l-muted);
	font-size: 13px;
}

body.login form p label,
body.login form .user-pass1-wrap > p > label {
	color: var(--fcm-l-paper);
}

/* Fields: input-on-dark with a gold hairline and the 3px gold focus ring. */
body.login form .input,
body.login input[type="text"],
body.login input[type="email"],
body.login input[type="password"] {
	box-sizing: border-box;
	background: var(--fcm-l-input);
	color: var(--fcm-l-paper);
	border: 1px solid var(--fcm-l-hairline);
	border-radius: 8px;
	box-shadow: none;
	font-family: var(--fcm-l-sans);
	font-size: 17px;
	line-height: 1.4;
	min-height: 48px;
	padding: 10px 14px;
	margin: 0 0 18px;
}

body.login input.password-input,
body.login #pass1,
body.login #pass1-text {
	font-family: var(--fcm-l-sans);
	letter-spacing: 0.02em;
}

body.login.js input.password-input {
	padding-right: 48px;
}

body.login form .input:focus,
body.login input[type="text"]:focus,
body.login input[type="email"]:focus,
body.login input[type="password"]:focus,
body.login #pass1:focus,
body.login #pass1-text:focus {
	border-color: var(--fcm-l-gold);
	box-shadow: 0 0 0 3px var(--fcm-l-ring);
	outline: 2px solid transparent;
}

body.login input::placeholder {
	color: var(--fcm-l-muted);
}

body.login input:-webkit-autofill,
body.login input:-webkit-autofill:hover,
body.login input:-webkit-autofill:focus {
	-webkit-text-fill-color: var(--fcm-l-paper);
	-webkit-box-shadow: 0 0 0 1000px var(--fcm-l-input) inset;
	caret-color: var(--fcm-l-paper);
}

/* Show / hide password (the eye inside the field). */
body.login .button.wp-hide-pw {
	color: var(--fcm-l-muted);
	width: 48px;
	height: 48px;
	min-height: 48px;
	top: 0;
	right: 0;
	border-radius: 8px;
}

body.login .button.wp-hide-pw:hover,
body.login .button.wp-hide-pw:focus {
	color: var(--fcm-l-paper);
	border-color: transparent;
	box-shadow: none;
}

body.login .button.wp-hide-pw:focus-visible {
	outline: 2px solid var(--fcm-l-gold);
	outline-offset: -2px;
}

body.login .button.wp-hide-pw .dashicons {
	color: inherit;
	top: 0;
}

/* Remember me. */
body.login input[type="checkbox"] {
	background: var(--fcm-l-input);
	border: 1px solid var(--fcm-l-muted);
	border-radius: 4px;
	box-shadow: none;
	width: 18px;
	height: 18px;
}

body.login input[type="checkbox"]:checked {
	background: var(--fcm-l-gold);
	border-color: var(--fcm-l-gold);
}

body.login input[type="checkbox"]:checked::before {
	content: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2020%2020%27%3E%3Cpath%20d%3D%27M14.83%204.89l1.34.94-5.81%208.38H9.02L5.78%209.67l1.34-1.25%202.57%202.4z%27%20fill%3D%27%230F1F10%27%2F%3E%3C%2Fsvg%3E");
	content: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2020%2020%27%3E%3Cpath%20d%3D%27M14.83%204.89l1.34.94-5.81%208.38H9.02L5.78%209.67l1.34-1.25%202.57%202.4z%27%20fill%3D%27%230F1F10%27%2F%3E%3C%2Fsvg%3E") / '';
}

body.login form .forgetmenot label,
body.login .pw-weak label {
	color: var(--fcm-l-paper);
	font-size: 14px;
	font-weight: 400;
	margin-bottom: 0;
}

/* Remember me's help (WordPress's toggletip). */
body.login .wp-tooltip .wp-tooltip__toggle,
body.login .wp-tooltip .wp-tooltip__close {
	color: var(--fcm-l-muted);
	background: transparent;
	border: 0;
}

body.login .wp-tooltip:not(:has(button[aria-disabled="true"],button[disabled])) .wp-tooltip__toggle:hover,
body.login .wp-tooltip:not(:has(button[aria-disabled="true"],button[disabled])) .wp-tooltip__toggle:focus,
body.login .wp-tooltip .wp-tooltip__close:hover,
body.login .wp-tooltip .wp-tooltip__close:focus {
	color: var(--fcm-l-paper);
	box-shadow: none;
}

body.login .wp-tooltip .wp-tooltip__toggle:focus-visible,
body.login .wp-tooltip .wp-tooltip__close:focus-visible {
	outline: 2px solid var(--fcm-l-gold);
	outline-offset: 1px;
}

body.login .wp-tooltip .wp-tooltip__bubble {
	background: var(--fcm-l-input);
	color: var(--fcm-l-paper);
	border: 1px solid var(--fcm-l-hairline);
	border-radius: 8px;
	box-shadow: none;
}

/* ── Buttons: the gold pill (primary), a quiet outline for the rest ── */

body.login .button {
	font-family: var(--fcm-l-sans);
	border-radius: 9999px;
	min-height: 44px;
	padding: 0 20px;
	font-size: 14px;
	line-height: 42px;
	font-weight: 600;
	box-shadow: none;
	text-shadow: none;
	transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

body.login .button.button-primary,
body.login .button-primary {
	background: var(--fcm-l-gold);
	border: 1px solid var(--fcm-l-gold);
	color: var(--fcm-l-night);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	font-size: 13px;
}

body.login .button.button-primary:hover,
body.login .button.button-primary:focus,
body.login .button-primary:hover {
	background: var(--fcm-l-gold-light);
	border-color: var(--fcm-l-gold-light);
	color: var(--fcm-l-night);
}

body.login .button.button-primary:active {
	background: var(--fcm-l-gold);
	border-color: var(--fcm-l-gold);
	transform: none;
}

body.login .button.button-primary:disabled,
body.login .button.button-primary[disabled] {
	background: var(--fcm-l-input) !important;
	border-color: var(--fcm-l-hairline) !important;
	color: var(--fcm-l-muted) !important;
}

body.login .button:not(.button-primary):not(.wp-hide-pw) {
	background: transparent;
	border: 1px solid var(--fcm-l-hairline);
	color: var(--fcm-l-paper);
}

body.login .button:not(.button-primary):not(.wp-hide-pw):hover,
body.login .button:not(.button-primary):not(.wp-hide-pw):focus {
	border-color: var(--fcm-l-gold);
	color: var(--fcm-l-paper);
	background: transparent;
}

/* Log in: the button on its own row, full width, under Remember me. */
body.login #loginform p.submit,
body.login #lostpasswordform p.submit,
body.login .login-action-lostpassword p.submit {
	margin: 0;
	clear: both;
}

body.login #loginform .forgetmenot {
	float: none;
	margin: 0 0 18px;
}

body.login #loginform .button-primary,
body.login #lostpasswordform .button-primary {
	float: none;
	width: 100%;
}

/* Choose a new password: Generate and Save side by side, wrapping on a phone. */
body.login .reset-pass-submit {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: space-between;
	margin-top: 4px;
}

body.login .reset-pass-submit .button {
	flex: 1 1 140px;
	margin: 0;
	text-align: center;
}

/* ── The strength meter (it still works: WordPress sets its class) ── */

body.login #pass-strength-result {
	box-sizing: border-box;
	width: 100%;
	margin: 8px 0 12px;
	padding: 8px 10px;
	border-radius: 8px;
	background: var(--fcm-l-input);
	border: 1px solid var(--fcm-l-hairline);
	color: var(--fcm-l-paper);
	font-size: 13px;
	font-weight: 600;
	opacity: 1;
}

body.login #pass-strength-result.short,
body.login #pass-strength-result.bad {
	background: var(--fcm-l-input);
	border-color: var(--fcm-l-error);
	color: var(--fcm-l-error-on-dark);
}

body.login #pass-strength-result.good {
	background: var(--fcm-l-input);
	border-color: var(--fcm-l-gold);
	color: var(--fcm-l-gold);
}

body.login #pass-strength-result.strong {
	background: var(--fcm-l-input);
	border-color: var(--fcm-l-green-mid);
	color: var(--fcm-l-paper);
}

body.login #pass1.short,
body.login #pass1-text.short,
body.login #pass1.bad,
body.login #pass1-text.bad {
	border-color: var(--fcm-l-error);
}

body.login #pass1.good,
body.login #pass1-text.good {
	border-color: var(--fcm-l-gold);
}

body.login #pass1.strong,
body.login #pass1-text.strong {
	border-color: var(--fcm-l-green-mid);
}

body.login .wp-pwd .caps-warning {
	background: var(--fcm-l-input);
	border: 1px solid var(--fcm-l-gold);
	border-radius: 8px;
	color: var(--fcm-l-paper);
}

/* ── Messages WordPress shows ── */

body.login .message,
body.login .notice,
body.login .success,
body.login #login_error {
	background: var(--fcm-l-raised);
	border: 1px solid var(--fcm-l-hairline);
	border-left: 4px solid var(--fcm-l-muted);
	border-radius: 8px;
	color: var(--fcm-l-paper);
	box-shadow: none;
	padding: 10px 14px;
	margin: 0 0 20px;
}

body.login .message p,
body.login .notice p,
body.login .success p,
body.login #login_error p {
	color: var(--fcm-l-paper);
	font-size: 14px;
	line-height: 1.5;
}

body.login .success {
	border-left-color: var(--fcm-l-green-mid);
}

body.login .notice-error,
body.login #login_error {
	border-left-color: var(--fcm-l-error);
}

body.login .notice-error strong,
body.login #login_error strong {
	color: var(--fcm-l-error-on-dark);
}

body.login .message a,
body.login .notice a,
body.login #login_error a {
	color: var(--fcm-l-paper);
	text-decoration-color: currentColor;
}

/* ── Under the card ── */

body.login #nav,
body.login #backtoblog {
	padding: 0 4px;
	margin: 0 0 10px;
	font-size: 14px;
	color: var(--fcm-l-muted);
	text-align: center;
}

body.login #nav a,
body.login #backtoblog a {
	color: var(--fcm-l-paper);
}

body.login #nav a:hover,
body.login #backtoblog a:hover {
	color: var(--fcm-l-gold);
}

body.login .privacy-policy-page-link {
	margin: 24px 0 16px;
	font-size: 13px;
}

body.login .language-switcher {
	padding: 0 16px 24px;
}

body.login .language-switcher label,
body.login .language-switcher .dashicons {
	color: var(--fcm-l-muted);
}

body.login .language-switcher select {
	background-color: var(--fcm-l-input);
	color: var(--fcm-l-paper);
	border: 1px solid var(--fcm-l-hairline);
	border-radius: 8px;
}

/* Admin email check (an administrator's sign-in, now and then). */
body.login .admin-email__heading {
	color: var(--fcm-l-paper);
	border-bottom-color: var(--fcm-l-hairline);
}

body.login .admin-email__details,
body.login .admin-email__later {
	color: var(--fcm-l-muted);
}

@media screen and (max-width: 420px) {
	body.login #login {
		padding-top: 32px;
	}

	body.login h1.wp-login-logo a,
	body.login h1 a {
		width: 88px;
		height: 88px;
		margin-bottom: 22px;
	}

	body.login form,
	body.login #login form {
		padding: 22px 18px;
	}
}

body.login.login-action-confirm_admin_email #login {
	max-width: 650px;
}