/** ACSComponent */

.ui-provider {
    display: none !important;
}

/** ACSChatListComponent */

.back-button .icon {
    left: 0.5px;
    margin: 0;
}

.add-chat-button {
    border: solid !important;
    border-width: 0.1px !important;
    border-color: #aaaaaa !important;
    color: #aaaaaa !important;
    background-color: white !important;
}

    .add-chat-button .icon {
        left: 0.5px;
        margin: 0;
    }

.add-participant-button .icon {
    width: 20px !important;
    height: 20px !important;
    fill: #aaaaaa !important;
    margin: 0;
    left: 0.5px;
}

.group-name-button .icon {
    width: 20px !important;
    height: 20px !important;
    fill: #aaaaaa !important;
    margin: 0;
    left: 0.5px;
}

.chat-thread .avatar,
.chat-user .avatar,
.chat-properties .avatar,
.initials {
    border: solid !important;
    border-width: 1.5px !important;
    border-color: var(--green) !important;
    color: var(--green) !important;
    background-color: #27BF8122 !important;
    font-weight: bolder !important;
}

.chats::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.chats::-webkit-scrollbar-track {
    background: transparent;
}

.chats::-webkit-scrollbar-thumb {
    background: var(--alpha-dark-2);
}

    .chats::-webkit-scrollbar-thumb:hover {
        background: var(--green);
    }

.chats::-webkit-scrollbar-corner {
    background: transparent;
}

/** ACSChatUsersComponent */

.back-button:hover {
    color: var(--grey-3);
}

.users::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.users::-webkit-scrollbar-track {
    background: transparent;
}

.users::-webkit-scrollbar-thumb {
    background: var(--alpha-dark-2);
}

    .users::-webkit-scrollbar-thumb:hover {
        background: var(--green);
    }

.users::-webkit-scrollbar-corner {
    background: transparent;
}

.footer .footer-button {
    background-color: var(--green);
    color: white;
}

.chat-user input[type="checkbox"] {
    background-color: white;
    color: white;
}

    .chat-user input[type="checkbox"]:checked {
        color: white;
        background-color: var(--green);
    }

    .chat-user input[type="checkbox"]:disabled {
        opacity: 0.5;
    }

/** ACSChatView */

.video-call-button {
    background-color: var(--green) !important;
}

    .video-call-button .icon {
        left: 1px;
        margin: 0;
        fill: white !important;
        width: 20px !important;
        height: 20px !important;
    }

.unread-message-indicator {
    background-color: red !important;
}

/* Chat thread window */

.ms-Stack.css-185,
.ui-chat,
.chat .chat-thread {
    background: url('../icons/chat-window-background.svg') !important;
}

/* Message input field */

.ms-TextField-fieldGroup-container {
    border-radius: 24px !important;
    border-color: lightgray !important;
}

.ms-TextField-fieldGroup {
    border-radius: 24px !important;
    border-color: lightgray !important;
    padding-left: 10px !important;
}

/* Edit message input field */

.ui-chat__message__content .ms-TextField-wrapper {
    background-color: white;
    margin: -2px;
}

    .ui-chat__message__content .ms-TextField-wrapper .ms-TextField-fieldGroup {
        border: solid;
        padding-left: 0 !important;
    }

/* Send message button */

i[data-icon-name="SendBoxSend"],
i[data-icon-name="SendBoxSendHovered"] {
    color: gray;
}

/* Received chat thread message */

.received-chat-thread-message-box {
    background-color: white !important;
    color: black !important;
    box-shadow: 0 0 8px lightgray !important;
    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px;
    border-top-right-radius: 16px;
    display: flex;
    flex-direction: column-reverse;
    align-items: end;
    margin-top: 4px;
}

/* Received chat thread message - First in a sequence */

.received-chat-thread-message-box-first {
    margin-left: 8px;
}

/* Received chat thread messsage - Message author */

.ui-chat__message__author {
    margin: 0;
    position: absolute;
    top: -22px;
    left: 0;
    width: 200px;
    max-height: 20px;
    overflow: hidden;
}

.ui-text.css-132 {
    color: #aaaaaa;
    font-weight: 200 !important;
    font-size: 14px;
}

/* Received chat thread message - Message content */

.ui-chat__message__content > div > div[aria-label*="said"] {
    font-weight: 600;
}

/* Received chat thread message - Sender avatar */

.ms-Persona {
    margin-top: -27px;
}

.ms-Persona-initials {
    border: solid !important;
    border-width: 1.5px !important;
    border-color: var(--green) !important;
    color: var(--green) !important;
    background-color: #27BF8122 !important;
    font-weight: bolder !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Sent chat thread message */

.sent-chat-thread-message-box {
    background-color: var(--green) !important;
    color: white !important;
    border-top-left-radius: 16px;
    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px;
    border-top-right-radius: 0;
    display: flex;
    flex-direction: column-reverse;
    align-items: end;
}

/* Sent chat thread message - Message content */

.ui-chat__message__content > div > div[aria-label^="You said"] {
    color: white !important;
    font-weight: initial;
}

    .ui-chat__message__content > div > div[aria-label^="You said"] a {
        color: #eeeeee;
    }

/* Sent chat thread message - Context menu */

.ms-ContextualMenu-icon,
.ms-ContextualMenu-link:hover .ms-ContextualMenu-icon {
    color: var(--green);
}

.ms-ContextualMenu-linkContent .ms-Persona {
    padding-top: 32px;
}

/* Sent chat thread message - Message metadata */

.meta-message-box {
    background-color: rgba(0, 0, 0, 0.8);
    padding: 16px;
    border-radius: 32px;
}

.meta-message-text {
    color: #dddddd;
}

i[data-icon-name="PeopleAdd"] {
    color: white;
}

/* Sent chat thread message - Seen indicator */

.ms-Stack .css-212 {
    color: white;
}

.css-285, .css-283 {
    color: white;
}

.ms-TooltipHost.root-91 i[aria-label="Message seen by others"] {
    margin-top: 2px;
    margin-bottom: -2px;
    color: white;
}

/* Sent chat thread message - Sent indicator */

.ms-TooltipHost.root-91 i[aria-label="Message sent"] {
    margin-bottom: 8px !important;
    color: white;
}

/* Timestamp label */

.ui-chat__message__timestamp > .ui-text {
    -webkit-text-fill-color: lightgray !important;
    text-transform: uppercase;
}

/* Edited label */

.ui-chat__messagedetails {
    -webkit-text-fill-color: lightgray !important;
}

/* Typing indicator */

[data-ui-id=typing-indicator] span {
    color: black;
}

/* New messages button. */

.ms-Button--primary,
.ms-Button--primary:hover {
    background-color: var(--green);
    border-color: var(--green);
    border-radius: 8px;
}

/** ACSIncomingCallView */
.acs-incoming-call {
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
}

.acs-incoming-call-container {
    flex-flow: column !important;
    align-items: center !important;
    padding: 14px !important;
    background: var(--grey-dark-3) !important;
    width: 400px;
    height: 450px;
}

#acsInitialsContainer {
    background-color: var(--grey-dark-4);
    width: 100%;
    height: 250px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.acs-incoming-call .initials {
    margin: 0;
    width: 96px !important;
    height: 96px !important;
    border-radius: 48px !important;
    font-size: 40px !important;
}

.acs-incoming-call .caller {
    align-items: center !important;
    margin-top: 20px;
}

    .acs-incoming-call .caller label {
        color: white;
        font-size: 15px;
    }

#acsCallerName {
    color: #cccccc;
    transform: translate(0, -90px);
    font-size: 15px;
}

.incoming-call-controls {
    margin-top: 32px !important;
    padding: 4px;
    border-radius: 100px;
    background-color: var(--grey-dark-4);
}

.accept-button,
.reject-button {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: none !important;
    font-size: 0;
    background-origin: content-box !important;
    padding: 13px !important;
}

    .accept-button,
    .accept-button:hover {
        background: url("../icons/icon-call-answer.svg") center no-repeat;
        color: var(--green);
        background-color: var(--green);
    }

    .reject-button,
    .reject-button:hover {
        background: url("../icons/icon-call-end.svg") center no-repeat;
        color: var(--red);
        background-color: var(--red);
    }

/** ACSCallWithChat */

.minimize-video {
    color: black !important;
}

    .minimize-video .icon {
        position: initial !important;
    }

.maximize-video {
    color: black !important;
}

    .maximize-video .icon {
        position: initial !important;
    }

.acs-video-gallery-container[call-with-chat-view] {
    padding-top: 67px;
    color: var(--grey-1);
    background: var(--grey-dark-4);
    border: 1px solid var(--grey-dark-2);
    border-radius: 0;
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.3);
}

    .acs-video-gallery-container[call-with-chat-view] * {
        box-sizing: border-box;
    }

.acs-video-gallery-container button {
    font-size: 16px;
}

    .acs-video-gallery-container button .icon {
        color: currentColor !important;
        position: initial;
        margin-right: 0;
    }

.acs-video-gallery-container.minimize[call-with-chat-view] {
    bottom: 10px;
    left: 10px;
    height: 67px;
}

.acs-video-gallery-container.maximize[call-with-chat-view] {
    border: none;
}

    .acs-video-gallery-container.maximize[call-with-chat-view] [data-ui-id=call-composite-local-preview] {
        margin-bottom: initial;
    }

.acs-video-gallery-container .ms-Stack {
    pointer-events: all;
}

.acs-video-gallery-container .ms-MessageBar {
    position: relative;
    padding: 0 4px;
    font-family: var(--font-family);
    font-size: 12px;
    font-weight: 400;
    text-align: left;
    background: transparent;
}

    .acs-video-gallery-container .ms-MessageBar::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: currentColor;
    }

    .acs-video-gallery-container .ms-MessageBar.ms-MessageBar--warning {
        color: var(--yellow);
    }

        .acs-video-gallery-container .ms-MessageBar.ms-MessageBar--warning::before {
            opacity: 0.2;
        }

.acs-video-gallery-container .ms-MessageBar-content {
    opacity: 0.75;
}

.acs-video-gallery-container .ms-Button,
.acs-video-gallery-container .ms-MessageBar-icon {
    color: currentColor;
}

    .acs-video-gallery-container .ms-Button i,
    .acs-video-gallery-container .ms-MessageBar-icon i {
        color: currentColor;
    }

.acs-video-gallery-container .ms-MessageBar-icon {
    margin: 0;
    align-items: center;
    justify-content: center;
    min-width: 30px;
    line-height: 1;
}

    .acs-video-gallery-container .ms-MessageBar-icon i {
        height: initial;
    }

.acs-video-gallery-container .ms-Button,
.acs-video-gallery-container .ms-Button-icon {
    height: initial;
}

.acs-video-gallery-container [class*=body],
.acs-video-gallery-container .ms-Stack {
    background: transparent;
}

.acs-video-gallery-container .video-gallery-controls[call-with-chat-view] {
    width: 100%;
    justify-content: flex-start;
    background: var(--alpha-light-1);
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.08);
}

.acs-video-gallery-container .video-gallery-controls button[call-with-chat-view] {
    position: initial;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 43px;
    height: 43px;
    color: var(--grey-3) !important;
    border-radius: 50%;
    margin-right: 0;
    transition: all var(--transition-duration) ease 0s;
}

    .acs-video-gallery-container .video-gallery-controls button[call-with-chat-view]:hover {
        color: var(--green) !important;
        background: rgba(255, 255, 255, 0.05);
    }

.acs-video-gallery-container .video-gallery-controls .minimize-video[call-with-chat-view] .icon {
    width: 1em;
    height: 1em;
}

.acs-video-gallery-container .video-gallery-controls .camera[call-with-chat-view] {
    display: none;
}

.acs-video-gallery-container #acsParticipantInitials[call-with-chat-view],
.acs-video-gallery-container #acsParticipantDisplayName[call-with-chat-view] {
    display: flex;
    color: inherit;
}

.acs-video-gallery-container #acsParticipantInitials[call-with-chat-view] {
    line-height: 0;
}

.acs-video-gallery-container #acsParticipantDisplayName[call-with-chat-view] {
    flex: 1 1 auto;
}

.acs-video-gallery-container [id*=callWithChatCompositeParentDiv] .ms-StackItem {
    margin-bottom: 0;
}

.acs-video-gallery-container [data-ui-id=call-composite-local-preview] {
    margin-top: 40px;
    margin-bottom: auto;
}

    .acs-video-gallery-container [data-ui-id=call-composite-local-preview] + .ms-Stack {
        margin-top: 20px;
    }

    .acs-video-gallery-container [data-ui-id=call-composite-local-preview] [data-ui-id=video-tile] span {
        font-size: 13px;
        font-family: var(--font-family);
        color: var(--grey-dark-1);
    }

    .acs-video-gallery-container [data-ui-id=call-composite-local-preview] [data-ui-id=video-tile] button {
        position: relative;
        color: var(--grey-3);
        width: 43px;
        height: 43px;
        display: block;
        background: var(--grey-dark-4);
    }

        .acs-video-gallery-container [data-ui-id=call-composite-local-preview] [data-ui-id=video-tile] button::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            border-radius: 50%;
            background: #ffffff;
            opacity: 0;
            transition: all var(--transition-duration) ease 0s;
        }

        .acs-video-gallery-container [data-ui-id=call-composite-local-preview] [data-ui-id=video-tile] button:hover {
            color: var(--green);
        }

            .acs-video-gallery-container [data-ui-id=call-composite-local-preview] [data-ui-id=video-tile] button:hover::before {
                opacity: 0.05;
            }

        .acs-video-gallery-container [data-ui-id=call-composite-local-preview] [data-ui-id=video-tile] button span {
            color: currentColor;
        }

        .acs-video-gallery-container [data-ui-id=call-composite-local-preview] [data-ui-id=video-tile] button[aria-disabled=true] {
            color: var(--grey-dark-2);
            pointer-events: none;
        }

    .acs-video-gallery-container [data-ui-id=call-composite-local-preview] [data-ui-id=video-tile] .ms-Stack {
        border-radius: 30px;
    }

.acs-video-gallery-container [data-ui-id=video-tile] {
    background: var(--grey-dark-6);
    border: 1px solid var(--grey-dark-3);
}

    .acs-video-gallery-container [data-ui-id=video-tile] .ms-Stack {
        background: transparent;
    }

    .acs-video-gallery-container [data-ui-id=video-tile] .ms-Button-textContainer {
        display: none;
    }

.acs-video-gallery-container [data-icon-name=LocalPreviewPlaceholder] {
    width: 30px;
    height: auto;
    min-width: initial;
    padding: 0;
    color: var(--grey-dark-1);
    margin-bottom: 20px;
}

    .acs-video-gallery-container [data-icon-name=LocalPreviewPlaceholder] svg {
        width: 100%;
        height: auto;
    }

.acs-video-gallery-container [id*=callWithChatCompositeParentDiv] [role=heading] {
    color: var(--grey-1);
    font-family: inherit;
    text-align: left;
    margin-bottom: 20px;
}

.acs-video-gallery-container [data-ui-id=call-composite-device-settings] {
    font-family: var(--font-family);
    text-align: left;
}

    .acs-video-gallery-container [data-ui-id=call-composite-device-settings] > .ms-Stack {
        padding: 0;
    }

    .acs-video-gallery-container [data-ui-id=call-composite-device-settings] .ms-Label {
        color: var(--grey-3);
        align-self: flex-start;
        font-family: inherit;
    }

    .acs-video-gallery-container [data-ui-id=call-composite-device-settings] .ms-Dropdown {
        font-family: inherit;
        font-size: 14px;
        color: var(--grey-3);
    }

        .acs-video-gallery-container [data-ui-id=call-composite-device-settings] .ms-Dropdown.is-disabled .ms-Dropdown-title {
            color: var(--grey-dark-1);
            background: var(--grey-dark-3);
        }

        .acs-video-gallery-container [data-ui-id=call-composite-device-settings] .ms-Dropdown.is-disabled .ms-Icon {
            color: currentColor;
        }

        .acs-video-gallery-container [data-ui-id=call-composite-device-settings] .ms-Dropdown:hover .ms-Dropdown-title, .acs-video-gallery-container [data-ui-id=call-composite-device-settings] .ms-Dropdown:focus .ms-Dropdown-title {
            color: currentColor;
            border-color: var(--green);
        }

        .acs-video-gallery-container [data-ui-id=call-composite-device-settings] .ms-Dropdown:hover .ms-Dropdown-caretDown, .acs-video-gallery-container [data-ui-id=call-composite-device-settings] .ms-Dropdown:focus .ms-Dropdown-caretDown {
            color: currentColor;
        }

    .acs-video-gallery-container [data-ui-id=call-composite-device-settings] .ms-Dropdown-title {
        border-color: var(--grey-dark-3);
        background: var(--grey-dark-6);
        transition: all var(--transition-duration) ease 0s;
    }

    .acs-video-gallery-container [data-ui-id=call-composite-device-settings] [class^=errorMessage] {
        font-family: inherit;
        color: var(--red);
        font-size: 12px;
        line-height: 1.2;
    }

.acs-video-gallery-container [data-ui-id=call-composite-start-call-button] {
    position: relative;
    display: flex;
    margin-top: 20px;
    margin-bottom: 20px;
    width: 100%;
    max-width: 283px;
    min-height: 43px;
    color: #ffffff;
    font-size: 14px;
    background: var(--green);
    border: 1px solid transparent;
}

    .acs-video-gallery-container [data-ui-id=call-composite-start-call-button]:hover {
        border-color: #27e99b;
        box-shadow: 0 6px 12px rgba(39, 191, 129, 0.3);
    }

    .acs-video-gallery-container [data-ui-id=call-composite-start-call-button] svg {
        margin-right: 10px;
    }

.acs-video-gallery-container .ms-Dropdown-items {
    background: var(--grey-dark-3);
    border: 1px solid var(--grey-dark-2);
    border-top: none;
}

    .acs-video-gallery-container .ms-Dropdown-items button {
        color: var(--grey-1);
        font-size: 14px;
        background: transparent;
    }

        .acs-video-gallery-container .ms-Dropdown-items button[aria-selected=true] {
            background: var(--grey-dark-6);
            color: var(--grey-dark-1);
            pointer-events: none;
        }

        .acs-video-gallery-container .ms-Dropdown-items button:hover {
            background: var(--grey-dark-6);
        }

.acs-video-gallery-container .ms-Dropdown-optionText {
    font-family: inherit;
    font-size: inherit;
}

.acs-video-gallery-container [data-ui-id=left-call-page] {
    color: var(--grey-1);
}

    .acs-video-gallery-container [data-ui-id=left-call-page] .ms-Icon {
        display: flex;
        align-items: center;
        justify-content: center;
        color: var(--red);
        width: 56px;
        height: 56px;
        margin: auto;
        border: 2px solid currentColor;
        border-radius: 50%;
        margin-bottom: 20px;
    }

        .acs-video-gallery-container [data-ui-id=left-call-page] .ms-Icon svg {
            width: 30px;
            height: auto;
        }

    .acs-video-gallery-container [data-ui-id=left-call-page] span {
        color: currentColor;
    }

        .acs-video-gallery-container [data-ui-id=left-call-page] span:nth-of-type(2) {
            color: var(--grey-3);
        }

.acs-video-gallery-container [data-ui-id=leaving-page] {
    color: var(--grey-1);
}

    .acs-video-gallery-container [data-ui-id=leaving-page] span {
        color: currentColor;
    }

.acs-video-gallery-container [data-ui-id=lobby-page],
.acs-video-gallery-container [data-ui-id=call-page] {
    background: var(--grey-dark-4);
}

    .acs-video-gallery-container [data-ui-id=lobby-page] > .ms-Stack:first-child > .ms-Stack:first-child > div:first-child,
    .acs-video-gallery-container [data-ui-id=call-page] > .ms-Stack:first-child > .ms-Stack:first-child > div:first-child {
        background: transparent;
        box-shadow: none;
    }

        .acs-video-gallery-container [data-ui-id=lobby-page] > .ms-Stack:first-child > .ms-Stack:first-child > div:first-child > .ms-Stack:first-child,
        .acs-video-gallery-container [data-ui-id=call-page] > .ms-Stack:first-child > .ms-Stack:first-child > div:first-child > .ms-Stack:first-child {
            padding: 0;
            min-height: 0;
        }

            .acs-video-gallery-container [data-ui-id=lobby-page] > .ms-Stack:first-child > .ms-Stack:first-child > div:first-child > .ms-Stack:first-child > .ms-StackItem:nth-child(2),
            .acs-video-gallery-container [data-ui-id=call-page] > .ms-Stack:first-child > .ms-Stack:first-child > div:first-child > .ms-Stack:first-child > .ms-StackItem:nth-child(2) {
                position: absolute;
                right: 0;
                bottom: 8px;
                padding: 0;
            }

        .acs-video-gallery-container [data-ui-id=lobby-page] > .ms-Stack:first-child > .ms-Stack:first-child > div:first-child .ms-StackItem:first-child > .ms-Stack .ms-StackItem > div:first-child > div:first-child,
        .acs-video-gallery-container [data-ui-id=call-page] > .ms-Stack:first-child > .ms-Stack:first-child > div:first-child .ms-StackItem:first-child > .ms-Stack .ms-StackItem > div:first-child > div:first-child {
            position: absolute;
            bottom: 0;
            left: 50%;
            transform: translate(-50%, -40px);
            width: initial;
            height: initial;
            background: var(--grey-dark-3);
            border-radius: 50px;
        }

            .acs-video-gallery-container [data-ui-id=lobby-page] > .ms-Stack:first-child > .ms-Stack:first-child > div:first-child .ms-StackItem:first-child > .ms-Stack .ms-StackItem > div:first-child > div:first-child > [class*=root],
            .acs-video-gallery-container [data-ui-id=call-page] > .ms-Stack:first-child > .ms-Stack:first-child > div:first-child .ms-StackItem:first-child > .ms-Stack .ms-StackItem > div:first-child > div:first-child > [class*=root] {
                padding: 4px;
                -moz-column-gap: 0;
                column-gap: 0;
            }

    .acs-video-gallery-container [data-ui-id=lobby-page] .ms-StackItem,
    .acs-video-gallery-container [data-ui-id=call-page] .ms-StackItem {
        background: transparent;
    }

    .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=video-tile] [data-ui-id=video-tile-display-name],
    .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=video-tile] [data-ui-id=video-tile-display-name] {
        color: rgba(255, 255, 255, 0.75) !important;
        background: rgba(39, 39, 39, 0.75);
    }

        .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=video-tile] [data-ui-id=video-tile-display-name]:not(:empty),
        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=video-tile] [data-ui-id=video-tile-display-name]:not(:empty) {
            padding: 4px 8px;
        }

        .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=video-tile] [data-ui-id=video-tile-display-name] + .ms-Stack,
        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=video-tile] [data-ui-id=video-tile-display-name] + .ms-Stack {
            margin: 0;
            color: rgba(255, 255, 255, 0.75);
            background: rgba(39, 39, 39, 0.75);
        }

            .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=video-tile] [data-ui-id=video-tile-display-name] + .ms-Stack:not(:empty),
            .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=video-tile] [data-ui-id=video-tile-display-name] + .ms-Stack:not(:empty) {
                padding: 4px;
            }

            .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=video-tile] [data-ui-id=video-tile-display-name] + .ms-Stack svg,
            .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=video-tile] [data-ui-id=video-tile-display-name] + .ms-Stack svg {
                height: 19px;
                width: auto;
            }

    .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=video-tile] .ms-Persona,
    .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=video-tile] .ms-Persona {
        margin-top: 0;
    }

        .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=video-tile] .ms-Persona .ms-Persona-coin,
        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=video-tile] .ms-Persona .ms-Persona-coin {
            font-family: var(--font-family);
        }

        .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=video-tile] .ms-Persona .ms-Persona-imageArea,
        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=video-tile] .ms-Persona .ms-Persona-imageArea {
            width: 160px !important;
            height: 160px !important;
        }

        .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=video-tile] .ms-Persona .ms-Persona-initials,
        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=video-tile] .ms-Persona .ms-Persona-initials {
            width: 100% !important;
            height: 100% !important;
            font-size: 60px;
            border-width: 0 !important;
        }

    .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=call-composite-microphone-button],
    .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=call-composite-camera-button],
    .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=call-composite-screenshare-button],
    .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=common-call-composite-people-button],
    .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=call-composite-microphone-button],
    .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=call-composite-camera-button],
    .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=call-composite-screenshare-button],
    .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=common-call-composite-people-button] {
        color: var(--grey-1);
        border: none;
        width: 43px;
        height: 43px;
        min-width: initial;
        font-size: 14px;
        padding: 0;
        border-radius: 50%;
        background: transparent;
        transition: all var(--transition-duration) ease 0s;
    }

        .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=call-composite-microphone-button][aria-disabled=true],
        .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=call-composite-camera-button][aria-disabled=true],
        .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=call-composite-screenshare-button][aria-disabled=true],
        .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=common-call-composite-people-button][aria-disabled=true],
        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=call-composite-microphone-button][aria-disabled=true],
        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=call-composite-camera-button][aria-disabled=true],
        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=call-composite-screenshare-button][aria-disabled=true],
        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=common-call-composite-people-button][aria-disabled=true] {
            color: var(--grey-dark-1);
            pointer-events: none;
        }

        .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=call-composite-microphone-button]:hover,
        .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=call-composite-camera-button]:hover,
        .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=call-composite-screenshare-button]:hover,
        .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=common-call-composite-people-button]:hover,
        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=call-composite-microphone-button]:hover,
        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=call-composite-camera-button]:hover,
        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=call-composite-screenshare-button]:hover,
        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=common-call-composite-people-button]:hover {
            color: var(--green);
            background: rgba(255, 255, 255, 0.025);
        }

        .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=call-composite-microphone-button] > .ms-Button-flexContainer,
        .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=call-composite-camera-button] > .ms-Button-flexContainer,
        .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=call-composite-screenshare-button] > .ms-Button-flexContainer,
        .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=common-call-composite-people-button] > .ms-Button-flexContainer,
        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=call-composite-microphone-button] > .ms-Button-flexContainer,
        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=call-composite-camera-button] > .ms-Button-flexContainer,
        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=call-composite-screenshare-button] > .ms-Button-flexContainer,
        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=common-call-composite-people-button] > .ms-Button-flexContainer {
            line-height: 0;
        }

        .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=call-composite-microphone-button] .ms-Button-textContainer,
        .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=call-composite-camera-button] .ms-Button-textContainer,
        .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=call-composite-screenshare-button] .ms-Button-textContainer,
        .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=common-call-composite-people-button] .ms-Button-textContainer,
        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=call-composite-microphone-button] .ms-Button-textContainer,
        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=call-composite-camera-button] .ms-Button-textContainer,
        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=call-composite-screenshare-button] .ms-Button-textContainer,
        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=common-call-composite-people-button] .ms-Button-textContainer {
            display: none;
        }

    .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=call-composite-hangup-button],
    .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=call-composite-hangup-button] {
        color: #ffffff;
        border: none;
        width: 43px;
        height: 43px;
        min-width: initial;
        border-radius: 50%;
        background: var(--red);
        border: 1px solid transparent;
        transition: all var(--transition-duration) ease 0s;
        box-shadow: 0 3px 6px rgba(0, 0, 0, 0.08);
    }

        .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=call-composite-hangup-button]:hover,
        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=call-composite-hangup-button]:hover {
            border-color: #f34758;
            box-shadow: 0 3px 6px rgba(229, 40, 59, 0.5);
        }

        .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=call-composite-hangup-button] > .ms-Button-flexContainer,
        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=call-composite-hangup-button] > .ms-Button-flexContainer {
            line-height: 0;
        }

        .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=call-composite-hangup-button] svg,
        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=call-composite-hangup-button] svg {
            width: 24px;
            height: auto;
        }

    .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=call-with-chat-composite-chat-button],
    .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=call-with-chat-composite-chat-button] {
        display: none;
    }

    .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=call-composite-microphone-button] [aria-haspopup=true],
    .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=call-composite-microphone-button] [aria-haspopup=true] {
        display: none;
    }

        .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=call-composite-microphone-button] [aria-haspopup=true] + span,
        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=call-composite-microphone-button] [aria-haspopup=true] + span {
            display: none;
        }

    .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=common-call-composite-people-button],
    .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=common-call-composite-people-button] {
        background: var(--grey-dark-4);
    }

        .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=common-call-composite-people-button]:hover,
        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=common-call-composite-people-button]:hover {
            background: var(--grey-dark-3);
        }

        .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=common-call-composite-people-button].is-checked,
        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=common-call-composite-people-button].is-checked {
            width: 0;
            overflow: hidden;
        }

    .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=SidePane],
    .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=SidePane] {
        max-width: 260px;
        color: var(--grey-1);
        background: var(--grey-dark-3);
    }

        .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=SidePane] .ms-Button[aria-label=Close],
        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=SidePane] .ms-Button[aria-label=Close] {
            background: transparent;
        }

        .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=SidePane] .ms-Button--default,
        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=SidePane] .ms-Button--default {
            font-family: var(--font-family);
            font-size: 14px;
            font-weight: 400 !important;
            background: var(--grey-dark-4);
            border: 0;
        }

            .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=SidePane] .ms-Button--default:hover,
            .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=SidePane] .ms-Button--default:hover {
                color: var(--green);
                background: var(--grey-dark-6);
            }

        .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=SidePane] [data-ui-id=participant-list] [data-ui-id=participant-item] .ms-Persona,
        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=SidePane] [data-ui-id=participant-list] [data-ui-id=participant-item] .ms-Persona {
            margin-top: 0;
        }

            .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=SidePane] [data-ui-id=participant-list] [data-ui-id=participant-item] .ms-Persona + span,
            .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=SidePane] [data-ui-id=participant-list] [data-ui-id=participant-item] .ms-Persona + span {
                color: var(--grey-1);
            }

            .acs-video-gallery-container [data-ui-id=lobby-page] [data-ui-id=SidePane] [data-ui-id=participant-list] [data-ui-id=participant-item] .ms-Persona .ms-Persona-presence,
            .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=SidePane] [data-ui-id=participant-list] [data-ui-id=participant-item] .ms-Persona .ms-Persona-presence {
                right: 0;
                width: 10px;
                height: 10px;
                border-color: var(--grey-dark-3);
            }

    .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=floating-local-video-host] {
        right: 20px;
        bottom: 20px;
        background: transparent;
    }

        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=floating-local-video-host] [data-ui-id=video-tile] .ms-Persona .ms-Persona-coin {
            font-family: var(--font-family);
        }

        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=floating-local-video-host] [data-ui-id=video-tile] .ms-Persona .ms-Persona-imageArea {
            width: 80px !important;
            height: 80px !important;
        }

        .acs-video-gallery-container [data-ui-id=call-page] [data-ui-id=floating-local-video-host] [data-ui-id=video-tile] .ms-Persona .ms-Persona-initials {
            width: 100% !important;
            height: 100% !important;
            font-size: 30px;
            border-width: 0 !important;
        }

.ms-Button.camera-split-button {
    display: none;
}

[data-ui-id="call-composite-camera-button"] > span > span {
    display: none !important;
}