@import url(root.css);
@import url(form.css);

/* Tu znajdziesz wszystko związane z formularzem logowania */


input[type="password"]::-ms-reveal {
    display: none !important;
}

input[type="password"]::-ms-clear {
    display: none !important;
}

.login-banner {
    height: 0;
    width: 45vw;
    border-top: 100vh solid var(--main-color);
    border-left: 0px solid transparent;
    border-right: 200px solid transparent;
}

.login-form-container {
    position: absolute;
    top: 0;
    right: 0;
    height: 100vh;
    width: 55vw;
    min-width: 400px;
    display: flex;
    align-items: center;
    justify-content:center;
}

.login-header {
    width: 350px;
    margin-bottom: 8vh;
}

.login-header__logo {
    height: 48px;
}

.login-header__title {
    margin-top: 24px;
    font-size: 48px;
    font-weight: 700;
    color: var(--text-main-color);
    line-height: 50%;
    letter-spacing: 2.5px;
}

    .login-header__title span {
        font-weight: 400;
        font-size: 24px;
        line-height: 50%;
        letter-spacing: normal;
    }

.login-form {
    border-radius: 8px;
    width: 350px;
    padding: 16px;
    background: #fff;
}

.login-form__title {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 16px;
}

.login-form__pass {
    position: relative;
}

.login-form__pass-button {
    background: none;
    color: var(--text-black);
    border: none;
    padding-top: 8px;
    padding-bottom: 6px;
}

    .login-form__pass-button:hover,
    .login-form__pass-button:active,
    .login-form__pass-button:focus {
        background: rgba(0,0,0,0.025);
        color: #000;
    }

.login-form__see-pass {
    position: absolute;
    top: 0px;
    right: 0px;
}

.login-form__label {
    font-weight: 500;
    font-size: 16px;
    padding: 0;
}

.login-form__button {
    width: 96%;
    background: var(--secondary-color);
}

    .login-form__button:hover,
    .login-form__button:focus,
    .login-form__button:active {
        background: var(--main-color);
    } 

.login-form__helptext {
   margin-top: 24px;
   color: var(--text-main-color);
   line-height: 100%;
   font-size: 12px;
   font-weight: 500;
}

@media screen and (max-width: 600px) {
    .login-form {
        border:rgba(0,0,0,0.12) 1px solid;
    }
}