/* Nocturne administration login. */
.nocturne-login {
    --login-accent: var(--nocturne-light);
    --login-text: var(--nocturne-light);
    display: grid;
    width: 100%;
    /* padding: 16px 0; */
}

.nocturne-login,
.nocturne-login * {
	box-sizing: border-box;
}

.nocturne-login-panel {
	width: 100%;
	max-width: none;
	padding: 8px 10px 18px;
	border-radius: 8px;
	background: linear-gradient(0deg, var(--nocturne-deep) 80%, var(--nocturne-panel));
	border: 1px solid var(--nocturne-edge);
	/* box-shadow:
			0 8px 24px rgb(var(--nocturne-void-rgb) / 0.4392),
			inset 0 2px 0 var(--nocturne-edge),
			inset 0 -3px 0 var(--login-accent); */
	/* box-shadow:
		0 0 4px 0 var(--nocturne-deep),
		inset 0 1px 0 0 rgb(var(--nocturne-light-rgb) / 0.2078),
		inset 0 -1px 0 0 rgb(var(--nocturne-light-rgb) / 0.2078); */
	/* box-shadow: 0 0 4px 1px rgb(var(--nocturne-void-rgb) / 0.5804), inset 0 2px 0 var(--nocturne-edge), inset 0 -3px 0 var(--nocturne-light); */
	color: var(--login-text);
}

.nocturne-login-heading {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 22px 18px;
}

.nocturne-login-heading h1 {
	margin: 0;
	font-size: 1.25rem;
	font-weight: 700;
	line-height: 1.4;
	color: var(--login-text);
}

.nocturne-login-emblem {
	display: grid;
	place-items: center;
	flex: 0 0 44px;
	height: 44px;
	border: 1px solid var(--nocturne-edge);
	border-radius: 8px;
	background: linear-gradient(0deg, var(--nocturne-deep), var(--nocturne-panel));
	box-shadow: inset 0 1px 0 rgb(var(--nocturne-light-rgb) / 0.08235);
	color: var(--login-accent);
	font-size: 1.25rem;
}

.nocturne-login-content {
	padding: 22px 18px;
	border-radius: 8px;
	background: var(--nocturne-deep);
	/* box-shadow: 0 0 1px 1px rgb(var(--nocturne-void-rgb) / 0.5804); */
	box-shadow: 0 0 1px 1px rgb(var(--nocturne-void-rgb) / 0.5804), inset 0 0 0 1px var(--nocturne-panel);
}

@media (min-width: 576px) {.nocturne-login-content {
		padding: 28px;
	}
}

.nocturne-login-form {
	display: grid;
	gap: 20px;
	width: 100%;
	max-width: 460px;
	margin-inline: auto;
}

.nocturne-login-field {
	display: grid;
	gap: 8px;
	min-width: 0;
}

.nocturne-login-field > label {
	font-weight: 700;
}

.nocturne-login-remember {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin: 0;
	line-height: 1.5;
	cursor: pointer;
}

.nocturne-login-remember > input {
	flex-shrink: 0;
	width: 18px;
	height: 18px;
	margin: 2px 0 0;
	accent-color: var(--login-accent);
}

.nocturne-login-remember > input:focus-visible {
	outline: 2px solid var(--login-accent);
	outline-offset: 3px;
}

.nocturne-login-security {
	display: grid;
	justify-items: center;
	min-width: 0;
	padding-block: 16px;
	border-block: 1px solid var(--nocturne-panel);
}

.nocturne-login-security img {
	max-width: 100%;
	height: auto;
}

.nocturne-login-submit:focus-visible {
	outline: 2px solid var(--login-accent);
	outline-offset: 4px;
}

.nocturne-login-notice {
	margin: 0 0 20px;
	padding: 12px;
	border: 1px solid var(--nocturne-edge);
	border-inline-start: 3px solid var(--login-accent);
	border-radius: 6px;
	background: var(--nocturne-deep);
	font-size: .875rem;
	line-height: 1.6;
	overflow-wrap: anywhere;
}

.nocturne-login-notice-warning {
	border-inline-start-color: var(--nocturne-muted);
}
