/*----------------------------------------------------------------- */
/* LOGIN
/*----------------------------------------------------------------- */

body.login
{
	display: flex;
	align-items: center;
	flex-direction: column;
	justify-content: center;

	min-height: 100vh;
	padding: var(--padding__default);

	gap: var(--padding__default);
}

#login
{
	width: 100%;
	max-width: 360px;
}

.login h1
{
	font-family: var(--font-family__heading);
	font-size: 4rem;
	font-weight: var(--font-weight__normal);
	line-height: 40px;

	display: block;

	margin: 0 0 var(--padding__default) 0;

	text-align: center;
	letter-spacing: 1.5rem;

	color: var(--color__content-heading);
}

.login_protection h1
{
	letter-spacing: 0;
}

.login h1 a
{
	text-decoration: none;

	color: var(--color__content-heading);
}

.login h1 a:hover
{
	color: var(--color__blue);
}

.login p
{
	margin: 0;
}

.login a
{
	text-decoration: none;
}

.login a:hover
{
	color: var(--color__blue);
}

.login form
{
	position: relative;
	z-index: 10;

	padding: 20px 30px;

	transition: background-color var(--transition-duration__default), color var(--transition-duration__default);

	color: var(--color__content-text);
	border-radius: 5px;
	background: var(--color__content-bg);
}

.login input,
.login textarea,
.login select
{
	margin: 0 !important;
}

.login #loginform
{
	display: grid;
	align-items: center;

	gap: 15px;
	grid-template-columns: 1fr 1fr;
}

.login #registerform
{
	display: grid;
	align-items: center;

	gap: 15px;
	grid-template-columns: 1fr;
}

.login_protection #loginform
{
	grid-template-columns: 1fr;
}

.login #loginform > p:first-child,
.login #loginform > .user-pass-wrap
{
	grid-column: span 2;
}

.login_protection #loginform > p:first-child,
.login_protection #loginform > .user-pass-wrap
{
	grid-column: 1;
}

.login .submit
{
	text-align: right;
}

.login #lostpasswordform .submit
{
	margin-top: 15px;
}

.login .wp-pwd
{
	position: relative;
}

.login #reg_passmail
{
	font-size: var(--font-size__small);
}

.login #nav,
.login #backtoblog,
.login__info
{
	padding-top: 15px;
	padding-right: 30px;
	padding-left: 30px;

	text-align: center;

	background: var(--color__form-bg-extra);
}

.login #nav
{
	position: relative;
	z-index: 5;

	margin-top: -5px;
	padding-top: 25px;
}

.login #backtoblog
{
	padding-top: 15px;
	padding-bottom: 20px;

	border-radius: 0 0 5px 5px;
}

div.login__info
{
	position: relative;
	z-index: 5;

	margin-top: -5px;
	padding-top: 25px;
	padding-bottom: 20px;

	text-align: left;

	border-radius: 0 0 5px 5px;
}

div.login__info a
{
	text-decoration: underline;
}

.login .language-switcher
{
	max-width: 360px;

	text-align: center;
}

.login .language-switcher form
{
	display: grid;
	gap: 0 15px;
	grid-template-columns: 1fr auto;
}

.login .language-switcher form label
{
	text-align-last: left;

	grid-column: span 2;
}

.login .language-switcher .dashicons
{
	display: none;
}

@media (max-width: 760px)
{
	.login form
	{
		padding: 15px;
	}

	.login #nav,
	.login #backtoblog,
	.login__info
	{
		padding-right: 15px;
		padding-left: 15px;
	}
}