/**
 * Brand Alchemy LLC — parent brand design tokens (CSS custom properties)
 *
 * Canonical file in this repo. Sister sites may copy this file or import it in
 * their build; keep copies in sync when this file changes.
 *
 * Values match docs/BRAND_GUIDELINES.md and the Tailwind CDN gray scale used on
 * the live marketing site. Semantic names are for custom CSS / non-Tailwind use.
 */

:root {
  /* Typography — same families as index.html Google Fonts link */
  --ba-font-sans: 'Inter', ui-sans-serif, system-ui, sans-serif;
  --ba-font-serif: 'Source Serif 4', Georgia, 'Times New Roman', serif;

  /* Tailwind default gray palette (canonical neutrals on this site) */
  --ba-gray-50: #f9fafb;
  --ba-gray-100: #f3f4f6;
  --ba-gray-200: #e5e7eb;
  --ba-gray-300: #d1d5db;
  --ba-gray-400: #9ca3af;
  --ba-gray-500: #6b7280;
  --ba-gray-600: #4b5563;
  --ba-gray-700: #374151;
  --ba-gray-800: #1f2937;
  --ba-gray-900: #111827;

  /* Page & type roles */
  --ba-color-page-bg: #ffffff;
  --ba-color-text: var(--ba-gray-900);
  --ba-color-text-body: var(--ba-gray-500);
  --ba-color-text-muted: var(--ba-gray-400);
  --ba-color-text-accent-soft: var(--ba-gray-300);

  /* Surfaces & borders */
  --ba-color-border-subtle: var(--ba-gray-100);
  --ba-color-border: var(--ba-gray-200);
  --ba-color-surface-muted: var(--ba-gray-50);
  --ba-color-surface-strong: var(--ba-gray-100);

  /* Brand chrome (primary CTA, selection) */
  --ba-color-primary: #000000;
  --ba-color-on-primary: #ffffff;
  --ba-color-primary-hover: var(--ba-gray-800);

  /* Overlays */
  --ba-color-scrim: rgb(0 0 0 / 0.6);

  /*
   * Catalog only — Google / Yelp / “both” column styling in components/Products.tsx.
   * If these change, update the platform table in docs/BRAND_GUIDELINES.md in the same PR.
   */
  --ba-catalog-google-bg: #f0f4ff;
  --ba-catalog-google-accent: #4285f4;
  --ba-catalog-yelp-bg: #fff5f5;
  --ba-catalog-yelp-accent: #d32323;
  --ba-catalog-neutral-bg: #f3f4f6;
  --ba-catalog-both-bg: #f1f2f4;
  /** Combined-column emphasis (not full gray-900) */
  --ba-catalog-emphasis: #111111;
  /** Inactive catalog feature lines (between Tailwind gray-300 and gray-400) */
  --ba-catalog-feature-inactive: #c4c8cd;
}