

.login-overlay{
	position:absolute;
	inset:0;
	background:
		linear-gradient(
			90deg,
			rgba(255,255,255,0) 0%,
			rgba(255,255,255,0) 40%,
			rgba(255,255,255,0) 100%
		);
}

.login-page .container{
	position:relative;
	z-index:2;
}

.login-info{
	max-width:550px;
	color:#FFF;
}

.login-badge{
	display:inline-block;
	padding:12px 24px;
	border-radius:40px;
	background:rgba(255,255,255,.12);
	backdrop-filter:blur(10px);
	font-size:14px;
	font-weight:600;
	letter-spacing:.5px;
	margin-bottom:35px;
}

.login-info h1{
	font-size:4rem;
	line-height:1.1;
	font-weight:800;
	color:#FFF;

	text-shadow:
		0 4px 20px rgba(0,0,0,.75);

	margin-bottom:30px;
}

.login-info p{
	font-size:1.4rem;
	line-height:1.8;
	color:rgba(255,255,255,.92);

	text-shadow:
		0 2px 10px rgba(0,0,0,.8);
}

.login-card{
	position:relative;

	background:rgba(255,255,255,.94);

	backdrop-filter:blur(30px);

	border:1px solid rgba(0,0,0,.06);

	border-radius:40px;

	padding:60px;

	max-width:650px;

	box-shadow:
		0 30px 80px rgba(0,0,0,.12);

	overflow:hidden;

	margin-top:180px;
	margin-bottom:60px;
}      


.login-card input{
	height:58px;

	background:#fff;

	border:1px solid #e5e7eb;

	border-radius:18px;

	padding:0 25px;

	color:#1f2937;

	font-size:1rem;

	transition:.3s;
}

.login-card input::placeholder{
	color:#9ca3af;
}

.login-card input:focus{

	border-color:#d8a74d;

	box-shadow:
		0 0 0 4px rgba(216,167,77,.12);

	background:#fff;
}

.login-card input::placeholder{
	color:rgba(255,255,255,.45);
}

.login-card input:focus{
	background:rgba(255,255,255,.08);

	border-color:#d8a74d;

	box-shadow:
		0 0 0 4px rgba(216,167,77,.15);

	outline:none;
}
.login-card h2{
	color:#FFF;

	font-size:3rem;

	font-weight:600;

	margin-bottom:15px;
}
.login-card h3{
	color:#1f2937;

	font-size:2rem;

	font-weight:200;

	margin-bottom:15px;
}

.login-card p{
	color:#1f2937;

	font-size:1rem;
     font-weight: normal;
}
.login-card label{
	color:#1f2937;

	font-size:17px;

	font-weight:500;

	margin-bottom:10px;
}
.login-btn{

	height:60px;

	border:none;

	border-radius:40px;

	width:100%;

	font-size:18px;

	font-weight:700;

	color:#fff;

	background:linear-gradient(
		90deg,
		#0d4db8,
		#1e6df1
	);

	box-shadow:
		0 15px 40px rgba(13,77,184,.2);
          
}

.login-btn:hover{
	transform:translateY(-3px);

	box-shadow:
		0 20px 50px rgba(239,195,109,.4);
}
@media(max-width:991px){

	.login-card{

		padding:35px;

		border-radius:30px;
	}

}
@media(min-height:991px){
	.login-card{
          margin-top: 20px;
	}

}

.forgot-link{

	color:#0d6efd;

	font-size:14px;

	font-weight:500;

	text-decoration:none;
}

.forgot-link:hover{

	text-decoration:underline;

}


@media(min-height:800px){
     .login-card{
          margin-top: 20px;
     }
}

@media(max-width:991px){

	.login-page{
		padding:40px 0;
	}

	.login-card{

		padding:40px 30px;

		border-radius:30px;

		max-width:100%;
	}

	.login-header{
		margin-bottom:35px;
	}

	.login-icon{

		width:70px;
		height:70px;

		font-size:28px;
	}

	.login-header h3{
		font-size:1.7rem;
	}

	.login-info{
		display:none;
	}

}

@media(max-width:576px){

	.login-card{

		padding:30px 25px;

		border-radius:25px;
	}

	.login-input{

		height:55px;

		font-size:15px;
	}

	.login-btn{

		height:60px;

		font-size:18px;
	}

	.login-header h3{
		font-size:1.5rem;
	}

}
.login-icon{
     display:flex; align-items:center; justify-content:center;
     border-radius:50%;
	width:80px;
	height:80px;

	background:#fff8eb;

	border:1px solid rgba(216,167,77,.25);

	color:#d8a74d;

	font-size:30px;

	margin:0 auto;
}
.login-icon i{
     color: #D4A95F;
}

.register-box{
	display:flex;
	align-items:center;
	gap:25px;

	padding:28px;

	margin-top:35px;

	background:
		linear-gradient(
			145deg,
			rgba(19,39,76,.95),
			rgba(6,18,42,.95)
		);

	border:1px solid rgba(120,160,255,.15);

	border-radius:28px;

	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.05);
}

.register-icon{
	width:90px;
	height:90px;

	min-width:90px;

	border-radius:50%;

	display:flex;
	align-items:center;
	justify-content:center;

	font-size:34px;

	color:#e2b45e;

	background:
		radial-gradient(
			circle,
			rgba(226,180,94,.15),
			rgba(0,0,0,.3)
		);

	box-shadow:
		0 10px 30px rgba(0,0,0,.3);
}

.register-content{
	flex:1;
}

.register-text{
	color:rgba(255,255,255,.85);

	font-size:18px;

	line-height:1.7;

	margin-bottom:12px;
}

.register-link{
	display:inline-flex;
	align-items:center;
	gap:10px;

	color:#e2b45e;

	font-size:21px;

	font-weight:600;

	text-decoration:none;

	transition:.25s;
}

.register-link:hover{
	color:#f1c979;

	transform:translateX(5px);
}
@media(max-width:767px){

	.register-box{
		flex-direction:column;
		text-align:center;
	}

	.register-icon{
		width:75px;
		height:75px;
		font-size:28px;
	}

	.register-text{
		font-size:15px;
	}

	.register-link{
		font-size:18px;
	}
}
.login-features{

	margin-top:0;

	padding:80px 0;

	background:#FFF;

	border-top:1px solid #edf2f7;

	position:relative;
}

.feature-item{

	text-align:center;

	padding:35px 25px;

	height:100%;

	background:#FFF;

	border-radius:30px;

	border:1px solid #eef2f7;

	box-shadow:
		0 10px 30px rgba(0,0,0,.05);

	transition:.3s;
}

.feature-item:hover{

	transform:translateY(-5px);

	box-shadow:
		0 20px 40px rgba(0,0,0,.08);

}

.feature-icon{

	width:78px;
	height:78px;

	margin:0 auto 25px;

	border-radius:50%;

	display:flex;
	align-items:center;
	justify-content:center;

	font-size:30px;

	color:#d8ae61;

	background:#fff8ec;

	border:1px solid rgba(216,174,97,.20);

	box-shadow:
		0 10px 20px rgba(216,174,97,.15);

}

.feature-item h5{

	color:#12203a;

	font-size:1.2rem;

	font-weight:600;

	margin-bottom:12px;

}

.feature-item p{

	color:#7b8494;

	font-size:.95rem;

	line-height:1.7;

	max-width:200px;

	margin:auto;

}
.register-box{

	background:#fafafa;

	border:1px solid #ececec;

	box-shadow:none;
}

.register-text{
	color:#4b5563;
}

.register-link{
	color:#d8a74d;
}

.register-check{
	display:flex;
	align-items:center;
	gap:12px;

	font-size:15px;

	color:#4b5563;
}

.divider{
	position:relative;

	text-align:center;

	margin:40px 0 30px;
}

.divider::before{
	content:"";

	position:absolute;

	top:50%;
	left:0;

	width:100%;
	height:1px;

	background:#e5e7eb;
}

.divider span{
	position:relative;

	padding:0 20px;

	background:#fff;

	color:#6b7280;

	font-size:15px;
}

.social-login{
	display:flex;

	gap:15px;

	margin-bottom:35px;
}

.social-btn{
	flex:1;

	height:58px;

	border:1px solid #e5e7eb;

	border-radius:18px;

	display:flex;

	align-items:center;
	justify-content:center;

	gap:12px;

	color:#374151;

	font-size:16px;

	text-decoration:none;

	transition:.25s;
}

.social-btn:hover{
	border-color:#d8a74d;

	transform:translateY(-3px);

	box-shadow:
		0 10px 25px rgba(0,0,0,.08);
}

.password-group{
	position:relative;
}

.password-group .login-input{
	padding-right:55px;
}

.toggle-password{
	position:absolute;
	top:50%;
	right:18px;

	transform:translateY(-50%);

	cursor:pointer;

	color:#9ca3af;

	font-size:18px;

	transition:.2s;
}

.toggle-password:hover{
	color:#d8a74d;
}