/* ═══════════════════════════════════════════════════════════
   tokens.css — Designsystem-tokens, Home Inventory "Familie"
   Brug kun var(--…) andre steder — ingen hårdkodede farver.
═══════════════════════════════════════════════════════════ */

/* ── Mørkt tema (standard) ── */
:root,
[data-theme="dark"] {
    --bg:          #161412;
    --surface:     #221F1B;
    --surface-2:   #2A2621;
    --bar:         #1B1916;
    --line:        #302C27;
    --dash:        #4A443C;
    --text:        #F4EFE7;
    --muted:       #ABA296;
    --faint:       #766E64;
    --accent:      #4DB6A0;
    --accent-text: #7ED0BD;
    --on-accent:   #0B2621;
    --accent-soft: #1E2B27;
    --red:         #E8765E;
    --red-text:    #F0927E;
    --amber:       #E5A84B;
    --amber-text:  #EDBB6A;
    --shadow:      rgba(0, 0, 0, .45);
}

/* ── Lyst tema ── */
[data-theme="light"] {
    --bg:          #F6F2EC;
    --surface:     #FFFFFF;
    --surface-2:   #F1ECE4;
    --bar:         #FFFFFF;
    --line:        #ECE5DA;
    --dash:        #CFC5B6;
    --text:        #1F1C18;
    --muted:       #6B6358;
    --faint:       #A39A8E;
    --accent:      #1F7A69;
    --accent-text: #1A6A5B;
    --on-accent:   #FFFFFF;
    --accent-soft: #E3F0EC;
    --red:         #D25B41;
    --red-text:    #B3452D;
    --amber:       #D99326;
    --amber-text:  #94600D;
    --shadow:      rgba(31, 122, 105, .28);
}

/* ── Tema-uafhængige tokens ── */
:root {
    /* Typografi */
    --font-display: 'Fraunces', Georgia, serif;
    --font-body:    'Figtree', system-ui, -apple-system, sans-serif;

    /* Radius */
    --r-sm:   10px;
    --r-md:   14px;
    --r-lg:   18px;
    --r-xl:   22px;
    --r-pill: 999px;

    /* Spacing (4 px base) */
    --s-1:  4px;
    --s-2:  8px;
    --s-3:  12px;
    --s-4:  16px;
    --s-5:  20px;
    --s-6:  24px;
    --s-8:  32px;

    /* Minimum trykflade */
    --tap: 44px;
}

/* ── Profilfarver (6 slots, deterministisk pr. user-id % 6) ── */
:root {
    --p1: #4DB6A0; --p1-on: #0E2A24;
    --p2: #E5A84B; --p2-on: #3A2606;
    --p3: #8EA9F0; --p3-on: #111D3A;
    --p4: #E89BB4; --p4-on: #3A1020;
    --p5: #B7A3E8; --p5-on: #231740;
    --p6: #9CCB7A; --p6-on: #1C2E10;
}