/* Flywheel — Color System
   Sourced directly from the Flywheel Colour System sheet.
   All combinations are WCAG 2.1 AA/AAA compliant per brand guidance. */

:root {
  /* ---- Core palette ---- */
  --green-primary: #91d10b;   /* Primary Green — CTAs, active states, accents */
  --green-deep:    #437810;   /* Deep Green — text links, on-light emphasis */
  --green-text:    #407913;   /* Green text used on soft-green surfaces */
  --green-soft-bg: #eff9e1;   /* Soft Green BG — active nav, soft surfaces */
  --green-soft-2:  #eef5e3;   /* Soft action / status fill */
  --green-soft-border: #b3d986;

  --tan:        #f5f1e6;   /* Tan / Warm Neutral — banners, low-priority */
  --tan-border: #eae2d5;   /* Soft Tan Border */
  --tan-deep:   #736042;   /* Brown text on tan (LOW status) */

  --black:     #101010;   /* Pure brand black — logo, secondary CTA */
  --off-black: #1c1f24;   /* Off Black — dark panels (calendar header) */
  --white:     #fefefe;

  /* ---- Neutrals ---- */
  --page-bg:    #fdfdfd;   /* Page background */
  --card-bg:    #fefefe;   /* Card background */
  --gray-50:    #f7f7f7;
  --gray-100:   #f3f4f6;   /* Light Gray */
  --gray-200:   #e2e5ec;   /* Border Gray */
  --gray-300:   #d3d6db;
  --gray-icon:  #a7abb6;   /* Muted Icon Gray */
  --gray-text:  #727682;   /* Text Gray — secondary copy */

  /* ---- Semantic aliases ---- */
  --color-bg:           var(--page-bg);
  --color-surface:      var(--card-bg);
  --color-surface-soft: var(--green-soft-bg);
  --color-surface-warm: var(--tan);

  --text-strong:  var(--black);
  --text-body:    #2b2e33;
  --text-muted:   var(--gray-text);
  --text-on-dark: var(--white);
  --text-link:    var(--green-deep);

  --border-subtle: var(--gray-200);
  --border-strong: var(--black);
  --border-warm:   var(--tan-border);

  --accent:        var(--green-primary);
  --accent-press:  #7eb609;
  --focus-ring:    var(--green-primary);

  /* ---- Status system ---- */
  --status-confirmed-bg: var(--green-soft-2);
  --status-confirmed-fg: var(--green-text);
  --status-confirmed-bd: var(--green-soft-border);

  --status-high-bg: var(--green-soft-2);
  --status-high-fg: var(--green-text);
  --status-high-bd: #b8d989;

  --status-draft-bg: #fcfcfc;
  --status-draft-fg: #141414;
  --status-draft-bd: #121212;

  --status-medium-bg: #f5f5f7;
  --status-medium-fg: var(--gray-text);
  --status-medium-bd: var(--gray-300);

  --status-low-bg: var(--tan);
  --status-low-fg: var(--tan-deep);
  --status-low-bd: #e3dbcc;
}