/* ======================================================
   MODAL LOGIN — tampilan modern & minimalis
   Semua style di bawah ini di-scope ke .login-modern
   (hanya berlaku di dalam modal login)
   ====================================================== */
#modalLogin .modal-dialog{ max-width:400px; }
#modalLogin .modal-content{
	border:none;
	border-radius:2px;
	box-shadow:0 10px 50px rgba(0,0,0,.18);
}
#modalLogin .login-modern, .login-modern *{ box-sizing:border-box; }
#modalLogin .login-modern{ color:#111; padding:36px 32px 30px; }

.login-modern .lm-close{
	position:absolute;
	top:14px;
	right:16px;
	background:none;
	border:none;
	font-size:20px;
	line-height:1;
	color:#999;
	cursor:pointer;
	padding:6px;
	transition:color .2s ease;
}
.login-modern .lm-close:hover{ color:#111; }

.login-modern .lm-logo{
	text-align:center;
	margin-bottom:18px;
}
.login-modern .lm-logo img{
	max-height:40px;
	max-width:60%;
}

.login-modern .lm-title{
	font-size:19px;
	font-weight:700;
	color:#111;
	text-align:center;
	margin-bottom:4px;
}
.login-modern .lm-subtitle{
	font-size:13px;
	color:#888;
	text-align:center;
	margin-bottom:24px;
}

.login-modern .lm-field{ margin-bottom:12px; }
.login-modern .form-control{
	border:1px solid #ddd;
	border-radius:2px;
	box-shadow:none !important;
	font-size:14px;
	padding:12px 14px;
	height:auto;
	color:#111;
}
.login-modern .form-control:focus{
	border-color:#111;
}
.login-modern .form-control::placeholder{ color:#999; }

.login-modern .lm-row{
	display:flex;
	align-items:center;
	justify-content:space-between;
	font-size:12px;
	margin-bottom:22px;
}
.login-modern .lm-remember{
	display:flex;
	align-items:center;
	gap:6px;
	color:#666;
}
.login-modern .lm-remember input{ accent-color:#111; margin:0; }
.login-modern .lm-forgot{
	color:#111 !important;
	background:none !important;
	-webkit-text-fill-color:#111 !important;
	font-weight:600;
	cursor:pointer;
}
.login-modern .lm-forgot:hover{ opacity:.7; }

.login-modern .btn-lg{
	width:100%;
	border-radius:2px !important;
	font-size:13px !important;
	text-transform:uppercase;
	letter-spacing:.6px;
	font-weight:600 !important;
	padding:13px 20px !important;
	box-shadow:none !important;
	background-image:none !important;
	transition:opacity .2s ease;
	border:1px solid #111 !important;
}
.login-modern button.btn-lg,
.login-modern a.btn-lg.lm-submit{
	background:#111 !important;
	color:#fff !important;
}
.login-modern button.btn-lg:hover{ opacity:.85; }
.login-modern button.btn-lg:disabled{ opacity:.6; cursor:default; }

.login-modern .lm-switch{
	text-align:center;
	font-size:13px;
	color:#888;
	margin-top:16px;
}
.login-modern .lm-switch a{
	color:#111 !important;
	background:none !important;
	-webkit-text-fill-color:#111 !important;
	font-weight:700;
}
.login-modern .lm-switch a:hover{ opacity:.7; }

.login-modern .lm-divider{
	display:flex;
	align-items:center;
	gap:12px;
	margin:22px 0 18px;
	font-size:11px;
	text-transform:uppercase;
	letter-spacing:.6px;
	color:#aaa;
}
.login-modern .lm-divider::before,
.login-modern .lm-divider::after{
	content:"";
	flex:1;
	height:1px;
	background:#eee;
}

.login-modern .lm-google{
	display:flex;
	align-items:center;
	justify-content:center;
	gap:10px;
	width:100%;
	border:1px solid #ddd;
	border-radius:2px;
	background:#fff;
	color:#111;
	font-size:13px;
	font-weight:600;
	padding:11px 20px;
	transition:border-color .2s ease, background .2s ease;
}
.login-modern .lm-google:hover{ border-color:#111; background:#fafafa; color:#111; }
.login-modern .lm-google img{ height:18px; }

.login-modern .lm-hint{
	font-size:12px;
	color:#888;
	line-height:1.6;
	text-align:center;
	margin-bottom:16px;
}

.login-modern .lm-back{
	font-size:12px;
	color:#888 !important;
	background:none !important;
	-webkit-text-fill-color:#888 !important;
	font-weight:600;
	display:inline-flex;
	align-items:center;
	gap:6px;
	margin-bottom:18px;
	cursor:pointer;
}
.login-modern .lm-back:hover{ color:#111 !important; -webkit-text-fill-color:#111 !important; }

#modalLogin #error, #modalLogin #sukses{ font-size:12px; margin-top:-4px; }