@mixin eco-fab-speed-dial-actions($flex-direction, $order, $action-item-margin-direction) {
    flex-direction: $flex-direction;
    order: $order;

    & .eco-fab-action-item {
        margin-#{$action-item-margin-direction}: 10px;
    }
}

eco-fab-speed-dial {
    display: inline-block;
    z-index: 500;

    &.eco-opened {
        .eco-fab-speed-dial-container {
            eco-fab-speed-dial-trigger.eco-spin {
                .spin180 {
                    transform: rotate(180deg);
                }

                .spin360 {
                    transform: rotate(360deg);
                }
            }
        }
    }

    .eco-fab-speed-dial-container {
        position: relative;
        display: flex;
        align-items: center;
        z-index: 20;

        eco-fab-speed-dial-trigger {
            pointer-events: auto;
            z-index: 24;

            &.eco-spin {
                .spin180,
                .spin360 {
                    transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
                }
            }
        }

        eco-fab-speed-dial-actions {
            display: flex;
            position: absolute;
            height: 0;
            width: 0;

            & .eco-fab-action-item {
                transform: scale(0);
                transition: all 0.3s cubic-bezier(0.55, 0, 0.55, 0.2);
                transition-duration: 0.14286s;
            }
        }
    }

    &.eco-down {
        eco-fab-speed-dial-actions {
            bottom: 2px;
            left: 7px;
        }

        .eco-fab-speed-dial-container {
            flex-direction: column;

            & eco-fab-speed-dial-trigger {
                order: 1;
            }

            & eco-fab-speed-dial-actions {
                @include eco-fab-speed-dial-actions(column, 2, top);
            }
        }
    }

    &.eco-up {
        eco-fab-speed-dial-actions {
            top: 2px;
            left: 7px;
        }

        .eco-fab-speed-dial-container {
            flex-direction: column;

            & eco-fab-speed-dial-trigger {
                order: 2;
            }

            & eco-fab-speed-dial-actions {
                @include eco-fab-speed-dial-actions(column-reverse, 1, bottom);
            }
        }
    }

    &.eco-left {
        eco-fab-speed-dial-actions {
            top: 7px;
            left: 2px;
        }

        .eco-fab-speed-dial-container {
            flex-direction: row;

            & eco-fab-speed-dial-trigger {
                order: 2;
            }

            & eco-fab-speed-dial-actions {
                @include eco-fab-speed-dial-actions(row-reverse, 1, right);
            }
        }
    }

    &.eco-right {
        eco-fab-speed-dial-actions {
            top: 7px;
            right: 2px;
        }

        .eco-fab-speed-dial-container {
            flex-direction: row;

            & eco-fab-speed-dial-trigger {
                order: 1;
            }

            & eco-fab-speed-dial-actions {
                @include eco-fab-speed-dial-actions(row, 2, left);
            }
        }
    }
}
