/* ═══════════════════════════════════════════════════════════
   Canifa AI Platform — Shared Theme Variables
   Inspired by Memos (usememos.com) Light Theme
   ═══════════════════════════════════════════════════════════ */

:root {
    /* ── Surfaces ── */
    --background:       #f8f7f4;
    --foreground:       #1c1917;
    --card:             #ffffff;
    --card-foreground:  #1c1917;

    /* ── Muted / Secondary ── */
    --muted:            #f0efec;
    --muted-fg:         #78716c;
    --secondary:        #f0efec;
    --secondary-fg:     #57534e;

    /* ── Primary (Calm Blue) ── */
    --primary:          #3b5998;
    --primary-hover:    #2d4a7a;
    --primary-light:    #eef1f8;
    --primary-fg:       #ffffff;

    /* ── Accent ── */
    --accent:           #eef1f8;
    --accent-fg:        #1c1917;

    /* ── Borders & Input ── */
    --border:           #e7e5e2;
    --input:            #d6d3ce;
    --ring:             #3b5998;

    /* ── Sidebar ── */
    --sidebar:          #f2f0ed;
    --sidebar-fg:       #57534e;
    --sidebar-accent:   #e7e5e2;
    --sidebar-accent-fg:#1c1917;

    /* ── Semantic ── */
    --success:          #16a34a;
    --success-light:    #ecfdf5;
    --error:            #dc2626;
    --error-light:      #fef2f2;
    --warn:             #ca8a04;
    --warn-light:       #fefce8;
    --info:             #2563eb;
    --info-light:       #eff6ff;

    /* ── Dimensions ── */
    --radius:           0.5rem;
    --radius-sm:        0.25rem;
    --radius-lg:        0.75rem;
    --radius-xl:        1rem;

    /* ── Shadows ── */
    --shadow-xs:        0 1px 2px rgba(0,0,0,0.04);
    --shadow-sm:        0 1px 3px rgba(0,0,0,0.06);
    --shadow-md:        0 2px 8px rgba(0,0,0,0.06);
    --shadow-lg:        0 4px 12px rgba(0,0,0,0.08);

    /* ── Typography ── */
    --font-sans:        'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif;
    --font-mono:        'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
}

/* ── Global Reset ── */
*, *::before, *::after { box-sizing: border-box; }

/* ── Thin Scrollbar (Memos-style) ── */
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--input); border-radius: 999px; }
::-webkit-scrollbar-thumb:hover { background: var(--muted-fg); }

/* ── Font Smoothing ── */
body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
