/*
 * VOXLY THEME SYNC
 * Web 0.18.18.20
 *
 * Player + voice controls inherit the active
 * server appearance variables.
 */


/* ------------------------------------------------------------
   VOICE SIDEBAR / CONTROLS
   ------------------------------------------------------------ */

.voice-sidebar-panel {
    background:
        var(--sidebar) !important;

    border-color:
        var(--border) !important;

    color:
        var(--text) !important;
}


.voice-sidebar-panel .voice-card {
    background:
        var(--panel) !important;

    border-color:
        var(--border) !important;

    color:
        var(--text) !important;
}


.voice-sidebar-panel .voice-panel-label,
.voice-sidebar-panel #voiceRoomTitle,
.voice-sidebar-panel .voice-status {
    color:
        var(--muted) !important;
}


/*
 * Keep the primary voice controls tied to
 * the server accent color.
 */

#voxlyCompactVoiceControls .voice-button {
    background:
        var(--accent) !important;

    border-color:
        var(--accent) !important;

    color:
        var(--text) !important;
}


#voxlyCompactVoiceControls .voice-button:hover:not(:disabled) {
    background:
        var(--accent-hover) !important;

    border-color:
        var(--accent-hover) !important;
}


/*
 * Some voice buttons are direct children of
 * the voice card, so cover those as well.
 */

.voice-sidebar-panel > .voice-card > .voice-button,
.voice-sidebar-panel .voice-card > .voice-button {
    background:
        var(--accent) !important;

    border-color:
        var(--accent) !important;

    color:
        var(--text) !important;
}


.voice-sidebar-panel > .voice-card > .voice-button:hover:not(:disabled),
.voice-sidebar-panel .voice-card > .voice-button:hover:not(:disabled) {
    background:
        var(--accent-hover) !important;

    border-color:
        var(--accent-hover) !important;
}


/* ------------------------------------------------------------
   LIVE MUSIC PLAYER
   ------------------------------------------------------------ */

.voxly-live-music-player {
    background:
        var(--panel) !important;

    border-color:
        var(--border) !important;

    color:
        var(--text) !important;

    box-shadow:
        none !important;
}


.voxly-live-music-label {
    color:
        var(--muted) !important;
}


.voxly-live-music-title {
    color:
        var(--text) !important;
}


.voxly-live-music-track {
    background:
        var(--panel-3) !important;
}


.voxly-live-music-progress {
    background:
        var(--accent) !important;
}


.voxly-live-music-times {
    color:
        var(--muted) !important;
}


.voxly-live-music-status {
    color:
        var(--text) !important;
}


.voxly-live-music-next {
    color:
        var(--muted) !important;
}


/* ------------------------------------------------------------
   PLAYER TRANSPORT BUTTONS
   ------------------------------------------------------------ */

.voxly-live-music-control {
    background:
        var(--panel-2) !important;

    border-color:
        var(--border) !important;

    color:
        var(--text) !important;
}


.voxly-live-music-control:hover:not(:disabled) {
    background:
        var(--panel-3) !important;

    border-color:
        var(--accent) !important;
}


.voxly-live-music-control-label {
    color:
        var(--muted) !important;
}


.voxly-live-music-clear {
    background:
        var(--panel-2) !important;

    border-color:
        var(--border) !important;

    color:
        var(--text) !important;
}


.voxly-live-music-clear:hover:not(:disabled) {
    background:
        var(--panel-3) !important;

    border-color:
        var(--accent) !important;
}


.voxly-live-music-control:disabled,
.voxly-live-music-clear:disabled {
    opacity: .38;
}


/* ------------------------------------------------------------
   CONTROL STATUS
   ------------------------------------------------------------ */

.voxly-live-music-control-status {
    color:
        var(--muted) !important;
}


.voxly-live-music-control-status.error {
    color:
        var(--danger) !important;
}
