.LoginContainer
{
    height: 100vh;
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 50% 40%;
    overflow: hidden;
    align-items: center ;
        background-color: var(--background-tier-2);
}

.LoginContainerElement
{

}

.FormTitle
{
    padding: 2vh 2vw;
    text-align: center;
    font-size: 3vh;
      font-weight: bold;
}

.Left
{
    display: flex;
    flex-direction: column;
    align-items: center;
}

.Right
{

}


label{
    /* background-color: red; */
    padding: 0.5vh 0.5vw;
}

.ImageContainer {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    border: 3px solid #12A155;
    border-radius: 3vw;
    width: 40vw;
    height: 40vw;
    background-color: #FAFAFA;
    text-align: center;

    gap: 5vh;
    
}

.TitleToast{


    font-weight: bold;
    font-size: 4.5vh;
    padding: 1vh 1vw;

}

/* Avatar image */
img.avatar {
    width: 100%;
}

.FormContainer
{
    /* margin: 1vh 2vw; */

    display:grid;
    /* visibility: hidden; */

  
    border: 3px solid #12A155;
    background-color: #FAFAFA;
    
    border-radius: 2vw;


}

.cancel-btn
{
    visibility: hidden;

}


.form-inputs
{
    width: 100%;
    /* 
    max-height: 75vh; */
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    /* height: min-content; */
}

.input-container{
    display: flex;
    flex-direction: column;
    width: 100%;

    padding: 0.521vw;
}

#form-file-input,
#form-text,
#form-select,
#form-list,
input[type="date" i],
input[type="file" i],
input[type=password] {
    display: inline-block;
    border: 1px solid #12A155;
    box-sizing: border-box;
    border-radius: 0.521vw;
    width: 100%;
    padding: 0.625vw;
    
}

.form-container{
    
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    /* height: 70vh; */

}

.submit-button {
    background-color: #12A155;
    color: white;
    border: none;
    cursor: pointer;
    width: 100%;
}

/* Add a hover effect for buttons */
.submit-button:hover {
    opacity: 0.8;
}

.submit-container
{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.521vw;
}

/* Set a style for all buttons */
.form-submit-button,
.submit-button {
    background-color: #12A155;
    color: white;
    padding: 0.625vw;
    border-radius: 0.521vw;
    border: none;
    cursor: pointer;
    width: 50%;
}

/* Add a hover effect for buttons */
.form-submit-button:hover {
    opacity: 0.8;
}