.kzvn-btn {
    border-radius: var(--border-radius);
    padding: .5rem 1.5rem;
    font-size: 1.1rem;
    text-transform: uppercase;
    border: none;
    cursor: pointer;
    background-color: var(--kzvn-green-color-shade-900);
    color: var(--white-color);
    transition: var(--animation-bkg);
}

.kzvn-btn:hover:not(:disabled) {
    background: var(--kzvn-green-color) radial-gradient(circle, transparent 1%, var(--kzvn-green-color) 1%) center/15000%;
}

.kzvn-btn:active:not(:disabled) {
    background: var(--kzvn-green-color);
    background-size: 100%;
    transition: background 0s;
}

a.kzvn-secondary-btn {
    color: black;
    text-align: center;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

a:visited:not(.kzvn-sprachen-auswahl-option).kzvn-secondary-btn {
    color: black;
}

a:hover:not(.kzvn-sprachen-auswahl-option).kzvn-secondary-btn {
    color: black;
}

.kzvn-secondary-btn {
    border-radius: var(--border-radius);
    padding: .5rem 1.5rem;
    font-size: 1.1rem;
    text-transform: uppercase;
    border: none;
    cursor: pointer;
    background-color: var(--contrast-color);
    color: black;
    transition: var(--animation-bkg);
}

.kzvn-secondary-btn:hover:not(:disabled) {
    background: var(--contrast-color-hover) radial-gradient(circle, transparent 1%, var(--contrast-color-hover) 1%) center/15000%;
    color: black;
}

.kzvn-secondary-btn:active:not(:disabled) {
    background: var(--contrast-color-hover) radial-gradient(circle, transparent 1%, var(--contrast-color-hover) 1%) center/15000%;
    background-size: 100%;
    transition: background 0s;
}

.kzvn-btn:disabled, .kzvn-secondary-btn:disabled {
    background-color: var(--contrast-color);
    color: var(--white-color);
    cursor: not-allowed;
}

.show-password {
    aspect-ratio: 1/1;
    min-width: 2.5rem;
    border-radius: var(--border-radius);
    background-color: var(--contrast-color);
    transition: var(--animation-ease-3ms);
    font-size: .9rem;
    border: none;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
}

.show-password i {
    font-size: 1.3rem;
}

.show-password:hover {
    background-color: var(--contrast-color-hover);
    transition: var(--animation-ease-3ms);
}

.kzvn-alert-close-msg-dialog-btn {
    padding: .1rem;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: transparent;
    border: none;
}

.kzvn-alert-close-msg-dialog-btn svg path {
    transition: var(--animation-ease-3ms);
    stroke-width: .4;
}

.kzvn-alert-close-msg-dialog-btn:hover svg path {
    transition: var(--animation-ease-3ms);
    stroke-width: .8;
}

.auth-btns {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
}

@supports not (gap: 0.7rem) {
    .auth-btns > * {
        margin-right: 0.7rem;
    }

    .auth-btns > *:last-child {
        margin-right: 0;
    }
}

@supports (gap: 0.7rem) {
    .auth-btns {
        gap: 0.7rem;
    }
}

.auth.tablet .auth-btns a {
    width: 9rem;
}


.outline-btn {
    border-radius: var(--border-radius);
    padding: .5rem 1.5rem;
    font-size: 1rem;
    text-transform: uppercase;
    border: var(--border-2px);
    cursor: pointer;
    display: inline-flex;
    color: black;
    background-color: var(--white-color);
    transition: var(--animation-bkg);
}

.outline-login-btn {
    display: inline;
    text-align: center;
    border-color: var(--kzvn-grey-color-700);
    color: var(--kzvn-grey-color-700);
    text-transform: none;
}

@supports not (gap: 0.4rem) {
    .outline-btn > * {
        margin-right: 0.4rem;
    }

    .outline-btn > *:last-child {
        margin-right: 0;
    }
}

@supports (gap: 0.4rem) {
    .outline-btn {
        gap: 0.4rem;
    }
}

.outline-btn:hover:not(:disabled) {
    border: var(--border-2px-hover);
    background: var(--contrast-color-hover) radial-gradient(circle, transparent 1%, var(--contrast-color-hover) 1%) center/15000%;
}

.outline-btn:active:not(:disabled) {
    border: var(--border-2px-hover);
    background: var(--contrast-color-hover) radial-gradient(circle, transparent 1%, var(--contrast-color-hover) 1%) center/15000%;
    background-size: 100%;
    transition: background 0s;
}

.outline-btn:disabled {
    background-color: var(--contrast-color);
    color: var(--white-color);
    cursor: not-allowed;
}
