﻿footer {
    display: none !important;
}

.forie-connect-banner-area {
    display: none;
}

body {
    font-family: 'DM Sans', sans-serif;
    font-size: 16px;
    background-color: #fff;
}

.unverified {
    color: #F36234;
}

.no-access {
    color: #ED0017;
}


.searchShow {
    opacity: 1;
    pointer-events: all;
}

.searchClose {
    opacity: 0;
    pointer-events: none;
}

.wrapper {
    background-color: #F9F9FA;
    min-height: 101vh;
}

#chat_tab_content > div {
    background-color: #fff;
}

#chat_tab_content > .active {
    display: flex !important;
}

.chat-info-visible {
    transform: translateX(0);
    visibility: visible;
    min-width: 19.38rem;
    width: 19.38rem;
}
/*#region --------------- Headar Genel Buton Alanı --------------- */
.general-system-tabs-button-area {
    padding: 16px 0px;
}

.general-dropdown-item > abbr {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0.5px;
    padding: 13.5px 14px;
    background: #E6E9EF;
    border-radius: 8px;
    color: #00245D;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

    .general-dropdown-item > abbr:after {
        margin-top: 0px;
        border-radius: 6px;
        margin-left: 15px;
    }

    .general-dropdown-item > abbr > span {
        max-width: 330px;
        text-align: left;
        overflow: hidden;
        white-space: nowrap;
        display: block;
        margin-right: auto;
        text-overflow: ellipsis;
    }

    .general-dropdown-item > abbr > i {
        font-size: 21px;
        margin-right: 10px;
    }

    .general-dropdown-item > abbr > abbr {
        color: #fff;
        background-color: #34c5f3;
        padding: 0px 6px;
        border-radius: 50px;
        line-height: 1.66;
        min-width: 18px;
        font-style: normal;
        font-size: 13px;
        display: flex;
        align-items: center;
        margin-left: 8px;
        justify-content: center;
    }

.general-dropdown-item .general-dropdown-item-menu {
    padding: 0;
    margin: 0;
    border: 1px solid #DFE5EE;
    border-radius: 8px;
    min-width: 230px;
    max-height: 250px;
    overflow-y: auto;
}

    .general-dropdown-item .general-dropdown-item-menu a {
        padding: 15px 18px;
        color: #00245D;
        line-height: 1;
        border-bottom: 1px solid #DFE5EE;
        font-size: 15px;
        display: flex;
        align-items: center;
        transition: background-color .5s,border-bottom .5s;
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 400;
        justify-content: space-between;
        letter-spacing: 0.5px;
    }

        .general-dropdown-item .general-dropdown-item-menu a > i {
            margin-right: 24px;
            font-size: 21px;
        }

        .general-dropdown-item .general-dropdown-item-menu a > section {
            display: flex;
            margin-right: auto;
            flex-flow: column;
        }

            .general-dropdown-item .general-dropdown-item-menu a > section > span {
                max-width: 310px;
                text-align: left;
                overflow: hidden;
                white-space: nowrap;
                display: block;
                text-overflow: ellipsis;
            }

            .general-dropdown-item .general-dropdown-item-menu a > section > abbr {
                font-family: 'Roboto';
                font-style: normal;
                font-weight: 400;
                font-size: 12px;
                line-height: 14px;
                display: flex;
                align-items: center;
                border-radius: 1000px;
                color: #002155;
                padding-top: 5px;
            }

                .general-dropdown-item .general-dropdown-item-menu a > section > abbr.unverified {
                    color: #f36234;
                }

                .general-dropdown-item .general-dropdown-item-menu a > section > abbr > i {
                    font-size: 12px;
                    margin-right: 5px;
                }

    .general-dropdown-item .general-dropdown-item-menu > a > span {
        color: #fff;
        background-color: #34c5f3;
        padding: 0px 5px;
        border-radius: 50px;
        top: 4px;
        left: 4px;
        line-height: 1.75;
        font-size: 11px;
        display: block;
        margin-left: 25px;
    }

.chat-tab-header {
    margin-left: 20px;
    background: #E6E9EF;
    border-radius: 8px;
}

    .chat-tab-header > li > a {
        padding: 12px 18px !important;
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 400;
        font-size: 15px;
        line-height: 24px;
        letter-spacing: 0.5px;
        border-radius: 8px !important;
        color: #00245D;
    }

        .chat-tab-header > li > a:hover {
            color: #00245D;
        }

        .chat-tab-header > li > a.active {
            background-color: #34C5F3 !important;
            color: #fff !important;
        }

    .chat-tab-header > li #chat-tab.active {
        border-radius: 8px 0px 0px 8px !important;
    }

    .chat-tab-header > li #favori-tab.active {
        border-radius: 0px 0px 0px 0px !important;
    }

    .chat-tab-header > li #my-acoount-tab.active {
        border-radius: 0px 8px 8px 0px !important;
    }




.general-system-tabs-button-right-area > a {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    text-decoration: none;
    line-height: 24px;
    letter-spacing: 0.5px;
    display: flex;
    background: #34C5F3;
    border-radius: 8px;
    padding: 12px 18px !important;
    color: #FFFFFF;
    align-items: center;
}

    .general-system-tabs-button-right-area > a > i {
        margin-right: 8px;
        font-size: 20px;
    }


/*#endregion --------------- Headar Genel Buton Alanı --------------- */

/*#region --------------- Chat Left Header --------------- */
.chat-notification-badge {
    display: block;
    position: absolute;
    right: -5px;
    top: -5px;
    background-color: #f5424e;
    width: 15px;
    min-width: 15px;
    height: 15px;
    min-height: 15px;
    border-radius: 100%;
}

.chat-left-area {
    border-right: 1px solid #DFE5EE;
    position: relative;
}

.chat-left-header-buttons-area {
    height: 56px;
    display: flex;
    border-bottom: 1px solid #DFE5EE;
    position: relative;
    align-items: center;
    justify-content: space-between;
}

    .chat-left-header-buttons-area > section > div {
        position: relative;
        cursor: pointer;
        margin: 0px 8px;
    }

        .chat-left-header-buttons-area > section > div > i {
            display: flex;
            color: #00245D;
            font-size: 26px;
        }

        .chat-left-header-buttons-area > section > div:hover:before {
            content: "";
            position: absolute;
            display: block;
            width: 240px;
            height: 30px;
            bottom: 0;
            margin-bottom: -20px;
        }

        .chat-left-header-buttons-area > section > div > ul {
            position: absolute;
            content: "";
            left: -8px;
            top: 35px;
            width: 240px;
            height: auto;
            display: none;
            padding: 8px;
            margin: 0;
            list-style: none;
            background-color: #fff;
            box-shadow: 0px 4px 4px rgb(0 0 0 / 10%);
        }

            .chat-left-header-buttons-area > section > div > ul > li {
                display: flex;
                align-items: center;
                height: 48px;
                padding-left: 17px;
                transition: background-color .5s;
            }

                .chat-left-header-buttons-area > section > div > ul > li:hover {
                    background-color: #f9f9fa;
                }

                .chat-left-header-buttons-area > section > div > ul > li > a {
                    width: 100%;
                    font-size: 16px;
                    color: #00245D;
                    text-decoration: none;
                }

                    .chat-left-header-buttons-area > section > div > ul > li > a > i {
                        font-size: 18px;
                        vertical-align: sub;
                        margin-right: 10px;
                    }


#chat_list_nav_container::-webkit-scrollbar-track {
    border-radius: 0px;
    background-color: transparent;
}

#chat_list_nav_container::-webkit-scrollbar {
    width: 0px;
    background-color: transparent;
}

#chat_list_nav_container::-webkit-scrollbar-thumb {
    border-radius: 0px;
    background-color: transparent;
}

#chat_list_nav_container {
    overflow-x: overlay !important;
    width: 100%;
    overflow: hidden;
}

#chat_list_nav {
    width: 100%;
    justify-content: space-between;
}

#chat_list_nav_container > div > a {
    font-family: 'Roboto';
    font-style: normal;
    white-space: nowrap;
    font-weight: 400;
    font-size: 14px;
    line-height: 24px;
    padding: 8px 8px;
    text-decoration: none;
    letter-spacing: 0.5px;
    color: #00245D;
    margin: 0px 8px;
    border-radius: 8px;
    transition: background-color .5s;
}

#chat_list_nav_container > div > a {
   position:relative;
}
    #chat_list_nav_container > div > a:hover {
        background-color: #E6E9EF;
    }

    #chat_list_nav_container > div > a.active {
        background: #00245D;
        color: #fff;
    }

    #chat_list_nav_container > div > a > i {
        position: absolute;
        color: #fff;
        background-color: #34C5F3;
        padding: 0px 6px;
        border-radius: 50%;
        top: 0px;
        line-height: 1.7;
        font-size: 13px;
    }


.chat-left-header-buttons-area > article {
    position: relative;
}

    .chat-left-header-buttons-area > article > a {
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 400;
        line-height: 24px;
        padding: 9px 8px;
        display: flex;
        text-decoration: none;
        letter-spacing: 0.5px;
        color: #00245D;
        margin-right: 2px;
        border-radius: 8px;
        transition: background-color .5s;
    }

        .chat-left-header-buttons-area > article > a > i {
            font-size: 21px;
            line-height: 1;
        }

        .chat-left-header-buttons-area > article > a:hover {
            background-color: #E6E9EF;
        }



.chat-left-header-buttons-area > charset {
    position: absolute;
    right: 0px;
    top: 0px;
    display: flex;
    height: 56px;
    width: 100%;
    background-color: #fff;
    align-items: center;
    justify-content: space-evenly;
    border-bottom: 1px solid #DFE5EE;
}

    .chat-left-header-buttons-area > charset > a {
        display: flex;
        padding: 7px;
        border-radius: 8px;
        color: #00245D;
        transition: background-color .5s;
        text-decoration: none;
    }

        .chat-left-header-buttons-area > charset > a:hover {
            background-color: #e6e9ef;
        }

        .chat-left-header-buttons-area > charset > a > i {
            font-size: 21px;
        }

    .chat-left-header-buttons-area > charset > form {
        width: 100% !important;
    }

        .chat-left-header-buttons-area > charset > form > div {
            width: 100% !important;
        }

            .chat-left-header-buttons-area > charset > form > div > input {
                width: 100% !important;
                border-radius: 50px !important;
                height: 40px;
                margin: 0px 11px;
                border: 1px solid #00245D;
            }


/*#endregion --------------- Chat Left Header --------------- */

/*#region --------------- Chat Left List --------------- */

.chat-list-section::-webkit-scrollbar-track {
    border-radius: 0px;
    background-color: #fff;
}

.chat-list-section::-webkit-scrollbar {
    width: 3px;
    background-color: #fff;
}

.chat-list-section::-webkit-scrollbar-thumb {
    border-radius: 24px;
    background-color: #34c5f3;
}

.chat-list-section {
    overflow: hidden;
    height: 100%;
    height: 78.2vh;
    overflow-y: scroll;
}

    .chat-list-section > div > ul {
        padding: 0;
        margin: 0;
        list-style: none;
    }

        .chat-list-section > div > ul > li {
            border-bottom: 1px solid #EFF0F1;
            transition: background .5s;
        }

            .chat-list-section > div > ul > li:last-child {
                border: none;
            }

            .chat-list-section > div > ul > li:hover {
                background: #E6E9EF;
            }

.chat-list-item > a {
    display: flex;
    align-items: center;
    flex-grow: 1;
    max-width: 100%;
    text-decoration: none !important;
    padding: 24px 18px;
}

    .chat-list-item > a.active {
        background: #E6E9EF;
    }

        .chat-list-item > a.active.unverified {
            background: #FEEFEB;
        }





    .chat-list-item > a .avatar {
        height: 40px;
        display: inline-block;
        width: 40px;
        border-radius: 50%;
        box-shadow: 0 0 1px 1px rgb(0 0 0 / 10%);
        background: #8A9AB4;
    }

        .chat-list-item > a .avatar .user-short {
            width: 40px;
            height: 100%;
            border-radius: 50%;
            -o-object-fit: cover;
            object-fit: cover;
            display: flex;
            align-items: center;
            justify-content: center;
        }

            .chat-list-item > a .avatar .user-short > i {
                color: #E6E9EF;
                font-size: 22px;
            }

            .chat-list-item > a .avatar .user-short > img {
                width: 40px;
                height: 40px;
                object-fit: contain;
                border-radius: 50%;
                background-color: #fff;
            }

.contacts-content {
    padding-left: 0.875rem;
    transition: all .4s;
    overflow: hidden;
    max-width: 100%;
    flex: 1 1 auto;
}

    .contacts-content .contacts-info {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

        .contacts-content .contacts-info > strong {
            font-family: 'Roboto';
            font-style: normal;
            font-weight: 400;
            font-size: 16px;
            margin-right: 10px;
            line-height: 24px;
            text-align: center;
            letter-spacing: 0.5px;
            font-feature-settings: 'liga' off;
            color: #001941;
            max-width: 290px;
            text-align: left;
            overflow: hidden;
            white-space: nowrap;
            display: block;
            text-overflow: ellipsis;
        }

        .contacts-content .contacts-info > abbr {
            font-family: 'Roboto';
            font-style: normal;
            font-weight: 600;
            font-size: 12px;
            line-height: 16px;
            text-align: center;
            letter-spacing: 0.5px;
            font-feature-settings: 'liga' off;
            color: #78808C;
        }

    .contacts-content .contacts-text {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

        .contacts-content .contacts-text > span {
            font-family: 'Roboto';
            font-style: normal;
            font-weight: 500;
            font-size: 12px;
            line-height: 13px;
            letter-spacing: 0.5px;
            font-feature-settings: 'liga' off;
            display: flex !important;
            align-items: flex-end;
            color: #78808C;
            max-width: 315px;
            text-align: left;
        }

            .contacts-content .contacts-text > span span {
                overflow: hidden;
                white-space: nowrap;
                text-overflow: ellipsis;
                display: block;
            }

                .contacts-content .contacts-text > span span > img {
                    width: 17px;
                }

                .contacts-content .contacts-text > span span > i {
                    font-size: 15px !important;
                    line-height: 13px;
                    vertical-align: sub;
                    margin-right: 5px;
                }

            .contacts-content .contacts-text > span.unread {
                color: #34C5F3;
            }

            .contacts-content .contacts-text > span > i {
                font-size: 15px;
                width: 16px;
                vertical-align: bottom;
                margin-right: 5px;
            }

        .contacts-content .contacts-text > abbr > i {
            color: #fff;
            background-color: #34c5f3;
            padding: 0px 5px;
            border-radius: 50px;
            line-height: 1.64;
            min-width: 18px;
            font-style: normal;
            font-size: 11px;
            display: flex;
            align-items: center;
            justify-content: center;
        }

.chat-list-new-chat-btn {
    position: absolute;
    bottom: 22px;
    right: 20px;
}

    .chat-list-new-chat-btn > a {
        color: #00245D;
        padding: 16px;
        background: #EBF9FE;
        box-shadow: 0px 3px 4px rgb(0 0 0 / 10%);
        border-radius: 8px;
        display: flex;
        align-items: center;
        text-decoration: none;
        justify-content: center;
    }

        .chat-list-new-chat-btn > a > i {
            line-height: 1;
            font-size: 24px;
        }
/*#endregion --------------- Chat Left List --------------- */

.chat-right-area {
    height: 84.4vh;
    overflow: hidden;
    display: flex;
    flex-direction: row;
    background: #fff;
}

    .chat-right-area .chats {
        height: 100%;
        flex-grow: 1;
        display: flex;
        position: relative;
    }

/*#region --------------- Chats Header --------------- */

.chats-body {
    display: flex;
    flex-grow: 1;
    flex-flow: column;
    min-width: 0;
    width: 100%;
    position: relative;
}

.chats-header {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid #e5e9f2;
    display: flex;
    height: 56px;
    align-items: center;
    position: absolute;
    justify-content: space-between;
    top: 0;
    left: 0;
    z-index: 41;
    width: 100%;
    background-color: #fff;
}

    .chats-header > a {
        font-size: 20px;
        line-height: 0.5;
        color: #00245d;
        padding: 10px;
        display: none;
    }


    .chats-header > section {
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        margin-right: auto;
    }

        .chats-header > section .avatar {
            height: 40px;
            display: inline-block;
            min-width: 40px;
            border-radius: 50%;
            background: #EBF9FE;
            margin-right: 9px;
            overflow: hidden;
        }

            .chats-header > section .avatar > img {
                object-fit: contain;
                object-position: center;
                min-width: 100%;
                min-height: 100%;
            }

            .chats-header > section .avatar > span {
                width: 100%;
                height: 100%;
                border-radius: 50%;
                -o-object-fit: cover;
                object-fit: cover;
                display: flex;
                align-items: center;
                justify-content: center;
                font-family: 'Roboto';
                font-style: normal;
                font-weight: 600;
                font-size: 14px;
                line-height: 20px;
                text-align: center;
                letter-spacing: 0.1px;
                font-feature-settings: 'liga' off;
                color: #546C92;
            }


        .chats-header > section > article {
            display: flex;
            flex-flow: column;
        }

            .chats-header > section > article > charset {
                display: flex;
                align-items: center;
                justify-content: start;
                line-height: 0;
            }

                .chats-header > section > article > charset > h6 {
                    font-family: 'Roboto';
                    font-style: normal;
                    font-weight: 400;
                    font-size: 16px;
                    line-height: 24px;
                    text-align: center;
                    letter-spacing: 0.5px;
                    font-feature-settings: 'liga' off;
                    color: #001941;
                    margin-right: 10px;
                    max-width: 700px;
                    text-align: left;
                    overflow: hidden;
                    white-space: nowrap;
                    display: block;
                    text-overflow: ellipsis;
                }

                .chats-header > section > article > charset > span {
                    font-family: 'Roboto';
                    font-style: normal;
                    font-weight: 600;
                    font-size: 12px;
                    line-height: 16px;
                    display: flex;
                    align-items: center;
                    text-align: center;
                    letter-spacing: 0.5px;
                    font-feature-settings: 'liga' off;
                    color: #78808C;
                }

                    .chats-header > section > article > charset > span > i {
                        font-size: 17px;
                        margin-right: 6px;
                    }

            .chats-header > section > article > section {
                line-height: 1;
            }

                .chats-header > section > article > section > abbr {
                    font-family: 'Roboto';
                    font-style: normal;
                    font-weight: 600;
                    font-size: 12px;
                    line-height: 16px;
                    text-align: center;
                    letter-spacing: 0.5px;
                    font-feature-settings: 'liga' off;
                    color: #78808C;
                }


.chat-dropdown-item > abbr {
    display: flex;
    cursor: pointer;
}

    .chat-dropdown-item > abbr:after {
        display: none;
    }

.chat-dropdown-item-menu.show {
    /*transform: translate3d(-175px, 36px, 0px) !important;*/
    width: 200px;
}

.chat-dropdown-item-menu {
    border: none;
    box-shadow: 0px 4px 4px rgb(0 0 0 / 10%);
    padding: 8px;
}

    .chat-dropdown-item-menu > a {
        padding: 0px 18px 0px 17px;
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 400;
        font-size: 15px;
        line-height: 16px;
        white-space: normal;
        height: 48px;
        letter-spacing: 0.5px;
        text-decoration: none;
        color: #001941;
        display: flex;
        align-items: center;
    }

        .chat-dropdown-item-menu > a > i {
            font-size: 18px;
            vertical-align: sub;
            margin-right: 10px;
        }
/*#endregion --------------- Chats Header --------------- */

/*#region --------------- Chats Content --------------- */
.chat-content::-webkit-scrollbar-track {
    border-radius: 0px;
    background-color: transparent;
}

.chat-content::-webkit-scrollbar {
    width: 0px;
    background-color: transparent;
}

.chat-content::-webkit-scrollbar-thumb {
    border-radius: 0px;
    background-color: transparent;
}

.chat-content {
    flex: 2;
    -ms-overflow-style: none;
    scrollbar-width: none;
    overflow-y: auto;
    overflow-x: hidden;
    position: relative;
    margin: 60px 10px 5px 10px;
    padding: 0px 15px;
}

.message {
    font-size: .875rem;
}

.message-send-time {
    margin-bottom: 1.25rem;
    text-align: center;
}

    .message-send-time > span {
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 600;
        padding: 12px;
        font-size: 11px;
        line-height: 16px;
        display: block;
        letter-spacing: 0.5px;
        color: #001941;
    }

.message.self {
    text-align: right;
}

    .message.self .message-content {
        background-color: #E6E9EF;
        color: #fff;
        border-radius: 1.25rem 0px 1.25rem 1.25rem;
        margin-left: 0;
    }

        .message.self .message-content:after {
            display: none;
        }


.message .message-content {
    padding: 10px 16px;
    background-color: #F6F6F7;
    color: #8094ae;
    border-radius: 0px 1.25rem 1.25rem 1.25rem;
    text-align: left;
    display: inline-block;
    max-width: 25rem;
    position: relative;
}

    .message .message-content:after {
        position: absolute;
        content: "";
        border-top: 7px solid;
        border-right: 7px solid transparent;
        border-bottom: 0;
        border-left: 7px solid transparent;
        top: 0;
        left: -6px;
        color: #f6f6f7;
    }

.message.self .message-content:before {
    position: absolute;
    content: "";
    border-top: 7px solid;
    border-right: 7px solid transparent;
    border-bottom: 0;
    border-left: 7px solid transparent;
    top: 0;
    right: -6px;
    color: #e6e9ef;
}



.message .message-content > strong {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 600;
    font-size: 14px;
    line-height: 20px;
    display: flex;
    align-items: center;
    letter-spacing: 0.1px;
    font-feature-settings: 'liga' off;
    color: #34C5F3;
    max-width: 368px;
    text-align: left;
    overflow: hidden;
    white-space: nowrap;
    display: block;
    text-overflow: ellipsis;
}

.message .message-content > p {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    display: flex;
    align-items: center;
    letter-spacing: 0.25px;
    font-feature-settings: 'liga' off;
    color: #001941;
    margin: 0;
    word-break: break-word;
    flex-flow: wrap;
    white-space: pre-wrap;
}

    .message .message-content > p > img {
        width: 25px;
    }

.message .message-content > abbr {
    font-style: normal;
    font-weight: 600;
    font-size: 9px;
    line-height: 16px;
    letter-spacing: 0.5px;
    padding: 3px 0px;
    color: #78808C;
    display: flex;
    align-items: center;
}

    .message .message-content > abbr > i {
        font-size: 12px;
        width: 16px;
        height: 16px;
        color: #fff;
        font-weight: 100;
        border-radius: 50%;
        text-align: center;
        margin-left: 6px;
    }

.message .message-content .message-send-file-area > section {
    background-color: #fff;
    border-radius: 8px;
    display: flex;
    width: 100%;
    padding: 8px;
    margin-bottom: 16px;
}

    .message .message-content .message-send-file-area > section > a {
        display: flex;
        width: 100%;
        padding-right: 4px;
    }

        .message .message-content .message-send-file-area > section > a:last-child {
            padding-right: 0px;
        }

        .message .message-content .message-send-file-area > section > a > img {
            width: 100%;
            border-radius: 2px;
            height: 184px;
            object-fit: cover;
        }

        .message .message-content .message-send-file-area > section > a.multiple-pictures {
            position: relative;
        }

            .message .message-content .message-send-file-area > section > a.multiple-pictures .pictures-count-more-show-area {
                position: absolute;
                content: "";
                left: 0;
                top: 0;
                width: 100%;
                background: #485d6473;
                height: 100%;
                display: flex;
                align-items: center;
                border-radius: 2px;
                text-decoration: none;
                justify-content: center;
            }

                .message .message-content .message-send-file-area > section > a.multiple-pictures .pictures-count-more-show-area > abbr {
                    font-family: 'Roboto';
                    font-style: normal;
                    font-weight: 700;
                    font-size: 24px;
                    line-height: 32px;
                    display: flex;
                    align-items: center;
                    color: #FFFFFF;
                }

        .message .message-content .message-send-file-area > section > a > article {
            font-style: normal;
            font-weight: 400;
            font-size: 14px;
            line-height: 1.2px;
            padding: 0px 5px;
            display: flex;
            align-items: center;
            letter-spacing: 0.25px;
            font-feature-settings: 'liga' off;
            color: #001941;
            margin: 0;
            border-bottom: 1px solid #ecedf1;
            padding: 5px 0px;
        }

            .message .message-content .message-send-file-area > section > a > article > span {
                line-height: 1.2 !important;
                word-break: break-all;
            }

        .message .message-content .message-send-file-area > section > a:last-child > article {
            border: none;
        }

        .message .message-content .message-send-file-area > section > a > article > i {
            font-size: 18px;
            padding: 7px;
            background-color: #00245d;
            font-weight: 100;
            color: #fff;
            line-height: 1;
            border-radius: 50px;
            margin-right: 8px;
        }
/*#endregion --------------- Chats Content --------------- */

/*#region --------------- Chats Footer --------------- */
.chat-footer {
    position: relative;
    background-color: #EFF0F1;
    min-height: 56px;
    padding: 8px 16px;
    display: flex;
    /*align-items: center;*/
    flex-flow: column;
}

.chat-input-area {
    display: flex;
    position: relative;
    width: 100%;
}

.emojionearea {
    height: 40px;
    border-radius: 100px;
    border: none !important;
}

    .emojionearea .emojionearea-editor {
        padding: 10px 16px !important;
        border-radius: 50px !important;
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 400;
        font-size: 14px;
        line-height: 20px;
        display: flex;
        height: 40px !important;
        align-items: center;
        letter-spacing: 0.25px;
        color: #00245D;
        padding-right: 67px !important;
        user-select: text;
        white-space: pre-wrap;
        word-break: break-word;
    }

        .emojionearea .emojionearea-editor:focus {
            box-shadow: 0px 0px 0px 2px #00245d !important;
            padding-right: 67px !important;
            user-select: text;
            white-space: pre-wrap;
            word-break: break-word;
        }

.send-message {
    display: flex;
    padding: 10px 10px;
    background-color: #00245D;
    margin-left: 8px;
    color: #fff;
    border-radius: 100px;
}

    .send-message > i {
        font-size: 21px;
    }

.chat-file-dropdown-item {
    position: absolute;
    right: 65px;
    top: 10px;
    z-index: 3;
}

    .chat-file-dropdown-item > button {
        display: flex;
        cursor: pointer;
    }

        .chat-file-dropdown-item > button > i {
            font-size: 20px;
            color: #A7A8A9;
        }


        .chat-file-dropdown-item > button:after {
            display: none;
        }

/*.chat-file-dropdown-item-menu.show {
    transform: translate3d(-175px, -125px, 0px) !important;
    width: 200px;
}*/

.chat-file-dropdown-item-menu {
    border: none;
    box-shadow: 0px 4px 4px rgb(0 0 0 / 10%);
    padding: 8px;
}

    .chat-file-dropdown-item-menu > label {
        padding: 0px 18px 0px 17px;
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 400;
        font-size: 15px;
        line-height: 22px;
        height: 48px;
        letter-spacing: 0.5px;
        text-decoration: none;
        cursor: pointer;
        color: #001941;
        display: flex;
        align-items: center;
    }

        .chat-file-dropdown-item-menu > label > i {
            font-size: 18px;
            vertical-align: sub;
            margin-right: 10px;
        }

.emojionearea .emojionearea-button {
    right: 40px !important;
    top: 7px !important;
    color: #A7A8A9;
}

    .emojionearea .emojionearea-button > div.emojionearea-button-open {
        background: none;
    }

        .emojionearea .emojionearea-button > div.emojionearea-button-open:before {
            content: "\EC90";
            font-family: 'remixicon';
            font-size: 19px;
        }

    .emojionearea .emojionearea-button > div.emojionearea-button-close {
        background: none;
    }

        .emojionearea .emojionearea-button > div.emojionearea-button-close:before {
            content: "\EB99";
            font-size: 19px;
            font-family: 'remixicon';
        }

/*#endregion --------------- Chats Footer --------------- */

/*#region --------------- Chats File Area --------------- */

.error-file-area {
    width: 100%;
    background: #E6E9EF;
    top: 0;
    border-radius: 4px;
    padding: 16px;
    height: 133px;
    display: flex;
    flex-flow: column;
    margin-bottom: 16px;
    justify-content: center;
}

    .error-file-area > article {
        display: flex;
        align-items: center;
        margin-bottom: 16px;
        justify-content: space-between;
    }

        .error-file-area > article > span {
            font-style: normal;
            font-weight: 500;
            font-size: 13px;
            padding-right: 30px;
            line-height: 16px;
            display: flex;
            align-items: center;
            word-break: break-all;
            letter-spacing: 0.25px;
            color: #364153;
        }

        .error-file-area > article > i {
            font-size: 28px;
            color: #FD4B50;
        }

    .error-file-area > abbr {
        font-weight: 400;
        font-size: 9px;
        line-height: 14px;
        display: flex;
        align-items: center;
        letter-spacing: 0.25px;
        color: #364153;
    }



.chat-selected-file-area {
    max-height: 196px;
    overflow-y: scroll;
}

    .chat-selected-file-area::-webkit-scrollbar-track {
        border-radius: 0px;
        background-color: #fff;
    }

    .chat-selected-file-area::-webkit-scrollbar {
        width: 3px;
        background-color: #fff;
    }

    .chat-selected-file-area::-webkit-scrollbar-thumb {
        border-radius: 24px;
        background-color: #34c5f3;
    }

    .chat-selected-file-area > div {
        padding: 0px 5px;
        height: 200px;
    }

        .chat-selected-file-area > div > section {
            padding: 8px;
            background-color: #fff;
            align-items: center;
            display: flex;
            width: 100%;
            flex-flow: column;
            border-radius: 8px;
        }



            .chat-selected-file-area > div > section > article {
                width: 100%;
            }

                .chat-selected-file-area > div > section > article > a {
                    display: flex;
                    font-family: 'DM Sans';
                    font-style: normal;
                    font-weight: 400;
                    font-size: 14px;
                    line-height: 20px;
                    display: flex;
                    align-items: center;
                    letter-spacing: 0.25px;
                    text-decoration: none;
                    color: #364153;
                }

                    .chat-selected-file-area > div > section > article > a > i {
                        margin-right: 10px;
                        font-size: 21px;
                    }



.chat-selected-folders .selected-img > img {
    width: 100%;
    /*margin-bottom: 18px;
    padding-bottom: 10px;*/
    border-radius: 4px;
}



.selected-document {
    width: 100%;
    background: #E6E9EF;
    border-radius: 4px;
    padding: 16px;
    height: 133px;
    display: flex;
    flex-flow: column;
    justify-content: center;
    margin-bottom: 18px;
}

    .selected-document > article {
        display: flex;
        align-items: center;
        margin-bottom: 16px;
        justify-content: start;
    }

        .selected-document > article > span {
            font-style: normal;
            font-weight: 500;
            font-size: 13px;
            padding-left: 10px;
            word-break: break-all;
            line-height: 16px;
            display: flex;
            align-items: center;
            letter-spacing: 0.25px;
            color: #364153;
        }

        .selected-document > article > i {
            font-size: 28px;
            color: #34C5F3;
        }

    .selected-document > abbr {
        font-weight: 400;
        font-size: 9px;
        line-height: 14px;
        display: flex;
        align-items: center;
        letter-spacing: 0.25px;
        color: #364153;
    }

/*#endregion --------------- Chats File Area --------------- */

/*#region --------------- Spam Mesage --------------- */
.message-spam-message {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-flow: column;
    height: 200px;
}

    .message-spam-message > p {
        text-align: center !important;
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 500;
        font-size: 16px;
        line-height: 20px;
        justify-content: center;
        width: 100%;
        display: flex;
        align-items: center;
        letter-spacing: 0.25px;
        font-feature-settings: 'liga' off;
        color: #364153;
        margin-bottom: 16px;
    }

    .message-spam-message > section > a {
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 24px;
        letter-spacing: 0.5px;
        color: #00245D;
        padding: 8px 14px;
        border: 1px solid #002155;
        border-radius: 8px;
        margin: 0px 4px;
    }

        .message-spam-message > section > a.block-btn {
            background: #00245D;
            color: #fff;
            border: none;
        }

/*#endregion --------------- Spam Mesage --------------- */

/*#region --------------- Archive Mesage --------------- */
.message-archive-message {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-flow: column;
    height: 200px;
}

    .message-archive-message > p {
        text-align: center !important;
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 500;
        font-size: 16px;
        line-height: 20px;
        justify-content: center;
        width: 100%;
        display: flex;
        align-items: center;
        letter-spacing: 0.25px;
        font-feature-settings: 'liga' off;
        color: #364153;
        margin-bottom: 16px;
    }

    .message-archive-message > section > a {
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 24px;
        letter-spacing: 0.5px;
        padding: 8px 14px;
        border-radius: 8px;
        margin: 0px 4px;
        background: #00245D;
        color: #fff
    }
/*#endregion --------------- Archive Mesage --------------- */

/*#region --------------- Unblock Mesage --------------- */

.message-unblock-message {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-flow: column;
    height: 200px;
}

    .message-unblock-message > p {
        text-align: center !important;
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 500;
        font-size: 16px;
        line-height: 20px;
        justify-content: center;
        width: 100%;
        display: flex;
        align-items: center;
        letter-spacing: 0.25px;
        font-feature-settings: 'liga' off;
        color: #364153;
        margin-bottom: 16px;
    }

    .message-unblock-message > section > a {
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 24px;
        letter-spacing: 0.5px;
        padding: 8px 14px;
        border-radius: 8px;
        margin: 0px 4px;
        background: #00245D;
        color: #fff
    }
/*#endregion --------------- Unblock Mesage --------------- */

/*#region --------------- Chat Membership Packet Mesage --------------- */

.insufficient-membership-package {
    display: flex;
    height: 100%;
    align-items: center;
    margin-top: 70px;
}

    .insufficient-membership-package > section {
        background: #FFF2E5;
        border-radius: 8px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-flow: column;
        padding: 40px;
        margin: 0px 91px;
        position: relative;
    }

        .insufficient-membership-package > section > img {
            position: absolute;
            top: -65px;
        }


        .insufficient-membership-package > section > strong {
            font-family: 'Roboto';
            font-style: normal;
            font-weight: 700;
            font-size: 20px;
            line-height: 20px;
            display: flex;
            align-items: center;
            text-align: center;
            letter-spacing: 0.25px;
            font-feature-settings: 'liga' off;
            color: #364153;
            margin-bottom: 40px;
            margin-top: 37px;
        }

        .insufficient-membership-package > section > p {
            font-family: 'Roboto';
            font-style: normal;
            font-weight: 500;
            font-size: 16px;
            line-height: 24px;
            display: flex;
            align-items: center;
            text-align: center;
            letter-spacing: 0.25px;
            font-feature-settings: 'liga' off;
            color: #364153;
            margin-bottom: 40px;
        }

        .insufficient-membership-package > section > a {
            font-style: normal;
            font-weight: 400;
            font-size: 18px;
            line-height: 24px;
            letter-spacing: 0.5px;
            color: #002155;
            text-decoration: none;
            padding: 16px 22px;
            background: #FFBE7D;
            border-radius: 8px;
        }

/*#endregion --------------- Chat Membership Packet Mesage --------------- */

/*#region --------------- Chat Message Faild To Load --------------- */

.message-failed-to-load {
    display: flex;
    height: 100%;
    align-items: center;
}

    .message-failed-to-load > section {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-flow: column;
        padding: 40px;
        margin: 0px 91px;
        width: 100%;
    }

        .message-failed-to-load > section > img {
            margin-bottom: 15px;
        }

        .message-failed-to-load > section > strong {
            font-family: 'Roboto';
            font-style: normal;
            font-weight: 400;
            font-size: 24px;
            line-height: 34px;
            text-align: center;
            letter-spacing: 0.5px;
            font-feature-settings: 'liga' off;
            color: #000000;
            margin-bottom: 5px;
        }

        .message-failed-to-load > section > p {
            font-family: 'Roboto';
            font-style: normal;
            font-weight: 400;
            font-size: 16px;
            line-height: 24px;
            text-align: center;
            letter-spacing: 0.5px;
            font-feature-settings: 'liga' off;
            color: #000000;
            margin-bottom: 15px;
        }

        .message-failed-to-load > section > a {
            padding: 8px 14px;
            background: #00245D;
            border-radius: 8px;
            text-decoration: none;
            display: flex;
            color: #fff;
            align-items: center;
            justify-content: center;
        }

            .message-failed-to-load > section > a > i {
                margin-right: 10px;
                font-size: 21px;
            }

/*#endregion --------------- Chat Message Faild To Load --------------- */

/*#region --------------- Chat Message Request Timed Out --------------- */

.message-request-timed-out {
    display: flex;
    height: 100%;
    align-items: center;
}

    .message-request-timed-out > section {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-flow: column;
        padding: 40px;
        margin: 0px 91px;
        width: 100%;
    }

        .message-request-timed-out > section > img {
            margin-bottom: 15px;
        }

        .message-request-timed-out > section > strong {
            font-family: 'Roboto';
            font-style: normal;
            font-weight: 400;
            font-size: 24px;
            line-height: 34px;
            display: block;
            text-align: center;
            letter-spacing: 0.5px;
            font-feature-settings: 'liga' off;
            color: #000000;
            margin-bottom: 15px;
        }


        .message-request-timed-out > section > a {
            padding: 8px 14px;
            background: #FFBE7D;
            border-radius: 8px;
            text-decoration: none;
            display: flex;
            color: #002155;
            align-items: center;
            justify-content: center;
        }

            .message-request-timed-out > section > a > i {
                margin-right: 10px;
                font-size: 21px;
            }

/*#endregion --------------- Chat Message Request Timed Out --------------- */

/*#region --------------- Chat List Error --------------- */

.chat-list-error-area {
    padding: 8px;
}

    .chat-list-error-area > section {
        padding: 8px;
        padding: 16px;
        background: #EBF9FE;
        border-radius: 8px;
        display: flex;
    }

        .chat-list-error-area > section > article {
            padding-left: 16px;
            flex-flow: wrap;
            display: flex;
        }

            .chat-list-error-area > section > article > strong {
                font-family: 'Roboto';
                font-style: normal;
                font-weight: 500;
                font-size: 14px;
                line-height: 24px;
                letter-spacing: 0.5px;
                font-feature-settings: 'liga' off;
                color: #000000;
                margin-bottom: 4px;
            }

            .chat-list-error-area > section > article > span {
                font-family: 'Roboto';
                font-style: normal;
                font-weight: 400;
                font-size: 12px;
                width: 100%;
                line-height: 20px;
                letter-spacing: 0.5px;
                font-feature-settings: 'liga' off;
                color: #000000;
                margin-bottom: 10px;
            }

            .chat-list-error-area > section > article > a {
                background: #00245D;
                border-radius: 1000px;
                padding: 2px 7px;
                color: #fff;
                display: flex;
                text-decoration: none;
                align-items: center;
            }

                .chat-list-error-area > section > article > a > i {
                    margin-right: 6px;
                    font-size: 20px;
                }
/*#endregion --------------- Chat List Error --------------- */

/*#region --------------- Chat List Request Time Out --------------- */

.chat-list-request-time-out-area {
    padding: 8px;
}

    .chat-list-request-time-out-area > section {
        padding: 8px;
        padding: 16px;
        background: #FFEBD7;
        border-radius: 8px;
        display: flex;
    }

        .chat-list-request-time-out-area > section > article {
            padding-left: 16px;
            flex-flow: wrap;
            display: flex;
        }

            .chat-list-request-time-out-area > section > article > strong {
                font-family: 'Roboto';
                font-style: normal;
                font-weight: 500;
                font-size: 14px;
                line-height: 24px;
                letter-spacing: 0.5px;
                font-feature-settings: 'liga' off;
                color: #000000;
                width: 100%;
                margin-bottom: 10px;
            }

            .chat-list-request-time-out-area > section > article > a {
                background: #FFBE7D;
                border-radius: 1000px;
                padding: 2px 7px;
                color: #002155;
                display: flex;
                text-decoration: none;
                align-items: center;
            }

                .chat-list-request-time-out-area > section > article > a > i {
                    margin-right: 6px;
                    font-size: 20px;
                }
/*#endregion --------------- Chat List Request Time Out --------------- */

/*#region --------------- Chat List İtem Not Fount --------------- */

.chat-list-item-not-found {
    padding: 8px;
}

    .chat-list-item-not-found > section {
        padding: 8px;
        padding: 16px;
        background: #EBF9FE;
        border-radius: 8px;
        display: flex;
    }

        .chat-list-item-not-found > section > article {
            padding-left: 16px;
            flex-flow: wrap;
            display: flex;
            align-items: center;
        }

            .chat-list-item-not-found > section > article > strong {
                font-family: 'Roboto';
                font-style: normal;
                font-weight: 500;
                font-size: 14px;
                line-height: 24px;
                letter-spacing: 0.5px;
                font-feature-settings: 'liga' off;
                color: #000000;
                width: 100%;
                margin-bottom: 10px;
            }



/*#endregion --------------- Chat List Request Time Out --------------- */


/*#region --------------- Chat İnfo --------------- */

.chat-info::-webkit-scrollbar-track {
    border-radius: 0px;
    background-color: transparent;
}

.chat-info::-webkit-scrollbar {
    width: 0px;
    background-color: transparent;
}

.chat-info::-webkit-scrollbar-thumb {
    border-radius: 0px;
    background-color: transparent;
}

.chat-info {
    background: #FDFDFD;
    box-shadow: -4px 0px 4px rgb(0 0 0 / 5%);
    border-radius: 0px;
    padding-top: 56px;
    overflow: hidden;
    width: 0;
    height: 100%;
    overflow-y: scroll;
    z-index: 6;
    position: absolute;
    right: 0;
}

.chat-info-wrapper {
    display: flex;
    justify-content: space-between;
    flex-flow: column;
}

.close-chat-info-btn-area {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

    .close-chat-info-btn-area > a {
        line-height: 0;
        padding: 15px;
        color: #00245D;
        transition: background-color .5s;
    }

        .close-chat-info-btn-area > a:hover {
            background-color: #e6e9ef;
        }

        .close-chat-info-btn-area > a > i {
            font-size: 19px;
        }


.chat-info-header {
    padding: 0px 25px 35px 25px;
}

    .chat-info-header > section {
        width: 80px;
        height: 80px;
        background-color: #EBF9FE;
        color: #546C92;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 16px !important;
        text-align: center;
        border-radius: 100px;
        margin: 0 auto;
        border-radius: 50%;
        overflow: hidden;
    }

        .chat-info-header > section > img {
            object-fit: contain;
            object-position: center;
            min-width: 100%;
            min-height: 100%;
        }

    .chat-info-header > h4 {
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 700;
        font-size: 22px;
        line-height: 28px;
        text-align: center;
        color: #001941;
        word-break: break-all;
        margin-bottom: 5px;
    }

    .chat-info-header > article {
        display: block;
        text-align: center;
    }

        .chat-info-header > article > a {
            text-decoration: none;
            color: #00245D;
        }

            .chat-info-header > article > a i {
                font-size: 17px;
            }






.chat-info-main {
    display: flex;
    flex-flow: column;
    padding: 0px 25px 0px 25px;
}

    .chat-info-main > section {
        display: flex;
        flex-flow: column;
        min-height: 48px;
        border-bottom: 1px solid rgb(0 0 0 / 5%);
        padding: 6px 0px;
        margin-bottom: 16px;
    }

        .chat-info-main > section > span {
            font-family: 'Roboto';
            font-style: normal;
            font-weight: 400;
            font-size: 16px;
            line-height: 16px;
            letter-spacing: 0.5px;
            font-feature-settings: 'liga' off;
            color: #546C92;
        }

        .chat-info-main > section > strong {
            font-family: 'Roboto';
            font-style: normal;
            font-weight: 600;
            font-size: 14px;
            word-break: break-all;
            line-height: 20px;
            letter-spacing: 0.1px;
            font-feature-settings: 'liga' off;
            color: #00245D;
        }



.chat-info-send-file-preview-area {
    padding-top: 32px;
    padding-bottom: 50px;
}

    .chat-info-send-file-preview-area > section {
        display: flex;
        align-items: center;
        width: 100%;
        justify-content: space-between;
        cursor: pointer;
    }

        .chat-info-send-file-preview-area > section > i {
            color: #00245D;
            font-size: 20px;
        }

        .chat-info-send-file-preview-area > section > article {
            display: flex;
            padding-left: 25px;
            flex-flow: column;
            margin-right: auto;
        }

            .chat-info-send-file-preview-area > section > article > span {
                font-family: 'Roboto';
                font-style: normal;
                font-weight: 400;
                font-size: 16px;
                line-height: 16px;
                /* identical to box height, or 100% */

                letter-spacing: 0.5px;
                font-feature-settings: 'liga' off;
                /* Black */

                color: #001941;
            }

            .chat-info-send-file-preview-area > section > article > abbr {
                font-family: 'Roboto';
                font-style: normal;
                font-weight: 600;
                font-size: 14px;
                line-height: 20px;
                /* identical to box height, or 143% */

                letter-spacing: 0.1px;
                font-feature-settings: 'liga' off;
                /* Forie/primary/primary-blue-500 */

                color: #00245D;
            }

.chat-info-foter {
    padding: 102px 20px 20px 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .chat-info-foter > a {
        display: flex;
        align-items: center;
        font-style: normal;
        text-decoration: none;
        font-weight: 400;
        font-size: 14px;
        line-height: 20px;
        display: flex;
        align-items: center;
        letter-spacing: 0.25px;
        color: #00245D;
    }

        .chat-info-foter > a > i {
            font-size: 21px;
            margin-right: 10px;
        }





/*#endregion --------------- Chat İnfo --------------- */

/*#region --------------- Chat File Info --------------- */
.chat-files-info {
    background: #FDFDFD;
    box-shadow: -4px 0px 4px rgb(0 0 0 / 5%);
    border-radius: 0px;
    padding-top: 56px;
    overflow: hidden;
    width: 0;
    height: 100%;
    overflow-y: scroll;
    z-index: 6;
    position: absolute;
    right: 0;
}

.chat-files-info-header {
    padding: 12px 15px;
    background: #EBF9FE;
}

    .chat-files-info-header > a {
        display: flex;
        align-items: center;
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 700;
        font-size: 16px;
        line-height: 24px;
        text-decoration: none !important;
        letter-spacing: 0.1px;
        font-feature-settings: 'liga' off;
        color: #001941;
        margin-bottom: 16px;
    }

        .chat-files-info-header > a > i {
            font-size: 20px;
            margin-right: 15px;
        }


    .chat-files-info-header > ul > li > a {
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 400;
        font-size: 14px;
        line-height: 20px;
        text-align: center;
        letter-spacing: 0.25px;
        font-feature-settings: 'liga' off;
        color: #001941 !important;
        border-radius: 8px !important;
    }

        .chat-files-info-header > ul > li > a.active {
            background-color: #00245D !important;
            color: #EBF9FE !important;
        }





#chat-files-summary-area > div {
    padding: 16px;
    height: calc(100vh - 303px);
    overflow-y: scroll !important;
    overflow: hidden;
}


    #chat-files-summary-area > div::-webkit-scrollbar-track {
        border-radius: 0px;
        background-color: #fff;
    }

    #chat-files-summary-area > div::-webkit-scrollbar {
        width: 3px;
        background-color: #fff;
    }

    #chat-files-summary-area > div::-webkit-scrollbar-thumb {
        border-radius: 24px;
        background-color: #34c5f3;
    }

#chat_media_tab > section > div {
    width: 100%;
    height: 80px;
    padding: 4.5px;
    border-radius: 4px;
}

    #chat_media_tab > section > div > a {
        display: flex;
        align-items: center;
        justify-content: center;
    }

        #chat_media_tab > section > div > a > img {
            width: 100%;
            height: 70px;
        }



.chat-documents-item {
    padding: 8px 16px;
    margin-bottom: 7px;
}

    .chat-documents-item > abbr {
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 600;
        font-size: 11px;
        line-height: 16px;
        letter-spacing: 0.5px;
        color: #78808C;
    }

    .chat-documents-item > section {
        background: linear-gradient(0deg, rgba(230, 233, 239, 0.5), rgba(230, 233, 239, 0.5)), #FFFFFF;
        border-radius: 4px;
        padding: 8px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 10px;
    }

        .chat-documents-item > section > img {
            width: 27px;
            height: 32px;
        }

        .chat-documents-item > section article {
            display: flex;
            margin: 0 auto;
            flex-flow: column;
            padding-left: 10px;
            margin-left: 0;
        }

            .chat-documents-item > section article > strong {
                font-family: 'Roboto';
                font-style: normal;
                font-weight: 600;
                font-size: 14px;
                line-height: 20px;
                display: flex;
                align-items: center;
                letter-spacing: 0.1px;
                font-feature-settings: 'liga' off;
                color: #000F27;
                max-width: 160px;
                text-align: left;
                overflow: hidden;
                white-space: nowrap;
                display: block;
                text-overflow: ellipsis;
            }

            .chat-documents-item > section article > span {
                font-family: 'Roboto';
                font-style: normal;
                font-weight: 400;
                font-size: 12px;
                line-height: 16px;
                display: flex;
                align-items: center;
                letter-spacing: 0.4px;
                font-feature-settings: 'liga' off;
                color: #636364;
            }

        .chat-documents-item > section > a {
            text-decoration: none;
            color: #00245D;
        }






.chat-links-item {
    padding: 8px 16px;
    margin-bottom: 15px;
    border-radius: 8px;
    position: relative;
}

    .chat-links-item.against:before {
        position: absolute;
        content: "";
        border-top: 7px solid;
        border-right: 7px solid transparent;
        border-bottom: 0;
        border-left: 7px solid transparent;
        top: 0;
        left: -6px;
        color: #e6e9ef;
    }

    .chat-links-item.against {
        background-color: #E6E9EF;
    }

    .chat-links-item > a {
        text-decoration: none;
    }

        .chat-links-item > a > strong {
            font-family: 'Roboto';
            font-style: normal;
            font-weight: 600;
            font-size: 14px;
            line-height: 20px;
            display: flex;
            align-items: center;
            letter-spacing: 0.1px;
            font-feature-settings: 'liga' off;
            color: #00245D;
            max-width: 278px;
            text-align: left;
            overflow: hidden;
            white-space: nowrap;
            display: block;
            text-overflow: ellipsis;
        }

        .chat-links-item > a > span {
            font-family: 'Roboto';
            font-style: normal;
            font-weight: 400;
            font-size: 14px;
            line-height: 20px;
            display: flex;
            align-items: center;
            letter-spacing: 0.25px;
            font-feature-settings: 'liga' off;
            color: #001941;
            max-width: 278px;
            text-align: left;
            overflow: hidden;
            white-space: nowrap;
            display: block;
            text-overflow: ellipsis;
        }

        .chat-links-item > a > abbr {
            font-family: 'Roboto';
            font-style: normal;
            font-weight: 600;
            font-size: 11px;
            line-height: 16px;
            letter-spacing: 0.5px;
            color: #78808C;
            max-width: 278px;
            text-align: left;
            overflow: hidden;
            white-space: nowrap;
            display: block;
            text-overflow: ellipsis;
        }


/*#endregion --------------- Chat File Info --------------- */

/* #region ---------Forie Chat Login Modal Tasarımı---------- */
.modal-container {
    display: flex;
    align-items: center;
}

.modal-login-header {
    border-bottom: none;
    padding:30px;
    display: flex;
    justify-content: flex-end;
}

.modal-login-body {
    padding: 70px 66.5px 100px 66.5px;
}

.modal-login-buttons {
    display: flex;
}

.modal-login-text {
    padding: 0px 32px 32px 32px;
}

    .modal-login-text > p {
        font-family: "Roboto";
        font-weight: 400;
        font-size: 24px;
        line-height: 34px;
        letter-spacing: 0.5px;
        color: #000000;
        margin: 0;
    }

.modal-login-buttons {
    padding: 0px 0px 75px 32px;
}

.log-in-button {
    background-color: #00245D;
    padding: 8px 16px;
    color: #FFFFFF;
    border-radius: 8px;
    font-family: "Roboto";
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0.5px;
    border: 1px solid transparent;
    margin-right: 5px;
}

.sign-up-button {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #00245D;
    background: #E6E9EF;
    border-radius: 8px;
    padding: 8px;
    border: 1px solid transparent;
}

.close-icon {
    padding: 10px;
}

.modal-close-button.close {
    opacity: 1;
    background: #EBECEE;
    border-radius: 8px;
    padding: 0;
    margin: 0;
    line-height: 2;
    width: 56px;
    height: 56px;
}



/* #endregion ---------Forie Chat Login Modal Tasarımı---------- */

/* #region ---------Chat My Account---------- */
.my-account-left-side {
    font-family: "Roboto";
    border-right: 1px solid #EFF0F1;
    border-radius: 0px;
}

.header-text {
    font-weight: 700;
    font-family: "Roboto";
    font-size: 16px;
    line-height: 16px;
    font-style: normal;
    color: #00245D;
    margin: 0;
}

.header-inner-text {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 16px;
    letter-spacing: 0.15px;
    color: #546C92;
    margin: 0;
    font-family: "Roboto";
}

.letter {
    width: 80px;
    height: 40px;
    font-style: normal;
    font-weight: 600;
    font-size: 28px;
    line-height: 40px;
    text-align: center;
    letter-spacing: 0.2px;
    font-feature-settings: 'liga' off;
    color: #546C92;
}

.user-letters {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 0px;
    position: absolute;
    width: 80px;
    height: 80px;
    left: calc(50% - 80px/2 + 0.5px);
    top: -40px;
    background: #EBF9FE;
    border-radius: 200px;
}

.my-acc-user-details {
    padding-top: 60px;
    isolation: isolate;
    background: rgba(230, 239, 255, 0.3);
    border-radius: 24px;
    margin-top: 140px;
    position: relative;
    display: flex;
    flex-direction: column;
    margin-left: 23.6px;
    margin-right: 23px;
    margin-bottom: 50px;
}

.my-acc-user-info {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-radius: 24px;
    margin-bottom: 40px;
}

    .my-acc-user-info .user-letters {
        font-size: 28px;
        font-weight: 600;
        line-height: 40px;
        letter-spacing: 0.2px;
        color: #546C92
    }

    .my-acc-user-info .my-account-user-name {
        font-style: normal;
        font-weight: 700;
        font-size: 22px;
        line-height: 28px;
        text-align: center;
        padding: 0px 20px;
        padding-bottom: 5px;
    }

    .my-acc-user-info > abbr > a {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 6px 16px;
        border: 1px solid;
        color: #00245d;
        display: none;
        border-radius: 5px;
        font-size: 15px;
    }

        .my-acc-user-info > abbr > a > i {
            font-size: 18px;
            margin-right: 5px;
        }

    .my-acc-user-info .user-mail {
        font-style: normal;
        font-weight: 600;
        font-size: 12px;
        line-height: 16px;
        text-align: center;
        letter-spacing: 0.5px;
        font-feature-settings: 'liga' off;
        color: #8A9AB4
    }

.company-and-user-information {
    display: flex;
    align-items: center;
    padding: 13px 25px;
    gap: 5px;
    isolation: isolate;
    align-items: flex-start;
}

.my-acc-user-details i {
    font-size: 25.67px;
}

.padding-i {
    padding-right: 25.67px;
}

.my-acc-right-side-header {
    border-bottom: 1px solid #DFE5EE;
    border-radius: 0px;
    padding: 11px 16px;
    display: flex;
    align-items: center;
}

.my-acc-left-side-header {
    border-bottom: 1px solid #DFE5EE;
    border-radius: 0px;
    padding: 11px 16px;
}

.my-acc-right-side-header > a {
    font-size: 20px;
    line-height: 0.5;
    color: #00245d;
    padding: 10px;
    display: none;
}

.title {
    font-size: 16px;
    line-height: 16px;
    letter-spacing: 0.5px;
    font-weight: 400;
    color: #546C92;
    margin: 0;
}

.inner-title {
    font-style: normal;
    font-weight: 600;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0.1px;
    font-feature-settings: 'liga' off;
    color: #00245D;
    margin: 0;
}

.settings-property {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 24px 0px 24px 24px;
    border-bottom: 1px solid #EFF0F1;
    height: 88px;
    gap: 24px
}

.settings-area {
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100%;
    padding: 50px 0px;
}

.user-settings {
    width: 50%;
}

.settings-title {
    font-style: normal;
    font-family: "Roboto";
    font-weight: 700;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0.1px;
    font-feature-settings: 'liga' off;
    color: #000000;
}

.settings-text {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0.5px;
    font-feature-settings: 'liga' off;
    color: #001941;
    margin: auto 0;
}

.pb-8 {
    padding-bottom: 8px;
}

.pb-12 {
    padding-bottom: 12px;
}

.pt-24 {
    padding-top: 24px;
}

.mt-45 {
    margin-top: 45px;
}

.my-account-right-side .settings-area input[type="checkbox"] {
    position: relative;
    min-width: 45px;
    height: 23px;
    -webkit-appearance: none;
    border: 1px solid #B0BBCD;
    background: #E6E9EF;
    outline: none;
    border-radius: 20px;
    cursor: pointer;
    /* box-shadow: inset 0 0 5px rgb(255 0 0 / 20%); */
    transition: 0.7s;
}

.my-account-right-side .settings-area input:checked[type="checkbox"] {
    background: #50B04D;
    border: none;
}

.my-account-right-side .settings-area input[type="checkbox"]:before {
    content: '';
    position: absolute;
    width: 13px;
    height: 13px;
    border-radius: 20px;
    top: 4px;
    left: 4px;
    background: #B0BBCD;
    transform: scale(1.1);
    /* box-shadow: 0 2px 5px rgb(0 0 0 / 20%); */
    transition: .5s;
}

.my-account-right-side .settings-area input:checked[type="checkbox"]:before {
    left: 24px;
    font-family: "remixicon";
    content: "\EB80";
    display: flex;
    color: #ffffff;
    align-items: center;
    background: transparent !important;
}





.refresh {
    display: flex;
    justify-content: center;
    margin: 55px 0;
}

.my-acc-right-side-title-reset {
    margin: 0;
    padding: 8px 0px;
}

.settings-property button:hover, .refresh > button:hover {
    background-color: #acbcd5 !important;
}

.my-acc-not-approved-info {
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    display: flex;
    align-items: center;
    letter-spacing: 0.25px;
    margin-bottom: 30px;
    color: #F36234;
}

    .my-acc-not-approved-info > i {
        margin-right: 8px;
        font-size: 15px;
    }

.staff-people-list-not-found {
    padding: 16px;
    background: #FEEFEB;
    border-radius: 8px;
    display: flex;
    margin-top: 16px;
}


    .staff-people-list-not-found > span {
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 400;
        font-size: 14px;
        line-height: 20px;
        display: flex;
        margin-left: 15px;
        align-items: center;
        letter-spacing: 0.5px;
        font-feature-settings: 'liga' off;
        color: #000000;
    }

.why-should-update-my-information {
    background: linear-gradient(60deg, #F3F3F3 13.4%, #C9F5FC 86.6%);
    border-radius: 8px;
    padding: 40px;
    margin: 32px;
    width: 93%;
}

    .why-should-update-my-information > strong {
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 400;
        font-size: 24px;
        line-height: 28px;
        letter-spacing: 0.1px;
        color: #000000;
        margin-bottom: 8px;
        display: block;
    }

    .why-should-update-my-information ul {
        padding-left: 25px;
    }

        .why-should-update-my-information ul li > span {
            font-family: 'Roboto';
            font-style: normal;
            font-weight: 400;
            font-size: 16px;
            line-height: 32px;
            letter-spacing: 0.1px;
            font-feature-settings: 'liga' off;
            display: block;
            color: #000000;
        }

    .why-should-update-my-information > article {
        margin-top: 32px;
        display: flex;
        align-items: center;
        justify-content: flex-end;
    }

        .why-should-update-my-information > article > a {
            padding: 8px 14px;
            color: #fff;
            background-color: #00245D;
            font-family: 'DM Sans';
            font-style: normal;
            font-weight: 400;
            font-size: 16px;
            line-height: 24px;
            letter-spacing: 0.5px;
            border-radius: 8px;
        }

/*#endregion -------- Chat My Account -------   */

/*#region ------- Forie Chat Start New Chat Modal--------*/
.modal-new-chat-content {
    width: 600px;
}

.listed-companies {
    height: 60vh;
    overflow: auto;
}

    .listed-companies::-webkit-scrollbar {
        width: 2px
    }

    .listed-companies::-webkit-scrollbar-track {
        background: white;
    }

    .listed-companies::-webkit-scrollbar-thumb {
        background: #8A9AB4;
        border-radius: 4px;
    }

.modal-new-chat-content p {
    margin: 0;
}

.modal-new-chat-content i {
    cursor: pointer;
}

.listed-companies .flag-icon {
    width: 17px;
    height: 12px;
}

.start-new-chat-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #001941;
}

    .start-new-chat-header > p {
        font-family: "Roboto";
        font-weight: 700;
        font-size: 22px;
        line-height: 28px;
        color: #000000;
        padding: 10px 0px 10px 16px;
    }

.start-new-chat-search-area {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 0px 20px 16px;
}

.search-input {
    padding: 10px 0px 10px 16px;
    background: #ffffff;
    border: 2px solid #E6E9EF;
    border-radius: 100px;
    width: 90%;
}

    .search-input::placeholder {
        font-family: "Roboto";
        font-style: normal;
        font-weight: 400;
        font-size: 14px;
        line-height: 20px;
        color: #001941;
        letter-spacing: 0.25px;
    }

.search-company-list-item {
    display: flex;
    gap: 8px;
    padding: 28px 16px 28px 16px;
    width: 100%;
    border-bottom: 1px solid #EFF0F1;
}

.search-company-user-input {
    display: flex;
    gap: 8px;
    padding: 28px 16px 28px 16px;
}

.modal-new-chat-content a {
    text-decoration: none;
}

.search-user-name {
    display: flex;
    flex-direction: column;
    cursor: pointer;
    width: 100%;
}

    .search-user-name > p {
        font-family: "Roboto";
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 24px;
        letter-spacing: 0.5px;
        color: #001941;
        margin-bottom: 3px;
    }

.user-name-and-country {
    display: flex;
    justify-content: space-between;
    flex: 1;
    align-items: center;
    padding-left: 8px;
}

.chat-user-logo {
    width: 40px;
    height: 40px;
    border-radius: 100px;
    background: #8a9ab4;
    display: flex;
    justify-content: center;
    align-items: center;
}

    .chat-user-logo > img {
        width: 40px;
        height: 40px;
        object-fit: contain;
        border-radius: 50%;
        background-color: #fff;
    }

.user-country-flag-and-name {
    display: flex;
    align-items: center;
    gap: 4px;
}

    .user-country-flag-and-name > span {
        font-family: "Roboto";
        font-style: normal;
        font-weight: 600;
        font-size: 12px;
        line-height: 16px;
        letter-spacing: 0.5px;
        color: #001941
    }

.color-white {
    color: #E6E9EF;
}

.search-company-list-item:hover {
    background: #f5f8fd;
}

.p-48 {
    padding: 48px;
}
/*#endregion ------- Forie Chat Start New Chat Modal--------*/

/*#region --------Forie Chat Couldn't Load Contact List Modal--------*/

.contact-load-fail {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding-top: 32px;
}

    .contact-load-fail img {
        margin-top: 10px;
    }

.error-title {
    font-family: "Roboto";
    font-weight: 400;
    font-size: 24px;
    line-height: 34px;
    letter-spacing: 0.5px;
    color: #000000;
    width: 100%;
    padding: 16px 0px;
    margin-top: 10px;
}

.error-description {
    font-family: "Roboto";
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0.5px;
    color: #000000;
    width: 100%;
    padding: 6px;
}

.try-again-button {
    display: flex;
    align-items: center;
    padding: 8px 16px;
    background: #00245d;
    border-radius: 8px;
    margin-top: 16px;
    border: 1px solid transparent;
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
    color: #ffffff;
    font-style: normal;
    font-family: "Roboto";
    margin-bottom: 30px;
}
/*#endregion --------Forie Chat Couldn't Load Contact List Modal--------*/

/*#region ------Forie Chat Request Time Out Modal------ */
.request-timeout-modal {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding-top: 32px;
}

.bg-request-timeout-try-again {
    background: #FFBE7D !important;
    color: #002155 !important;
}

/*#endregion ------Forie Chat Request Time Out Modal------ */

/*#region -------Forie Chat Request Time Out Yedek Modal--------*/
.request-timeout-reserve {
    display: flex;
    align-items: center;
    background: #FFEBD7;
    border-radius: 8px;
    padding: 16px;
}

.request-timeout-text {
    flex: 1;
}

.request-timeout-reserve img, .load-contact-fail-reserve img {
    width: 80px;
    padding-right: 16px;
}

.reserve-modal-again-button {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    display: flex;
    align-items: center;
    letter-spacing: 0.25px;
    color: #002155;
    background: #FFBE7D;
    border-radius: 1000px;
    border: 1px solid transparent;
}

.request-timeout-error-title {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0.5px;
    font-feature-settings: 'liga' off;
    color: #000000;
    margin-bottom: 10px !important;
}

/*#endregion -------Forie Chat Request Time Out Yedek Modal--------*/

/*#region ------Forie Chat Couldn't Load Contact Yedek Modal------*/
.bg-again-button {
    color: #ffffff !important;
    background: #00245d !important;
    padding: 2px 8px;
}

.load-contact-fail-reserve {
    display: flex;
    align-items: center;
    background: #EBF9FE;
    border-radius: 8px;
    padding: 16px;
}

.load-contact-fail-error-title {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0.5px;
    font-feature-settings: 'liga' off;
    color: #000000;
}

.reserve-modal-again-button > i {
    font-size: 18px;
}

.load-contact-fail-error-desc {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 20px;
    letter-spacing: 0.5px;
    font-feature-settings: 'liga' off;
    color: #000000;
    padding-bottom: 6px;
}


/*#endregion */

/*#region ------ Sending Messages Other Companies ------*/

.sending-messages-other-companies {
    display: flex;
    margin-right: auto;
    padding: 15px 0px;
}

    .sending-messages-other-companies > abbr {
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 500;
        font-size: 16px;
        line-height: 20px;
        display: flex;
        align-items: center;
        margin-left: 10px;
        letter-spacing: 0.25px;
        font-feature-settings: 'liga' off;
        color: #364153;
    }


    .sending-messages-other-companies > article input[type="checkbox"] {
        position: relative;
        width: 45px;
        height: 23px;
        -webkit-appearance: none;
        border: 1px solid #B0BBCD;
        background: #E6E9EF;
        outline: none;
        border-radius: 20px;
        cursor: pointer;
        /* box-shadow: inset 0 0 5px rgb(255 0 0 / 20%); */
        transition: 0.7s;
    }

    .sending-messages-other-companies > article input:checked[type="checkbox"] {
        background: #50B04D;
        border: none;
    }

    .sending-messages-other-companies > article input[type="checkbox"]:before {
        content: '';
        position: absolute;
        width: 13px;
        height: 13px;
        border-radius: 20px;
        top: 4px;
        left: 4px;
        background: #B0BBCD;
        transform: scale(1.1);
        /* box-shadow: 0 2px 5px rgb(0 0 0 / 20%); */
        transition: .5s;
    }

    .sending-messages-other-companies > article input:checked[type="checkbox"]:before {
        left: 24px;
        font-family: "remixicon";
        content: "\EB80";
        display: flex;
        color: #ffffff;
        align-items: center;
        background: transparent !important;
    }

/*#endregion ------ Sending Messages Other Companies ------*/

/*#region --------- Three To End Encrypted Message ------*/

.three-to-end-encrypted-message {
    display: flex;
    align-items: center;
    background: linear-gradient(60deg, #F3F3F3 13.4%, #C9F5FC 86.6%);
    border-radius: 8px;
    padding: 16px 110px 16px 40px;
    margin-bottom: 15px;
}

    .three-to-end-encrypted-message > span {
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 400;
        font-size: 12px;
        line-height: 16px;
        margin-left: 20px;
        letter-spacing: 0.5px;
        color: #000000;
    }

/*#endregion --------- Three To End Encrypted Message ------*/

/*#region --------- Unverified Company Message ------*/

.unverified-company-message {
    display: flex;
    align-items: center;
    background: #FEEFEB;
    justify-content: space-between;
    border-radius: 8px;
    padding: 16px 40px 16px 40px;
    margin-bottom: 15px;
}

    .unverified-company-message > span {
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 20px;
        display: flex;
        align-items: center;
        margin-right: auto;
        margin-left: 25px;
        letter-spacing: 0.5px;
        font-feature-settings: 'liga' off;
        color: #000000;
    }

    .unverified-company-message > a {
        background: #F36234;
        border-radius: 8px;
        display: flex;
        align-items: center;
        font-style: normal;
        font-weight: 400;
        font-size: 18px;
        line-height: 24px;
        padding: 10px 15px !important;
        letter-spacing: 0.5px;
        text-decoration: none;
        color: #FFFFFF;
        transition: background .5s;
    }

        .unverified-company-message > a:hover {
            background: #c5380b;
        }

        .unverified-company-message > a > i {
            font-size: 19px;
            margin-right: 10px;
        }

/*#endregion --------- Unverified Company Message ------*/

/*#region ------------- Chat Info Loading Problem ------------- */

.chat-info-loading-problem {
    display: flex;
    flex-flow: column;
    align-items: center;
    text-align: center;
    padding: 15px;
}

    .chat-info-loading-problem > img {
        margin-bottom: 16px;
    }

    .chat-info-loading-problem > strong {
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 400;
        font-size: 24px;
        line-height: 34px;
        text-align: center;
        letter-spacing: 0.5px;
        font-feature-settings: 'liga' off;
        color: #000000;
        margin-bottom: 6px;
    }

    .chat-info-loading-problem > abbr {
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        display: block;
        line-height: 24px;
        text-align: center;
        letter-spacing: 0.5px;
        font-feature-settings: 'liga' off;
        color: #000000;
        margin-bottom: 16px;
    }

    .chat-info-loading-problem > a {
        background: #00245D;
        border-radius: 8px;
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 24px;
        letter-spacing: 0.5px;
        color: #FFFFFF;
        padding: 8px 14px;
        display: flex;
        align-items: center;
    }

        .chat-info-loading-problem > a > i {
            font-size: 20px;
            margin-right: 6px;
        }



/*#endregion ------------- Chat Info Loading Problem ------------- */

/*#region ------------- Chat Info Request Time Out ------------- */

.chat-info-request-time-out {
    display: flex;
    flex-flow: column;
    align-items: center;
    text-align: center;
    padding: 15px;
}

    .chat-info-request-time-out > img {
        margin-bottom: 16px;
    }

    .chat-info-request-time-out > strong {
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 400;
        font-size: 24px;
        line-height: 34px;
        text-align: center;
        letter-spacing: 0.5px;
        font-feature-settings: 'liga' off;
        color: #000000;
        margin-bottom: 16px;
    }

    .chat-info-request-time-out > a {
        background: #F36234;
        border-radius: 8px;
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 24px;
        letter-spacing: 0.5px;
        color: #FFFFFF;
        padding: 8px 14px;
        display: flex;
        align-items: center;
    }

        .chat-info-request-time-out > a > i {
            font-size: 20px;
            margin-right: 6px;
        }

.text-blur {
    color: transparent !important;
    text-shadow: 0 0 5px rgba(0,0,0,0.5);
    user-select: none;
}

/*#endregion ------------- Chat Info Request Time Out ------------- */

/*#region Forie chat ayrıcalık ekleme modalı CSS kodları */
#addPrivileges > .modal-dialog > .modal-content > .modal-header {
    align-items: center !important;
}

    #addPrivileges > .modal-dialog > .modal-content > .modal-header > h5 {
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 700;
        font-size: 22px;
        line-height: 28px;
        text-align: center;
        color: #000000;
        padding: 10px 0px;
    }

#accordionPrivilege {
    max-height: 300px;
    overflow: auto;
}

.privilege-close-button {
    color: #00245D !important;
    opacity: 1 !important;
}

#addPrivileges > .modal-dialog > .modal-content {
    padding: 48px;
}

.employee-wrapper > .privilege-search-area {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 40px;
    margin-bottom: 24px;
    margin-top: 12px;
    padding-left: 16px;
}

    .employee-wrapper > .privilege-search-area input {
        width: 90%;
        border: 2px solid #E6E9EF;
        border-radius: 100px;
        height: 100%;
        outline: none;
    }

        .employee-wrapper > .privilege-search-area input::placeholder {
            font-family: 'Roboto';
            font-style: normal;
            font-weight: 400;
            font-size: 14px;
            line-height: 20px;
            display: flex;
            align-items: center;
            letter-spacing: 0.25px;
            font-feature-settings: 'liga' off;
            color: #001941;
            padding-left: 16px;
        }

    .employee-wrapper > .privilege-search-area i {
        height: 100%;
        color: #001941;
        line-height: 40px;
        font-size: 24px;
        cursor: pointer;
    }

#employeeButton > .employee-avatar {
    width: 40px;
    height: 40px;
    background: #8A9AB4;
    border-radius: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #E6E9EF;
}

#employeeButton > span {
    flex: 1;
    padding-left: 8px;
}

.privilege-collapse > .properties > div.property, #employeeButton > span {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0.5px;
    font-feature-settings: 'liga' off;
    color: #001941;
}

.employee-wrapper > .accordion > .card {
    border-bottom: 1px solid #EFF0F1 !important;
}

.privilege-collapse > .properties {
    display: flex;
    flex-direction: column;
    border-bottom: 1px solid #EFF0F1;
    background-color: #fff;
}

#employeeButton {
    display: flex;
    align-items: center;
    padding: 24px 16px;
    box-shadow: none;
}

    #employeeButton > span {
        flex: 1;
        text-align: left;
        padding-left: 8px;
    }

.privilege-collapse > .properties > .property {
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 40px;
    padding: 16px 24px !important;
}

#addPrivileges {
    padding-left: 0 !important;
}

#accordionPrivilege > .card-header {
    background-color: #fff;
}

.privilege-collapse > .properties > .property > input[type="checkbox"] {
    position: relative;
    min-width: 45px;
    height: 23px;
    -webkit-appearance: none;
    border: 1px solid #B0BBCD;
    background: #E6E9EF;
    outline: none;
    border-radius: 20px;
    cursor: pointer;
    /* box-shadow: inset 0 0 5px rgb(255 0 0 / 20%); */
    transition: 0.7s;
}

.privilege-collapse > .properties > .property > input:checked[type="checkbox"] {
    background: #50B04D;
    border: none;
}


.privilege-collapse > .properties > .property > input[type="checkbox"]:before {
    content: '';
    position: absolute;
    width: 13px;
    height: 13px;
    border-radius: 20px;
    top: 4px;
    left: 4px;
    background: #B0BBCD;
    transform: scale(1.1);
    /* box-shadow: 0 2px 5px rgb(0 0 0 / 20%); */
    transition: .5s;
}

.privilege-collapse > .properties > .property > input:checked[type="checkbox"]:before {
    left: 24px;
    font-family: "remixicon";
    content: "\EB80";
    display: flex;
    color: #ffffff;
    align-items: center;
    background: transparent !important;
}



/*.privilege-collapse > .properties > .property > input[type="checkbox"] {
    position: relative;
    min-width: 45px;
    height: 23px;
    -webkit-appearance: none;
    border: 1px solid #B0BBCD;
    background: #E6E9EF;
    outline: none;
    border-radius: 20px;
    cursor: pointer;
    transition: 0.7s;
}


.privilege-collapse > .properties > .property > input:checked {
    background: #b0bbcd;
}

.privilege-collapse > .properties > .property > input:before {
    content: '';
    position: absolute;
    width: 13px;
    height: 13px;
    border-radius: 20px;
    top: 4px;
    left: 4px;
    background: #B0BBCD;
    transform: scale(1.1);
    transition: .5s;
    color: #00245D;
}

.privilege-collapse > .properties > .property > input:checked:before {
    left: 24px;
    font-family: "Material Icons";
    content: "\e86c";
    display: flex;
    align-items: center;
}*/

#employeeButton[aria-expanded="true"] {
    background-color: #F9F9FA;
}

    #employeeButton[aria-expanded="true"] > i::after {
        content: "expand_less";
    }

#employeeButton[aria-expanded="false"] > i::before {
    content: "expand_more";
}


@media screen and (min-width:576px) {
    #addPrivileges > .modal-dialog {
        max-width: 600px;
    }
}

@media screen and (max-width:576px) {
    #addPrivileges > .modal-dialog > .modal-content {
        padding: 40px 10px;
    }

    .employee-wrapper > .privilege-search-area {
        padding-left: 0px !important;
    }

    #employeeButton {
        padding: 24px 0px;
    }
}


/*#endregion */

.chat-message-area {
    min-height: 71.2vh;
    height: 100%;
}

.user-blocked {
    padding: 16px;
    background-color: #FFE6E6;
    gap: 16px;
    border-radius: 8px;
    width: 100%;
}

    .user-blocked p {
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 20px;
        letter-spacing: 0.5px;
        font-feature-settings: 'liga' off;
        color: #000000;
        margin: 0px;
        flex: 1;
    }



@media (min-width: 320px) and (max-width: 991px) {
    .forie-connect-activation-area {
        height: auto !important;
    }

    body {
        margin-bottom: 35px;
    }

    .general-system-tabs-button-left-area {
        width: 100%;
        padding: 0px 10px !important;
        margin-bottom: 7px;
        flex-flow: column;
    }

    #account_selector_container {
        margin-bottom: 7px;
        width: 100%;
    }

    .chat-tab-header {
        width: 100%;
        margin-left: 0px;
    }

        .chat-tab-header > li {
            width: 50%;
            text-align: center;
        }

    .general-system-tabs-button-right-area {
        padding: 0px 10px;
    }

        .general-system-tabs-button-right-area > a {
            width: 100%;
            text-align: center;
            justify-content: center;
            padding: 6px 18px !important;
        }

    .general-dropdown-item .general-dropdown-item-menu {
        width: 100%;
    }


    .chat-right-area {
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        height: 100%;
        min-height: 100vh;
        width: 100%;
        z-index: 1020;
        visibility: hidden;
        transform: translateX(100%);
        transition: transform .3s ease, visibility .3s ease;
        background: #fafbfd;
    }

        .chat-right-area.main-visible {
            visibility: visible;
            transform: translateX(0);
        }

    .chats-body {
        margin: 60px 0px 80px 0px;
    }

    .chats-header {
        /*top: 60px;*/
        padding-left: 0px !important;
    }

        .chats-header > a {
            display: block;
        }

    .chat-info {
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        height: 100%;
        width: 100%;
        z-index: 1020;
        visibility: hidden;
        transform: translateX(100%);
        transition: transform .3s ease, visibility .3s ease;
        background: #fafbfd;
    }

        .chat-info.chat-info-visible {
            visibility: visible;
            transform: translateX(0);
        }

    .my-acc-right-side-header > a {
        display: block;
    }

    .chat-files-info {
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        height: 100%;
        width: 100%;
        z-index: 1020;
        visibility: hidden;
        transform: translateX(100%);
        transition: transform .3s ease, visibility .3s ease;
        background: #fafbfd;
    }

        .chat-files-info.chat-info-visible {
            visibility: visible;
            transform: translateX(0);
        }

    .my-acc-user-info > abbr > a {
        display: flex;
    }

    #my_account_right_container {
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        height: 100%;
        width: 100%;
        z-index: 1020;
        visibility: hidden;
        transform: translateX(100%);
        transition: transform .3s ease, visibility .3s ease;
        background: #fafbfd;
        padding: 60px 0px 0px 0px !important;
        overflow-y: scroll;
        margin-bottom: 20px;
    }

        #my_account_right_container.my-account-visible {
            visibility: visible !important;
            transform: translateX(0);
        }

    .settings-area {
        height: auto;
        padding: 20px 15px;
    }

    .my-acc-right-side-header {
        padding: 11px 0px;
    }

    .modal-new-chat-content {
        width: 100%;
    }

    .p-48 {
        padding: 12px;
    }

    .search-company-list-item {
        padding: 28px 1px 28px 0px;
    }

    .search-company-user-input {
        padding: 28px 0px 28px 0px;
    }

    .search-user-name > p {
        line-height: 19px;
    }

    .chat-info-main {
        padding-bottom: 60px !important;
    }

    .general-dropdown-item .general-dropdown-item-menu a > i {
        margin-right: 10px;
    }

    .chat-footer {
        padding: 8px 5px;
    }

    #chat-files-summary-area > div {
        height: calc(100vh - 235px);
    }

    .mobile-bottom {
        margin: 60px 0px 0px 0px;
    }



    .undefined-phone-activation-message {
        flex-flow: column;
    }

        .undefined-phone-activation-message > img {
            flex-flow: column;
            margin-bottom: 15px;
        }

        .undefined-phone-activation-message > span {
            line-height: 17px !important;
            margin-left: 0px !important;
        }

    .activation-tab-1-header-left {
        order: 2;
    }

    .activation-tab-1-header-right > img {
        margin-bottom: 22px;
    }

    .activation-tab-1-main-item > section {
        flex-flow: column;
    }

        .activation-tab-1-main-item > section .form-group {
            width: 100% !important;
            margin-right: 0px !important;
            margin-bottom: 10px !important;
        }

    .activation-tab-1 {
        text-align: center;
    }

    .activation-tab-1-main-item > span {
        justify-content: center;
    }
}

@media (min-width: 320px) and (max-width: 575px) {

    .general-system-tabs-button-left-area {
        width: 100%;
        padding: 0px 10px !important;
        margin-bottom: 7px;
        flex-flow: column;
    }

    #account_selector_container {
        margin-bottom: 7px;
        width: 100%;
    }

    .chat-tab-header {
        width: 100%;
        margin-left: 0px;
    }

        .chat-tab-header > li {
            width: 50%;
            text-align: center;
        }

    .general-system-tabs-button-right-area {
        padding: 0px 10px;
    }

        .general-system-tabs-button-right-area > a {
            width: 100%;
            text-align: center;
            justify-content: center;
            padding: 6px 18px !important;
        }

    .chat-tab-header > li > a {
        padding: 6px 18px !important;
    }

    #chat_list_nav_container {
        overflow-x: overlay !important;
        width: 100%;
        overflow: hidden;
    }

        #chat_list_nav_container > div > a {
            white-space: nowrap;
        }



    .chat-list-item > a {
        padding: 24px 9px;
    }

    .chats-header > section > article > charset {
        display: flex;
        align-items: self-start;
        justify-content: center;
        line-height: 0;
        min-width: 200px;
        flex-flow: column;
    }

    .insufficient-membership-package > section {
        margin: 0px 0px;
        padding: 35px 10px;
    }

    .chats-header > section > article > section > abbr {
        font-size: 10px;
        line-height: 1px;
    }

    .general-dropdown-item .general-dropdown-item-menu {
        width: 100%;
    }

    .chat-content {
        margin: 60px 3px 5px 0px;
    }

    .general-main-area {
        padding: 10px;
    }

    .my-acc-user-details {
        margin-left: 5px;
        margin-right: 5px;
    }

    .company-and-user-information {
        padding: 13px 10px;
    }

    .user-settings {
        width: 100%;
    }

    .why-should-update-my-information {
        padding: 20px;
        margin: 16px;
        width: 100%;
        margin-bottom: 67px;
    }

    .modal-login-body {
        padding: 0px 10px 132px 10px;
        text-align: center;
    }

        .modal-login-body img {
            padding: 51px 10px 75px 10px;
            width: 233px;
        }

    .modal-login-buttons {
        padding: 0px;
        justify-content: center;
    }

    .general-activation-layer {
        padding: 64px 10px !important;
    }

    .forie-connect-activation-area {
        width: 100%;
    }

    .activation-general-area {
        padding: 0;
    }

    #activation-phone-add-modal .modal-content {
        padding: 30px 15px !important
    }

    #activation-phone-add-modal .modal-body {
        flex-flow: column;
    }

        #activation-phone-add-modal .modal-body .input-group {
            margin-bottom: 20px;
        }

    .activation-body-top-right > img {
        width: 50% !important;
    }

    .chats-header.mobile-top {
        /*top: 125px !important;*/
    }
}


@media (min-width: 320px) and (max-width: 420px) {
    .chats-header > section > article > charset > h6 {
        max-width: 157px;
    }

    .general-dropdown-item .general-dropdown-item-menu a > section > span {
        max-width: 175px;
    }

    .chats-header > section {
        width: 78%;
    }

    #message_board_menu {
        margin-left: 14px;
    }
}

@media (min-width: 421px) and (max-width: 575px) {
    .chats-header > section > article > charset > h6 {
        max-width: 257px;
    }

    .general-dropdown-item .general-dropdown-item-menu a > section > span {
        max-width: 257px;
    }
}

@media (min-width: 576px) and (max-width: 767px) {
    .chats-header > section > article > charset > h6 {
        max-width: 415px;
    }

    .general-dropdown-item .general-dropdown-item-menu a > section > span {
        max-width: 415px
    }

    .general-system-tabs-button-left-area {
        width: 100%;
        padding: 0px 10px !important;
        margin-bottom: 7px;
        flex-flow: column;
    }

    #account_selector_container {
        margin-bottom: 7px;
        width: 100%;
    }

    .chat-tab-header {
        width: 100%;
        margin-left: 0px;
    }

        .chat-tab-header > li {
            width: 50%;
            text-align: center;
        }

    .general-system-tabs-button-right-area {
        padding: 0px 10px;
    }

        .general-system-tabs-button-right-area > a {
            width: 100%;
            text-align: center;
            justify-content: center;
            padding: 6px 18px !important;
        }

    .chat-tab-header > li > a {
        padding: 6px 18px !important;
    }

    #chat_list_nav_container {
        overflow-x: overlay !important;
        width: 100%;
        overflow: hidden;
    }

        #chat_list_nav_container > div > a {
            white-space: nowrap;
        }

        #chat_list_nav_container::-webkit-scrollbar-track {
            border-radius: 0px;
            background-color: transparent;
        }

        #chat_list_nav_container::-webkit-scrollbar {
            width: 0px;
            background-color: transparent;
        }

        #chat_list_nav_container::-webkit-scrollbar-thumb {
            border-radius: 0px;
            background-color: transparent;
        }

    .chat-list-item > a {
        padding: 24px 9px;
    }

    .chats-header > section > article > charset {
        display: flex;
        align-items: self-start;
        justify-content: center;
        line-height: 0;
        min-width: 200px;
        flex-flow: column;
    }

    .insufficient-membership-package > section {
        margin: 0px 0px;
        padding: 35px 10px;
    }

    .chats-header > section > article > section > abbr {
        font-size: 10px;
        line-height: 1px;
    }

    .general-dropdown-item .general-dropdown-item-menu {
        width: 100%;
    }

    .modal-login-body {
        padding: 0px 10px 132px 10px;
        text-align: center;
    }

        .modal-login-body img {
            padding: 51px 10px 75px 10px;
            width: 233px;
        }

    .modal-login-buttons {
        padding: 0px;
        justify-content: center;
    }

    .general-activation-layer {
        padding: 64px 10px !important;
    }

    .forie-connect-activation-area {
        width: 100%;
    }

    .activation-general-area {
        padding: 0;
    }

    .activation-body-top-right > img {
        width: 35% !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .chats-header > section > article > charset > h6 {
        max-width: 565px;
    }

    .general-dropdown-item .general-dropdown-item-menu a > section > span {
        max-width: 565px;
    }

    .modal-login-body {
        padding: 50px 10px 55px 10px;
        text-align: center;
    }

        .modal-login-body img {
            width: 100%;
        }

    .modal-login-text {
        padding: 0px 0px 32px 0px;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .chats-header > section > article > charset > h6 {
        max-width: 788px;
    }
}



/*#region ------------- Activaiton Tab 1 ------------- */

.forie-connect-activation-area {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 93vh;
}

.general-activation-layer {
    background: #FFFFFF;
    box-shadow: 0px 10px 20px rgb(0 0 0 / 5%);
    /*min-height: 500px;*/
    border-radius: 16px;
    /*width: 88.6%;*/
    padding: 64px 48px;
}

.activation-tab-1-header-left > strong {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    font-size: 24px;
    line-height: 32px;
    letter-spacing: 0.5px;
    display: block;
    color: #000000;
    margin-bottom: 16px;
}

.activation-tab-1-header-left > span {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0.5px;
    color: #000000;
}

.activation-tab-1-header-left > abbr {
    margin-top: 15px;
    display: block;
    color: #e10000 !important;
    font-family: Roboto;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    margin-bottom: 10px;
    font-style: normal;
    line-height: 1.43;
    letter-spacing: normal;
}

.activation-tab-1-main-item > span {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 600;
    font-size: 14px;
    line-height: 20px;
    display: flex;
    align-items: center;
    letter-spacing: 0.25px;
    color: #000000;
}

.activation-tab-1-main-item > section {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

    .activation-tab-1-main-item > section .form-group {
        width: calc(100% - 115px);
        margin-right: 8px;
        position: relative;
        margin-bottom: 0px;
    }

        .activation-tab-1-main-item > section .form-group input {
            background: #F9F9FA;
            border: 1px solid #F2F2F4;
            border-radius: 8px;
            padding: 15px 48px;
            width: 100%;
        }

        .activation-tab-1-main-item > section .form-group i {
            position: absolute;
            left: 13px;
            color: #34C5F3;
            top: 16px;
        }


    .activation-tab-1-main-item > section > a {
        padding: 16px 7px;
        background: #00245D;
        border-radius: 8px;
        color: #fff;
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 500;
        font-size: 16px;
        line-height: 24px;
        text-decoration: none;
        letter-spacing: 0.5px;
        min-width: 105px;
        text-align: center;
    }


/*#endregion ------------- Activaiton Tab 1 ------------- */

/*#region ------------- Activaiton Tab 2 ------------- */

.undefined-phone-activation-message {
    display: flex;
    align-items: center;
    background: #FEEFEB;
    border-radius: 8px;
    padding: 16px;
    margin-top: 50px;
}

    .undefined-phone-activation-message > img {
        width: 80px;
    }

    .undefined-phone-activation-message > span {
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 500;
        font-size: 14px;
        line-height: 24px;
        margin-left: 16px;
        letter-spacing: 0.5px;
        font-feature-settings: 'liga' off;
        color: #000000;
    }


#activation-phone-add-modal .modal-content {
    padding: 48px;
}

#activation-phone-add-modal .modal-body {
    padding: 42px 0px 0px 0px;
    display: flex;
    align-items: start;
}

#phone-input {
    border-radius: 6px !important;
    height: 50px !important;
    background: #F9F9FA;
    border: 1px solid #F2F2F4;
    border-radius: 8px;
    padding-left: 92px;
    FONT-WEIGHT: 500;
}

.intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-3 .selected-flag {
    border-radius: 6px 0px 0px 6px !important;
    width: 85px !important;
    background-color: #F9F9FA !important;
}

.intl-tel-input.separate-dial-code .selected-flag {
    background-color: #fff !important;
    border-right: 1px solid #dee5ed;
}



@media (min-width: 576px) {
    #chat_not_login_user .modal-dialog {
        max-width: 800px !important;
    }
}

#activation-phone-add-modal .modal-dialog {
    max-width: 620px !important;
}



#activation-phone-add-modal .modal-body .input-group {
    padding: 1px 0px;
    margin-right: 8px;
}

#activation-phone-add-modal .modal-body a {
    padding: 14px 7px;
    background: #00245D;
    border-radius: 8px;
    color: #fff;
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    text-decoration: none;
    letter-spacing: 0.5px;
    min-width: 105px;
    text-align: center;
}

.activation-phone-add-modal-title {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 24px;
    letter-spacing: 0.5px;
    color: #000000;
}

.activation-tab-2-main {
    display: flex;
    flex-flow: column;
    align-items: center;
}

    .activation-tab-2-main > img {
        margin-bottom: 16px;
    }

    .activation-tab-2-main > strong {
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 700;
        font-size: 24px;
        line-height: 32px;
        text-align: center;
        letter-spacing: 0.5px;
        color: #000000;
        margin-bottom: 16px;
    }

    .activation-tab-2-main > abbr {
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 24px;
        text-align: center;
        letter-spacing: 0.5px;
        color: #000000;
        margin-bottom: 16px;
    }

.activation {
    width: 48px;
    font-size: 16px;
    padding: 15px 17px;
    border-radius: 8px;
    color: var(--dark);
    border: 1px solid #dee5ed;
    font-weight: bold;
    outline-color: var(--secondary500);
}

.activation-tab-3-main {
    display: flex;
    flex-flow: column;
    align-items: center;
}



.number-to-send-code-phone {
    margin-bottom: 16px;
}

.number-to-send-code-mail {
    margin-bottom: 16px;
}


.activation-tab-2-main > a {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 24px;
    letter-spacing: 0.5px;
    padding: 16px 22px;
    background: #00245D;
    border-radius: 8px;
    color: #FFFFFF;
}

/*#endregion ------------- Activaiton Tab 2 ------------- */


/*#region  ForieChat Firma Bulunamadı */
.no-companies-found {
    display: flex;
    padding: 16px;
    gap: 16px;
    background: #FEEFEB;
    border-radius: 8px;
}

.no-companies-found-text {
    gap: 16px
}

    .no-companies-found-text > span {
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 500;
        font-size: 16px;
        line-height: 24px;
        letter-spacing: 0.5px;
        font-feature-settings: 'liga' off;
        color: #000000;
    }

.no-companies-found-button {
    align-items: center;
    padding: 4px;
    isolation: isolate;
    width: 88px;
    height: 32px;
    background: #F36234;
    border-radius: 4px;
    display: flex;
    justify-content: center;
    gap: 4px;
    color: white !important;
    text-decoration: none !important;
}
/*#endregion*/


html[lang=es] #chat_list_nav_container > div > a {
    font-size: 12px;
}

html[lang=pt] #chat_list_nav_container > div > a {
    font-size: 13px;
}




.activation-header-message-area > h4 {
    font-family: "Roboto";
    font-weight: 500;
    font-size: 24px;
    line-height: 34px;
    letter-spacing: 0.5px;
    color: #3b9f29;
    margin-bottom: 50px;
    text-align: center;
}

.activation-body-top-left {
    text-align: center;
}

    .activation-body-top-left > h3 {
        font-style: normal;
        font-weight: bold;
        font-size: 23px;
        text-align: center;
        margin-bottom: 10px;
        color: #00245D;
    }

    .activation-body-top-left > p {
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        color: #000000
    }

.activation-body-top-right {
}



.download-mobile-app-choice {
    justify-content: center;
    display: flex;
    flex-flow: column;
    align-items: center;
}

    .download-mobile-app-choice > h2 {
        font-style: normal;
        font-weight: bold;
        font-size: 23px;
        text-align: center;
        margin-bottom: 20px;
        color: #00245D;
    }

    .download-mobile-app-choice a {
        text-decoration: none;
        padding: 0;
        margin: 0;
    }

        .download-mobile-app-choice a > section {
            height: 50px;
            background-color: #000000;
            border-radius: 5.1px;
            align-items: center;
            padding: 7.8px 16px;
            cursor: pointer;
            display: flex;
            color: #fff;
            justify-content: space-between;
            margin-bottom: 15px;
        }

            .download-mobile-app-choice a > section > article {
                display: flex;
                flex-flow: column;
                padding-left: 24px;
            }

                .download-mobile-app-choice a > section > article > strong {
                    font-family: 'DM Sans';
                    font-style: normal;
                    font-weight: 700;
                    font-size: 13.6px;
                    color: white;
                    flex-flow: column;
                }

                .download-mobile-app-choice a > section > article > span {
                    font-family: 'DM Sans';
                    font-style: normal;
                    font-weight: 400;
                    font-size: 10.2px;
                    letter-spacing: 0.200162px;
                    color: #FFFFFF;
                }








/*@media (min-height: 800px) and (max-height: 850px) {
    .chat-right-area {
        height: 82.5vh;
    }
}

@media (min-height: 750px) and (max-height: 799px) {
    .chat-right-area {
        height: 80.5vh;
    }
}


@media (min-height: 700px) and (max-height: 749px) {
    .chat-right-area {
        height: 78.5vh;
    }
}


@media (min-height: 650px) and (max-height: 699px) {
    .chat-right-area {
        height: 76.5vh;
    }
}

@media (min-height: 500px) and (max-height: 649px) {
    .chat-right-area {
        height: 74.5vh;
    }
}*/

@media (max-height: 768px) {
    .chat-right-area {
        height: 100%;
        min-height: 100vh;
    }
}
