:root { color-scheme: light; }

html, body.login { min-height: 100%; }

body.login {
	align-items: center !important;
	background: #f8f5f9 !important;
	box-sizing: border-box;
	display: flex;
	font-family: Dubai, Tahoma, Arial, sans-serif;
	justify-content: center !important;
	margin: 0;
	padding: 24px 16px;
}

body.login::before,
.numu-login-intro,
.numu-login-policy,
.numu-login-lead { display: none !important; }

body.login #login {
	box-sizing: border-box;
	margin: 0;
	max-width: 100%;
	padding: 0;
	position: static !important;
	width: 440px !important;
}

body.login #login > * { display: none !important; }
body.login #login > .numu-otp-card { display: block !important; }
body.login #login ~ * { display: none !important; }

.numu-otp-card {
	background: #fff;
	border: 1px solid #e8dfe9;
	border-radius: 22px;
	box-shadow: 0 18px 46px rgba(50, 0, 75, .10);
	color: #32004b;
	overflow: hidden;
	text-align: right;
}

.numu-otp-card,
.numu-otp-card * { font-family: Dubai, Tahoma, Arial, sans-serif; }
body.login .numu-otp-card h1 { font-family: Dubai, Tahoma, Arial, sans-serif !important; }

.numu-otp-brand-row {
	align-items: center;
	display: flex;
	justify-content: center;
	padding: 30px 28px 6px;
}

.numu-otp-brand {
	align-items: baseline;
	color: #32004b;
	display: inline-flex;
	direction: ltr;
	gap: 7px;
	text-decoration: none;
}

.numu-otp-logo { display: block; height: auto; max-width: 100%; width: 178px; }

.numu-otp-brand-name {
	font-family: Arial, sans-serif;
	font-size: 39px;
	font-style: italic;
	font-weight: 800;
	letter-spacing: -2px;
	line-height: 1;
}

.numu-otp-brand-subtitle {
	font-family: Arial, sans-serif;
	font-size: 9px;
	font-weight: 700;
	letter-spacing: .15px;
	white-space: nowrap;
}

.numu-otp-content { padding: 26px 38px 30px; text-align: center; }

.numu-otp-card h1 {
	color: #32004b;
	font-size: 28px;
	font-weight: 800;
	letter-spacing: -.4px;
	line-height: 1.3;
	margin: 0 0 8px;
}

.numu-otp-intro {
	color: #695e6e;
	font-size: 15px;
	line-height: 1.65;
	margin: 0 0 24px;
}

.numu-otp-form label {
	color: #32004b;
	display: block;
	font-size: 15px;
	font-weight: 800;
	margin: 0 0 9px;
	text-align: right;
}

.numu-otp-form input,
body.login .numu-otp-form input {
	appearance: none;
	background: #fff;
	border: 1px solid #cbb9d1 !important;
	border-radius: 12px !important;
	box-shadow: none !important;
	box-sizing: border-box;
	color: #32004b;
	direction: ltr;
	font-family: inherit;
	font-size: 18px;
	min-height: 56px;
	margin: 0 !important;
	padding: 12px 15px !important;
	text-align: left;
	transition: border-color .16s ease, box-shadow .16s ease;
	width: 100%;
}

.numu-otp-form input:focus,
body.login .numu-otp-form input:focus {
	border-color: #32004b !important;
	box-shadow: 0 0 0 3px rgba(50, 0, 75, .12) !important;
	outline: 0;
}

.numu-otp-form .numu-otp-code {
	font-size: 23px !important;
	font-weight: 700;
	letter-spacing: 7px;
	padding-left: 17px !important;
	text-align: center;
}

.numu-otp-form .button-primary {
	background: #32004b;
	border: 1px solid #32004b;
	border-radius: 12px;
	box-shadow: none;
	box-sizing: border-box;
	color: #fff;
	font-family: inherit;
	font-size: 17px;
	font-weight: 800;
	height: 56px !important;
	margin-top: 16px;
	min-height: 56px;
	padding: 0 18px;
	text-shadow: none;
	width: 100%;
}

.numu-otp-form .button-primary:hover,
.numu-otp-form .button-primary:focus {
	background: #4e1268;
	border-color: #4e1268;
	box-shadow: 0 8px 18px rgba(50, 0, 75, .18);
}

.numu-otp-resend { margin-top: 15px; text-align: center; }
.numu-otp-resend .button-link { color: #5c176f; font-family: inherit; font-size: 13px; font-weight: 700; }

.numu-otp-footer {
	background: #fff;
	border-top: 1px solid #f0e8f2;
	color: #776b7b;
	font-size: 12px;
	line-height: 1.8;
	padding: 15px 24px 17px;
	text-align: center;
}

.numu-otp-footer p { margin: 0; }
.numu-otp-footer a { color: #4a0c60; font-weight: 700; text-decoration: none; }
.numu-otp-footer a:hover,
.numu-otp-footer a:focus { color: #a6731f; text-decoration: underline; }
.numu-otp-footer span { color: #b5a6ba; margin: 0 7px; }

body.login #login_error,
body.login .message {
	border-left: 0;
	border-right: 4px solid #ffda8b;
	direction: rtl;
	margin: 0 0 16px;
	text-align: right;
}

@media (max-width: 520px) {
	body.login { align-items: flex-start !important; padding: 16px 12px; }
	.numu-otp-card { border-radius: 18px; }
	.numu-otp-brand-row { padding: 26px 22px 4px; }
	.numu-otp-content { padding: 24px 22px 26px; }
	.numu-otp-card h1 { font-size: 26px; }
	.numu-otp-footer { padding: 14px 18px 16px; }
}