.authentication-wrapper {
    --bs-auth-basic-inner-max-width: 460px;
    display: flex;
    flex-basis: 100%;
    inline-size: 100%;
    min-block-size: 85vh
}

.authentication-wrapper .authentication-bg {
    background-color: var(--bs-paper-bg)
}

.authentication-wrapper .authentication-inner {
    inline-size: 100%
}

.authentication-wrapper .app-brand-logo.demo svg {
    block-size: 38px;
    inline-size: 22px
}

.authentication-wrapper.authentication-basic {
    overflow: hidden;
    align-items: center;
    justify-content: center
}

.authentication-wrapper.authentication-basic .authentication-inner {
    position: relative;
    max-inline-size: var(--bs-auth-basic-inner-max-width)
}

.authentication-wrapper.authentication-basic .authentication-inner::before {
    position: absolute;
    background: color-mix(in sRGB, var(--bs-primary) 100%, var(--bs-paper-bg));
    block-size: 312px;
    content: " ";
    inline-size: 317px;
    inset-block-start: -136px;
    inset-inline-end: -138px;
    mask-image: url("../../../img/bg_vector.svg");
    mask-repeat: no-repeat;
    mask-size: 100% 100%
}

@media(max-width: 575.98px) {
    .authentication-wrapper.authentication-basic .authentication-inner::before {
        display: none
    }
}

.authentication-wrapper.authentication-basic .authentication-inner::after {
    position: absolute;
    z-index: -1;
    background: color-mix(in sRGB, var(--bs-primary) 100%, var(--bs-paper-bg));
    block-size: 240px;
    content: " ";
    inline-size: 243px;
    inset-block-end: -88px;
    inset-inline-start: -50px;
    mask-image: url("../../../img/bg_vector.svg");
    mask-size: 100% 100%
}

@media(max-width: 575.98px) {
    .authentication-wrapper.authentication-basic .authentication-inner::after {
        display: none
    }
}

.authentication-wrapper.authentication-basic .authentication-inner .card {
    z-index: 1
}

@media(min-width: 576px) {
    .authentication-wrapper.authentication-basic .authentication-inner .card {
        padding: 1.5rem
    }
}

.authentication-wrapper.authentication-basic .authentication-inner .card .app-brand {
    margin-block-end: 0.5rem
}

.authentication-wrapper .auth-input-wrapper .auth-input {
    font-size: 150%;
    max-inline-size: 50px;
    padding-inline: .4rem
}

@media(max-width: 575.98px) {
    .authentication-wrapper .auth-input-wrapper .auth-input {
        font-size: 1.125rem
    }
}

.auth-cover-brand {
    position: absolute;
    z-index: 1;
    inset-block-start: 2.1rem;
    inset-inline-start: 2.5rem
}

@media(max-width: 575.98px) {
    .auth-cover-brand {
        inset-inline-start: 1.5rem
    }
}

#twoStepsForm .fv-plugins-bootstrap5-row-invalid .form-control {
    border-width: 2px;
    border-color: #ff3e1d;
    box-shadow: none
}

@media(max-width: 575.98px) {
    .numeral-mask-wrapper .numeral-mask {
        padding: 0
    }

    .numeral-mask {
        margin-inline: 1px
    }
}