/*
 *  Copyright (c) 2018-present, Evgeny Nadymov
 *
 * This source code is licensed under the GPL v.3.0 license found in the
 * LICENSE file in the root directory of this source tree.
 */

.top-bar {
    height: 63px;
    transform: scaleY(-1) translateY(-9px) translateX(-1px);
}

.group-call-top-panel-wrapper {
    display: flex;
    align-items: center;
    color: white;
    height: 43px;
    z-index: 3;
    position: relative;
}

.group-call-top-panel {
    --key_voipgroup_overlayBlue1: #2BCEFF;
    --key_voipgroup_overlayBlue2: #0976E3;
    --key_voipgroup_overlayGreen1: #12B522;
    --key_voipgroup_overlayGreen2: #00D6C1;
    --key_voipgroup_topPanelBlue1: #60C7FB;
    --key_voipgroup_topPanelBlue2: #519FF9;
    --key_voipgroup_topPanelGreen1: #52CE5D;
    --key_voipgroup_topPanelGreen2: #00B1C0;
    --key_voipgroup_topPanelGray: #8599aa;
    --key_voipgroup_mutedByAdminGradient: #57A4FE;
    --key_voipgroup_mutedByAdminGradient2: #F05459;
    --key_voipgroup_mutedByAdminGradient3: #766EE9;

    width: 100%;
    height: 100%;
    background: linear-gradient(to left, var(--key_voipgroup_topPanelBlue1) 0%, var(--key_voipgroup_topPanelBlue2) 100%);
}

.group-call-top-panel-muted {
    background: linear-gradient(to left, var(--key_voipgroup_topPanelBlue1) 0%, var(--key_voipgroup_topPanelBlue2) 100%);
}

.group-call-top-panel-muted-by-admin {
    background: linear-gradient(to left, var(--key_voipgroup_mutedByAdminGradient) 0%, var(--key_voipgroup_mutedByAdminGradient3) 60%, var(--key_voipgroup_mutedByAdminGradient2) 100%);
}

.group-call-top-panel-unmuted {
    background: linear-gradient(to left, var(--key_voipgroup_topPanelGreen2) 0%, var(--key_voipgroup_topPanelGreen1) 100%);
}

.group-call-top-panel-connecting {
    background: var(--key_voipgroup_topPanelGray);
}

.group-call-top-panel-title {
    flex: 1 1 auto;
    text-align: center;
    user-select: none;
}

.group-call-top-panel-buttons {
    cursor: pointer;
    background: transparent;
    width: 100%;
    height: 100%;
    padding: 0 12px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    position: absolute;
    left: 0;
    top: 0;
}