/* Pantalla de acceso a wp-admin con la estética de GRESº */
body.login {
	background: #000;
	color: var(--gres-crema);
	font-family: "Space Grotesk", system-ui, sans-serif;
	-webkit-font-smoothing: antialiased;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 100vh;
}
#login { width: 340px; padding: 40px 0; }

.login h1 a {
	background: url(../img/logo-gres.svg) no-repeat center / contain;
	width: 232px;
	height: 78px;
	margin: 0 auto 40px;
}

.login form {
	background: transparent;
	border: 1px solid rgba(229, 221, 207, .25);
	border-radius: 16px;
	box-shadow: none;
	padding: 28px 28px 32px;
	margin-top: 0;
}
.login label { color: var(--gres-crema); font-size: 14px; letter-spacing: .02em; }

.login input[type="text"],
.login input[type="password"],
.login input[type="email"] {
	background: transparent;
	border: 0;
	border-bottom: 1px solid rgba(229, 221, 207, .5);
	border-radius: 0;
	box-shadow: none;
	color: var(--gres-crema);
	font-family: inherit;
	font-size: 18px;
	padding: 6px 2px;
}
.login input[type="text"]:focus,
.login input[type="password"]:focus,
.login input[type="email"]:focus {
	border-bottom-color: var(--gres-crema);
	box-shadow: none;
	outline: 0;
}
.login .button.wp-hide-pw { color: var(--gres-crema); }
.login .button.wp-hide-pw:focus { box-shadow: none; border-color: transparent; }
.login input[type="checkbox"] { background: transparent; border-color: rgba(229, 221, 207, .5); }
.login input[type="checkbox"]:checked::before { filter: invert(1) sepia(.2); }

/* Botón con el relleno de izquierda a derecha de la web */
.login .button-primary {
	--gres-fill: var(--gres-crema);
	background: transparent linear-gradient(var(--gres-fill), var(--gres-fill)) no-repeat left center / 0% 100%;
	border: 1px solid var(--gres-crema);
	border-radius: 999px;
	box-shadow: none;
	color: var(--gres-crema);
	font-family: inherit;
	font-weight: 500;
	letter-spacing: .04em;
	text-shadow: none;
	padding: 0 22px;
	transition: background-size .65s cubic-bezier(.65, 0, .35, 1), color .45s cubic-bezier(.65, 0, .35, 1) .1s;
}
.login .button-primary:hover,
.login .button-primary:focus {
	background-color: transparent;
	background-size: 100% 100%;
	border-color: var(--gres-crema);
	box-shadow: none;
	color: var(--gres-tinta);
}
@media (prefers-reduced-motion: reduce) {
	.login .button-primary { transition: none; }
}

.login #nav,
.login #backtoblog { text-align: center; padding: 0; }
.login #nav a,
.login #backtoblog a,
.login .privacy-policy-link { color: rgba(229, 221, 207, .7); }
.login #nav a:hover,
.login #backtoblog a:hover { color: var(--gres-crema); }

.login .message,
.login .notice,
.login .success,
.login #login_error {
	background: rgba(229, 221, 207, .08);
	border-left-color: var(--gres-crema);
	box-shadow: none;
	color: var(--gres-crema);
}
.login #login_error a { color: var(--gres-crema); }
.login .language-switcher { display: none; }