html, body { 
    margin: 0 !important; 
    padding: 0 !important; 
    background-color: #DFE4E9 !important; 
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    min-height: 100vh !important;
}
header, footer, .site-footer, .footer-global { display: none !important; }
main.auth-layout { background: transparent !important; }

.auth-centered-wrapper {
    width: 100% !important;
    max-width: 440px !important;
    padding: 20px !important;
    box-sizing: border-box !important;
}

.auth-card-clean { 
    background: #F2F4F4 !important;
    border: 1px solid #E2E8F0 !important;
    border-radius: 16px !important;
    padding: 40px 30px !important;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.02) !important;
    box-sizing: border-box !important;
    width: 100% !important;
}

.center-logo {
    text-align: center !important;
    margin-bottom: 24px !important;
}

.auth-title { text-align: center !important; font-size: 24px !important; font-weight: 700 !important; color: var(--primary) !important; margin-bottom: 8px !important; margin-top: 0 !important; }
.auth-title strong { font-weight: 800 !important; color: var(--accent) !important; }
.auth-sub { text-align: center !important; font-size: 13.5px !important; color: var(--text-muted) !important; margin-bottom: 24px !important; font-weight: 500 !important; line-height: 1.4 !important; }

.form-group { text-align: left !important; margin-bottom: 18px !important; } 
.form-label { display: block !important; font-size: 12px !important; font-weight: 700 !important; color: var(--primary) !important; margin-bottom: 6px !important; }
.input-wrapper { position: relative !important; display: flex !important; align-items: center !important; }
.input-icon { position: absolute !important; left: 14px !important; color: #54657E !important; width: 18px !important; height: 18px !important; pointer-events: none !important; }

.form-input { width: 100% !important; height: 46px !important; padding: 0 14px 0 42px !important; border-radius: 10px !important; border: 1px solid var(--border) !important; background: #F2F4F4 !important; font-size: 14px !important; color: var(--primary) !important; font-weight: 500 !important; outline: none !important; box-sizing: border-box !important; transition: border-color 0.2s ease !important; }
.form-input:focus { border-color: var(--accent) !important; }
.captcha-container { display: flex !important; justify-content: center !important; margin: 16px 0 !important; height: 65px !important; overflow: hidden !important; }

.btn-submit { width: 100% !important; background: var(--accent) !important; color: #fff !important; border: none !important; height: 46px !important; border-radius: 100px !important; font-weight: 700 !important; font-size: 14px !important; cursor: pointer !important; display: flex !important; align-items: center !important; justify-content: center !important; box-sizing: border-box !important; transition: transform 0.2s ease, box-shadow 0.2s ease !important; }
.btn-submit:hover { transform: translateY(-2px) !important; box-shadow: 0 4px 12px rgba(79, 70, 229, 0.2) !important; }

.divider { display: flex !important; align-items: center !important; text-align: center !important; margin: 24px 0 !important; color: var(--text-muted) !important; font-size: 11px !important; font-weight: 500 !important; }
.divider::before, .divider::after { content: '' !important; flex: 1 !important; border-bottom: 1px solid var(--border) !important; }
.divider::before { margin-right: .5em !important; } .divider::after { margin-left: .5em !important; }

.menu-btn-capsule { 
    display: inline-flex !important; 
    align-items: center !important; 
    justify-content: center !important; 
    height: 44px !important; 
    border-radius: 100px !important; 
    font-weight: 700 !important; 
    font-size: 14px !important; 
    text-decoration: none !important; 
    position: relative !important;
    z-index: 1 !important;
    overflow: hidden !important;
    transition: transform 0.2s ease, color 0.2s ease, box-shadow 0.2s ease !important; 
    padding: 0 24px !important; 
    box-sizing: border-box !important; 
}

.menu-btn-capsule::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important; left: 0; right: 0; bottom: 0 !important;
    background: linear-gradient(90deg, #4F46E5 0%, #3B82F6 100%) !important;
    z-index: -1 !important;
    opacity: 0 !important;
    transition: opacity 0.25s ease !important;
}

.menu-btn-capsule:hover::before {
    opacity: 1 !important;
}

.menu-btn-capsule:hover { 
    transform: translateY(-2px) !important; 
    color: #ffffff !important;
    box-shadow: 0 6px 20px rgba(79, 70, 229, 0.3) !important;
}

.btn-capsule-light { background: #E4EAED !important; color: #1E2A52 !important; }

.btn-capsule-dark { background: #1E2A52 !important; color: #ffffff !important; }
