.systemMessage {
    max-width: 70%;
    clear: both;
    border-top-left-radius: 0 !important;
    background: whitesmoke;
    border-radius: 0.5rem;
    padding: 1rem;
    margin-bottom: 1rem;
    
}

.userMessage {
    background: #5850c0;
    margin-bottom: 0px;
    float: right;
    max-width: 70%;
    color: white;
    padding: 0.3rem;
    margin-right: 1rem;
    margin-bottom: 1rem;
    border-bottom-right-radius: 0 !important;
    border-radius: 0.5rem;
}

@media (max-width: 999px) {
    .systemMessage {
        max-width: 100%;
    }
    .userMessage {
        max-width: 100%;
    }
}

.chat-source {
    background-color: #4e69ac7d;
    color: white;
    padding: 0.4rem;
    margin-top: 1rem;
    width: fit-content;
    margin-right: 1rem;
    pointer-events: none;
}

.chat-header {
    text-align: right;
    border-bottom: 2px solid silver;
    border-image: linear-gradient(to left, silver, transparent) 1;
    padding-bottom: 0.5rem;
    margin-bottom: 0.5rem;
}