/* Design tokens shared by every Weekly Shop view. */
:root {
  --color-primary: #2f6fed;
  --color-green: #2d8a57;
  --color-citrus: #f5b642;
  --color-tomato: #d95d39;
  --color-graphite: #1f2933;
  --color-ink: var(--color-graphite);
  --color-slate: #677487;
  --color-background: #f7f9fb;
  --color-surface: #ffffff;
  --color-border: #dde4ec;
  --color-success: #11895a;
  --color-warning: #b77a12;
  --color-error: #c63c3c;
  --color-coles: #e2372c;
  --color-woolworths: #7cc242;

  --shadow-card: 0 1px 2px rgba(15, 23, 42, 0.08), 0 1px 3px rgba(15, 23, 42, 0.06);
  --shadow-sheet: 0 8px 16px rgba(15, 23, 42, 0.10), 0 2px 6px rgba(15, 23, 42, 0.06);
  --shadow-modal: 0 24px 48px rgba(15, 23, 42, 0.16), 0 8px 16px rgba(15, 23, 42, 0.10);

  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 26px;
  --radius-pill: 999px;

  --space-4: 4px;
  --space-8: 8px;
  --space-12: 12px;
  --space-16: 16px;
  --space-24: 24px;
  --space-32: 32px;

  --ink: var(--color-graphite);
  --muted: var(--color-slate);
  --bg: var(--color-background);
  --panel: var(--color-surface);
  --line: var(--color-border);
  --accent: var(--color-primary);
  --accent-strong: #257326;
  --accent-soft: #eef4ff;
  --danger: #cf3a32;
  --save: #287b2f;
  --card: var(--color-surface);
  --shadow: var(--shadow-card);
}