.carousel-inner,
.item {
	position: relative;
	transition: opacity .4s $default-easing;
}

.body {
    &--submitting {
        transition: opacity .4s 1.5s $default-easing;
    }

    &--submitted {
        opacity: 0;
    } 
}

.form {
    position: relative;

    &--loading {
        .btn {
            cursor: wait;

            &__text {
                visibility: hidden;
            }

            &__spinner {
                display: block;
                opacity: 1;
                visibility: visible;
            }

            // Hide arrow for 'next' buttons
            &.btn-next {
                &::after {
                    display: none;
                }
            }
        }
    }

    &--submit {
        cursor: wait;
        user-select: none;

        & * {
            pointer-events: none;
        }

        .step {
            > *:not(.form-btns) {
                opacity: .4;
            }
        }

        .btn-back {
            opacity: 0;
        }

        .btn__spinner {
            opacity: 1;
            visibility: visible;
        }

        .btn__text {
            display: none;
        }

        &-done {
            cursor: default;

            .btn-primary {
                background-color: $color-green5;

                &:active,
                &:hover,
                &:focus {
                    background-color: $color-green5;
                }

                // Hide arrow for 'next' buttons
                &.btn-next {
                    &::after {
                        display: none;
                    }
                }
            }

            .btn__spinner {
                opacity: 0;
                visibility: hidden;
            }
        
            .btn__check {
                opacity: 1;
                visibility: visible;
            }
        }

        &-error {
            cursor: default;

            .btn-primary {
                background-color: $color-red5;

                &:active,
                &:hover,
                &:focus {
                    background-color: $color-red5;
                }

                // Hide arrow for 'next' buttons
                &.btn-next {
                    &::after {
                        display: none;
                    }
                }
            }

            .btn__spinner,
            .btn__text {
                opacity: 0;
                transition-delay: .1s;
                visibility: hidden;
            }

            .btn__error {
                opacity: 1;
                transition-delay: .1s;
                visibility: visible;
            }
        }
    }
}