/**
 * Official brand colors on auth pages (login, forgot/reset password, 2FA).
 * Blue #0B4DAD | Green #38B34A | Black #111111 | White #FFFFFF
 */
.account-page {
	--brand-blue: #0B4DAD;
	--brand-green: #38B34A;
	--brand-black: #111111;
	--brand-white: #FFFFFF;
	--brand-blue-rgb: 11, 77, 173;
	--brand-green-rgb: 56, 179, 74;
	--brand-blue-hover: #093f91;
	--brand-blue-focus: rgba(11, 77, 173, 0.2);

	--bs-primary: var(--brand-blue);
	--bs-success: var(--brand-green);
	--bs-primary-rgb: var(--brand-blue-rgb);
	--bs-success-rgb: var(--brand-green-rgb);
	--bs-link-color: var(--brand-blue);
	--bs-link-hover-color: var(--brand-blue-hover);
	--bs-body-color: var(--brand-black);
}

/* Headings & labels */
.account-page .login-wrapper .login-content .login-userheading h3 {
	color: var(--brand-black);
}

.account-page .login-wrapper .login-content .login-userheading h4,
.account-page .login-wrapper .login-content .form-login label,
.account-page .login-wrapper .login-content .login-userset .my-4 p {
	color: var(--brand-black);
}

.account-page .login-wrapper .login-content .login-userset .my-4 p {
	opacity: 0.85;
}

/* Primary button */
.account-page .btn-primary,
.account-page .btn.btn-primary {
	background-color: var(--brand-blue) !important;
	border-color: var(--brand-blue) !important;
	color: var(--brand-white) !important;
	box-shadow: 0 4px 14px rgba(var(--brand-blue-rgb), 0.22) !important;
}

.account-page .btn-primary:hover,
.account-page .btn-primary:focus,
.account-page .btn-primary:active,
.account-page .btn.btn-primary:hover,
.account-page .btn.btn-primary:focus,
.account-page .btn.btn-primary:active {
	background-color: var(--brand-blue-hover) !important;
	border-color: var(--brand-blue-hover) !important;
	color: var(--brand-white) !important;
	box-shadow: 0 3px 10px rgba(var(--brand-blue-rgb), 0.35) !important;
}

/* Links */
.account-page .text-primary {
	color: var(--brand-blue) !important;
}

.account-page a.text-primary:hover,
.account-page a.text-primary:focus {
	color: var(--brand-blue-hover) !important;
}

/* Inputs */
.account-page .login-wrapper .login-content .form-login input:focus,
.account-page .form-control:focus,
.account-page .pass-group .pass-input:focus {
	border-color: var(--brand-blue) !important;
	box-shadow: 0 0 0 0.2rem var(--brand-blue-focus) !important;
}

/* Remember me checkbox */
.account-page .checkboxs input:checked ~ .checkmarks {
	background-color: var(--brand-blue) !important;
	border-color: var(--brand-blue) !important;
}

.account-page .authentication-check .checkboxs .checkmarks {
	border-color: rgba(var(--brand-blue-rgb), 0.35);
}

/* Language dropdown */
.account-page .login-lang-dropdown .dropdown-toggle {
	color: var(--brand-black);
	border-color: rgba(var(--brand-blue-rgb), 0.25);
}

.account-page .login-lang-dropdown .dropdown-item.active,
.account-page .login-lang-dropdown .dropdown-item:active,
.account-page .login-lang-dropdown .dropdown-item:hover {
	background-color: rgba(var(--brand-blue-rgb), 0.08) !important;
	color: var(--brand-black) !important;
}

/* Footer powered-by link */
.account-page .copyright-text a.text-primary {
	color: var(--brand-blue) !important;
}

.account-page .copyright-text a.text-primary:hover {
	color: var(--brand-green) !important;
}

/* Loader */
.account-page #global-loader .whirly-loader:not(:required) {
	width: 40px !important;
	height: 40px !important;
	border: 4px solid rgba(var(--brand-blue-rgb), 0.2) !important;
	border-top-color: var(--brand-blue) !important;
	box-shadow: none !important;
	border-radius: 50% !important;
}

.account-page .spinner-border,
.account-page .spinner-border-sm {
	color: var(--brand-blue) !important;
}
