:root {
    --bg-body: #f8f9fa;
    --bg-chat: #ffffff;
    --border-color: #dee2e6;
    --text-color: #212529;
    --text-muted: #6c757d;
    --bubble-user-bg: #0d6efd;
    --bubble-user-text: #ffffff;
    --bubble-assistant-bg: #f8f9fa;
    --bubble-assistant-text: #212529;
}

html[data-theme="dark"] {
    --bg-body: #121212;
    --bg-chat: #1e1e1e;
    --border-color: #2b2b2b;
    --text-color: #f8f9fa;
    --text-muted: #adb5bd;
    --bubble-user-bg: #0d6efd;
    --bubble-user-text: #ffffff;
    --bubble-assistant-bg: #2b2b2b;
    --bubble-assistant-text: #f8f9fa;
}

html, body {
    height: 100%;
}

body {
    background-color: var(--bg-body);
    color: var(--text-color);
}

#app, #adminApp {
    height: 100vh;
    display: flex;
    flex-direction: column;
}

.app-main {
    flex: 1;
}

.border-bottom,
.border-top,
.border-end {
    border-color: var(--border-color) !important;
}

.bg-body {
    background-color: var(--bg-body) !important;
}

.conversation-item {
    cursor: pointer;
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid var(--border-color);
}

.conversation-item.active {
    background-color: rgba(13, 110, 253, 0.15);
}

.conversation-title {
    font-weight: 500;
    font-size: 0.9rem;
}

.conversation-meta {
    font-size: 0.7rem;
    color: var(--text-muted);
}

.message-row {
    margin-bottom: 0.75rem;
    display: flex;
}

.message-row.user {
    justify-content: flex-end;
}

.message-row.assistant {
    justify-content: flex-start;
}

.message-bubble {
    max-width: 75%;
    padding: 0.5rem 0.75rem;
    border-radius: 0.75rem;
    white-space: pre-wrap;
    font-size: 0.9rem;
}

.message-bubble.user {
    background-color: var(--bubble-user-bg);
    color: var(--bubble-user-text);
    border-bottom-right-radius: 0.2rem;
}

.message-bubble.assistant {
    background-color: var(--bubble-assistant-bg);
    color: var(--bubble-assistant-text);
    border-bottom-left-radius: 0.2rem;
}

#messagesContainer {
    background-color: var(--bg-chat);
}

#statsContainer h6 {
    font-size: 0.85rem;
    margin-top: 0.5rem;
    margin-bottom: 0.25rem;
}

#statsContainer table {
    font-size: 0.8rem;
}

.table-sm th,
.table-sm td {
    padding: 0.25rem 0.4rem;
}