#login_card{
    width: 500px;
}

.eye-icon{
    right: 30px;
    top: 25%; 
    user-select: none;
}

.text-logo{
    font-family: 'EB Garamond','sans-serif' !important;
    font-feature-settings: 'clig' off, 'liga' off;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px; /* 120% */
    letter-spacing: 0.15px;
    color: var(--grey-1) !important;
}

small{
    font-size: 16px;
    
    font-family: 'Lato', sans-serif;
    font-style: normal;
    font-weight: 400;
    line-height: 24px; /* 150% */
    letter-spacing: 0.5px;
    color: var(--grey-1) !important;
}


.subheader{
    font-family: 'Cabin', sans-serif;
    font-size: 34px;
    font-style: normal;
    font-weight: 400;
    line-height: 36px;
    color: var(--grey-1) !important;
}


.image-footer{
    position: absolute;
    bottom: 23px;
    right: 30px;
}

.form-label {
    position: absolute;
    top: 15px;
    left: 25px;
    pointer-events: none;
    transition: 0.2s ease;
    color: #888;
    z-index: 10;
    font-size: 15px;
    font-family: 'Lato', sans-serif;
}

  
.form-input:focus + .form-label,
.form-input:not(:placeholder-shown) + .form-label {
    top: 2px;
    font-size: 12px;
    color:#d0a858;
    z-index: 10;
}

.form-input:not(:focus) + .form-label {
    color: #888;
}

.form-input::placeholder {
    color: transparent; /* Hide the placeholder text */
}

.form-input:focus::placeholder {
    color: transparent; /* Restore the placeholder text color on focus */
}

.active-input {
    box-shadow: 0 2px var(--grey);
    padding-top: 10px;
}


.email-container .form-label,
.password-container .form-label{ 
    position: absolute;
    
    top: -2px;
    left: 25px;
    font-size: 12px;
    color:#d0a858;
    pointer-events: none;
    transition: 0.2s ease;
    z-index: 10;
}