/* Log masuk kakitangan / lupa kata laluan */
.auth-body { margin: 0; background: #f6f4ec; }
.auth-split { min-height: 100vh; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); }
@media (max-width: 991.98px) { .auth-split { grid-template-columns: 1fr; } .auth-art { display: none; } }

.auth-art { position: relative; overflow: hidden; color: #fff; display: flex; align-items: flex-end; background: #0b2e1c; }
.auth-art .art-bg { position: absolute; inset: 0; background-size: cover; background-position: center; animation: artFade 16s infinite; }
.auth-art .art-bg-2 { opacity: 0; }
@keyframes artFade { 0%, 40% { opacity: 1; } 50%, 90% { opacity: 0; } 100% { opacity: 1; } }
.auth-art .art-bg-2 { animation-name: artFade2; }
@keyframes artFade2 { 0%, 40% { opacity: 0; } 50%, 90% { opacity: 1; } 100% { opacity: 0; } }
.art-shade { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(4, 30, 15, .92) 0%, rgba(4, 30, 15, .35) 55%, rgba(4, 30, 15, .55) 100%); }
.art-copy { position: relative; z-index: 2; padding: 3rem; max-width: 560px; }
.art-copy h2 { font-family: Georgia, serif; font-size: 2.1rem; line-height: 1.2; margin: 1rem 0 .5rem; text-shadow: 0 2px 14px rgba(0, 0, 0, .5); }
.art-copy p { opacity: .9; }
.art-points { list-style: none; padding: 0; margin: 1.5rem 0 0; display: grid; gap: .55rem; font-size: .95rem; }
.art-points i { color: #f5b942; margin-right: .5rem; }
.brand-chip { width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; background: #fff; box-shadow: 0 8px 24px rgba(0, 0, 0, .3); padding: 6px; }
.brand-chip img { width: 100%; height: 100%; object-fit: contain; }
.brand-chip.sm { width: 48px; height: 48px; display: inline-grid; padding: 5px; }

.auth-pane { display: grid; place-items: center; padding: 2rem 1.25rem; }
.auth-box { width: 100%; max-width: 420px; }
.auth-box h1 { font-family: Georgia, serif; font-weight: 700; font-size: 1.85rem; }
.auth-box .lead-sm { color: #66756d; }
.auth-box .form-control-lg { border-radius: .9rem; font-size: 1rem; padding: .8rem 1rem; }
.auth-box .input-group .form-control-lg { border-radius: .9rem 0 0 .9rem; }
.auth-box .input-group .btn { border-radius: 0 .9rem .9rem 0; }
.auth-box .btn-primary { background: #14532d; border-color: #14532d; border-radius: .9rem; padding: .8rem 1rem; font-weight: 700; }
.auth-box .btn-primary:hover { background: #0f4023; border-color: #0f4023; }
.auth-box .form-control:focus { border-color: #2f7d3a; box-shadow: 0 0 0 .25rem rgba(47, 125, 58, .18); }
.auth-foot { display: flex; justify-content: space-between; gap: 1rem; margin-top: 2rem; font-size: .8rem; color: #8a968f; }
.auth-foot a { color: #66756d; text-decoration: none; } .auth-foot a:hover { color: #14532d; }
.caps-warn { display: none; font-size: .8rem; color: #b45309; margin-top: .35rem; }
.caps-warn.on { display: block; }
.strength { height: 6px; border-radius: 4px; background: #e6e9e4; overflow: hidden; margin-top: .4rem; }
.strength i { display: block; height: 100%; width: 0; background: #dc3545; transition: width .25s, background .25s; }
.sent-card { text-align: center; }
.sent-card .big { font-size: 3.2rem; color: #2f7d3a; }
.auth-box .form-control, .auth-box .btn-outline-secondary { border-color: #cfc8b4; background-color: #fff; }
.auth-box .btn-outline-secondary { color: #66756d; }