/* Bequest design tokens — single source of truth for color, radius, shadow.
   Reference these via var(--bq-*) anywhere in custom CSS. Derived from the brand
   colors in The Knowledge and the marketing mockup. */

@import url('/assets/fonts/inter/current/inter.css');

:root {
  /* Brand */
  --bq-blue: #1E88E5;
  --bq-blue-dark: #1565C0;
  --bq-blue-darker: #0D47A1;
  --bq-blue-soft: #E3F2FD;
  --bq-blue-softer: #F5FAFE;

  --bq-yellow: #FBC02D;       /* direct giving */
  --bq-yellow-dark: #F9A825;
  --bq-yellow-darker: #8B6914;
  --bq-yellow-soft: #FFF8E1;

  --bq-green: #43A047;        /* campaigns */
  --bq-green-dark: #2E7D32;
  --bq-green-darker: #1B5E20;
  --bq-green-soft: #E8F5E9;

  --bq-red: #E53935;          /* pools */
  --bq-red-dark: #C62828;
  --bq-red-darker: #8B1F1C;
  --bq-red-soft: #FFEBEE;

  /* Neutrals */
  --bq-black: #0F172A;
  --bq-gray-900: #1E293B;
  --bq-gray-700: #475569;
  --bq-gray-500: #64748B;
  --bq-gray-400: #94A3B8;
  --bq-gray-300: #CBD5E1;
  --bq-gray-200: #E2E8F0;
  --bq-gray-100: #F1F5F9;
  --bq-gray-50:  #F8FAFC;
  --bq-white: #FFFFFF;

  /* Radius */
  --bq-radius-sm: 6px;
  --bq-radius: 10px;
  --bq-radius-lg: 16px;
  --bq-radius-xl: 24px;

  /* Elevation */
  --bq-shadow-sm: 0 1px 2px rgba(15,23,42,0.04);
  --bq-shadow:    0 4px 12px rgba(15,23,42,0.06);
  --bq-shadow-lg: 0 20px 40px rgba(15,23,42,0.08);

  /* Type */
  --bq-font-sans: 'InterVariable', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --bq-font-mono: 'SF Mono', Monaco, Inconsolata, 'Fira Code', monospace;
}