/*
 * RossPak Messenger — WhatsApp-inspired UI
 * Version: 1.0
 * Element Web: 1.12.31
 */

/* Main palette */
:root {
    --rp-green: #075e54;
    --rp-accent: #00a884;
    --rp-chat-bg: #efeae2;
    --rp-outgoing: #d9fdd3;
    --rp-incoming: #ffffff;
    --rp-border: #e9edef;
    --rp-text: #111b21;
    --rp-muted: #667781;
}

/* Main interface */
body {
    font-family: Arial, "Segoe UI", sans-serif;
}

.mx_MatrixChat {
    background: #f0f2f5;
}

/* Room background */
.mx_RoomView {
    background-color: var(--rp-chat-bg);
}

/* Sidebar */
.mx_LeftPanel {
    background: #ffffff;
    border-right: 1px solid var(--rp-border);
}

/* Chat header */
.mx_RoomHeader {
    background: #f0f2f5;
    border-bottom: 1px solid var(--rp-border);
}

/* Chat list */
.mx_RoomTile {
    border-radius: 8px;
    transition: background-color .15s ease;
}

.mx_RoomTile:hover {
    background-color: #f5f6f6;
}

/* Chat messages */
.mx_EventTile_line {
    border-radius: 10px;
}

.mx_EventTile_content {
    line-height: 1.45;
}

/* Own message bubble */
.mx_EventTile.mx_EventTile_sending,
.mx_EventTile.mx_EventTile_sent {
    border-radius: 10px;
}

/* Composer */
.mx_MessageComposer {
    background: #f0f2f5;
    padding: 8px 12px;
}

.mx_BasicMessageComposer {
    background: #ffffff;
    border-radius: 12px;
}

/* Buttons and accents */
.mx_RoomView button,
.mx_LeftPanel button {
    transition: background-color .15s ease;
}

/* Scrollbars */
.mx_RoomView ::-webkit-scrollbar,
.mx_LeftPanel ::-webkit-scrollbar {
    width: 7px;
}

.mx_RoomView ::-webkit-scrollbar-thumb,
.mx_LeftPanel ::-webkit-scrollbar-thumb {
    background: #c2c9cc;
    border-radius: 10px;
}