body.login {
	--color-bg: #f6f4ee;
	--color-base: #001846;

	background: none;
	background-color: var(--color-bg);
	min-width: 320px;
	display: flex;

	#login {
		padding: 0;
	}

	h1 a {
		background: url("../../parts/images/logo-blue.svg") no-repeat center /
			contain;
		width: 263px;
		height: 47pxpx;
		margin: 0 auto 25px;
		padding: 0;
		text-decoration: none;
		text-indent: -4004px;
		outline: none;
		overflow: hidden;
		display: block;
		color: transparent !important;
		font: 0/0 serif;
		box-shadow: none;
	}

	label {
		font-size: 12px;
	}

	input[type="checkbox"],
	input[type="color"],
	input[type="date"],
	input[type="datetime-local"],
	input[type="datetime"],
	input[type="email"],
	input[type="month"],
	input[type="number"],
	input[type="password"],
	input[type="radio"],
	input[type="search"],
	input[type="tel"],
	input[type="text"],
	input[type="time"],
	input[type="url"],
	input[type="week"],
	select:focus,
	textarea:focus {
		font-size: 16px;
		border-color: var(--color-base);
		border-radius: 4px !important;

		&:focus {
			box-shadow: 0 0 0 1px var(--color-base);
			border-color: var(--color-base);
		}
	}

	input[type="text"],
	input[type="password"] {
		border-radius: 0;
	}

	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%23000%27%2F%3E%3C%2Fsvg%3E");
			}
		}
	}

	#loginform {
		border-color: var(--color-base);
		border-radius: 4px;
		max-width: 100%;
	}

	.button.wp-hide-pw {
		&,
		&:hover,
		&:focus {
			color: var(--color-base);
		}

		&:focus {
			border-color: var(--color-base);
			box-shadow: 0 0 0 1px var(--color-base);
		}
	}

	.forgetmenot {
		display: flex;
		align-items: center;
		gap: 6px;
		height: 32px;

		label {
			line-height: 16px;
			margin: 0;
		}

		input[type="checkbox"] {
			margin: 0;
		}
	}

	#nav a,
	#backtoblog a {
		&,
		&:hover,
		&:active,
		&:focus {
			color: var(--color-base);
			box-shadow: none;
		}

		&:focus-visible {
			outline: 1px solid currentColor;
			outline-offset: 4px;
		}

		&:hover {
			text-decoration: underline;
		}
	}

	#backtoblog {
		&:last-child {
			margin-bottom: 0;
		}
	}

	.button-primary {
		&,
		&:hover,
		&:focus {
			background-color: var(--color-base);
			border-color: var(--color-base);
			text-shadow: none;
			box-shadow: none;
		}

		&:hover {
			background-color: color-mix(in oklab, var(--color-base) 80%, #fff 20%);
			border-color: color-mix(in oklab, var(--color-base) 80%, #fff 20%);
		}
	}

	.privacy-policy-link {
		color: var(--color-base);
	}
}
