/**
 * cbd-brand.css — cbdcompared brand layer.
 *
 * Loaded site-wide (not guarded by the $is_fit_page check that gates
 * cbd-frontend.css) so WordPress chrome and non-plugin pages inherit the brand
 * too. Defines the design tokens that cbd-frontend.css consumes.
 *
 * The palette is emerald. It matches the favicon, suits the subject matter,
 * and keeps this site visually distinct from its sibling SuppTrend, which is
 * navy. Before this file existed the accent colour was #2563eb, inherited
 * from the pre-branding SuppTrend clone.
 *
 * Two-step naming is deliberate: raw ramp values first, semantic aliases
 * second. Components reference ONLY the semantic names, so a palette change
 * stays a handful of edits here.
 */
:root{
  /* Emerald — brand primary */
  --cbd-emerald-900:#064e3b;
  --cbd-emerald-800:#065f46;
  --cbd-emerald-700:#047857;
  --cbd-emerald-600:#059669;
  --cbd-emerald-500:#10b981;
  --cbd-emerald-400:#34d399; /* light enough for text on dark surfaces */
  --cbd-emerald-100:#d1fae5;
  --cbd-emerald-50:#ecfdf5;

  /* Green — price accent. Deliberately NOT emerald: primary and price are
     different roles, and a warmer green keeps "this costs X" from reading as
     "this is clickable". */
  --cbd-green-700:#15803d;
  --cbd-green-600:#16a34a;
  --cbd-green-50:#f0fdf4;

  /* Neutrals */
  --cbd-ink:#111827;
  --cbd-ink-muted:#4b5563;
  --cbd-ink-soft:#6b7280;   /* the most common secondary text colour in cbd-frontend.css */
  --cbd-border:#e5e7eb;
  --cbd-bg:#ffffff;
  --cbd-bg-subtle:#f9fafb;

  /* Semantic aliases — templates and components reference ONLY these */
  --cbd-color-primary:var(--cbd-emerald-700);
  --cbd-color-primary-hover:var(--cbd-emerald-600);
  --cbd-color-surface-dark:var(--cbd-emerald-900);
  /* green-700, not green-600: on white the latter is 3.30:1, which only
     passes as large text. Prices are the one figure that must stay legible
     at any size, so the token carries the 5.02:1 tone. */
  --cbd-color-price:var(--cbd-green-700);
  --cbd-color-text:var(--cbd-ink);
  --cbd-color-text-muted:var(--cbd-ink-muted);
  --cbd-color-border:var(--cbd-border);

  /* Scale */
  --cbd-radius:8px;
  --cbd-radius-sm:6px;
  --cbd-shadow-card:0 1px 3px rgba(6,78,59,.08);
}

/* Minimal WP-chrome override so theme links inherit the brand emerald.
   Fallbacks repeat the literal value for the case where this file loads but
   the custom properties are unsupported. */
a{color:var(--cbd-color-primary,#047857);}
a:hover{color:var(--cbd-color-primary-hover,#059669);}