/*! Vector-Map Studio — inlogscherm */
body.vms-login {
	--vms-ink: #121b24;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 100vh;
	overflow-x: hidden;
	background:
		radial-gradient(50% 60% at 15% 20%, color-mix(in srgb, var(--vms-accent) 55%, transparent), transparent 70%),
		radial-gradient(40% 50% at 90% 85%, color-mix(in srgb, #b45309 30%, transparent), transparent 70%),
		var(--vms-ink);
	font-family: "VMS Inter", Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	-webkit-font-smoothing: antialiased;
}

body.vms-login::before {
	content: "";
	position: fixed;
	inset: 0;
	background:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='640' height='640' viewBox='0 0 640 640' fill='none' stroke='%23ffffff' stroke-width='1'%3E%3Cpath d='M320 96c96 0 196 54 214 150s-46 214-150 248-238-10-276-112 60-286 212-286z'/%3E%3Cpath d='M320 140c78 0 156 44 170 120s-38 168-120 194-186-8-216-88 48-226 166-226z'/%3E%3Cpath d='M320 184c58 0 114 34 124 90s-28 122-88 140-136-6-158-64 34-166 122-166z'/%3E%3Cpath d='M322 230c38 0 72 22 78 58s-18 76-56 88-86-4-100-40 22-106 78-106z'/%3E%3Cpath d='M324 274c18 0 32 10 34 26s-8 34-26 38-38-2-44-18 10-46 36-46z'/%3E%3C/svg%3E") center / 900px auto no-repeat,
		linear-gradient(90deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px),
		linear-gradient(0deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px);
	background-size: 900px auto, 56px 56px, 56px 56px;
	opacity: 0.5;
	-webkit-mask-image: radial-gradient(60% 60% at 50% 50%, #000 30%, transparent 85%);
	mask-image: radial-gradient(60% 60% at 50% 50%, #000 30%, transparent 85%);
	pointer-events: none;
}

body.vms-login #login {
	position: relative;
	z-index: 1;
	width: min(400px, calc(100vw - 32px));
	margin: 0;
	padding: 6vh 0;
}

body.vms-login #login h1 a {
	width: 240px;
	height: 70px;
	margin: 0 auto 26px;
	background-size: contain;
	background-position: center;
	color: #fff;
	font-size: 30px;
	font-weight: 750;
	letter-spacing: -0.04em;
	line-height: 1.2;
}

body.vms-login #login h1 a:focus {
	box-shadow: none;
	outline: 2px solid var(--vms-accent);
	outline-offset: 6px;
	border-radius: 5px;
}

body.vms-login form {
	margin: 0;
	padding: 30px 30px 26px;
	border: 1px solid rgba(255, 255, 255, 0.5);
	border-radius: 5px;
	background: rgba(255, 255, 255, 0.97);
	box-shadow: 0 50px 100px -30px rgba(0, 0, 0, 0.6), 0 0 0 1px rgba(255, 255, 255, 0.06);
}

body.vms-login label {
	color: #3b4651;
	font-size: 13px;
	font-weight: 600;
}

body.vms-login form .input,
body.vms-login input[type="text"],
body.vms-login input[type="password"],
body.vms-login input[type="email"] {
	min-height: 46px;
	margin-top: 6px;
	padding: 8px 14px;
	border: 1px solid #d3d8dc;
	border-radius: 5px;
	background: #fff;
	font-size: 16px;
	box-shadow: none;
	transition: border-color 150ms ease, box-shadow 150ms ease;
}

body.vms-login form .input:focus,
body.vms-login input[type="text"]:focus,
body.vms-login input[type="password"]:focus {
	border-color: var(--vms-accent);
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--vms-accent) 18%, transparent);
	outline: none;
}

body.vms-login .button.wp-hide-pw {
	min-height: 46px;
	margin-top: 6px;
	color: #64707d;
}

body.vms-login .button.wp-hide-pw .dashicons {
	top: 0.6rem;
}

body.vms-login input[type="checkbox"] {
	border-radius: 5px;
	border-color: #b9c0c6;
}

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

body.vms-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%23ffffff%27%2F%3E%3C%2Fsvg%3E");
}

body.vms-login .forgetmenot {
	margin-top: 4px;
}

body.vms-login .forgetmenot label {
	font-weight: 500;
}

body.vms-login.wp-core-ui .button-primary {
	float: none;
	width: 100%;
	min-height: 48px;
	margin-top: 18px;
	border: 0;
	border-radius: 5px;
	background: var(--vms-accent);
	box-shadow: 0 14px 30px -12px var(--vms-accent);
	font-size: 15px;
	font-weight: 650;
	text-shadow: none;
	transition: background 200ms ease, transform 250ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

body.vms-login.wp-core-ui .button-primary:hover,
body.vms-login.wp-core-ui .button-primary:focus {
	background: color-mix(in srgb, var(--vms-accent) 82%, #000);
	transform: translateY(-1px);
}

body.vms-login .submit {
	clear: both;
}

body.vms-login #nav,
body.vms-login #backtoblog {
	padding: 0;
	margin: 18px 0 0;
	text-align: center;
	font-size: 13px;
}

body.vms-login #nav a,
body.vms-login #backtoblog a,
body.vms-login .privacy-policy-page-link a {
	color: rgba(255, 255, 255, 0.7);
	text-decoration: none;
	transition: color 150ms ease;
}

body.vms-login #nav a:hover,
body.vms-login #backtoblog a:hover {
	color: #fff;
}

body.vms-login #login_error,
body.vms-login .message,
body.vms-login .notice,
body.vms-login .success {
	margin-bottom: 16px;
	border: 0;
	border-left: 4px solid var(--vms-accent);
	border-radius: 5px;
	background: #fff;
	box-shadow: 0 10px 30px -12px rgba(0, 0, 0, 0.4);
}

body.vms-login #login_error,
body.vms-login .notice-error {
	border-left-color: #dc2626;
}

body.vms-login .language-switcher {
	position: relative;
	z-index: 1;
}

body.vms-login .language-switcher label .dashicons {
	color: rgba(255, 255, 255, 0.6);
}

.vms-login-art {
	position: fixed;
	left: 24px;
	bottom: 20px;
	z-index: 0;
	pointer-events: none;
}

.vms-login-coords {
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	font-size: 11px;
	letter-spacing: 0.14em;
	color: rgba(255, 255, 255, 0.35);
}