/* Sazón V80 Organic — design tokens.
   Source: Organic design system (Caprasimo + Figtree, cream ground, terracotta accent, olive second voice).
   Every other stylesheet reads colours, type, spacing, radii and shadows from these variables.
   The legacy aliases at the bottom keep the V78 stylesheets and compiled storefront on the same palette. */

:root {
  --color-bg: #f5ead8;
  --color-surface: #ebddc5;
  --color-text: #201e1d;
  --color-accent: #c67139;
  --color-accent-2: #7a8a5e;
  --color-divider: color-mix(in srgb, #201e1d 16%, transparent);
  --color-danger: #ad3535;
  --color-danger-bg: #fae0e0;
  --color-danger-ink: #8c2525;

  --color-neutral-100: #f9f4ed;
  --color-neutral-200: #eee7db;
  --color-neutral-300: #dcd3c4;
  --color-neutral-400: #c0b6a5;
  --color-neutral-500: #a19786;
  --color-neutral-600: #82796a;
  --color-neutral-700: #645c50;
  --color-neutral-800: #474238;
  --color-neutral-900: #2e2b25;

  --color-accent-100: #fff2eb;
  --color-accent-200: #ffe1d0;
  --color-accent-300: #ffc6a5;
  --color-accent-400: #f6a06b;
  --color-accent-500: #d67f48;
  --color-accent-600: #b2622d;
  --color-accent-700: #8c491a;
  --color-accent-800: #643312;
  --color-accent-900: #402310;

  --color-accent-2-100: #f0fae1;
  --color-accent-2-200: #e1eecc;
  --color-accent-2-300: #ccdbb2;
  --color-accent-2-400: #aebf92;
  --color-accent-2-500: #8fa073;
  --color-accent-2-600: #728157;
  --color-accent-2-700: #56633f;
  --color-accent-2-800: #3d472b;
  --color-accent-2-900: #272e1b;

  --font-heading: "Caprasimo", Georgia, serif;
  --font-heading-weight: 400;
  --font-body: "Figtree", system-ui, -apple-system, "Segoe UI", sans-serif;

  --space-1: 4.4px;
  --space-2: 8.8px;
  --space-3: 13.2px;
  --space-4: 17.6px;
  --space-6: 26.4px;
  --space-8: 35.2px;
  --space-12: 52.8px;
  --space-16: 70.4px;

  --radius-sm: 8px;
  --radius-md: 16px;
  --radius-lg: 28px;
  --radius-xl: 36px;
  --radius-pill: 999px;
  --radius-blob: 58% 42% 55% 45% / 48% 60% 40% 52%;

  --shadow-sm: 0 1px 2px color-mix(in srgb, #2e2b25 14%, transparent);
  --shadow-md: 0 3px 10px color-mix(in srgb, #2e2b25 16%, transparent);
  --shadow-lg: 0 12px 32px color-mix(in srgb, #2e2b25 22%, transparent);

  --ease-soft: cubic-bezier(.2, .8, .2, 1);
  --ease-bounce: cubic-bezier(.3, 1.4, .5, 1);
  --header-h: 68px;

  /* Legacy aliases — V78 stylesheets (portal-v2, admin-v3, site-fixes) and the compiled storefront CSS. */
  --green: var(--color-accent-2-800);
  --green2: var(--color-accent-2-700);
  --cream: var(--color-bg);
  --paper: var(--color-neutral-100);
  --terra: var(--color-accent);
  --gold: var(--color-accent-300);
  --ink: var(--color-text);
  --muted: var(--color-neutral-700);
  --line: var(--color-neutral-300);
  --ok: var(--color-accent-2-700);
  --warn: var(--color-accent-700);
  --bad: var(--color-danger);
  --sz-cream: var(--color-bg);
  --sz-forest: var(--color-accent-2-800);
  --sz-gold: var(--color-accent-400);
  --sz-gold-soft: var(--color-accent-100);
  --sz-ink: var(--color-text);
  --sz-terracotta: var(--color-accent);
  /* V96 · Brasa CTA: white on #a9552a is 5.22:1 (cream on the old accent was 3.03:1, below AA). */
  --color-cta-bg: #a9552a;
  --color-cta-bg-hover: #9a4b22;
  --color-cta-fg: #ffffff;
  /* Audit A-50/A-51: text that must read at small sizes on cream (#f5ead8) and sand (#ebddc5). */
  --color-text-secondary: #645c50; /* 5.53:1 on cream */
  --color-link: #8c491a;           /* 5.72:1 on cream, 5.0:1 on sand */
  --color-text-green: #56633f;     /* secondary green text, 5.3:1 on cream */
  --color-action-primary: var(--color-cta-bg);
  --color-action-primary-hover: var(--color-cta-bg-hover);
  /* V96 · Suscripción panel and plan cards. */
  --plan-selected-border: var(--color-accent-700);
  --plan-badge-bg: var(--color-accent-2-800);
  --plan-badge-fg: var(--color-accent-2-100);
  --save-chip-bg: var(--color-accent-2-200);
  --save-chip-fg: var(--color-accent-2-800);
  --step-done: var(--color-accent-2-700);
  --step-current: var(--color-cta-bg);
  --step-todo: var(--color-neutral-600);
  --status-action-bg: var(--color-accent-100);  --status-action-border: var(--color-accent-300);
  --status-ok-bg: var(--color-accent-2-100);    --status-ok-border: var(--color-accent-2-300);
  --status-info-bg: var(--color-neutral-100);   --status-info-border: var(--color-neutral-300);
  --status-error-bg: var(--color-danger-bg);    --status-error-border: #e9b3b3;
  --color-action-secondary: var(--color-accent-2-800);
  --color-brand-cream: var(--color-bg);
  --color-brand-green: var(--color-accent-2-800);
  --color-progress: var(--color-accent);
  --background: var(--color-bg);
  --foreground: var(--color-text);
  --primary: var(--color-accent-2-800);
  --primary-foreground: var(--color-neutral-100);
  --secondary: var(--color-surface);
  --muted-foreground: var(--color-neutral-700);
  --border: var(--color-neutral-300);
  --olive: var(--color-accent-2-600);
  --rust: var(--color-accent-600);
  --st-requested: var(--color-neutral-600);
  --st-confirmed: var(--color-accent-2-600);
  --st-cooking: var(--color-accent-500);
  --st-route: var(--color-accent-800);
  --st-delivered: var(--color-accent-2-800);
  --st-cancelled: var(--color-danger);
  --c-small: var(--color-accent-2-600);
  --c-medium: var(--color-accent);
  --c-serie: var(--color-accent-2-800);
  --c-grid: var(--color-neutral-300);
}

html { font-synthesis-weight: none; }
