/* Erzeugt aus src/supermarket/design/tokens.py - nicht von Hand ändern.
   Neu erzeugen mit: supermarket design build */


:root {
  --bg: #f6f7f9;
  --panel: #ffffff;
  --panel-2: #fbfbfd;
  --ink: #16181d;
  --ink-2: #5b6270;
  --ink-3: #888f9d;
  --line: #e2e5ea;
  --line-2: #eef0f4;
  --accent: #2c5fd6;
  --accent-in: #ffffff;
  --ok: #15803d;
  --warn: #b45309;
  --bad: #be123c;
  --up: #be123c;
  --down: #15803d;
  --band: rgba(44, 95, 214, .10);
  --migros: #f26f21;
  --coop: #b3151b;
  --aldi: #1f4b9b;
  --denner: #7a1f6d;
  --lidl: #16667a;
  --volg: #2e7d32;
  --ottos: #c2410c;
  --s1: #e8590c;
  --s2: #2f9e44;
  --s3: #9c36b5;
  --s4: #0c8599;
  --s5: #c2255c;
  --shadow-panel: 0 1px 2px rgba(16,24,40,.05), 0 1px 3px rgba(16,24,40,.06);
  --shadow-overlay: 0 8px 26px rgba(0,0,0,.28);

  --sp-0: 0;
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;

  --text-xs: 11px;
  --text-sm: 12px;
  --text-md: 13px;
  --text-base: 14px;
  --text-lg: 16px;
  --text-xl: 20px;
  --text-xxl: 26px;

  --weight-normal: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;

  --radius-sm: 6px;
  --radius-md: 9px;
  --radius-lg: 14px;
  --radius-pill: 9999px;

  --z-raised: 5;
  --z-sticky: 40;
  --z-overlay: 60;

  --dur-fast: .12s;
  --dur-slow: .16s;

  --tint-weak: 10%;
  --tint-soft: 16%;
  --tint-medium: 26%;
  --tint-strong: 55%;

  --mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;
  --sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;

  --bp-narrow: 760px;

  --page-max: 1380px;
  --topbar-h: 54px;
  --line-h: 1.5;
  --thumb: 116px;
  --thumb-sm: 40px;
  --map-h: 480px;
  --login-w: 372px;
  --col-wide: 400px;
  --col-tile: 230px;
  --col-card: 272px;
  --col-fact: 140px;
  --who-max: 200px;
  --nav-w: 224px;
  --nav-w-narrow: 56px;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0f1216;
    --panel: #171b21;
    --panel-2: #1c2129;
    --ink: #e8eaee;
    --ink-2: #a3abb8;
    --ink-3: #79818f;
    --line: #262c35;
    --line-2: #1f242c;
    --accent: #6d97f5;
    --accent-in: #0f1216;
    --ok: #4ade80;
    --warn: #fbbf24;
    --bad: #fb7185;
    --up: #fb7185;
    --down: #4ade80;
    --band: rgba(109, 151, 245, .14);
    --migros: #ff9354;
    --coop: #f2666c;
    --aldi: #6f9ce8;
    --denner: #d987cc;
    --lidl: #5cb8cf;
    --volg: #6fc275;
    --ottos: #ff8f5e;
    --s1: #ff9a5c;
    --s2: #6ede7e;
    --s3: #d08ce6;
    --s4: #4fc4d8;
    --s5: #f2779f;
    --shadow-panel: 0 1px 2px rgba(0,0,0,.4);
    --shadow-overlay: 0 8px 26px rgba(0,0,0,.5);
  }
}

:root[data-theme="dark"] {
  --bg: #0f1216;
  --panel: #171b21;
  --panel-2: #1c2129;
  --ink: #e8eaee;
  --ink-2: #a3abb8;
  --ink-3: #79818f;
  --line: #262c35;
  --line-2: #1f242c;
  --accent: #6d97f5;
  --accent-in: #0f1216;
  --ok: #4ade80;
  --warn: #fbbf24;
  --bad: #fb7185;
  --up: #fb7185;
  --down: #4ade80;
  --band: rgba(109, 151, 245, .14);
  --migros: #ff9354;
  --coop: #f2666c;
  --aldi: #6f9ce8;
  --denner: #d987cc;
  --lidl: #5cb8cf;
  --volg: #6fc275;
  --ottos: #ff8f5e;
  --s1: #ff9a5c;
  --s2: #6ede7e;
  --s3: #d08ce6;
  --s4: #4fc4d8;
  --s5: #f2779f;
  --shadow-panel: 0 1px 2px rgba(0,0,0,.4);
  --shadow-overlay: 0 8px 26px rgba(0,0,0,.5);
}