/* Warm Precision — global design tokens (PLAN-REDESIGN §2.2–2.5).
   Single source of truth. All other stylesheets reference these variables.
   No component rules here — keep this file *tokens only*. */

:root {
  /* -- Colours ---------------------------------------------------------- */
  --color-primary: #722F37;          /* Bordo — H-headings, CTA hover, active icons */
  --color-primary-dark: #4A1C23;     /* Dark bordo — dark section BGs, footer hover */
  --color-primary-hover: #4A1C23;    /* Alias for legacy pages.css compatibility */
  --color-secondary: #C5A55A;        /* Antique gold — accents, borders, decor */
  --color-secondary-light: #D4B96B;  /* Brighter gold — hover state on gold */
  --color-surface: #FFFFFF;          /* Base surface */
  --color-auth-surface: #F8E3C8;     /* Ciepły pomarańcz — tło SEKCJI ekranów auth
                                        (reset hasła / link do logowania / logowanie).
                                        Karta formularza zostaje BIAŁA — kontrast jest celowy. */
  --color-surface-light: #FAF7F2;    /* Warm white — light section BGs, cards */
  --color-surface-dark: #1A1716;     /* Near-black — header, footer, dark sections */
  --color-border: #E8E4DF;           /* Warm grey — dividers, card borders */
  --color-text-primary: #2C2624;     /* Dark brown — body text on light BG */
  --color-text: #2C2624;             /* Alias for legacy compatibility */
  --color-text-secondary: #6B6460;   /* Warm grey — captions, meta, muted */
  --color-text-muted: #6B6460;       /* Alias for legacy compatibility */
  --color-text-on-dark: #F5F0EB;     /* Warm off-white — text on dark BG */
  --color-success: #5C7A3B;          /* Olive — confirmations */
  --color-error: #C0392B;            /* Wine red — validation errors */
  --color-ai: #8B5E83;               /* Wine purple — AI sommelier accent */

  /* Aliases for wines.css + future modules — audit 04-visual-ux P0-3.
     Map old wines.css token names onto canonical design-system tokens,
     eliminating the third-gold (#b78a3c) divergence across the site. */
  --color-accent: var(--color-secondary);
  --color-accent-strong: var(--color-secondary-light);
  --color-surface-tinted: var(--color-surface-light);
  --color-fg-muted: var(--color-text-muted);

  /* -- Typography ------------------------------------------------------- */
  --font-serif: "Lora", "EB Garamond", Georgia, "Times New Roman", serif;
  --font-sans: "Work Sans", "Inter", system-ui, -apple-system,
    BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-italic: "Instrument Serif", "Lora", Georgia, serif;
  --font-mono: "IBM Plex Mono", "JetBrains Mono", ui-monospace,
    SFMono-Regular, Menlo, Consolas, monospace;

  /* Typography scale — mobile-first clamp() (PLAN §2.3). */
  --font-h1: clamp(2rem, 5vw, 3.5rem);         /* 32 → 56px */
  --font-h2: clamp(1.625rem, 3.5vw, 2.5rem);   /* 26 → 40px */
  --font-h3: clamp(1.25rem, 2.5vw, 1.75rem);   /* 20 → 28px */
  --font-body: clamp(1rem, 1.2vw, 1.125rem);   /* 16 → 18px */
  --font-small: 0.875rem;                       /* 14px */
  --font-cta: clamp(1rem, 1.2vw, 1.125rem);    /* 16 → 18px */

  --fw-regular: 400;
  --fw-medium: 500;
  --fw-bold: 700;

  --lh-tight: 1.2;
  --lh-base: 1.5;
  --lh-relaxed: 1.75;

  /* -- Space scale (8-based) ------------------------------------------- */
  --space-1: 0.25rem;   /* 4px  — micro gaps, icon-to-text */
  --space-2: 0.5rem;    /* 8px  — inline gap, icon padding */
  --space-3: 1rem;      /* 16px — button padding, grid gap */
  --space-4: 1.5rem;    /* 24px — card padding, element gap */
  --space-5: 2rem;      /* 32px — mobile section margin */
  --space-6: 3rem;      /* 48px — tablet section margin */
  --space-7: 4rem;      /* 64px — desktop section margin */
  --space-8: 6rem;      /* 96px — hero padding */
  --space-9: 8rem;      /* 128px — large separators */

  /* -- Radius ---------------------------------------------------------- */
  --radius: 6px;
  --radius-lg: 12px;
  --radius-full: 999px;

  /* -- Shadow ---------------------------------------------------------- */
  --shadow-card: 0 2px 8px rgba(26, 23, 22, 0.04);
  --shadow-card-hover: 0 8px 24px rgba(26, 23, 22, 0.08);
  --shadow-focus: 0 0 0 3px rgba(197, 165, 90, 0.25);

  /* -- Layout ---------------------------------------------------------- */
  --container-max: 1280px;
  --container-padding: clamp(1rem, 5vw, 4rem);
  --header-height: 72px;

  /* -- Z-index --------------------------------------------------------- */
  --z-header: 50;
  --z-drawer: 60;
  --z-modal: 100;
  --z-toast: 150;
  --z-skiplink: 200;

  /* -- Transitions ----------------------------------------------------- */
  --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-base: 250ms cubic-bezier(0.4, 0, 0.2, 1);

  /* -- Breakpoints (reference only; use @media with px values) ---------
   *  --bp-sm: 480px   — narrow phone
   *  --bp-md: 768px   — tablet / large phone
   *  --bp-lg: 1024px  — small laptop
   *  --bp-xl: 1280px  — desktop (container-max)
   */

  /* ==================================================================
     Status semantic tokens — for /panel/leady/ status pills.
     Each status pairs a strong foreground color with a soft tinted
     background. All foreground colors meet WCAG AA (4.5:1) on the
     paired soft background. Status enums:
       degustacja: new / contacted / scheduled / completed / rejected
       franczyza:  new / contacted / converted / rejected
     ================================================================== */
  --color-status-new-fg: #1A4A8B;          /* Deep blue — fresh inquiry */
  --color-status-new-bg: #DDE9F8;
  --color-status-contacted-fg: #8B5E1A;    /* Warm amber — in progress */
  --color-status-contacted-bg: #F8EFD9;
  --color-status-scheduled-fg: #6B4A8B;    /* Wine-purple aligned — booked */
  --color-status-scheduled-bg: #ECE2F4;
  --color-status-completed-fg: #4A6B2D;    /* Olive — done */
  --color-status-completed-bg: #E2EBD3;
  --color-status-converted-fg: #722F37;    /* Bordeaux — franchise won */
  --color-status-converted-bg: #F2DDDF;
  --color-status-rejected-fg: #6B6460;     /* Warm grey — closed lost */
  --color-status-rejected-bg: #ECE8E2;
}