/* Design tokens. The UI layer follows Fogito's Aurora system (same fonts,
   canvas and accent as planning.fogito.com); the data layer uses the
   validated chart palette. Colors carry meaning: the accent is for
   interaction only, company colors are identity. Profit and loss use their own
   pair, never a company hue: dark slate for profit and red for loss ("sorte tal
   og røde tal"); bars also carry the sign by direction. Validated with the
   dataviz palette check against the company colors (23 Sep 2026). */
:root{
  color-scheme: light;
  --canvas:  #F6F7FB;
  --surface: #FFFFFF;
  --raised:  #FFFFFF;
  --sunk:    #F1F2F8;
  --sunk-2:  #E7E9F2;
  --ink:     #14151C;
  --ink-2:   #5C5E74;
  --ink-3:   #8A8CA3;
  --ink-4:   #B9BACB;
  --hair:    rgba(29,27,63,.08);
  --hair-2:  rgba(29,27,63,.14);
  --hover:   rgba(29,27,63,.045);

  --accent:    #5B4BE8;
  --accent-hi: #4C3CDB;
  --on-accent: #FFFFFF;
  --wash:      rgba(91,75,232,.08);
  --wash-2:    rgba(91,75,232,.15);

  /* meaning */
  --neg:       #C0362C;   /* loss, over limit: text-safe red */
  --neg-wash:  rgba(208,59,59,.08);
  --neg-2:     rgba(208,59,59,.20);
  --pos:       #177245;   /* profit text */
  --pos-wash:  rgba(12,163,12,.08);
  --warn:      #A15C00;   /* amber text on light */
  --warn-wash: rgba(250,178,25,.14);
  --good-mark: #0ca30c;
  --warn-mark: #fab219;
  --serious-mark:#ec835a;
  --crit-mark: #d03b3b;

  /* chart palette (validated: light surface #FFFFFF) */
  --c1: #2a78d6;  /* CC Facility */
  --c2: #eb6834;  /* Palmgren */
  --c3: #1baf7a;  /* CC Ejendomsdrift */
  --c4: #eda100;  /* JLR Flyttesyn */
  --c-other: #B9BACB;
  --div-pos: #4a4f68;   /* profit: dark slate, "sorte tal" */
  --div-neg: #b3261e;   /* loss: red, ΔE 17 from Palmgren orange */
  /* ageing of open items: neutral, then amber to deep red */
  --age-0: #B9BACB; --age-1: #fab219; --age-2: #ec835a; --age-3: #d03b3b; --age-4: #8f2323;
  --grid: #EDEEF3;
  --axis: #C9CAD6;
  --forecast-wash: rgba(91,75,232,.05);

  --lift:   0 1px 2px rgba(26,24,58,.05), 0 8px 24px -12px rgba(26,24,58,.16);
  --lift-2: 0 2px 6px rgba(26,24,58,.08), 0 24px 56px -20px rgba(26,24,58,.30);
  --r:   14px;
  --r-s: 9px;
  --sans: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "DM Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  --side: 248px;
}

@media (prefers-color-scheme: dark){
  :root:where(:not([data-theme="light"])){
    color-scheme: dark;
    --canvas:  #0E0F17;
    --surface: #171A25;
    --raised:  #1E2230;
    --sunk:    #1C202C;
    --sunk-2:  #262B3A;
    --ink:     #ECEDF6;
    --ink-2:   #A2A6BF;
    --ink-3:   #767A94;
    --ink-4:   #474B60;
    --hair:    rgba(178,186,230,.10);
    --hair-2:  rgba(178,186,230,.18);
    --hover:   rgba(178,186,230,.06);
    --accent:    #9184FF;
    --accent-hi: #A79BFF;
    --on-accent: #121320;
    --wash:      rgba(145,132,255,.13);
    --wash-2:    rgba(145,132,255,.22);
    --neg:       #FF8A8A;
    --neg-wash:  rgba(230,103,103,.14);
    --neg-2:     rgba(230,103,103,.28);
    --pos:       #5ED39B;
    --pos-wash:  rgba(12,163,12,.14);
    --warn:      #F0B64A;
    --warn-wash: rgba(250,178,25,.14);
    --c1: #3987e5; --c2: #d95926; --c3: #199e70; --c4: #c98500;
    --c-other: #474B60;
    --div-pos: #858ba4; --div-neg: #b72164;
    --age-0: #474B60; --age-1: #c98a12; --age-2: #d06a45; --age-3: #d64545; --age-4: #ff8f8f;
    --grid: #232736; --axis: #383C4E;
    --forecast-wash: rgba(145,132,255,.07);
    --lift:   0 1px 0 rgba(0,0,0,.2);
    --lift-2: 0 20px 50px -20px rgba(0,0,0,.6);
  }
}
:root[data-theme="dark"]{
  color-scheme: dark;
  --canvas:  #0E0F17; --surface: #171A25; --raised: #1E2230; --sunk: #1C202C; --sunk-2: #262B3A;
  --ink: #ECEDF6; --ink-2: #A2A6BF; --ink-3: #767A94; --ink-4: #474B60;
  --hair: rgba(178,186,230,.10); --hair-2: rgba(178,186,230,.18); --hover: rgba(178,186,230,.06);
  --accent: #9184FF; --accent-hi: #A79BFF; --on-accent: #121320;
  --wash: rgba(145,132,255,.13); --wash-2: rgba(145,132,255,.22);
  --neg: #FF8A8A; --neg-wash: rgba(230,103,103,.14); --neg-2: rgba(230,103,103,.28);
  --pos: #5ED39B; --pos-wash: rgba(12,163,12,.14);
  --warn: #F0B64A; --warn-wash: rgba(250,178,25,.14);
  --c1: #3987e5; --c2: #d95926; --c3: #199e70; --c4: #c98500; --c-other: #474B60;
  --div-pos: #858ba4; --div-neg: #b72164;
  --age-0: #474B60; --age-1: #c98a12; --age-2: #d06a45; --age-3: #d64545; --age-4: #ff8f8f;
  --grid: #232736; --axis: #383C4E; --forecast-wash: rgba(145,132,255,.07);
  --lift: 0 1px 0 rgba(0,0,0,.2); --lift-2: 0 20px 50px -20px rgba(0,0,0,.6);
}