.signIn {
    max-width: 1440px;
    min-height: calc(100vh - 80px);
    min-height: calc(100svh - 80px);
    margin: 16px auto 0;

    display: grid;
    gap: 16px;
    grid-template-columns: repeat(auto-fit, minmax(calc(50% - 8px), 1fr));
    /*grid-template-rows: auto 64px;*/
}

.signIn aside {
    justify-self: end;
    align-self: center;
}

.signIn main {
    justify-self: start;
    align-self: center;
    margin-bottom: 2rem;
}

.signIn main.no-aside {
    place-self: center;
    grid-column: 1 / -1;
}

.signInFormsContainer {
    box-shadow: var(--box-shadow-card);
    border-radius: 15px;
    width: 438px;
    max-width: 100%;
    padding-block-start: 32px;
}

.signInFormsContainer__logoLink {
    display: block;
    margin-bottom: 36px;
}

.signInFormsContainer__logoLink img {
    display: block;
    width: 163px;
    height: 48px;
    object-fit: contain;
    object-position: center;
    margin: 0 auto;
}

.signInFormsContainer__formDescription {
    text-align: center;
    padding: 0 8px;
}

.signInFormsContainer__formDescription--withIcon {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    text-align: center;
    font-weight: 700;
    padding: 0 8px;
}

.signInForm {
    font: var(--font-small);
}

.signInForm__bottomWrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.5rem;
}

.signInForm__bottomWrapper--offert {
    gap: 1rem;
    flex-wrap: wrap;
}

.signInForm__bottomWrapper--offert button {
    min-width: max-content;
}

.signInForm__inputWrapper {
    min-height: 90px;
    margin-block-end: 8px;
}

.signInForm__inputWrapper--low {
    min-height: 4rem;
}

.signInForm__input {
    width: 250px;
}

.signInForm__resend {
    cursor: pointer;
    margin: 20px auto;
    background: transparent;
    border: none;
    color: var(--color-neutral-2, #545454);
    font: var(--font-default);
    display: flex;
    gap: 5px;
}

.signInForm__resend span {
    text-decoration: underline;
}

.signInForm__resend img {
    filter: brightness(0.3);
}

.signInForm__resend[disabled] {
    cursor: default;
    color: var(--color-neutral-3, #8E8F90);
}

.signInForm__resend[disabled] img {
    filter: brightness(1);
}

.signInForm__resend[disabled] span {
    text-decoration: none;
}

.signInForm__anotherNumber {
    text-align: center;
    display: block;
    margin-bottom: 36px;
}

.signInForm__emailInput {
    display: block !important;
    width: 275px;
    margin: 0 auto;
}

.signInForm__descriptionTitle {
    text-align: center;
    display: block;
    margin: 0 auto 20px;
}

.copyrightLink, .copyrightLink:hover, .copyrightLink:active,
.copyrightLink:visited, .copyrightLink:focus, .copyrightLink:focus-within {
    font: var(--font-small);
    color: inherit;
    text-decoration: underline;
    display: block;
    margin-block: 26px;
}

.signInForm__emailCodePrompt {
    font: var(--font-small);
    margin-top: 32px;
    margin-bottom: 0;
}

.signInForm__emailFormContainer {
    padding-inline: 42px;
    padding-block-end: 32px;
}

.passwordForm {
    padding-inline: 42px;
    padding-block-end: 32px;
    font: var(--font-small);
}

.passwordForm__description {
    margin-bottom: 1rem;
}

.passwordForm__buttonWrapper {
    display: flex;
    align-items: center;
    justify-content: end;
}

.passwordForm__inputWrapper {
    min-height: 90px;
    margin-block-end: 8px;
}

.passwordForm__input {
    width: 250px;
}

body:has(#offertWellcomeFormContainer) {
    background: url("/cockpit/images/bg_login_large-988d510433f98d1e8e6d1234231e1d03.jpg") top center / cover repeat-y;
    min-width: 360px;
}

.customBlock {
    margin: 0 10% 1rem;
    background: var(--color-neutral-8);
    padding: 2rem 3rem;
    border-radius: 15px;
    box-shadow: var(--box-shadow-card);
    border-top: 24px solid var(--color-additional-3);
}

.customBlock--scrolled {
    max-height: calc(90vh - 16px - 64px);
    overflow-y: auto;
}

/* SIGNIN MEDIA */

@media screen and (max-width: 1080px) {
    .signIn aside {
        display: none;
    }

    .signIn main {
        place-self: center;
    }

}

@media screen and (max-width: 700px) {
    body:has(#offertWellcomeFormContainer) {
        background: none;
        min-width: auto;
    }

    .signIn {
        min-height: calc(100vh - 220px);
        min-height: calc(100svh - 220px);
    }


    .customBlock {
        margin: 1rem 0.5rem;
    }

    .customBlock .flex-right {
        justify-content: center;
    }

    .signInForm__bottomWrapper--offert {
        margin-top: 0.5rem;
        justify-content: center;
    }

    .signInForm__bottomWrapper--offert button {
        min-width: auto;
    }
}

@media screen and (max-width: 438px) {
    .signIn {
        margin: 0 auto;
    }

    .signIn main {
        width: 100%;
    }

    .signInFormsContainer {
        box-shadow: none;
        place-self: start;
        width: 100%;
    }
}

@media screen and (max-width: 320px) {

    .formTabContainer, .passwordForm, .signInForm__emailFormContainer {
        padding-inline: 8px;
    }

    .formTabContainer--noPadding {
        padding: 0;
    }
}