/* naturahonig design tokens — palette A "Honig & Creme" (approved 2026-10-19).
   Ships unchanged as app/static/css/tokens.css. Light only by design: product
   photos are cut-outs on warm tiles and the shop has one visual world. */
:root {
  color-scheme: light;

  /* Type */
  --font-sans: "Instrument Sans", "Helvetica Neue", Arial, sans-serif;
  --step--2: 0.75rem;
  --step--1: 0.8125rem;
  --step-0: 0.9375rem;
  --step-1: 1.0625rem;
  --step-2: 1.375rem;
  --step-3: clamp(1.75rem, 1.3rem + 2vw, 2.75rem);
  --step-4: clamp(2.25rem, 1.6rem + 3vw, 3.5rem);
  --leading-tight: 1.15;
  --leading: 1.5;

  /* Surfaces and ink */
  --paper: #FFFFFF;
  --paper-2: #F7F4EE;
  --paper-3: #EFEAE1;
  --ink: #221E19;
  --ink-2: #5E574D;
  --ink-3: #6F675C;          /* smallest legible grey: 5.5:1 on paper, 5.0:1 on paper-2 */
  --line: #E7E1D6;
  --line-strong: #CFC6B7;
  --accent: #9A6512;         /* honey brown: links, icons, focus accents (4.9:1 on paper) */
  --accent-strong: #7A4E0C;
  --on-ink: #FBF8F2;
  --scrim: rgb(34 30 25 / 0.42);

  /* Category tiles (Category.tile_color picks one of these names) */
  --tile-honey: #F2E2B3;
  --tile-pollen: #F0D9A0;
  --tile-wax: #F2EBDC;
  --tile-blossom: #EFD9CF;
  --tile-sage: #E0E5D3;
  --tile-neutral: #ECE8E0;

  /* Status (separate from the accent) */
  --ok: #2F6B3F;     --ok-bg: #E3EFE0;
  --info: #2D5A7B;   --info-bg: #E2ECF3;
  --warn: #835400;   --warn-bg: #F7EACB;
  --danger: #A4372B; --danger-bg: #F7E1DD;
  --muted: #5E574D;  --muted-bg: #EEEAE3;

  /* Space (4 px base) */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 72px;
  --space-9: 104px;

  /* Shape */
  --radius-sm: 6px;
  --radius-input: 10px;
  --radius-card: 12px;
  --radius-tile: 16px;
  --radius-pill: 999px;

  /* Depth */
  --shadow-1: 0 1px 2px rgb(34 30 25 / 0.06);
  --shadow-2: 0 2px 6px rgb(34 30 25 / 0.06), 0 16px 48px rgb(34 30 25 / 0.16);
  --shadow-jar: drop-shadow(0 10px 14px rgb(60 40 10 / 0.14));

  /* Motion */
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --dur-1: 0.15s;
  --dur-2: 0.3s;

  /* Layers */
  --z-header: 10;
  --z-drawer: 50;
  --z-toast: 60;

  --page-max: 1280px;
}