/* Login page styles for MPMS - PPNJ theme */
:root{
    --ppnj-green: #0B5D32;
    --ppnj-light: #196f3f;
    --ppnj-gold: #C9A227;
}

html,body{height:100%;}
body.login-bg{
    font-family: 'Segoe UI', Tahoma, sans-serif;
    background-color: #f8fbf9;
    background-image: 
        linear-gradient(180deg, rgba(248, 251, 248, 0.82) 0%, rgba(247, 248, 248, 0.78) 50%, rgba(7, 156, 67, 0.82) 100%),
        url('/images/KBB.JPG');
    background-attachment: fixed;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 140%;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:2rem;
}

.login-wrapper{width:100%;max-width:980px;display:grid;grid-template-columns:1fr 420px;gap:2rem;align-items:center}

.brand-panel{padding:2.5rem 2rem;color:var(--ppnj-green)}
.brand-panel .logo{width:120px;height:auto;margin-bottom:1rem}
.brand-panel h1{font-size:2.5rem;margin:0;font-weight:800;color:#0B5D32;letter-spacing:0.05em;text-shadow:0 2px 10px rgba(11,93,50,0.12)}
.brand-panel h2{margin-top:0.4rem;font-size:1.05rem;color:rgba(6,33,18,0.9);font-weight:700;line-height:1.3;text-shadow:0 1px 6px rgba(11,93,50,0.08)}
.brand-panel p.org{margin-top:0.7rem;color:rgba(0,0,0,0.65);font-size:0.95rem;letter-spacing:0.01em}

.login-card{background:#ffffff;border-radius:14px;box-shadow:0 12px 30px rgba(6,40,18,0.12);overflow:hidden;border:1px solid rgba(11,93,50,0.06)}
.login-card .card-inner{padding:2rem}

.form-title{display:flex;flex-direction:column;gap:0.125rem;margin-bottom:1rem}
.form-title .title-main{font-size:1.25rem;font-weight:700;color:var(--ppnj-green)}
.form-title .title-sub{font-size:0.875rem;color:rgba(0,0,0,0.6)}

.input-icon{position:relative}
.input-icon input{padding-left:3rem}
.input-icon svg{position:absolute;left:0.75rem;top:50%;transform:translateY(-50%);width:1.25rem;height:1.25rem;color:var(--ppnj-green);opacity:0.9}

.ppnj-btn{background:var(--ppnj-green);color:#fff;border-radius:10px;padding:0.75rem 1rem;border:none;width:100%;font-weight:600}

.footer-note{text-align:center;color:rgba(0,0,0,0.55);font-size:0.85rem;margin-top:1rem}
.footer-note .branch{display:block;color:rgba(0,0,0,0.55);font-size:0.85rem}

@media (max-width:900px){
    .login-wrapper{grid-template-columns:1fr;max-width:420px}
    .brand-panel{text-align:center}
}

/* small tweaks for error box to match theme */
.error-box{background:#fff5f5;border:1px solid #fde2e2;color:#7b1e1e;padding:0.65rem;border-radius:8px}