/**
 * Centry Engine - wp-login.php.
 *
 * Loaded only on the login screen. The logo URL arrives as --ce-login-logo,
 * injected from inc/branding.php so the path stays resolved by WordPress rather
 * than hardcoded relative to this file.
 *
 * Tokens are redeclared here on purpose: main.css is a front-end stylesheet and
 * is not enqueued on wp-login.php, so this file cannot inherit from it.
 */

:root {
	--ce-color-brand: #ff8200;
	--ce-color-brand-text: #a34e00;
	--ce-color-ink: #404041;
	--ce-color-ink-strong: #1c1c1d;
	--ce-color-surface: #ffffff;
	--ce-color-border: #e0e0de;
	--ce-radius: 6px;
}

body.login {
	background-color: #f5f5f4;
}

/* Logo ------------------------------------------------------------------- */

.login h1 a {
	width: 240px;
	height: 110px;
	margin-bottom: 24px;
	background-image: var(--ce-login-logo);
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}

/* Form ------------------------------------------------------------------- */

.login form {
	border: 1px solid var(--ce-color-border);
	border-radius: var(--ce-radius);
	box-shadow: 0 1px 3px rgb(0 0 0 / 8%);
}

.login input[type='text'],
.login input[type='password'] {
	border-radius: var(--ce-radius);
}

.login input[type='text']:focus,
.login input[type='password']:focus {
	border-color: var(--ce-color-brand-text);
	box-shadow: 0 0 0 1px var(--ce-color-brand-text);
}

/*
 * Ink on orange, not white on orange: white against #ff8200 is 2.49:1 and
 * fails WCAG AA. #1c1c1d against it is 6.85:1.
 */
.wp-core-ui .button-primary {
	background: var(--ce-color-brand);
	border-color: var(--ce-color-brand);
	color: var(--ce-color-ink-strong);
	text-shadow: none;
	box-shadow: none;
}

.wp-core-ui .button-primary:hover,
.wp-core-ui .button-primary:focus {
	background: #e67500;
	border-color: #e67500;
	color: var(--ce-color-ink-strong);
}

.wp-core-ui .button-primary:focus-visible {
	outline: 2px solid var(--ce-color-ink-strong);
	outline-offset: 2px;
}

/* Links ------------------------------------------------------------------ */

.login #backtoblog a,
.login #nav a {
	color: var(--ce-color-ink);
}

.login #backtoblog a:hover,
.login #nav a:hover,
.login #backtoblog a:focus,
.login #nav a:focus {
	color: var(--ce-color-brand-text);
}

.login .privacy-policy-page-link a {
	color: var(--ce-color-ink);
}
