/* ==========================================================================
   ACCESSIBILITY WIDGET — DESIGN TOKENS (standalone)
   The panel stylesheet (a11y-panel.css) was built for the Witt & Goldsworthy
   site and reads its colors/fonts from CSS custom properties. This file
   provides those properties so the widget works on any site.

   TO RE-BRAND: edit the values below to match your site's palette and
   type. Nothing in a11y-panel.css or a11y-panel.js needs to change.

   If your site already defines variables with these names, delete this
   file (or remove the duplicates) to avoid conflicts.
   ========================================================================== */

:root {
  /* Panel chrome colors (originally WG navy/gold; restyle freely) */
  --color-navy:       #1a2744;  /* panel header, FAB background, active tiles */
  --color-gold:       #b58a4e;  /* accent: FAB glyph, active-step dashes, focus rings */
  --color-gold-deep:  #8e6835;  /* hover states, section headings */
  --color-gold-pale:  #efe3cc;  /* outline-view nested-list rule */
  --color-charcoal:   #3d3d3d;  /* tile label text */
  --color-mid-gray:   #636e72;  /* secondary text, statement link */
  --color-light-gray: #b2bec3;  /* tile borders */
  --color-pale:       #f7f5ef;  /* outline-view hover wash */
  --color-pale-gray:  #f8f9fa;  /* panel body background */
  --color-white:      #ffffff;

  /* Fonts used by the panel UI. The original site used commercial fonts
     (Concourse); these fallbacks are free system fonts. Swap in your own. */
  --font-ui:   'Gill Sans', 'Trebuchet MS', Helvetica, Arial, sans-serif;
  --font-caps: 'Gill Sans', Helvetica, Arial, sans-serif;
  --font-body: Georgia, 'Palatino Linotype', serif;
}