/* ============================================================
   ConnectIE — Shared Design Tokens
   Single source of truth for color, shadow, and radius values.
   Link this BEFORE each page's own <style> block so page-specific
   rules can still override where needed.
   ============================================================ */

:root {
  /* Brand colors */
  --navy:         #1B2E4B;
  --navy-light:   #2A4165;
  --navy-faint:   rgba(27, 46, 75, 0.06);

  --orange:       #E8742A;
  --orange-light: #F59044;
  --orange-glow:  rgba(232, 116, 42, 0.13);

  --sage:         #6B9B6E;
  --sage-light:   #8DB890;
  --sage-faint:   rgba(107, 155, 110, 0.1);

  --sky:          #E8EFF6;
  --sky-dark:     #D4E0EC;

  --cream:        #F7F4EE;
  --cream-dark:   #EDE8DE;

  --white:        #FFFFFF;

  /* Text */
  --text-dark:    #1B2E4B;
  --text-mid:     #4A5568;
  --text-light:   #718096;

  /* Status */
  --error:        #D94F4F;
  --error-faint:  rgba(217, 79, 79, 0.08);
  --success:      #3D8B5F;
  --warning:      #B8860B;

  /* Shape & elevation */
  --radius-card:  18px;
  --shadow-sm:    0 2px 12px rgba(27, 46, 75, 0.07);
  --shadow-md:    0 6px 28px rgba(27, 46, 75, 0.11);
  --shadow-lg:    0 16px 50px rgba(27, 46, 75, 0.14);
}