box.audio-popup {
    background: rgba($background, .7);
    padding: 8px;
    margin-right: 6px;
    border-radius: 16px;
    border: .5px solid rgba($foreground, .3);
}

.audio-popup .separator {
    border-top: .5px solid rgba(darken($color: $foreground, $amount: 25), .7);
    margin-bottom: 8px;
    margin-left: 6px;
    margin-right: 6px;
    border-radius: 1px;
}

.audio-popup .output-slider {
    label {
        margin-left: 18px;
        color: $background;
    }
}

.audio-popup .source-slider {
    label {
        margin-left: 18px;
        color: $background;
    }
}


.audio-popup {

    trough {
        background: darken($color: $foreground, $amount: 25);
        border-radius: 6px;
    }

    trough highlight {
        background: $foreground;
        padding: 10px;
        border-radius: inherit;
    }

    slider:active highlight {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
    }

    scale {
        padding: 10px;
    }
}