/* ============================================================================
   Forecourt UK — "Warm Authority" theme layer
   ============================================================================
   Single source of truth for the brand's visual language. The existing page
   templates keep their component CSS (layout, structure, behaviour), but every
   colour and the fonts come from HERE via custom properties. Each template
   defines a tiny :root mapping its legacy var names onto these tokens, so no
   component rules need rewriting and nothing about layout/interaction changes.

   This file deliberately does NOT restructure or restyle components — only
   supplies tokens + font loading. Component choices live in the templates.
   ============================================================================ */

:root {
  /* --- Colour --- */
  --ink:          #221E19;  /* headers, footer, dark sections, primary text */
  --paper:        #F9F4EC;  /* page background (never pure white)           */
  --surface:      #FFFDF9;  /* cards, inputs, elevated surfaces             */
  --border:       #E4DCCB;  /* default borders / dividers                   */
  --border-muted: #EDE5D6;  /* card borders                                 */
  --text-muted:   #6E5F52;  /* secondary text, labels (AA 5.6:1 on paper)   */
  --accent:       #B84E1E;  /* primary CTA (AA 4.98:1 w/ surface text)      */
  --accent-hover: #A94316;
  --success:      #2F6B44;  /* fresh / live (AA 5.5:1 on success-bg)        */
  --success-bg:   #E8F1E8;
  --warning:      #8F5C1E;  /* stale (AA 4.85:1 on warning-bg)              */
  --warning-bg:   #F5EDDD;

  /* Risk / destructive / "closed" family (muted, warm) */
  --danger:       #8F3A2B;
  --danger-bg:    #F9E9E4;

  /* --- Derived tints & borders (component fills; sourced here, not in
         components). State families pair a strong ink with a washed tint:
         success (open / live), warning (stale), danger (closed / error),
         and a warm surface-tint for active/selected fills. --- */
  --surface-tint:  #F5EDE0;   /* active decision cards, warm selected fills */
  --error:         #8F3A2B;   /* readable error text on --paper (AA 7:1)    */
  --success-border:#B9D6C0;
  --warning-border:#E5C896;
  --danger-border: #E8BFB8;

  /* --- Typography --- */
  --font-display: "Fraunces", Georgia, serif;      /* display/headings      */
  --font-body:    "Work Sans", system-ui, sans-serif; /* body/UI text       */

  /* --- Shape & elevation --- */
  --radius-sm:  8px;    /* small tags/icon chips (kitchen-sink default)     */
  --radius-md: 12px;    /* inputs, buttons                                  */
  --radius-lg: 16px;    /* cards, panels                                    */
  --radius-pill: 999px; /* pills/chips ONLY where pills already exist       */
  --shadow-soft: 0 20px 40px rgba(34, 30, 25, 0.18); /* search card on dark */
  --border-width: 1px;
}

600;700&family=Work+Sans:wght@400;500;600;700&display=swap');

/* --- Base (no layout change — body rules are re-applied in-line per page) -- */
* { box-sizing: border-box; }

/* Visible focus for ALL interactive elements — WCAG 2.4.7 / a11y */
:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

/* Consistent interactive cursor + tap highlight */
a, button, summary, [role="button"] { -webkit-tap-highlight-color: transparent; }