/*#chat-container {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px;
    overflow-y: scroll;
    margin-bottom: 16px;
}

.message {
    display: flex;
    flex-direction: column;
    gap: 0px;
    position: relative;
    overflow: visible;
}

.message .pseudo {
    opacity: 0.5;
    font-size: var(--fontSize-medium);
}

.message.admin {
    width: 100%;
    padding: 8px;
    background-color: var(--color-primary);
    color: var(--color-background);
    border-radius: 16px 16px 16px 0px;

    position: sticky;
    top: 0;
}

.message-header {
    position: relative;
}

.btn-report {
    display: none;
    position: absolute;
    right: 0;
    top: 0;
}

.message:hover .btn-report {
    display: block;
}

.message:hover {
    background-color: rgba(255, 255, 255, 0.05);
}*/

/* New chatbox */

.chatbox {
    display: flex;
    flex-direction: column;
    overflow-y: scroll;
    gap: 8px;
    height: 100%;
    min-height: 256px;

    padding: 8px;
    border-radius: 8px;
    background-color: var(--color-background);
}

.chatbox.tribe {--chatbox-color: var(--color-secondary-3);}
.chatbox.cyberspace {--chatbox-color: var(--color-secondary-2);}

.chatbox h2 {
    color: var(--chatbox-color);
}

.chat-container {
    width: 100%;
    height: 100%;

    display: flex;
    flex-direction: column;
    gap: 16px;

    overflow-y: scroll;
}

.message-box {
    display: flex;
    gap: 8px;
}

.message-box>input {
    border: solid 2px var(--chatbox-color);
    color: var(--chatbox-color);
    padding: 4px;
}

.message-box>.send {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    padding: auto 8px;
    background-color: var(--color-secondary-4);
    border-radius: 8px;
}

/* Messages */

.message {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.message-container {
    display: flex;
    gap: 4px;
}

.message-container.admin,
.message-container.adminsoft {
    color: var(--color-secondary-3);
    background-color: var(--color-background);
    border: solid 2px white;
    border-radius: 8px;
    padding: 8px;
}

.message-container.admin {
    border: solid 2px white;
    border-radius: 8px;
    padding: 8px;
    /* position: sticky;
    top: 0;
    z-index: 1; */
}

.message .header {
    display: flex;
    align-items: center;
    gap: 4px;
}

.message .username {
    color: var(--chatbox-color);
    font-weight: bold;
    font-size: var(--fontSize-medium);
}

.message .date {
    opacity: 0.5;
    font-size: var(--fontSize-small);
}

.message .content {
    font-size: var(--fontSize-medium);
}