/*******************  content style    *********************/
.login-wrapper{
	min-height: 100vh;
	background-color: #F9FBFF;
	display: flex;	
	align-items: center;
	justify-content: center;
  padding: 5px 0;
  position: relative;
  z-index: 0;
  &:before{
		content: '';
		border-radius: 865px;
		background: linear-gradient(218deg, rgba(35, 46, 70, 0.30) -29.64%, rgba(89, 114, 169, 0.30) 69.77%);
		filter: blur(145.5px);
		width: 450px;
    height: 328px;
		position: absolute;
		z-index: 1;
		top: 0;
		right: 0;
	}
	&:after{
		content: '';
		border-radius: 758px;
		background: linear-gradient(180deg, rgba(89, 114, 169, 0.30) 0%, rgba(89, 114, 169, 0.30) 65.26%);
		filter: blur(110.5px);
		width: 403px;
		height: 314px;
		position: absolute;
		z-index: 1;
		bottom: 0;
		left: 0;
	}
}
a{
	text-decoration: none !important;
}
.wrapper-content{
	display: flex;
	align-items: center;
	flex-direction: column;
	justify-content: center;
}
.logo-wrapper{
  width: 100%;
	text-align: end;
  max-width: 1096px;
	.dge-logo{
		width: 248px;
		height: 97px;
	}
}
.login-card{	
  width: 100%;
	height: 450px;
	border-radius: 27px;
	max-width: 1096px;
	display: flex;	
	align-items: center;
	justify-content: center;
	position: relative;
	&:before{
		content: '';
		background-image: url('./img/left-bg-img.png');
		background-position: right;
		background-repeat: no-repeat;
		background-size: contain;
		width: 181px;
		height: 193px;
		position: absolute;
		z-index: 1;
		left: 43px;
		bottom: -72px;
	}
	.right-side{
		position: relative;
		z-index: 2;
		border-radius: 0 27px 27px 0;
		height: 100%;
		width: 50%;
		padding: 22px 25px;
		background: rgba(255, 255, 255, 0.68);
		.content-box{
			text-align: center;
			margin-top: 10px;
		}
	}
	.left-side{
		border-radius: 27px 0 0 27px;
		height: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		background: rgba(228, 232, 239, 0.53);
		width: 50%;
		position: relative;
		z-index: 2;
    overflow: hidden;
	  &:before{
			content: '';
			background-image: url('./img/right-bg-image.png');
			background-position: right;
			background-repeat: no-repeat;
			background-size: contain;
			width: 237px;
			height: 250px;
			position: absolute;
			z-index: 1;
			top: -53px;
			right: -48px;
		}
		.abu-dhabi-logo{
			width: 416px;
			height: 197px;
		}
	}
}
.lang-link{
	margin-left: auto;
	border-radius: 40px;
	background: #F9FBFF;
	box-shadow: 0 2px 4px 0 rgba(54, 54, 54, 0.09);
	padding: 12px;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	.lang-icon{
		width: 20px;
		height: 20px;
	}
}
.fingerprint-icon{
	width: 45px;
	height: 58px;
}
.main-title{
	font-family: "Poppins", sans-serif;
	color: #515151;
	font-size: 30px;
	font-weight: 600;
	margin-bottom: 8px;
}
.sub-title{
	font-family: "Inter", sans-serif !important;
	color: #7D7D7D;
	font-size: 18px;
	font-weight: 400;
	margin-bottom: 32px;
}
.signIn-btn{
	font-family: "Inter", sans-serif !important;
	max-width: 393px;
	margin: 0 auto;
	height: 57px;
	padding: 15px;
	border-radius: 16px;
	border: 1px solid #000;
	box-shadow: 1px 1px 5.1px 0 rgba(0, 0, 0, 0.50);
	color: #181818;
	font-size: 22px;
	font-weight: 600;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 5px;
	&:hover{
  	border: 1px solid #b69971;
	}
}
.footer-txt{
	font-family: "Poppins", sans-serif;
	margin-top: 27px;
	font-size: 16px;
	font-weight: 400;
	.txt-1{
		color: #5972A9;
	}
	.txt-2{
		color: #88919D;
		a{
			color: #88919D;
		}
	}
}
.dropdown-lang{
  .dropdown-menu{
  	--bs-dropdown-min-width: 8rem;
  }     
}
.login_UAE_pass{
  text-align: left !important;
  margin: 48px auto 0;
  max-width: 393px;
  .main-title{
  	margin-bottom: 20px;
  }
}
.login-btn{
	border-radius: 10px;
	background-color: #5972A9;
	box-shadow: 0 2px 11px 0 rgba(0, 0, 0, 0.15);
	height: 45px;
	border: 1px solid #5972A9;
	display: block;
	width: 100%;
	padding: 9px;
	text-align: center;
	color: #F9FBFF;
	font-size: 16px;
	font-weight: 500;
	font-family: "Poppins", sans-serif;
	&:hover{
		background-color: #fff;
		color: #5972A9;
	}
}
.psw-txt{
	color: #717171;
	font-size: 14px;
	font-weight: 500;
	margin-top: 20px;
	display: block;
	text-align: center;
	font-family: "Poppins", sans-serif;
}
.input-field{
	margin-bottom: 15px;
	font-family: "Poppins", sans-serif;
	label{
		color: #515151;
		font-size: 16px;
		font-weight: 400;
		margin-bottom: 5px;
	}
	input{
		box-shadow: none;
		border-radius: 9px;
		border: 1.5px solid #ADADAD;
		padding: 8px 10px;
		background: rgba(255, 255, 255, 0.13);
		color: #717171;
		font-size: 14px;
		font-weight: 300;
	}
}
.verify-box{
	border-radius: 10px;
	border: 0.5px solid #EF3F43;
	background-color: rgba(247, 231, 232, 0.79);
	padding: 19px 13px;
	margin-bottom: 26px;
}
.verify-content{
	display: flex;
	align-items: flex-start;
	.info-icon{
		width: 17px;
		height: 18px;
		margin-right: 8px;
	}
	.verify-txt{
		color: #9D292C;
		font-size: 14px;
		font-weight: 400;
		line-height: 22px;
		font-family: "Inter", sans-serif !important;
		text-align: center;
	}
}	
.verify-wrapper{
  margin: 49px auto 0;
  max-width: 403px;
}



/*****************************   AR   **************************/
html[lang="ar"]{
	.dropdown-lang .dropdown-menu{
		text-align: start;
	}
	.login-card {
		&:before{
			right: 30px;
			left: unset;
		}
		.right-side{
      border-radius: 27px 0 0 27px;
		}
		.left-side{
			border-radius: 0 27px 27px 0;
			&:before{
				right: unset;
				left: -82px;
			}
		}
	}
	.lang-link{
		margin-left: 0;
		margin-right: auto;
	}
	.login-wrapper{
		&:before{
			right: unset;
			left: 0;
		}
		&:after{
			right: 0;
			left: unset;
		}
	}
	.login_UAE_pass{
		text-align: right !important;
	}
	.verify-content .info-icon {
		margin-right: 0;
		margin-left: 6px;
	}

}
/*****************************   responsive   **************************/
@media (max-width: 2652px), not all and (min-width: 2653px){
	.login-card{
    height: 630px;
	}
	.footer-txt{
    margin-top: 79px;
	}
	.login-card .right-side .content-box{
  	margin-top: 45px; 
  }


}
@media (max-width: 1366px), not all and (min-width: 1367px){
	.login-card{
    height: 400px;
	}
	.footer-txt{
    margin-top: 27px;
	}
	.login-card .right-side .content-box{
  	margin-top: 10px; 
  }
  .psw-txt{
    margin-top: 18px;
  }
  .logo-wrapper {
    .dge-logo{
			width: 238px;
			height: 87px;
  	}
  }
  .verify-card{
	  height: 459px;
	}



}
@media (max-width: 991px), not all and (min-width: 992px){
	.login-wrapper {
    &:before{
    	display: none;
    }
    &:after{
    	display: none;
    }
  }
  .login-card {
    max-width: 100%;
    height: 100%;
  	flex-direction: column;
 	  &:before{
	  	display: none;
    }
    .right-side{
   		border-radius: 0 0 27px 27px !important;
    	width: 100%;
    }
    .left-side {
    	width: 100%;
    	border-radius: 27px 27px 0 0 !important;
    	padding: 30px;
    	&:before{
    		display: none;
    	}
			.abu-dhabi-logo {
				width: 100%;
				height: auto;
				max-width: 450px;
			}
    }
  }
  .signIn-btn{
    padding: 3px 15px;
    font-size: 18px;
  	height: 100%;
  }


}
@media (max-width: 767px), not all and (min-width: 768px){
	.dropdown-lang {
    margin-right: 0;
	}
	html[lang="ar"]{
		.dropdown-lang {
	    margin-left: 0;
		}	
	}
	.login-card .left-side {
	  .abu-dhabi-logo {
      max-width: 358px;
	  }
  }



}
@media (max-width: 575px), not all and (min-width: 576px){
	.login-card .left-side {
	  .abu-dhabi-logo {
      max-width: 315px;
	  }
  }


}