/*
 * Brand design tokens.
 *
 * Define project-specific variables here first. Map them to Pico variables in
 * ui/css/theme.css instead of using brand tokens directly throughout the markup.
 */

:root {
  --brand-color-primary: #ba7d00;
  --brand-color-red: #cb4234;
  --brand-color-red-soft: #f76b5a;
  --brand-color-yellow: #edb032;
  --brand-color-yellow-soft: #fec354;
  --brand-color-green: #08912b;
  --brand-color-green-soft: #47ba54;
  --brand-color-blue: #2d74dd;
  --brand-color-blue-soft: #4c93ff;

  --brand-gray-50: #fafafa;
  --brand-gray-100: #f5f5f5;
  --brand-gray-200: #e5e5e5;
  --brand-gray-300: #d4d4d4;
  --brand-gray-400: #a3a3a3;
  --brand-gray-500: #737373;
  --brand-gray-600: #525252;
  --brand-gray-700: #404040;
  --brand-gray-800: #262626;
  --brand-gray-900: #171717;
  --brand-gray-950: #0a0a0a;

  --brand-gold-50: #faf4d3;
  --brand-gold-100: #f7e5a5;
  --brand-gold-200: #eecc6a;
  --brand-gold-300: #dcb04d;
  --brand-gold-400: #cc9734;
  --brand-gold-500: #ba7d00;
  --brand-gold-600: #8c6720;
  --brand-gold-700: #624d1e;
  --brand-gold-800: #413617;
  --brand-gold-900: #221d0d;
  --brand-gold-950: #151409;
}