@import url("Font.css");


.otpPop h1 {
	margin-bottom: 0.5rem;
	color: var(--black-color);
	font-weight: 600;
	font-size: 28px;
}

.regristration-modal {
	max-width: 600px !important;
	font-family: 'Raleway', sans-serif;font-feature-settings: "lnum";
	text-transform: math-auto;
}

.modal-body-heading h2 {
	font-size: 28px !important;
}

.leading-points p {
	font-size: 16px !important;
	font-weight: 400;
	font-family: 'Raleway', sans-serif;font-feature-settings: "lnum";
	margin-bottom: 0px !important;
}


.waiting-mssg {
	font-family: 'Raleway', sans-serif;font-feature-settings: "lnum";
	font-size: 16px !important;

}

.otpPop p {

	color: var(--black-color);
	font-weight: 300;
	font-size: 16px !important; 
	margin-bottom:0.5rem !important;
}

.otp-input {
	display: flex;
	justify-content: center;
	margin-bottom: 0rem;
}

.otp-input input {
	width: 50px;
	height: 50px;
	margin: 0 8px;
	text-align: center;
	font-size: 20px;
	border: 1px solid var(--black-color);
	border-radius: 12px;

	color: var(--black-color);
	transition: all 0.3s ease;
}

.otp-input input:focus {
	border-color: var(--primary-color);
	outline: none;
}

.otp-input input::-webkit-outer-spin-button,
.otp-input input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.otp-input input[type=number] {
	-moz-appearance: textfield;
}

.otpPopbutton {

	background-color: var(--primary-color) !important;
	font-family: 'Raleway', sans-serif;font-feature-settings: "lnum";
	font-size: 20px !important;
	font-weight: 700 !important;
	line-height: 23.48px !important;
	text-align: center !important;
	color: var(--white-color) !important;
	height: 42px !important;
}

.otpPopbutton:hover {
	border: 1px solid var(--primary-color) !important;
}



.otpPopResend {

	background-color: #444 !important;
	font-family: 'Raleway', sans-serif;font-feature-settings: "lnum";
	font-weight: 700 !important;
	line-height: 20.48px !important;
	text-align: center !important;
	color: var(--white-color) !important;
	height: 30px !important;
}

.otpPopResend:hover {
	border: 1px solid var(--primary-color) !important;
}

.otpPopResend:disabled {
	background: #cccccc !important;
	border-color: #999999 !important;
	color: #666666 !important;
	cursor: not-allowed !important;
	transform: none !important;
	box-shadow: none !important;

}

#timer {
	font-size: 1rem;
	color: white;
	font-weight: 500;
	margin-left: 10px;
}

@keyframes pulse {
	0% {
		opacity: 1;
	}

	50% {
		opacity: 0.5;
	}

	100% {
		opacity: 1;
	}
}

.expired {
	animation: pulse 2s infinite;
	color: #ff4444;
}

.resend-text {
	margin-top: 1rem;
	font-size: 0.9rem;
	color: #b0b0b0;
}

.resend-text p {
	text-align: center;
	margin-bottom: 0;
	margin-top: 5px;
}

.btnLoader {
	border: 3px solid #f3f3f3;
	border-top: 3px solid var(--primary-color);
	border-radius: 50%;
	width: 16px;
	height: 16px;
	animation: spin 1s linear infinite;
	display: inline-block;
	vertical-align: middle;
	margin-right: 15px;
}

@keyframes spin {
	0% {
		transform: rotate(0deg);
	}

	100% {
		transform: rotate(360deg);
	}
}