.component_audio{
    position: absolute;
    left: 0;
    right: 0;
    background: var(--super-light);
    height: 40px;
    bottom: 0;
    border-top: 1px solid #e2e2e2;
}


.component_progress{
    width: 300px;
    margin-top: 9px;
    margin-left: 10px;

    .placeholder{
        width: 100%;
        height: 2px;
        background: #dadada;
    }
    .progress-bar{
        height: 2px;
        background: var(--primary);
        position: relative;
        top: -2px;
    }
}

.component_control{
    .component_icon {
        height: 18px;
    }
}

.component_trackinfo{
    width: 300px;
    overflow: hidden;
    white-space: nowrap;
    margin-left: 10px;
    color: var(--light);
}

.component_volume{
    position: relative;
    .volume-controller-wrapper{
        display: block;
        position: absolute;
        top: -150px;
    }
    .volume-controller{
        height: 150px;
        width: 20px;
        background: var(--super-light);
        border: 1px solid #e2e2e2;
    }
    &:hover{
        .volume-controller-wrapper{display: block;}
    }
}
