/* Palette is verbatim from the Planters Etc. brand guide, p1 "Color Palatte". Do not add hues. */
:root{
  /* Brand palette — the six official swatches */
  --color-cream:#f2e6da;
  --color-navy:#055474;
  --color-crimson:#ee2e50;
  --color-mustard:#d8b528;
  --color-coral:#f36e51;
  --color-green:#7ac143;

  /* Tints & shades — derived for UI states only; never introduced as new brand colors */
  --color-navy-900:#023a51;
  --color-navy-700:#044964;
  --color-navy-300:#5b8ca4;
  --color-navy-100:#d6e3e9;
  --color-green-700:#5fa32f;
  --color-green-600:#6cb437;
  --color-green-100:#e6f4da;
  --color-crimson-700:#cf1f3f;
  --color-coral-700:#e05a3d;
  --color-mustard-700:#bd9c17;
  --color-cream-200:#faf4ee;
  --color-cream-400:#e6d6c6;

  /* Neutrals — sampled from the brand's studio photography (warm gray sweep) */
  --color-ink:#151515;
  --color-graphite:#3a3a3c;
  --color-studio-600:#87868a;
  --color-studio-400:#b4b3b6;
  --color-studio-200:#dedde0;
  --color-studio-100:#efeef0;
  --color-white:#ffffff;

  /* ---- Semantic aliases: use these in components ---- */
  --text-primary:var(--color-navy);
  --text-body:var(--color-graphite);
  --text-muted:var(--color-studio-600);
  --text-inverse:var(--color-white);
  --text-on-dark:var(--color-cream);
  --text-accent:var(--color-green);
  --text-price:var(--color-navy);
  --text-sale:var(--color-crimson);
  --text-link:var(--color-navy);
  --text-link-hover:var(--color-green);

  --surface-page:var(--color-white);
  --surface-card:var(--color-white);
  --surface-sunken:var(--color-cream-200);
  --surface-cream:var(--color-cream);
  --surface-studio:var(--color-studio-100);
  --surface-dark:var(--color-navy);
  --surface-accent:var(--color-green);
  --surface-alert:var(--color-crimson);

  --border-subtle:var(--color-studio-200);
  --border-strong:var(--color-studio-400);
  --border-dark:var(--color-navy);
  --border-focus:var(--color-green);

  --action-primary-bg:var(--color-green);
  --action-primary-bg-hover:var(--color-green-700);
  --action-primary-fg:var(--color-white);
  --action-secondary-bg:var(--color-navy);
  --action-secondary-bg-hover:var(--color-navy-900);
  --action-secondary-fg:var(--color-white);
  --action-ghost-fg:var(--color-navy);
  --action-disabled-bg:var(--color-studio-200);
  --action-disabled-fg:var(--color-studio-600);

  --status-success:var(--color-green);
  --status-warning:var(--color-mustard);
  --status-error:var(--color-crimson);
  --status-info:var(--color-navy);
  --status-promo:var(--color-coral);
}