﻿html, body, form,
.Page, .login {
    height: 100vh;
}

.Page {
    background: #F6F6F6
}

.login {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    position: relative;
}

.login-form {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
        flex-direction: column;
    -webkit-flex-direction: column;
        align-items: center;
    -webkit-align-items: center;
    width: 50%;
    height: 100vh;
}

.login-info {

    color: var(--stays-light);
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
    -webkit-align-items: center;
    justify-content: center;
    -webkit-justify-content: center;
    width: 50%;
    height: 100vh;
}

.login-footer {
    position: absolute;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    align-items: flex-end;
    -webkit-align-items: flex-end;
    justify-content: center;
    -webkit-justify-content: center;
    bottom: 0;
    left: 0;
    width: 50%;
    z-index: 2;
    text-align: center;
    min-height: 64px;
    padding: 32px 0 8px;
}

.login-background {
        display: flex;
    justify-content: center;
    position: absolute;
    top: 0;
    right: 0;
    width: 50%;
    height: 100%;
    background: #dfe2e5 url('/Cofi_Theme/img/Loginimagem.png?22668') center bottom / cover no-repeat;

}



.login-box {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
        flex-direction: column;
    -webkit-flex-direction: column;
    justify-content: center;
    -webkit-justify-content: center;
    height: 100%;
    max-width: 384px;
    padding: 32px 0;
}



.login-content-wrapper {
    display: flex;
    padding: 24px 0;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--gap-l);
}

.login-content {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: var(--gap-l);
    
}


.login-actions {
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
gap: var(--padding-2xl);
align-self: stretch;
}


.login-logo {
    text-align: center;
    color: #fff;
}

.login-form .Button {
    margin: 0;
}

.login-form .Columns {
    margin-bottom: 0;
}



.tablet .login-background, .phone .login-background {
    flex: 1;
    position: relative;
}

.tablet .login, .phone .login {
    display: flex;
    flex-direction: column;
} 


.tablet .login-background,
.phone .login-background{
    width: 100%;
    height: auto;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

.tablet .login .login-form,
.phone .login .login-form {
    width: 100%;
    height: auto;
}


.tablet .login .login-box {
    padding: 160px 0 80px;
}
.phone .login .login-box {
    padding: 80px 0 40px;
}


.tablet .login-info,
.phone .login-info {
    width: 100%;
    height: auto;
}

.tablet .login-footer,
.phone .login-footer {
    position:static;
    width: 100%;
    
}


.login-box .Buttons {
    padding: 0;
    margin: 0;
}

.desktop.big .Feedback_Message_Info, .desktop.big .Feedback_Message_Success, .desktop.big .Feedback_Message_Error, .desktop.big .Feedback_Message_Warning {
    width: 100%;
    left: 0;
}

/* ExcludeAllFromPickersOutsideBlock */