body {
    background:
        radial-gradient(circle at 12% 18%, rgba(252, 209, 22, .24), transparent 25rem),
        radial-gradient(circle at 88% 78%, rgba(206, 17, 38, .16), transparent 28rem),
        linear-gradient(135deg, #002b82 0%, #0757c9 52%, #eaf3ff 52%, #f8fbff 100%);
    background-position: center;
    font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 16px;
    min-height: 100vh;
}

#auth-logo {
    padding: 10% 11%;
    background: #FF4A4A;
}

.btn-info,  
.btn-info.disabled {
    background: #FF4A4A;
    border: 2px solid #b2c59d;
}


#form-section {
    background: #ffffff;
    height: 100vh;
    padding-left: 0;
    padding-right: 0;
}

#auth-form {
    width: min(100%, 440px);
    max-width: 100%;
    margin: 0;
}

.imgCustom200pxCircle {
    border: 1px solid #ddd;
    padding: 5px;
    width: 200px;
}

body > .container > .row {
    border: 1px solid rgba(255, 255, 255, .64);
    background: rgba(255, 255, 255, .76) !important;
    box-shadow: 0 32px 90px rgba(0, 25, 80, .28) !important;
    backdrop-filter: blur(24px) saturate(145%);
    -webkit-backdrop-filter: blur(24px) saturate(145%);
}

#auth-form .brand-image {
    max-height: 86px;
    max-width: 100%;
    object-fit: contain;
}

#auth-form .form-control {
    height: 56px !important;
    border: 1px solid rgba(0, 56, 168, .18) !important;
    background: rgba(245, 249, 255, .78) !important;
    color: #0b1739;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.8) !important;
    transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}

#auth-form .form-control:focus {
    border-color: #1769e0 !important;
    background: rgba(255,255,255,.96) !important;
    box-shadow: 0 0 0 4px rgba(23,105,224,.13) !important;
}

#btnUserLogin {
    background: linear-gradient(135deg, #0038A8, #1769e0) !important;
    box-shadow: 0 14px 28px rgba(0,56,168,.24) !important;
    transition: transform .2s ease, box-shadow .2s ease;
}

#btnUserLogin:hover { transform: translateY(-2px); box-shadow: 0 18px 34px rgba(0,56,168,.3) !important; }
#checkbox-signup { accent-color: #0038A8; }

@media (max-width: 991.98px) {
    body { background: linear-gradient(145deg, #edf4ff, #fff9f3); }
    body > .container > .row { max-width: 560px !important; border-radius: 24px !important; }
}
