html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

html {
    position: relative;
}

body {
    margin-bottom: 60px;
}


html, body {
    min-height: 100%;
    height: 100%;
}

.chat-attachment-list:has(> *) {
    /*mb-3*/
    margin-bottom: 1rem !important;
}

.chat-alert-list:has(> *) {
    /*mb-3*/
    margin-bottom: 1rem !important;
}

.chat-attachment {
    /*bg-secondary*/
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-secondary-rgb), var(--bs-bg-opacity));
    /*rounded*/
    border-radius: var(--bs-border-radius);
    /*p-1*/
    padding: 0.25rem !important;
}

.chat-attachment > a {
    /*text-muted*/
    --bs-text-opacity: 1;
    color: var(--bs-secondary-color);
}

.chat-message-list {
    flex: 1 1 auto;
    overflow-y: scroll;
}

.chat-message {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.chat-message-hidden {
    opacity: 0;
    /*text-muted*/
    --bs-text-opacity: 1;
    color: var(--bs-secondary-color);
}

.chat-message:hover .chat-message-hidden {
    opacity: 1;
}

.chat-message-left {
    flex-direction: row;
    justify-content: left;
}

.chat-message-right {
    flex-direction: row-reverse;
    justify-content: right;
}

.chat-message-right > p {
    /*bg-primary-subtle*/
    --bs-bg-opacity: 1;
    background-color: var(--bs-primary-bg-subtle);
}

.chat-message-left > p {
    /*bg-body-secondary*/
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-secondary-bg-rgb), var(--bs-bg-opacity));
}

.chat-message-text {
    /*small*/
    font-size: 0.875em;
    /*p-2*/
    padding: 0.5rem;
    /*mb-1*/
    margin-bottom: 0.25rem;
    /*rounded-3*/
    border-radius: var(--bs-border-radius-lg);
}

.chat-message-text p {
    margin: 0;
}