/* DopaCart — design tokens (OKLCH). Due mondi: shopping (caldo) + reward (viola/blu). Mai #000/#fff. */
:root {
  /* Base neutra calda */
  --bg:        oklch(0.971 0.013 70);
  --bg-2:      oklch(0.955 0.018 65);
  --surface:   oklch(0.998 0.005 70);
  --surface-2: oklch(0.945 0.016 70);
  --border:    oklch(0.898 0.018 70);
  --text:      oklch(0.225 0.022 60);
  --text-soft: oklch(0.490 0.024 60);
  --text-faint:oklch(0.555 0.022 65);

  /* Colore-AZIONE unico (solo CTA) */
  --action:       oklch(0.640 0.215 18);
  --action-press: oklch(0.560 0.205 18);
  --action-soft:  oklch(0.640 0.215 18 / 0.12);
  --on-action:    oklch(0.995 0.005 70);

  /* Accenti dopamine décor (reward/gamification, MAI sui CTA) */
  --joy-violet: oklch(0.560 0.205 290);
  --joy-blue:   oklch(0.660 0.155 245);
  --joy-mint:   oklch(0.745 0.150 165);
  --joy-amber:  oklch(0.815 0.155 78);
  --joy-pink:   oklch(0.700 0.180 350);

  /* Semantici */
  --success: var(--joy-mint);
  --info:    var(--joy-blue);
  --warning: var(--joy-amber);
  --danger:  oklch(0.600 0.190 25);

  /* Gradienti firma */
  --grad-action: linear-gradient(135deg, oklch(0.690 0.210 30), oklch(0.640 0.215 8));
  --grad-warm:   linear-gradient(135deg, oklch(0.800 0.160 60), oklch(0.660 0.215 20));
  --grad-reward: linear-gradient(140deg, oklch(0.620 0.210 300), oklch(0.620 0.170 250));
  --grad-mint:   linear-gradient(140deg, oklch(0.780 0.150 170), oklch(0.700 0.150 200));
  --grad-hero:   linear-gradient(150deg, oklch(0.660 0.215 15) 0%, oklch(0.640 0.200 350) 48%, oklch(0.580 0.200 290) 100%);

  /* Badge sconto giallo pop (dal riferimento) */
  --badge:    oklch(0.885 0.185 100);
  --on-badge: oklch(0.28 0.06 60);

  /* Tipografia */
  --font-display: 'Unbounded', 'Hanken Grotesk', system-ui, sans-serif;
  --font: 'Hanken Grotesk', -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  --fs-xs:.75rem; --fs-sm:.875rem; --fs-base:1rem; --fs-lg:1.18rem;
  --fs-xl:1.45rem; --fs-2xl:1.85rem; --fs-3xl:2.4rem; --fs-4xl:3.1rem;

  /* Spacing */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px;
  --sp-5:20px; --sp-6:24px; --sp-8:32px; --sp-10:40px; --sp-12:48px; --sp-16:64px;

  /* Raggi */
  --r-sm:10px; --r-md:16px; --r-lg:22px; --r-xl:30px; --r-full:999px;

  /* Ombre (morbide, grandi) */
  --shadow-soft: 0 1px 3px oklch(0.30 0.03 50 / 0.08), 0 2px 6px oklch(0.30 0.03 50 / 0.05);
  --shadow-card: 0 6px 22px oklch(0.32 0.04 45 / 0.10), 0 2px 6px oklch(0.32 0.04 45 / 0.06);
  --shadow-lift: 0 18px 50px oklch(0.32 0.05 40 / 0.16);
  --shadow-pop:  0 16px 44px oklch(0.56 0.20 300 / 0.30);
  --shadow-nav:  0 -6px 24px oklch(0.30 0.03 50 / 0.10);

  /* Motion */
  --dur-micro:180ms; --dur-base:260ms; --dur-meso:440ms;
  --ease-out: cubic-bezier(.22,1,.36,1);
  --ease-pop: cubic-bezier(.34,1.45,.5,1);

  /* App shell */
  --app-max: 480px;
  --nav-h: 68px;

  /* Grana (SVG noise data-uri) */
  --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
}

/* Nota: nessun dark-mode automatico — DopaCart è sempre chiaro/crema (come il riferimento),
   così l'identità resta coerente anche se il sistema è in tema scuro. */