#kc-header-wrapper {
    display: none;
}

#kc-header .logo-wrapper {
    margin-bottom: 1.5rem;
}

.parsley-errors-list.filled {
    display: block;
}

.card-header {
    margin-left: 0;
    margin-right: 0;
    padding-top: 1.5rem !important;
}

.banner {
    background-color: #F9FAFB;
    border: 1px solid #E5E7EB;
    padding-bottom: 1.5rem !important;
}

.logo-wrapper {
    margin-top: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 3rem;
    height: 3rem;
    width: 100%;
}

#vshn-logo {
    background-image: url(../img/vshn.svg);
    background-repeat: no-repeat;
    background-size: contain;
    height: 2.6rem;
    width: 11rem;
    margin-bottom: 0.4rem;
}

#servala-logo {
    background-image: url(../img/servala.png);
    background-repeat: no-repeat;
    background-size: contain;
    height: 2.8rem;
    width: 12.432rem;
}

#appuio-logo {
    background-image: url(../img/appuio.png);
    background-repeat: no-repeat;
    background-size: contain;
    height: 3rem;
    width: 6.735rem;
}


.display-flex {
    display: flex;
}


.pf-m-control {
    width: 5rem;
    border: #bdc0c7 1px solid;
    border-left: none;
    background-color: white;
}

#password {
    border-radius: 3px 0 0 3px;
}

.vshn-logo {
    position: relative;
    width: 200px;
    margin: 1em auto;
    pointer-events: none;
}

.alert-error {
    background-color: #ea3f30;
}

#kc-content {
    padding: 20px 30px 15px;
    border-radius: 0 0 3px 3px;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
}

.pf-c-alert__icon {
    width: 55px;
    font-size: 1.846rem;
    vertical-align: middle;
    text-align: center;
    line-height: 22px;
    display: table-cell;
    cursor: default;
    padding-top: 1px;
}

.social-providers h4 {
    text-align: center;
}

.social-providers ul {
    padding: 0;
}

.splash-container {
    max-width: 950px;
}

#kc-totp-settings {
    padding-left: 20px;
}

.form-horizontal .form-group {
    margin-left: -15px;
    margin-right: -15px;
}

.form-horizontal {
    padding-bottom: 15px;
}

.list-group-item-action {
    cursor: pointer;
}

.list-group-item .icon {
    font-size: 1.5rem;
}

.bold-text {
    font-weight: bold;
}

.kcLoginOTPListInputClass {
    visibility: hidden;
    width: 0;
    height: 0;
    overflow: hidden;
}

.kcLoginOTPListClass {
    border: 1px solid #d5d8de;
    padding: 0.75rem 1rem;
    cursor: pointer;
    border-radius: 3px;
}

.kcLoginOTPListInputClass:checked + .kcLoginOTPListClass {
    border: 1px solid #4081CB;
}

.kcLoginOTPListItemIconBodyClass {
    font-size: 1.3rem;
    padding-right: 0.25rem;
}

body[data-page-id="login-login"] .form-settings {
    display: flex;
    flex-direction: row;
    gap: 1rem;
    justify-content: space-between;
}

#kc-page-title {
    padding: 0 1rem;
    font-size: 2rem;
}

body[data-page-id="login-login"] #kc-content-wrapper {
    display: grid;
    grid-auto-columns: 1fr 1fr;
}

body[data-page-id="login-register"] #kc-content-wrapper,
body[data-page-id="login-login-reset-password"] #kc-content-wrapper,
body[data-page-id="login-login-config-totp"] #kc-content-wrapper,
body[data-page-id="login-login-otp"] #kc-content-wrapper,
body[data-page-id="login-login-update-password"] #kc-content-wrapper {
    max-width: 40rem;
    margin: auto;
}

body[data-page-id="login-login"] #kc-form {
    grid-row:  2 / span 1;
    grid-column: 1 / span 1;
    padding: 3.75rem 3.75rem 0 3.75rem;
}

body[data-page-id="login-login"] #kc-info {
    grid-row:  3 / span 1;
    grid-column: 1 / span 1;
    padding: 0 3.75rem 3.75rem 3.75rem;
}

#kc-registration a {
    text-decoration: underline;
}

body[data-page-id="login-login"] #kc-social-providers {
    grid-row:  2 / span 2;
    grid-column: 2 / span 1;
    margin-top: 2rem;
    margin-bottom: 2rem;
    padding-left: 3.75rem;
    padding-right: 3.75rem;
    border-left: 1px solid rgba(0, 0, 0, 0.1);;
}

body[data-page-id="login-login"] #kc-content-wrapper .alert {
    grid-column: 1 / span 2;
}

#kc-social-providers hr {
    display: none;
}

#kc-social-providers h2 {
    text-align: center;
    font-size: 1rem;
    color: #666666;
    font-weight: 400;
}

.social-account-list {
    margin-top: 1rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    width: 100%;
    list-style-type: none;
}

.social-account-list a{
    width: 100%;
}

#footer {
    padding-bottom: 2rem;
    padding-left: 3.75rem;
    padding-right: 3.75rem;
    text-align: center;
    color: #9CA3AF;
}

#footer a {
    color: #9CA3AF;
    text-decoration: underline;
}

#footer .tos-login,
#footer .tos-register {
    display: none;
}

body[data-page-id="login-login"] #footer .tos-login,
body[data-page-id="login-register"] #footer .tos-register {
    display: block;
}

header.banner .subtitle {
    display: none;
}
header.banner .col-md-10 {
    max-width: 100%;
}

#kc-register-form .form-group:last-of-type,
#kc-reset-password-form .form-group:last-of-type {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

#kc-register-form .form-group:last-of-type #kc-form-buttons,
#kc-reset-password-form .form-group:last-of-type #kc-form-buttons {
    order: 1;
}

#kc-register-form .form-group:last-of-type #kc-form-options,
#kc-reset-password-form .form-group:last-of-type #kc-form-options  {
    order: 2;
    max-width: fit-content;
    align-self: center;
}

ol#kc-totp-settings {
    counter-reset: otp-steps-counter;
    list-style: none;
    padding-left: 3.5rem;
    margin-bottom: 0;
}

ol#kc-totp-settings>li {
    counter-increment: otp-steps-counter;
    margin-bottom: 2.5rem;
    padding-left: 2.5rem;
    position: relative;
    border-left: 1px solid #d5d8de;
}

ol#kc-totp-settings>li:last-child {
    margin-bottom: 0;
    padding-bottom: 1rem;
}

ol#kc-totp-settings>li:before {
    content: counter(otp-steps-counter);
    background-color: #4081CB;
    color: white;
    font-size: 1.2rem;
    position: absolute;
    --size: 2rem;
    left: calc(-1 * var(--size) /2 );
    line-height: var(--size);
    width: var(--size);
    height: var(--size);
    top: -2px;
    border-radius: 50%;
    text-align: center;
}

ul#kc-totp-supported-apps li {
    padding-left: 0.75rem;
    padding-bottom: 0.5rem;
}

#kc-totp-settings-form {
    margin-left: 3.5rem;
    padding-left: 2.5rem;
    max-width: 40rem;
    border-left: 1px solid #d5d8de;
}

body[data-page-id="login-login-verify-email"] #kc-content-wrapper .alert {
    background-color: transparent;
    color: #666666;
    display: flex;
    flex-direction: column;
}

body[data-page-id="login-login-verify-email"] #kc-content-wrapper .alert .message {
    color: #8A2D0C;
    font-weight: bold;
    font-size: 1.2rem;
}

body[data-page-id="login-login-verify-email"] #kc-content-wrapper .alert .mdi-alert-circle-o:before {
    content: url(../img/email-icon.svg);
}