@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600&family=Roboto:wght@400;500&family=Poppins:wght@400;600&display=swap');

:root {
    --font-classic: 'Inter', sans-serif;
    --font-black: 'Roboto', sans-serif;
    --font-pastel: 'Poppins', sans-serif;
}

body.app-body {
    font-family: var(--font-classic);
    background-color: var(--surface-color, #f8f9fa);
    color: var(--text-color, #212529);
    transition: background-color 0.3s ease, color 0.3s ease;
}

.navbar {
    background-color: var(--navbar-bg, #ffffff) !important;
}

.navbar, .card, .list-group-item, .table {
    color: inherit;
}

.card {
    background-color: var(--card-bg, #ffffff);
    border: none;
}

[data-theme="classic"] {
    --surface-color: #f3f6fb;
    --text-color: #212529;
    --card-bg: #ffffff;
    --navbar-bg: #ffffff;
    --accent-color: #0d6efd;
    font-family: var(--font-classic);
}

[data-theme="black"] {
    --surface-color: #000000;
    --text-color: #f1f3f5;
    --card-bg: #121212;
    --navbar-bg: #121212;
    --accent-color: #17a2b8;
    font-family: var(--font-black);
}

[data-theme="pastel"] {
    --surface-color: #f9f5ff;
    --text-color: #4b2e83;
    --card-bg: #ffffff;
    --navbar-bg: #f4ecfe;
    --accent-color: #ff8ba7;
    font-family: var(--font-pastel);
}

[data-theme="black"] .card,
[data-theme="black"] .list-group-item,
[data-theme="black"] .table {
    color: #f1f3f5;
}

.theme-button.active {
    background-color: var(--accent-color);
    color: #ffffff;
}

.message-body {
    white-space: pre-wrap;
    font-family: 'Courier New', monospace;
}