/* OTP Login Feature Styles */

.pwdless-login {
	padding: 100px 0;
}
.pwdless-login .container {
	display: grid;
	grid-template-columns: 57% 35%;
	justify-content: space-between;
}
.pwdless-login .container:after, .pwdless-login .container::before{display: none;}
.pwdless-login .other-logins {
	border-radius: 10px;
	padding: 40px 45px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
}
.pwdless-login .otp-login {
	margin-left: auto;
	border-radius: 10px;
	padding: 40px 45px 120px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
	background: url(../images/login-bg.png) center bottom no-repeat;
	background-size: 100% 115px;
}
.pwdless-login .otp-login h2{margin-bottom: 20px; font-size: 1.2em; font-weight: 600;}
.otp-login p{font-size: 0.875em; font-weight: 500;}
.otp-form label{display: block; margin-bottom: 10px; font-family: 'Montserrat', sans-serif;}
.otp-form .form-control{width:100%; padding: 10px; margin-bottom: 15px; border:1px solid #cfcfcf;}
.otp-form .org-btn{ padding: 12px 20px; background-color: #264281; border-radius: 20px; border:none; color: #fff; text-align: center; margin-bottom: 20px; cursor: pointer; width:100%;}
.otp-form .org-btn:hover{background-color: #3767d5;}
.pwdless-login .otp-login .form-item {
	margin-bottom: 15px;
	position: relative;
}
.pwdless-login .otp-login .form-label {
	margin-bottom: 8px;
	display: block;
	position: absolute;
	left: 10px;
	top: -8px;
	background-color: #fff;
	padding: 0 8px;
	font-size: 0.875em; font-family: 'Montserrat', sans-serif;
}
.pwdless-login .otp-login .form-control {
	width: 100%;
	border-radius: 8px;
	padding: 12px 10px; font-family: 'Montserrat', sans-serif; font-size: 0.9rem;
}
.pwdless-login .otp-login .form-submit {
	cursor: pointer;
	display: inline-flex;
	padding: 12px 20px;
	background-color: #264281;
	margin-bottom: 15px;
	border-radius: 20px;
	color: #fff;
	border: none;
	width: 100%;
	text-align: center; font-family: 'Montserrat', sans-serif;
}
.pwdless-login .otp-login .form-submit:hover {
	background-color: #144ac9;
}
.pwdless-login .otp-login .registration-message {
	margin-top: 10px;
}
.pwdless-login .otherlogin-text {
	margin-bottom: 30px;
	display: block;
	text-align: center;
	font-size: 1.2em;
	font-weight: 600;
}
.pwdless-login .otp-info {
	margin-bottom: 20px;
}
.otp-login .alert-success {
	border: 1px solid #2ab998;
	padding: 15px 13px;
	border-radius: 15px;
	background: #d0fbf1; margin-bottom: 10px; font-size: 0.9rem; color: #0f6b53;
}
.otp-login .alert-danger,.otp-login .alert.alert-error {
	border: 1px solid #d9675d;
	padding: 15px 13px;
	border-radius: 15px;
	background: #e8b6b3; margin-bottom: 10px; font-size: 0.9rem;
}
.pt-line {
	border-top: 1px solid #ddd;
	position: relative;
	font-size: 0.875em;
	text-align: center;
}
.pt-line span {
	background-color: #fff;
	top: -11px;
	position: relative;
	padding: 0 10px;
	display: inline-flex;
}
.ligin-pt-block {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 50px;
}
.login-by {
	text-align: center;
	padding: 30px 20px;
}
.login-by a {
	border-radius: 10px;
	background-color: #fff;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
	justify-content: center;
	display: flex;
	margin-bottom: 15px;
	padding: 25px 15px 60px;
	height: 164px;
	align-items: center;
}
.login-by a.my-auth {
	background: url(../images/design-2.png) 0 bottom no-repeat;
}
.login-by a.jan-login {
	background: url(../images/design-1.png) right bottom no-repeat;
}
.login-by .login-text {
	font-size: 0.875em;
	font-weight: 500;
}
.resend-otp{margin-bottom: 10px;font-size: 0.875em; }
.form-user-identifier{position: relative;}
.form-user-identifier label { margin-bottom: 8px; display: block; position: absolute; left: 10px; top: -8px; background-color: #fff; padding: 0 8px; font-family: 'Montserrat', sans-serif; font-size: 0.875em; }
.can-change-user{font-size: 0.9rem; display: inline-flex; justify-content: space-between; border: 1px solid #2483c5; margin-bottom: 20px; border-radius: 7px; cursor: pointer; max-width: 100%; flex-wrap: nowrap; align-items: center;}
.can-change-user .user-name{display: inline-block; padding: 10px; line-height: 20px; width: auto; word-break: break-all; font-weight: 500;}
.lineV{height: 20px; background-color: #ddd; width:1px;}
.can-change-user a{margin: 0 8px;}


/* Responsive — 1270px */
@media all and (max-width:1270px){
	.pwdless-login .container{grid-template-columns: 58% 38%;}
	.ligin-pt-block{gap:20px;}
	.login-by{padding: 10px 0 0;}
}

/* Responsive — 1130px */
@media all and (max-width:1130px){
	.pwdless-login .other-logins,.pwdless-login .otp-login{padding: 40px 20px;}
	.pwdless-login { padding: 50px 0;}
}

/* Responsive — 1023px */
@media all and (max-width:1023px){
	.pwdless-login{padding: 100px 0;}
}

/* Responsive — 767px (mobile) */
@media all and (max-width:767px){
	.pwdless-login .container{grid-template-columns: 1fr;}
	.pwdless-login .other-logins{order:2; padding: 20px;}
	.pwdless-login .otp-login{order: 1; max-width: 100%; margin-bottom: 30px; padding: 20px 20px 75px; background-size: 100% 74px; margin-right: auto;}
	.pwdless-login {padding: 30px 0;}
}

/* Responsive — 599px */
@media (max-width: 599px){
	.pwdless-login .otherlogin-text{font-size: 1.1em;}
	.pwdless-login .otp-login h2{font-size: 1.1em; margin-bottom: 10px;}
}

/* Responsive — 479px */
@media all and (max-width:479px){
	.ligin-pt-block{grid-template-columns: 1fr;}
}

/* Responsive — 370px */
@media all and (max-width:370px){
	.pwdless-login .otp-login{padding: 15px 15px 75px;}
}


/* Dark theme overrides remain in assets/css/change.css (loaded conditionally for dark mode) */