/*
 * GEN-306 Admin UI v2 - login page (Login.aspx, LoginHeb.aspx; brief sec. 8.2).
 * A 400px card with 12px radius, centred, logo above; labels above inputs (no label repeated as a
 * placeholder); "Login with OTP" a full-width secondary button. The promo / news column on wide screens is
 * kept. Loaded after Styles/login.css and dashlite.css, so the rules that must win say so.
 */
.v2-login { background: var(--c-bg) !important; color: var(--c-text); font-family: var(--font-sans); }
.v2-login :is(input, button, select, textarea, label, a, p, span, h1, h2, h3, h4, h5, h6) { font-family: var(--font-sans); } /* dashlite and Styles/login.css set their own faces */
.v2-login .nk-auth-container { background: var(--c-bg) !important; border-color: var(--c-border) !important; }
.v2-login .nk-auth-body { width: 100%; max-width: 400px !important; margin-inline: auto; padding-inline: var(--sp-4); }
.v2-login .brand-logo { padding-bottom: var(--sp-6) !important; }
.v2-login .brand-logo .logo-img { max-height: 44px; width: auto; }

.v2-login .nk-auth-body > .card {
	border: 1px solid var(--c-border) !important;
	border-radius: var(--r-lg) !important;
	background: var(--c-surface);
	box-shadow: var(--shadow-sm);
}
.v2-login .nk-auth-body > .card > .card-inner { padding: var(--sp-6) !important; }
.v2-login .nk-auth-body .row, .v2-login .nk-auth-body [class*="col-"] { float: none; width: auto; margin-inline: 0; padding-inline: 0; }

.v2-login .form-group { margin-bottom: var(--sp-4); }
.v2-login .form-label { display: block; margin: 0 0 var(--sp-1); color: var(--c-text-2); font-size: var(--fs-13); font-weight: var(--fw-medium); }
.v2-login .form-control-lg { height: 40px; padding: 0 var(--sp-3); font-size: var(--fs-14); border-radius: var(--r-md); }
.v2-login .form-control-wrap { position: relative; }
.v2-login .containerPassword .checkmark { top: 7px; left: auto; right: auto; inset-inline-end: 10px; color: var(--c-text-subtle); }

/* Forgot password: one muted line under the password field. */
.v2-login .line-height-30 { line-height: 1.5; margin-top: var(--sp-2); font-size: var(--fs-13); }
.v2-login .line-height-30 span[style*="color: #000"] { color: var(--c-text-muted) !important; }

/* Sign in: primary, full width. Microsoft keeps its brand button. "Login with OTP": secondary, full width. */
.v2-login .btn-lg { height: 40px; padding: 0 var(--sp-4); font-size: var(--fs-14); font-weight: var(--fw-medium); border-radius: var(--r-md); }
.v2-login .btn-block { display: flex; align-items: center; justify-content: center; gap: var(--sp-2); width: 100%; }
.v2-login #lbtSingInWithTempPass { margin-top: var(--sp-2); background: var(--c-surface) !important; color: var(--c-text) !important; border: 1px solid var(--c-border-input) !important; }
.v2-login #lbtSingInWithTempPass:hover { background: var(--c-surface-2) !important; border-color: var(--c-border-hover) !important; }
.v2-login .nk-auth-body > .line-height-30 { max-width: 400px; margin-inline: auto; padding-inline: 0; }
.v2-login .nk-auth-body > .line-height-30 > span { display: block; margin: var(--sp-3) 0 var(--sp-1); color: var(--c-text-muted) !important; font-size: var(--fs-12); text-transform: uppercase; letter-spacing: .06em; }

/* Error / info message above the fields. */
.v2-login .alert-danger { background: transparent; border: 0; padding: 0; }
.v2-login .alert-danger .alert-msg { border: 1px solid var(--c-danger); border-radius: var(--r-md); background: var(--c-danger-bg); color: var(--c-danger-text); padding: var(--sp-3); }

.v2-login .nk-footer .nav-link { color: var(--c-text-muted); font-size: var(--fs-13); }
.v2-login .text-soft { color: var(--c-text-muted) !important; font-size: var(--fs-12) !important; }

@media (max-width: 480px) {
	.v2-login .nk-auth-body { margin-top: var(--sp-8) !important; }
	.v2-login .nk-auth-body > .card > .card-inner { padding: var(--sp-5) !important; }
}
