@import '_content/Microsoft.FluentUI.AspNetCore.Components/Microsoft.FluentUI.AspNetCore.Components.exfvxuochq.bundle.scp.css';

/* /Components/Auth.razor.rz.scp.css */
.auth-parent[b-ls9d99ggai] {
    display: flex;
    flex-direction: column;
    width: 100%;
    background-color: #9ABBDD;
    align-items: center;
    vertical-align: central;
    user-select: none;
}

    .auth-parent > img[b-ls9d99ggai] {
        display: flex;
        width: 300px;
        margin-top: 15vh;
    }

    .auth-parent > span[b-ls9d99ggai] {
        font-size: 30pt;
        font-weight: bold;
        margin-bottom: 5vh;
        color: #406B89;
    }


.div-element[b-ls9d99ggai] {
    display: flex;
    flex-direction: row;
    height: 60px;
    align-items: center;
}

    .div-element > span[b-ls9d99ggai] {
        max-height: 30px;
        min-height: 30px;
        min-width: 30px;
        position: absolute;
        margin-left: -145px;
    }

    .div-element > input[b-ls9d99ggai] {
        margin-left: -150px;
        position: absolute;
        max-height: 40px;
        min-height: 40px;
        min-width: 300px;
        max-width: 300px;
        font-size: 16pt;
        text-align: center;
    }

    .div-element > button[b-ls9d99ggai] {
        margin-top: 5vh;
        min-width: 300px;
        font-size: 18pt;
    }
/* /Components/Chat.razor.rz.scp.css */
.parent-div[b-5maqqd5hma] {
    display: flex;
    width: 100%;
    flex-direction: column-reverse;
    bottom: 5px;
    flex-grow: 3;
    overflow-y: auto;
    scrollbar-width: thin;
}

    .parent-div[b-5maqqd5hma]::before {
        content: "";
        background-image: url("../img/logo-transparent.png");
        background-position: center;
        opacity: 0.1;
        position: absolute;
        z-index: -1;
        width: 70%;
        height: 100%;
    }

    .parent-div[b-5maqqd5hma]::after {
        content: "";
        background-color: #9ABBDD;
        background-position: center;
        position: absolute;
        opacity: 0.7;
        z-index: -2;
        width: 70%;
        height: 100%;
    }
/* /Components/ContactList.razor.rz.scp.css */
.main-block[b-d7h6yon0f5] {
    display: flex;
    flex-direction: column;
    width: auto;
    height: 100%;
/*    overflow: hidden;*/
}

.scroll-block[b-d7h6yon0f5] {
    display: flex;
    flex-direction: column;
    padding-top: 2px;
    width: 100%;
    height: 100%;
    /*    overflow: hidden;*/
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: #A6B8CF #CED6DB;
}

    .scroll-block > div[b-d7h6yon0f5] {
        display: flex;
        width: 100%;
    }

.fixed-block[b-d7h6yon0f5] {
    display: flex;
    flex-direction: column;
    padding-top: 2px;
    width: 100%;
/*    height: 100%;*/
}



/* /Components/Creator.razor.rz.scp.css */
.scroll-block[b-ig344xbhib] {
    display: flex;
    flex-direction: column;
    padding-top: 2px;
    width: 100%;
    height: 100%;
    /*    overflow: hidden;*/
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: #A6B8CF #CED6DB;
}

    .scroll-block > div[b-ig344xbhib] {
        display: flex;
        width: 100%;
    }

.fixed-block[b-ig344xbhib] {
    display: flex;
    flex-direction: column;
    padding-top: 2px;
    width: 100%;
    /*    height: 100%;*/
}
/* /Components/Items/CreatorItem.razor.rz.scp.css */
.item[b-ae5fnho8w8] {
    display: flex;
    flex-direction: column;
    padding: 5px;
    background-color: #EDF6FD;
    overflow: hidden;
    margin-top: 2px;
    max-height: 170px;
    transition: max-height 0.2s ease-in-out;
}

    .item > span[b-ae5fnho8w8] {
        max-height: 30px;
        min-height: 30px;
        vertical-align: central;
        font-size: 14pt;
        font-weight: bold;
        user-select: none;
        cursor: pointer;
    }

    .item > input[b-ae5fnho8w8] {
        margin-top: 5px;
    }

    .item > button[b-ae5fnho8w8] {
        margin-top: 10px;
    }

.item-collapsed[b-ae5fnho8w8] {
    max-height: 50px;
    transition: max-height 0.2s ease-in-out;
}
/* /Components/Items/DialogItem.razor.rz.scp.css */
.parent-dialog[b-kvggkg155e] {
    display: flex;
    width: 100%;
    min-height: 75px;
    max-height: 75px;
    margin-bottom: 2px;
    border-bottom: solid 1px;
}

    .parent-dialog:hover[b-kvggkg155e] {
        background-color: #EDF6FD;
    }

.parent-dialog-selected[b-kvggkg155e] {
    background-color: #B8CFE7;
}

    .parent-dialog-selected:hover[b-kvggkg155e] {
        background-color: #B8CFE7;
    }


.photo[b-kvggkg155e] {
    display: flex;
    height: 100%;
    margin-left: 10px;
    align-items: center;
    width: 100%;
}

    .photo > img[b-kvggkg155e] {
        width: 56px;
        height: 56px;
        border-radius: 50%;
        align-content: center;
    }
    
.circle[b-kvggkg155e] {
    display: flex;
    flex-direction: row;
    align-items: end;
    height: 100%;
    padding-bottom: 10px;
}
    .circle > div[b-kvggkg155e] {
        display: flex;
        width: 10px;
        height: 10px;
        border-radius: 50%;
        background-color: limegreen;

    }

.dialog-info[b-kvggkg155e] {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
    padding: 0px 10px 0px 10px;
}

    .dialog-info > span[b-kvggkg155e] {
        padding-top: 3px;
        user-select: none;
        overflow: hidden;
        line-height: 1.1;
    }

        .dialog-info > span#name[b-kvggkg155e] {
            font-weight: bold;
            font-size: 14pt;
            word-wrap: unset;
            height: 35%;
        }

        .dialog-info > span#text[b-kvggkg155e] {
            font-weight: normal;
            font-size: 10pt;
            word-wrap: break-word;
            height: 45%;
            /*            color: #7D7D7D;*/
            color: #3D3D3D;
        }

        .dialog-info > span#date[b-kvggkg155e] {
            font-weight: normal;
            font-size: 8pt;
            word-wrap: break-word;
            height: 20%;
            text-align: right;
            /*            color: #7D7D7D;*/
            color: #3D3D3D;
        }
/* /Components/Items/SearchItem.razor.rz.scp.css */
.parent-dialog[b-tqm9vbwz32] {
    display: flex;
    width: 100%;
    min-height: 65px;
    max-height: 65px;
    margin-bottom: 2px;
    border-bottom: solid 1px;
}

    .parent-dialog:hover[b-tqm9vbwz32] {
        background-color: #EDF6FD;
    }

.photo[b-tqm9vbwz32] {
    display: flex;
    height: 100%;
    margin-left: 10px;
    align-items: center;
    width: 100%;
}

    .photo > img[b-tqm9vbwz32] {
        width: 50px;
        height: 50px;
        border-radius: 50%;
        align-content: center;
    }


.dialog-info[b-tqm9vbwz32] {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
    padding: 0px 10px 0px 10px;
}

    .dialog-info > span[b-tqm9vbwz32] {
        user-select: none;
        overflow: hidden;
        line-height: 1.1;
    }

        .dialog-info > span#name[b-tqm9vbwz32] {
            font-weight: bold;
            font-size: 14pt;
            word-wrap: unset;
            align-content: center;
            height: 50%;
        }

        .dialog-info > span#text[b-tqm9vbwz32] {
            font-weight: normal;
            font-size: 12pt;
            word-wrap: break-word;
            height: 50%;
            color: #7D7D7D;
        }

/* /Components/Message/Message.razor.rz.scp.css */
.main-out[b-kfashksver] {
    display: flex;
    justify-content: right;
}

.main-in[b-kfashksver] {
    display: flex;
    justify-content: left;
}

.message[b-kfashksver] {
    display: block;
    max-width: 80%;
    min-width: 50%;
    padding: 5px 10px 5px 10px;
    margin: 1px 10px 10px 10px;
    border-radius: 15px;
}

    .message:hover .message-top-action[b-kfashksver] {
        opacity: 0.6;
        transition: opacity 0.3s;
    }

.message-out[b-kfashksver] {
    background-color: rgba(240, 249, 255, 0.9);
}

.message-in[b-kfashksver] {
    background-color: rgba(255, 255, 255, 0.9);
}

.message-text[b-kfashksver] {
    text-wrap: wrap;
    font-size: 11pt;
    line-height: 1.3;
}

.message-top[b-kfashksver] {
    display: flex;
    width: 100%;
    height: 16px;
    font-size: 9pt;
    user-select: none;
}

.message-top-name[b-kfashksver] {
    display: flex;
    font-weight: bold;
    min-width: 70%;
    overflow: hidden;
    color: #8A54E0;
}

.message-top-action[b-kfashksver] {
    display: flex;
    width: 100%;
    right: 5px;
    justify-content: right;
    opacity: 0;
    transition: opacity 0.3s;
}

    .message-top-action:hover[b-kfashksver] {
        cursor: pointer;
    }

.message-bottom[b-kfashksver] {
    display: flex;
    flex-direction: row-reverse;
    width: 100%;
    height: 16px;
    font-size: 9pt;
    user-select: none;
    align-items: center;
/*    background-color: green;*/
}

    .message-bottom > span#text[b-kfashksver] {
        color: gray;
        margin-right: 5px;
    }

    .message-bottom > span#icon[b-kfashksver] {
        margin-right: 5px;
        min-width: 14px;
        min-height: 14px;
        max-height: 14px;
        max-width: 14px;
    }

.message-down[b-kfashksver] {
}

.media[b-kfashksver] {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    margin-bottom: 5px;
    margin-top: 5px;
}

.media-element[b-kfashksver] {
    display: flex;
    flex-basis: 50%;
    flex-grow: 1;
    justify-content: right;
    padding: 5px;
}

.media-element-image[b-kfashksver] {
    display: block;
    align-content: center;
    /*background-color: #FAFAFA;*/
}
    .media-element-image > img[b-kfashksver] {
        display: flex;
        max-width: 100%;
    }
/* /Components/Message/MessageInput.razor.rz.scp.css */
.main[b-8f4weue15v] {
    display: block;
    width: calc(100% - 20px);
    margin-left: 10px;
}

.media[b-8f4weue15v] {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    margin-bottom: 5px;
    margin-top: 5px;
}

.element[b-8f4weue15v] {
    display: flex;
    flex-basis: 25%;
    flex-grow: 1;
    justify-content: right;
    padding: 5px;
}

.element-button[b-8f4weue15v] {
    display: flex;
    position: absolute;
    height: 24px;
    background-color: gray;
}

    .element-button > span[b-8f4weue15v] {
        color: white;
    }

.element-image[b-8f4weue15v] {
    display: block;
    align-content: center;
    background-color: #FAFAFA;
}

    .element-image > img[b-8f4weue15v] {
        display: flex;
        max-width: 100%;
    }


.emoji[b-8f4weue15v] {
    display: flex;
    flex-basis: 10%;
    justify-content: center;
    height: 20pt;
    margin-bottom: 10px;
}

    .emoji > span[b-8f4weue15v] {
        display: flex;
        font-size: 18pt;
        user-select: none;
        cursor: pointer;
        background-color: white;
        background-size: cover;
    }


.input[b-8f4weue15v] {
    display: flex;
    flex-direction: row;
    border-top-width: 1px;
    border-top-style: solid;
    border-color: rgba(0, 0, 0, 0.2);
}

.input-text-block[b-8f4weue15v] {
    display: flex;
    flex-direction: row;
    align-items: center;
    width: 100%;
    margin-top: 5px;
    margin-bottom: 5px;
}

.input-text[b-8f4weue15v] {
    display: flex;
    width: 100%;
    height: 23px;
    max-height: 120px;
    border: none;
    overflow-y: scroll;
    line-height: 1.1;
    font-size: 13pt;
    text-justify: auto;
    margin-left: 5px;
    margin-right: 5px;
    scrollbar-width: thin;
}

    .input-text:focus[b-8f4weue15v] {
        outline: none;
    }

.block[b-8f4weue15v] {
    display: flex;
    min-height: 3rem;
    margin: 2px 3px 2px 3px;
    padding-bottom: 0.75rem;
    align-items: flex-end;
    cursor: pointer;
}

    .block > label[b-8f4weue15v] {
        cursor: pointer;
    }

.block-center[b-8f4weue15v] {
    width: 100%;
    flex-direction: column;
    align-items: center;
    vertical-align: middle;
    padding: 0;
    margin: 0;
}

    .block-center > div#button[b-8f4weue15v] {
        display: flex;
        flex-direction: row;
        height: 100%;
        align-items: center;
        font-size: 24px;
        font-weight: bold;
        user-select: none;
        color: #265075;
    }
/* /Components/TopChatMenu.razor.rz.scp.css */
.div-menu[b-orh7m87t25] {
    display: flex;
    /*    width: 100%;*/
    min-height: 60px;
    height: 60px;
    background-color: #27479E;
}

.main-button[b-orh7m87t25] {
    display: flex;
    height: 100%;
    align-items: center;
    margin-left: 10px;
    margin-right: 10px;
    cursor: pointer;
}

    .main-button > span[b-orh7m87t25] {
        display: block;
        color: white;
        height: 33px;
        width: 33px;
        opacity: 0.9;
    }

.photo[b-orh7m87t25] {
    display: flex;
    height: 100%;
    margin-left: 10px;
    align-items: center;
    width: 100%;
}

    .photo > img[b-orh7m87t25] {
        width: 43px;
        height: 43px;
        border-radius: 50%;
    }

    .photo > span[b-orh7m87t25] {
        margin-left: 10px;
        color: white;
        font-weight: bold;
        font-size: 22px;
        word-wrap: unset;
        user-select: none;
    }
/* /Components/TopMenu.razor.rz.scp.css */
.div-menu[b-6k6uy5gker] {
    display: flex;
    /*    width: 100%;*/
    min-height: 60px;
    height: 60px;
    background-color: #27479E;
}

.main-button[b-6k6uy5gker] {
    display: flex;
    height: 100%;
    align-items: center;
    margin-left: 10px;
    margin-right: 10px;
    cursor: pointer;
}

    .main-button > span[b-6k6uy5gker] {
        display: block;
        color: white;
        height: 33px;
        width: 33px;
        opacity: 0.9;
    }

.photo[b-6k6uy5gker] {
    display: flex;
    height: 100%;
    margin-left: 10px;
    align-items: center;
    width: 100%;
}

    .photo > img[b-6k6uy5gker] {
        width: 43px;
        height: 43px;
        border-radius: 50%;
    }

    .photo > span[b-6k6uy5gker] {
        margin-left: 10px;
        color: white;
        font-weight: bold;
        font-size: 22px;
        word-wrap: unset;
        user-select: none;
    }
/* /Layout/ChatLayout.razor.rz.scp.css */
.div-container[b-g2w08pzf9f] {
    height: 100vh;
    width: 100%;
    overflow: hidden;
    display: flex;
    /*    flex-direction: column;*/
}


.div-container-left[b-g2w08pzf9f] {
    width: calc(30% - 3px);
}

.div-container-right[b-g2w08pzf9f] {
    display: flex;
    flex-direction: column;
    width: 70%;
}

.div-container-spacer[b-g2w08pzf9f] {
    display: flex;
    width: 3px;
}

.div-container-bottom[b-g2w08pzf9f] {
    display: flex;
    position: absolute;
    align-items: center;
    height: 60px;
    min-height: 50px;
    width: 100%;
    overflow: hidden;
    bottom: 0px;
    background-color: #FF3333;
    color: white;
    font-size: 14pt;
    word-wrap: break-word;
    padding: 3px 10px 3px 10px;
}

    .div-container-bottom > span[b-g2w08pzf9f] {
        display: flex;
        position: absolute;
        right: 5px;
        min-height: 40px;
        min-width: 40px;
        max-height: 40px;
        max-width: 40px;
        opacity: 1;
        cursor: pointer;
    }