wpsstm-track-link{
    display:flex;
    label{
        @extend .wpsstm-can-click;
    }
    .wpsstm-track-link-actions{
        margin:0;
        padding:0;
        > *{
            display:inline-block;
        }
    }
}

.wpsstm-track-links-list{
    font-size:.8em;
    position:relative;
    padding-left:1em;
    line-height:2em;
    flex-grow:0;
    transition-property: margin-bottom;
    transition-duration: .2s;


    &.active{
        wpsstm-track-link{
            .wpsstm-track-link-actions{
                .wpsstm-action{
                    display:inline-block;
                }
            }
        }
    }

    a{
        @extend .wpsstm-no-underline;
    }

    wpsstm-track-link{ //single link

        position:relative;
        padding: 0 .75em;
        box-sizing: border-box;

        .wpsstm-link-title{ //link text
            @extend .wpsstm-ellipsis;
            &:before{
                @extend .wpsstm-icon;
            }
        }

        .wpsstm-track-link-action-play{
            @extend .wpsstm-can-click;
        }

        .wpsstm-track-link-action-play{
            @extend .wpsstm-icon;
        }

        &.link-loading .wpsstm-track-link-action-play{
            @extend .wpsstm-loading-icon;
        }

        &:not(.link-playing) .wpsstm-track-link-action-play:before{
            content:"\f04b"; //.fa-play
        }

        &.link-playing .wpsstm-track-link-action-play:before{
            content:"\f04c"; //.fa-pause;
        }
        &:not([wpsstm-playable]) .wpsstm-track-link-action-play{
            &:before{
                content:"\f071"; //.fa-exclamation-triangle
            }
        }

        .wpsstm-track-link-actions{
            margin:0;
            padding-right: .5em;
            display:flex;
            flex-shrink:0;

            .wpsstm-track-link-action{
                margin:auto!important;

                &:before{
                    margin-right:0;
                }
                > span{
                    display:none;
                }

                &.wpsstm-track-link-action-trash:before{
                    content: "\f1f8";//.fa-trash;
                }
                &.wpsstm-track-link-action-move:before{
                    content: "\f07d";//.fa-arrows-v;
                }
                &.wpsstm-track-link-action-edit-backend:before{
                    content:"\f084";//.fa-key;
                }
            }
        }

        &.link-active{
            display:flex;
        }

        .wpsstm-track-link-action-provider:before{
            content:"\f0c1";//fa-link
        }

        &[data-wpsstm-stream-type="video/soundcloud"] .wpsstm-track-link-action-provider:before{
            content:"\f1be";//fa-soundcloud
        }
        &[data-wpsstm-stream-type="video/youtube"] .wpsstm-track-link-action-provider:before{
            content:"\f167";//fa-youtube
        }
    }
}

wpsstm-track{
    .wpsstm-track-links-list:not(.active){
        display:none;
        .wpsstm-track-link-actions{
            > *{
                &:not(.wpsstm-track-link-action-provider){
                    display:none;
                }
            }
        }
    }
}
