/* Login controls retain the application's authentication and Bootstrap 5 runtime. */
.lw-login-reference .hero-text-background { padding: 3px 8px; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.lw-login-reference .banner-area .info .content.inc-video h1 { line-height: 1.5; }
.lw-login-reference .banner-area .info .content.inc-video p { line-height: 2; }
.lw-login-reference .banner-area .info .content.inc-video p { margin-bottom: 0; }
.lw-login-reference .login-system-status { margin: 6px 0 20px; color: #323a45; }
.lw-login-reference .login-system-status-heading { display: flex; align-items: center; gap: 8px; font-weight: 600; }
.lw-login-reference .login-system-status small { display: block; color: #667085; line-height: 1.6; margin-top: 4px; }
.lw-login-reference img[src*="/login-reference/logo-cekin.png"] { filter: brightness(0) invert(1); }
.lw-login-reference nav.navbar img.logo-scrolled { filter: brightness(0) saturate(100%) invert(32%) sepia(75%) saturate(647%) hue-rotate(131deg) brightness(92%) contrast(96%); width: auto; height: 40px !important; max-width: 100%; }
.lw-login-reference nav.navbar:not(.no-background) .navbar-brand { display: flex; align-items: center; padding-top: 10px; padding-bottom: 10px; }
.lw-login-reference .f-item.about img[src*="/login-reference/logo-cekin.png"] { display: block; margin-bottom: 0; filter: brightness(0) saturate(100%) invert(32%) sepia(75%) saturate(647%) hue-rotate(131deg) brightness(92%) contrast(96%); width: 190px; height: auto !important; max-width: 100%; }
.lw-login-reference .form-info .form-label { color: #fff !important; }
.lw-login-reference .form-info .form-control { background: #fff; color: #323a45; border-radius: 4px; font-size: 14px; }
.lw-login-reference .form-info .login-password { position: relative; }
.lw-login-reference .form-info .login-password .form-control { padding-right: 48px; }
.lw-login-reference .form-info .togglePassword { position: absolute; top: 0; right: 0; bottom: 0; width: 44px; padding: 0; border: 0; background: transparent; color: #667085; border-radius: 0 4px 4px 0; }
.lw-login-reference .form-info .togglePassword:hover { background: transparent; color: #323a45; }
.lw-login-reference .form-info .togglePassword:focus-visible { outline: 2px solid #323a45; outline-offset: -4px; }
.lw-login-reference .form-info #refresh-captcha { padding: 8px 12px; font-size: 12px; }
.lw-login-reference .form-info #kt_sign_in_submit { width: 100%; margin-top: 15px; }
.lw-login-reference .form-info .btn-light-primary { display: block; color: #fff; border: 1px solid rgba(255,255,255,.6); background: transparent; padding: 10px; }
.lw-login-reference .form-info a.btn-light-primary { font-weight: 400; }
.lw-login-reference .form-info .separator { margin: 16px 0 !important; border-color: rgba(255,255,255,.25); }
.lw-login-reference .form-info button:disabled { opacity: .65; }
.lw-login-reference nav.navbar .navbar-brand { height: auto; }
.lw-login-reference nav.navbar .navbar-collapse { flex-grow: 0; }
.lw-login-reference .footer-bottom p { margin: 0; }
@media (min-width: 1024px) {
    .lw-login-reference nav.navbar .navbar-collapse { display: block !important; }
    .lw-login-reference nav.navbar .navbar-nav { display: block; }
}
@media (max-width: 1023.98px) {
    .lw-login-reference nav.navbar .container { display: block; }
    .lw-login-reference nav.navbar .navbar-collapse.collapse:not(.show) { display: none !important; }
    .lw-login-reference nav.navbar .navbar-collapse.show { display: block !important; }
}
@media (max-width: 767.98px) {
    .lw-login-reference .form-info { min-width: 0; }
    .lw-login-reference .captcha-img { max-width: 100%; }
}

.lw-login-reference nav.navbar, .lw-login-reference nav.navbar > .container { display: block; }
.lw-login-reference .banner-area { min-height: 850px; }
.lw-login-reference .form-info .d-flex { display: flex; }
.lw-login-reference .form-info .flex-wrap { flex-wrap: wrap; }
.lw-login-reference .form-info .gap-3 { gap: 12px; }
.lw-login-reference .form-info .position-relative { position: relative; }
.lw-login-reference .form-info .position-absolute { position: absolute; }
.lw-login-reference .form-info .top-0 { top: 0; }
.lw-login-reference .form-info .start-0 { left: 0; }
.lw-login-reference .form-info .w-100 { width: 100%; }
.lw-login-reference .form-info .h-100 { height: 100%; }
.lw-login-reference .form-info .mt-3 { margin-top: 12px; }
.lw-login-reference .form-info .wait-login { display: none; }
.lw-login-reference .form-info .mb-5 { margin-bottom: 20px; }
.lw-login-reference .form-info .captcha-img { display: inline-block; flex-shrink: 0; }
.lw-login-reference #captcha-loading { position: absolute; inset: 0; align-items: center; justify-content: center; }
.lw-login-reference .captcha-spinner { display: inline-block; width: 28px; height: 28px; border: 3px solid rgba(255,255,255,.3); border-top-color: #fff; border-radius: 50%; animation: login-captcha-spin .75s linear infinite; }
@keyframes login-captcha-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .lw-login-reference .captcha-spinner { animation-duration: 1.5s; } }
.lw-login-reference nav .form-select { padding: 6px 10px; border-radius: 4px; }
.lw-login-reference .visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
@media (max-width: 767.98px) { .lw-login-reference .banner-area { min-height: 0; } }

.lw-login-reference .login-system-services { margin: 8px 0; }
.lw-login-reference .login-system-services > div { display: flex; align-items: center; gap: 12px; margin-bottom: 6px; }
.lw-login-reference .login-system-services dt { min-width: 80px; font-weight: 400; }
.lw-login-reference .login-system-services dd { display: inline-flex; align-items: center; gap: 6px; margin: 0; padding: 4px 8px; border-radius: 4px; font-size: 12px; line-height: 1.4; font-weight: 600; color: #59636f; background: #e9edf1; }
.lw-login-reference .login-system-services [data-state="ok"] { color: #21633b; background: #e4f3e9; }
.lw-login-reference .login-system-services [data-state="error"] { color: #9c2424; background: #fbe8e8; }