/* ============================================================
   Chat2Evidence — Design Tokens & CSS Variables
   ============================================================ */

:root {
  /* Brand */
  --teal:          #0d9488;
  --teal-dark:     #0f766e;
  --teal-hover:    #0a7c71;
  --teal-bg:       #f0fdfa;
  --teal-border:   #99f6e4;
  --teal-light:    #ccfbf1;
  --navy:          #0c1f3f;
  --navy-mid:      #1e3a5f;
  --orange:        #e84d1c;
  --orange-hover:  #c43d12;
  --orange-glow:   rgba(232, 77, 28, 0.25);

  /* Neutrals */
  --white:   #ffffff;
  --gray-50:  #f8fafc;
  --gray-100: #f1f5f9;
  --gray-200: #e2e8f0;
  --gray-300: #cbd5e1;
  --gray-400: #94a3b8;
  --gray-500: #64748b;
  --gray-600: #475569;
  --gray-700: #334155;
  --gray-800: #1e293b;
  --gray-900: #0f172a;

  /* WhatsApp chat colours */
  --sent-bg:     #dcf8c6;
  --sent-border: #b4dca0;
  --recv-bg:     #ffffff;

  /* Shadows */
  --shadow-sm:  0 1px 3px rgba(0,0,0,.08),  0 1px 2px rgba(0,0,0,.06);
  --shadow-md:  0 4px 16px rgba(12,31,63,.10), 0 2px 6px rgba(0,0,0,.06);
  --shadow-lg:  0 8px 40px rgba(12,31,63,.15), 0 4px 12px rgba(0,0,0,.08);
  --shadow-xl:  0 20px 60px rgba(12,31,63,.20);

  /* Radius */
  --r-sm:  6px;
  --r-md:  10px;
  --r-lg:  14px;
  --r-xl:  20px;
  --r-full: 9999px;

  /* Spacing */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;

  /* Typography */
  --font-sans:    'DM Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-serif:   'DM Serif Display', Georgia, serif;
  --font-mono:    'JetBrains Mono', 'Fira Code', 'Courier New', monospace;

  /* Transitions */
  --t-fast:   0.15s ease;
  --t-normal: 0.25s ease;
  --t-slow:   0.4s ease;
}