animations {
    .mat-mdc-form-field {
        width: 100%;
        margin-top: 32px;
    }

    .mat-mdc-tab-group {
        .mat-mdc-tab-header {
            padding: 24px 0;
            border-top-width: 1px;
        }

        .mat-mdc-tab-body-wrapper {
            .mat-mdc-tab-body {
                &:first-child {
                    .mat-mdc-tab-body-content {
                        display: flex;
                        justify-content: center;
                        min-height: 200px;
                    }
                }

                .animated-box {
                    width: 120px;
                    height: 120px;
                    overflow: hidden;
                    border-radius: 4px;
                    cursor: pointer;
                    user-select: none;

                    .animated-box-content {
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        flex: 1 0 auto;
                        height: 100%;
                        text-align: center;
                        font-size: 12px;
                        font-weight: 500;
                    }
                }
            }
        }
    }

    .info {
        @apply text-secondary bg-gray-400;
    }

    .animated-box {
        @apply bg-primary shadow-md;

        .animated-box-content {
            @apply text-on-primary;
        }
    }
}
