:host {
    z-index: 10000;
    position: absolute;

    width: 100%;
    height: 100%;

    display: flex;
    justify-content: center;
    align-items: center;

    .c-spinner {
        &__container {
            width: 100%;
            height: 100%;

            display: flex;
            align-items: center;
            justify-content: center;

            &--bgr-color {
                background-color: rgba(#f5f6f8, 0.85);
            }
        }

        &__wrapper {
            display: flex;
            align-items: center;
            justify-content: center;

            mat-spinner {
                ::ng-deep circle {
                    stroke: var(--clr-base-accent);
                }
            }

            &--bgr-color {
                width: 3rem;
                height: 3rem;

                background: var(--clr-white-100);
                border-radius: 50%;
                box-shadow:
                    0 1px 3px rgba(0, 0, 0, 0.12),
                    0 1px 2px rgba(0, 0, 0, 0.24);
            }
        }
    }
}