.login-wrapper{
    min-height: 100vh;
    background: linear-gradient(135deg, var(--secondary) 0%, #062F60 100%);
    padding: 2rem;
}

.login-card {
    backdrop-filter: blur(10px);
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    max-width: 28rem;
    box-shadow: var(--bs-box-shadow-lg);
}

.login-app-logo{
    max-width: 121px;
    min-width: 81px;
    height: auto;
}

.login-app-logo > .login-app-logo-img{
    height: 100%;
    width: 100%;
    border-radius: 4px;
    object-fit: cover;
}

.login-title-lead{
    color: var(--primary);
    font-size: var(--fs-lg);
}

.form-control {
    font-size: var(--fs-base);
}

.form-control::placeholder {
    color: rgba(255, 255, 255, 0.6);
}

.form-control,
.form-control:focus {
    background-color: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    color: white;
}

.form-control:focus {
    box-shadow: 0 0 0 2px rgba(255,255,255,.5);
}

#togglePassword:hover{
   cursor: pointer; 
}

.input-icon {
    position: absolute;
    top: 50%;
    right: 1rem;
    transform: translateY(-50%);
    color: var(--primary);
}

.recaptcha-container {
    background-color: rgba(255, 255, 255, 0.08);
    border-radius: 8px;
    transition: transform 0.3s ease-in-out;
}

.btn-login {
    background-color: var(--primary);
    font-family: var(--font-plus-jakarta-semibold);
    font-size: var(--fs-base);
    color: var(--white);
}

.btn-login:hover {
    background-color: #CC5200;
}

.is-invalid ~ .input-icon{
    display: none !important;
}