/* v18.35 AUTH COMPACT CLEAN REDESIGN - ringkas, profesional, online-safe */
.login-page-shell{
    min-height:calc(100vh - 136px) !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    padding:34px 18px 44px !important;
    background:
        radial-gradient(circle at top left, rgba(149,180,0,.08), transparent 30%),
        linear-gradient(180deg, #eef2f7 0%, #f8fafc 100%) !important;
}
.login-split-card{
    width:min(1120px, 100%) !important;
    min-height:560px !important;
    display:grid !important;
    grid-template-columns:0.86fr 1.14fr !important;
    background:#fff !important;
    border:1px solid rgba(212,170,42,.26) !important;
    border-radius:30px !important;
    overflow:hidden !important;
    box-shadow:0 26px 64px rgba(8,26,69,.10) !important;
}
.register-split-card{
    min-height:650px !important;
}
.login-left-pane{
    position:relative !important;
    background:
        radial-gradient(circle at 22% 18%, rgba(212,170,42,.22), transparent 28%),
        radial-gradient(circle at 86% 86%, rgba(149,180,0,.10), transparent 22%),
        linear-gradient(180deg, #071740 0%, #071a4d 52%, #041334 100%) !important;
    color:#fff !important;
}
.login-left-pane::before{
    content:"" !important;
    position:absolute !important;
    inset:0 !important;
    background-image:radial-gradient(rgba(255,255,255,.12) 1px, transparent 1px) !important;
    background-size:34px 34px !important;
    opacity:.16 !important;
    pointer-events:none !important;
}
.login-left-inner{
    position:relative !important;
    z-index:1 !important;
    height:100% !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    padding:46px 36px !important;
}
.auth-compact-brand{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:18px !important;
    text-align:center !important;
    color:#fff !important;
    text-decoration:none !important;
}
.login-brand-icon{
    min-width:92px !important;
    width:92px !important;
    height:92px !important;
    border-radius:28px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    background:linear-gradient(135deg,#a4c500 0%, #d4aa2a 100%) !important;
    color:#081a45 !important;
    font-size:32px !important;
    font-weight:950 !important;
    letter-spacing:-.04em !important;
    box-shadow:0 20px 42px rgba(149,180,0,.28) !important;
    line-height:1 !important;
    margin:0 !important;
}
.auth-compact-brand__text{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    gap:8px !important;
}
.auth-compact-brand__text strong{
    color:#fff !important;
    font-size:42px !important;
    line-height:1.02 !important;
    font-weight:950 !important;
    letter-spacing:-.05em !important;
}
.auth-compact-brand__text small{
    color:rgba(255,255,255,.74) !important;
    font-size:15px !important;
    font-weight:800 !important;
    letter-spacing:.02em !important;
}
.login-right-pane{
    background:linear-gradient(180deg,#ffffff 0%, #fbfcfe 100%) !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    padding:42px !important;
}
.login-form-wrap{
    width:min(520px, 100%) !important;
    padding:0 !important;
}
.login-form-wrap h1{
    margin:0 0 8px !important;
    font-size:38px !important;
    line-height:1.1 !important;
    color:#081a45 !important;
    font-weight:950 !important;
    letter-spacing:-.04em !important;
}
.login-subtext{
    margin:0 0 26px !important;
    color:#64748b !important;
    font-size:16px !important;
    line-height:1.6 !important;
}
.redesigned-login-grid{gap:16px !important}
.form-grid label.login-field-label,
.login-field-label{
    position:relative !important;
    display:flex !important;
    align-items:center !important;
    gap:0 !important;
    font-weight:400 !important;
    color:inherit !important;
}
.login-field-label .input-icon{
    position:absolute !important;
    left:18px !important;
    z-index:2 !important;
    font-size:19px !important;
    opacity:.68 !important;
}
.form-grid .login-field-label input,
.login-field-label input{
    width:100% !important;
    min-height:62px !important;
    border-radius:17px !important;
    border:1px solid #d7deea !important;
    background:#f8fafc !important;
    padding:0 18px 0 54px !important;
    font-size:16px !important;
    color:#0f172a !important;
    outline:none !important;
    box-shadow:none !important;
    transition:border-color .2s ease, box-shadow .2s ease, background .2s ease !important;
}
.form-grid .login-field-label input::placeholder,
.login-field-label input::placeholder{color:#94a3b8 !important}
.form-grid .login-field-label input:focus,
.login-field-label input:focus{
    border-color:#d4aa2a !important;
    box-shadow:0 0 0 4px rgba(212,170,42,.12) !important;
    background:#fffdf6 !important;
}
.gold-login-btn{
    width:100% !important;
    min-height:62px !important;
    border:none !important;
    border-radius:17px !important;
    background:linear-gradient(135deg, #d4aa2a 0%, #c79812 100%) !important;
    color:#fff !important;
    font-size:16px !important;
    font-weight:950 !important;
    letter-spacing:.04em !important;
    cursor:pointer !important;
    box-shadow:0 15px 30px rgba(212,170,42,.22) !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:8px !important;
}
.gold-login-btn:hover{background:linear-gradient(135deg, #c79812 0%, #b98f13 100%) !important}
.login-divider{
    display:flex !important;
    align-items:center !important;
    gap:16px !important;
    margin:26px 0 20px !important;
    color:#94a3b8 !important;
    font-weight:850 !important;
    font-size:12px !important;
    letter-spacing:.05em !important;
}
.login-divider::before,.login-divider::after{content:"" !important;flex:1 !important;height:1px !important;background:#d8dee8 !important}
.google-account-btn{
    width:100% !important;
    min-height:60px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:14px !important;
    border:1px solid #d8dee8 !important;
    border-radius:17px !important;
    background:#fff !important;
    color:#0f172a !important;
    font-weight:850 !important;
    font-size:15px !important;
    box-shadow:0 8px 22px rgba(15,23,42,.04) !important;
}
.google-account-btn:hover{background:#f8fafc !important}
.google-mark{
    width:30px !important;
    height:30px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    border-radius:50% !important;
    font-size:22px !important;
    font-weight:900 !important;
    color:#ea4335 !important;
    background:#fff !important;
}
.login-bottom-links{margin-top:26px !important;text-align:center !important}
.login-bottom-links p{margin:0 0 14px !important;color:#64748b !important;font-size:15px !important}
.login-bottom-links p a{color:#d4aa2a !important;font-weight:850 !important}
.back-home-link{display:inline-flex !important;align-items:center !important;justify-content:center !important;gap:8px !important;color:#081a45 !important;font-weight:850 !important;font-size:15px !important}
.admin-login-hint,
.auth-security-note,
.auth-panel-tag,
.auth-eyebrow-badge,
.auth-feature-list,
.auth-panel-heading,
.login-brand-desc,
.auth-inline-help-row{display:none !important}

@media (max-width:1100px){
    .login-split-card{grid-template-columns:1fr !important;width:min(720px,100%) !important;min-height:auto !important}
    .login-left-pane{min-height:220px !important}
    .login-left-inner{padding:36px 24px !important}
    .auth-compact-brand{flex-direction:row !important;text-align:left !important;gap:16px !important}
    .auth-compact-brand__text{align-items:flex-start !important}
    .auth-compact-brand__text strong{font-size:34px !important}
    .login-brand-icon{min-width:70px !important;width:70px !important;height:70px !important;border-radius:22px !important;font-size:26px !important}
}
@media (max-width:720px){
    .login-page-shell{padding:20px 12px 32px !important;align-items:flex-start !important}
    .login-split-card{border-radius:22px !important;width:100% !important}
    .login-left-pane{min-height:150px !important}
    .login-left-inner,.login-right-pane{padding:22px 18px !important}
    .auth-compact-brand{width:100% !important;justify-content:flex-start !important}
    .auth-compact-brand__text strong{font-size:28px !important}
    .auth-compact-brand__text small{font-size:13px !important}
    .login-brand-icon{min-width:58px !important;width:58px !important;height:58px !important;border-radius:18px !important;font-size:22px !important}
    .login-form-wrap h1{font-size:30px !important}
    .login-subtext{font-size:14px !important;margin-bottom:20px !important}
    .form-grid .login-field-label input,.login-field-label input,.gold-login-btn,.google-account-btn{min-height:56px !important}
    .login-bottom-links p,.back-home-link{font-size:14px !important}
}
@media (max-width:420px){
    .auth-compact-brand__text strong{font-size:24px !important}
    .auth-compact-brand__text small{font-size:12px !important}
    .login-right-pane{padding:20px 14px !important}
}


/* v19.08 - tampilkan Lupa Password di halaman login */
.login-page-shell .forgot-password-row{
    display:flex !important;
    justify-content:flex-end !important;
    align-items:center !important;
    margin:-2px 0 8px !important;
}
.login-page-shell .forgot-password-row a{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:6px !important;
    color:#d4aa2a !important;
    font-weight:850 !important;
    font-size:14px !important;
    text-decoration:none !important;
}
.login-page-shell .forgot-password-row a:hover{
    color:#081a45 !important;
    text-decoration:underline !important;
}
