html[data-nnweb-theme='dark'],
html[data-nnweb-theme='light'] {
	color-scheme: light dark;
}

body.login {
	background: var(--nnweb-background);
	font-family: 'Urbanist', system-ui, sans-serif;
	font-size: 16px;
	line-height: 1.5;
	color: var(--nnweb-foreground);
	min-height: 100vh;
}

body.login #login {
	width: min(100%, 400px);
	padding: 5vh 1rem 2rem;
}

body.login #login h1 a {
	width: auto;
	height: auto;
	text-indent: 0;
	font-size: 0;
	background: none;
	margin-bottom: 1.5rem;
}

body.login #login h1 a:hover,
body.login #login h1 a:focus-visible {
	text-decoration: none;
	color: inherit;
}

body.login #login h1 a::before {
	content: 'NNWeb Prezz';
	display: block;
	font-size: 1.75rem;
	font-weight: 700;
	color: var(--nnweb-foreground);
	letter-spacing: -0.02em;
}

body.login #login h1 a::after {
	display: block;
	margin-top: 0.35rem;
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.5;
	color: var(--nnweb-muted-foreground);
}

body.login.login-action-login #login h1 a::after {
	content: 'Pristup samo ulogovanim korisnicima';
}

body.login.login-action-resetpass #login h1 a::after,
body.login.login-action-rp #login h1 a::after {
	content: 'Postavite novu lozinku za pristup aplikaciji';
}

body.login.login-action-lostpassword #login h1 a::after,
body.login.login-action-retrievepassword #login h1 a::after {
	content: 'Unesite korisničko ime ili email za link za reset lozinke';
}

body.login.login-action-checkemail #login h1 a::after {
	content: 'Proverite email sanduče';
}

body.login form {
	background: var(--nnweb-card);
	border: 1px solid var(--nnweb-border);
	border-radius: 0.75rem;
	box-shadow: var(--nnweb-shadow);
	padding: 1.75rem;
}

body.login label {
	color: var(--nnweb-foreground);
	font-size: 1rem;
	font-weight: 600;
}

body.login input[type='text'],
body.login input[type='password'],
body.login input[type='email'] {
	background: var(--nnweb-secondary);
	border: 1px solid var(--nnweb-border);
	border-radius: 0.5rem;
	color: var(--nnweb-foreground);
	font-size: 1rem;
	line-height: 1.45;
	padding: 0.65rem 0.75rem;
	box-shadow: none;
}

body.login input[type='text']:focus,
body.login input[type='password']:focus,
body.login input[type='email']:focus {
	border-color: var(--nnweb-primary);
	box-shadow: 0 0 0 1px var(--nnweb-ring);
}

body.login .button-primary {
	background: var(--nnweb-primary);
	border-color: var(--nnweb-primary);
	color: var(--nnweb-primary-foreground);
	font-size: 1rem;
	font-weight: 600;
	border-radius: 0.5rem;
	text-shadow: none;
	box-shadow: none;
	height: auto;
	padding: 0.65rem 1.1rem;
}

body.login .button-primary:hover,
body.login .button-primary:focus {
	background: var(--nnweb-primary-soft);
	border-color: var(--nnweb-primary-soft);
	color: var(--nnweb-primary-foreground);
}

body.login .button-secondary,
body.login .button.wp-generate-pw {
	background: var(--nnweb-secondary);
	border-color: var(--nnweb-border);
	color: var(--nnweb-foreground);
	font-size: 1rem;
	border-radius: 0.5rem;
	box-shadow: none;
	padding: 0.65rem 1rem;
}

body.login .button-secondary:hover,
body.login .button-secondary:focus,
body.login .button.wp-generate-pw:hover,
body.login .button.wp-generate-pw:focus {
	background: var(--nnweb-card);
	border-color: var(--nnweb-primary);
	color: var(--nnweb-foreground);
}

body.login .reset-pass-submit .button,
body.login .reset-pass-submit .button.button-large,
body.login .reset-pass-submit .button-primary,
body.login .button.wp-generate-pw {
	min-height: 0;
	line-height: 1.35;
	padding: 0.45rem 0.95rem;
	font-size: 0.9375rem;
}

body.login .wp-hide-pw {
	color: var(--nnweb-muted-foreground);
}

body.login .wp-hide-pw .dashicons {
	color: inherit;
}

body.login #nav,
body.login #backtoblog {
	text-align: center;
	font-size: 1rem;
	line-height: 1.5;
}

body.login a {
	color: var(--nnweb-primary);
	text-decoration: none;
	transition: color 0.15s ease, text-decoration-color 0.15s ease;
}

body.login a:hover,
body.login a:focus-visible {
	color: var(--nnweb-foreground);
	text-decoration: underline;
	text-decoration-color: var(--nnweb-primary);
	text-underline-offset: 0.2em;
}

body.login #nav a,
body.login #backtoblog a {
	color: var(--nnweb-primary);
	font-weight: 600;
}

body.login #nav a:hover,
body.login #nav a:focus-visible,
body.login #backtoblog a:hover,
body.login #backtoblog a:focus-visible {
	color: var(--nnweb-foreground);
	text-decoration-color: var(--nnweb-primary-soft);
}

body.login .message,
body.login .success,
body.login .notice,
body.login #login_error {
	border-left-color: var(--nnweb-primary);
	background: color-mix(in srgb, var(--nnweb-primary) 12%, var(--nnweb-card));
	color: var(--nnweb-foreground);
	border-radius: 0.5rem;
	font-size: 1rem;
	line-height: 1.55;
}

body.login .message p,
body.login .success p,
body.login .notice p,
body.login #login_error p {
	font-size: 1rem;
	line-height: 1.55;
}

body.login .message a,
body.login .success a,
body.login .notice a,
body.login #login_error a {
	color: var(--nnweb-primary);
	font-weight: 600;
}

body.login .message a:hover,
body.login .success a:hover,
body.login .notice a:hover,
body.login #login_error a:hover,
body.login .message a:focus-visible,
body.login .success a:focus-visible,
body.login .notice a:focus-visible,
body.login #login_error a:focus-visible {
	color: var(--nnweb-foreground);
}

body.login .description,
body.login .indicator-hint {
	color: var(--nnweb-muted-foreground);
	font-size: 0.9375rem;
	line-height: 1.5;
}

body.login .pw-weak label {
	font-weight: 400;
	font-size: 1rem;
	color: var(--nnweb-muted-foreground);
}

body.login #pass-strength-result {
	font-size: 0.9375rem;
}

body.login .login .privacy-policy-page-link {
	display: none;
}

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

/* Theme switcher */
.nnweb-login-theme {
	position: fixed;
	top: 1rem;
	right: 1rem;
	z-index: 100;
	display: inline-flex;
	padding: 0.25rem;
	border-radius: 999px;
	background: var(--nnweb-card);
	border: 1px solid var(--nnweb-border);
	box-shadow: var(--nnweb-shadow);
}

.nnweb-login-theme__btn {
	appearance: none;
	border: 0;
	background: transparent;
	color: var(--nnweb-muted-foreground);
	font: inherit;
	font-size: 0.9375rem;
	font-weight: 600;
	line-height: 1;
	padding: 0.45rem 0.75rem;
	border-radius: 999px;
	cursor: pointer;
	transition: background 0.15s ease, color 0.15s ease;
}

.nnweb-login-theme__btn:hover {
	color: var(--nnweb-foreground);
}

.nnweb-login-theme__btn.is-active {
	background: var(--nnweb-primary);
	color: var(--nnweb-primary-foreground);
}

@media (max-width: 480px) {
	.nnweb-login-theme {
		top: auto;
		bottom: 1rem;
		right: 50%;
		transform: translateX(50%);
	}
}