:root {
    /* ====== MEMORO NEUTRAL GRAY THEME (v2.1) ====== */
    /* Basen är IDENTISK med v2 – endast accenter tillagda */

    /* ------------------------------------------------------------------
       Background layers (varma, neutrala)
       ------------------------------------------------------------------ */
    --color-bg: #f5f5f5; /* varm ljusgrå – huvudbakgrund */
    --color-bg-muted: #e8e8e8; /* ett steg mörkare */
    --color-bg-panel: #fdfdfd; /* nästan vit, ej blå */
    --color-header-bg: var(
        --color-bg-muted
    ); /* används av sticky brand-/meeting-bar på mobil */

    /* ------------------------------------------------------------------
       Borders
       ------------------------------------------------------------------ */
    --color-border: #d6d6d6; /* mjuk tunn linje */
    --color-border-strong: #b8b8b8; /* tydligare avgränsning */
    --color-border-dark: #9ca3af; /* mörkare punkt/ikoner */

    /* ------------------------------------------------------------------
       Text
       ------------------------------------------------------------------ */
    --color-text-main: #111827; /* nästan svart */
    --color-text-muted: #6b7280; /* neutral/mjuk grå */

    /* ------------------------------------------------------------------
       Primary accent (legacy – behålls för kompatibilitet)
       ------------------------------------------------------------------ */
    --color-accent: #111827; /* svart, används i app */

    /* ------------------------------------------------------------------
       Brand accent (NY – landingpage, CTA, fokus)
       ------------------------------------------------------------------ */
    --color-brand: #2563eb; /* dämpad, professionell blå */
    --color-brand-hover: #1e40af; /* hover / active */
    --color-brand-muted: #dbeafe; /* mycket ljus blå bakgrund */

    /* ------------------------------------------------------------------
       Attention / Notice (NY – info, highlights, viktiga notices)
       ------------------------------------------------------------------ */
    --color-attention: #f59e0b; /* varm amber/orange */
    --color-attention-muted: #fef3c7; /* mjuk bakgrund */

    /* ------------------------------------------------------------------
       Danger (oförändrad – ska fortsatt vara tydligt separat)
       ------------------------------------------------------------------ */
    --color-danger: #b91c1c;

    /* ------------------------------------------------------------------
       Radiuses
       ------------------------------------------------------------------ */
    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 16px;

    /* ------------------------------------------------------------------
       Shadows
       ------------------------------------------------------------------ */
    --shadow-window: 0 18px 40px rgba(0, 0, 0, 0.06);

    /* ------------------------------------------------------------------
       Typography
       ------------------------------------------------------------------ */
    --font-body:
        "Inter", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    --font-heading:
        "Inter", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}