/* ========================================================================= \\
    Chat Widget Modal Styles
\\ ========================================================================= */
#chat-form button,
#chat-form-conversation button {
    cursor: pointer;
}
#chat-form-conversation .user-message-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
}
#chat-form-conversation .chatbot-message-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    padding: 10px 10px 10px 0;
}
#chat-form-conversation .chatbot-message-response,
#chat-form-conversation .chatbot-message-timestamp,
#chat-form-conversation .user-message-response,
#chat-form-conversation .user-message-timestamp {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}
#chat-form-conversation .chatbot-message-image,
#chat-form-conversation .user-message-image {
    padding-right: 13px;
}
#chat-form-conversation .chatbot-message-image i {
    width: 7%;
    max-width: 50px;
    height: auto;
    margin: 0;
    font-size: 2em;
}
#chat-form-conversation .user-message-image img {
    max-width: 42px;
    height: auto;
    margin: 0;
    -webkit-filter: grayscale(100%);
            filter: grayscale(100%);
}
#chat-form-conversation .chatbot-message-timestamp,
#chat-form-conversation .user-message-timestamp {
    font-size: 0.7em;
}
#chat-form-conversation .chatbot-message-window-container {
    padding: 10px 10px 10px 20px;
    overflow-y: scroll;
    height: 300px;
}
#chat-form-conversation .user-message-container {
    padding: 10px 10px 10px 40px;
}
#chat-form-conversation .chatbot-message-name,
#chat-form-conversation .user-message-name {
    color: #2e9fff;
    font-weight: bold;
    font-size: 0.815em;
}
#chat-form-conversation .user-message-send {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: sticky;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    margin-top: 40px;
}
#chat-form-conversation .user-message-send input {
    margin-right: 20px;
}
#chat-form-conversation .user-message-send button {
    margin: 7px 0;
}
#chat-form-conversation .chatbot-message-response,
#chat-form-conversation .user-message-response {
    font-size: 0.875em;
}
#chat-form-conversation .chatbot-message-response,
#chat-form-conversation .user-message-response {
    padding-top: 5px;
}
#chat-form-conversation .chatbot-message-timestamp,
#chat-form-conversation .user-message-timestamp {
    padding-top: 5px;
}
/*#chat-form, #chat-form-conversation{
    transition: .5s all;
}*/

@media (max-width: 33.938em) {
    /** 543px **/
    #chat-form-conversation .chatbot-message-image,
    #chat-form-conversation .user-message-image {
        display: none;
    }
    #chat-form-conversation .user-message-container {
        padding: 10px 10px 10px 10px;
    }
    #chat-form-conversation .user-message-name {
        color: #ac1a2f;
    }
}
