/*
 * Medora theme. Every colour, font, spacing step and radius is a variable here.
 * Restyle the whole app by editing this file only; app.css contains layout, not looks.
 */
:root {
    /* Colours */
    --color-bg: #f6f7f9;
    --color-surface: #ffffff;
    --color-text: #1b1f24;
    --color-muted: #566070;
    --color-border: #cfd5dd;
    --color-primary: #1f4fd8;
    --color-primary-text: #ffffff;
    --color-danger: #b3261e;
    --color-danger-text: #ffffff;
    --color-ok-bg: #e6f4ea;
    --color-ok-text: #14532d;
    --color-warn-bg: #fff4d6;
    --color-warn-text: #6b4a00;
    --color-err-bg: #fde7e7;
    --color-err-text: #7a1612;
    --color-bubble-mine: #dbe6ff;
    --color-bubble-theirs: #eceff3;
    --color-focus: #ff9d00;

    /* Typography */
    --font-body: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    --font-size-base: 16px;
    --font-size-small: 0.875rem;
    --font-size-big: 1.25rem;

    /* Spacing and shape */
    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 24px;
    --space-6: 32px;
    --radius-s: 6px;
    --radius-m: 12px;
    --radius-l: 18px;
    --max-width: 640px;
}