.conversation-view {
    display: flex;
    flex-direction: column;
    height: 100%;
}

#conversation-reply-row {
    display: flex;
    flex-direction: row;
    height: 19%;
}

#conversation-items .dx-list .dx-empty-message {
    border: none;
}

#conversation-items {
    border: solid 1px #ddd;
    border-radius: 0 0 4px 4px;
    background-color: rgba(191, 191, 191, 0.15) !important;
    margin-bottom: 3px;
}

#conversation-items .dx-list-item {
    border: none;
}

#conversation-items .dx-list-item-content {
    white-space: normal;
    padding: 1px 0px 1px 5px;
    background-color: transparent;
}

/* Desktop screens */
@media only screen and (min-width: 768px) {
    .conversationItemLeft {
        display: inline-block;
        padding: 10px;
        border: solid 1px #ddd;
        border-radius: 5px;
        min-width: 33%;
        max-width: 67%;
        background-color: white;
        color: black;
    }

    .conversationItemRight {
        display: inline-block;
        float: right;
        padding: 10px;
        border: solid 1px #ddd;
        border-radius: 5px;
        min-width: 33%;
        max-width: 67%;
        background-color: white;
        color: black;
    }
}

/* Mobile screens */
@media only screen and (max-width: 768px) {
    .conversationItemLeft {
        display: inline-block;
        padding: 10px;
        border: solid 1px #ddd;
        border-radius: 5px;
        min-width: 50%;
        max-width: 80%;
        background-color: white;
        color: black;
    }

    .conversationItemRight {
        display: inline-block;
        float: right;
        padding: 10px;
        border: solid 1px #ddd;
        border-radius: 5px;
        min-width: 50%;
        max-width: 80%;
        background-color: white;
        color: black;
    }
}

.conversationItemContent {
    display: block;
}

.conversationItemOrigin {
    display: block;
    font-weight: bold;
}

.conversationItemDate {
    display: block;
    color: lightgrey;
}

#conversation-reply {
    border: solid 1px #ddd;
    border-radius: 4px;
    margin-right: 2px;
}

#conversation-reply .ql-editor {
    padding-left: 15px;
}

/*Bug# 1186 - whitespaces couldn't be entered at the end of text in FireFox*/
#conversation-reply p {
    white-space: pre-wrap !important;
    cursor: text;
}

#conversation-reply-send {
    border: solid 1px #ddd;
    border-radius: 4px;
}