.btn {
    transition: color var(--transition-delay) ease-in-out,background-color var(--transition-delay) ease-in-out,border-color var(--transition-delay) ease-in-out,box-shadow var(--transition-delay) ease-in-out;
    transition-property: color, background-color, border-color, box-shadow;
    transition-duration: var(--transition-delay), var(--transition-delay), var(--transition-delay), var(--transition-delay);
    transition-timing-function: ease-in-out, ease-in-out, ease-in-out, ease-in-out;
    transition-delay: 0s, 0s, 0s, 0s;
}
.btn-primary {
    background-color: transparent;
    border-color: var(--color-orange);
    color: black;
    border-width: 1px;
    border-radius: 2px;
    box-shadow: 1px 1px 2px 0px var(--color-orange-a50);
}

.btn-white {
    background-color: white;
}

.btn-primary:hover, .btn-primary:focus, .btn-primary:active,
.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active {
    color: black;
    border-width: 1px;
    box-shadow: 1px 1px 2px 0px var(--color-orange-a50);
    background-color: var(--color-orange-a10);
    animation-name: schaBg;
    animation-duration: 1s;
    border-color: var(--color-orange);
    border-radius: 2px;
}

.btn-danger {
    background-color: transparent;
    border-color: var(--color-red);
    color: var(--color-red);
    border-width: 1px;
    border-radius: 2px;
    box-shadow: 1px 1px 2px 0px var(--color-red-a50);
}
.btn-danger:hover, .btn-danger:focus, .btn-danger:active,
.btn-danger:not(:disabled):not(.disabled).active, .btn-danger:not(:disabled):not(.disabled):active {
    border-color: var(--color-red);
    color: var(--color-red);
    border-width: 1px;
    box-shadow: 1px 1px 2px 0px var(--color-red-a50);
    background-color: var(--color-red-a10);
    border-radius: 2px;
}

.btn-success {
    background-color: transparent;
    border-color: var(--color-green);
    color: var(--color-green);
    border-width: 1px;
    box-shadow: 1px 1px 2px 0px var(--color-green-a50);
    border-radius: 2px;
}
.btn-success:hover, .btn-success:focus, .btn-success:active,
.btn-success:not(:disabled):not(.disabled).active, .btn-success:not(:disabled):not(.disabled):active {
    background-color: transparent;
    border-color: var(--color-green);
    color: var(--color-green);
    border-width: 1px;
    box-shadow: 1px 1px 2px 0px var(--color-green-a50);
    background-color: var(--color-green-a10);
    border-radius: 2px;
}
.input-group-append>.btn,.input-group-append>.input-group-text {
    box-shadow: none;
    border-width: 1px;
    border-color: var(--color-orange);
    padding-top: 1rem;
    padding-bottom: 1rem;
}
.input-group-append>.input-group-text {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.input-group-append>.btn-primary:hover, .input-group-append>.btn-primary:focus, .input-group-append>.btn-primary:active,
.input-group-append>.btn-primary:not(:disabled):not(.disabled).active, .input-group-append>.btn-primary:not(:disabled):not(.disabled):active {
    box-shadow: 1px 1px 2px 0px var(--color-orange);
}