/* Main color variables  */
:root {
  --brand-50: #f0f9ff;
  --brand-100: #e0f3ff;
  --brand-200: #b8e7ff;
  --brand-300: #75d6ff;
  --brand-400: #2ec4ff;
  --brand-500: #02aaf2;
  --brand-600: #0088d2;
  --brand-700: #006ba8;
  --brand-900: #074c74;
  --brand-950: #04304d;

  --brand-primary: #006397;

  /* accent */
  --accent-50: #fbf5ff;
  --accent-100: #f5e9fe;
  --accent-200: #eed6fe;
  --accent-300: #e0b7fb;
  --accent-400: #cd88f8;
  --accent-500: #b95af2;
  --accent-700: #8d27c4;
  --accent-800: #7926a3;
  --accent-900: #632083;
  --accent-950: #450a61;

  --accent: #a739e4;

  /* success */
  --success-50: #ecfdf5;
  --success-100: #d2f9e5;
  --success-200: #a9f1d0;
  --success-300: #71e4b6;
  --success-400: #41d19c;
  --success-500: #14b57f;
  --success-700: #077556;
  --success-800: #085d45;
  --success-900: #084c3a;
  --success-950: #032b21;

  --success: #089166;

  /* warning */
  --warning-50: #fff8ec;
  --warning-100: #fff0d3;
  --warning-200: #ffdea7;
  --warning-300: #ffc56f;
  --warning-400: #ffa035;
  --warning-500: #ff830e;
  --warning-700: #c94d05;
  --warning-800: #9f3d0d;
  --warning-900: #80340e;
  --warning-950: #451805;

  /* 600 orange */
  --warning: #fb6b04;

  /* neutrals */
  --neutral-50: hsl(204, 45%, 98%);
  --neutral-100: hsl(210, 40%, 96%);
  --neutral-200: hsl(214, 32%, 91%);
  --neutral-300: hsl(213, 27%, 84%);
  --neutral-400: hsl(215, 20%, 65%);
  --neutral-500: hsl(215, 16%, 47%);
  --neutral-600: hsl(215, 19%, 35%);
  --neutral-700: hsl(215, 25%, 27%);
  --neutral-800: hsl(217, 33%, 17%);
  --neutral-900: hsl(222, 47%, 11%);
  --neutral-950: #020617;
}

/* Utility variables */
:root {
  --page-bg: rgb(241, 245, 249);
  --bs-body-bg: #fff;
  --body-text: var(--neutral-800);
  --primary-btn-hover: var(--brand-600);
}

/* variables for bootstrap colors */
:root {
  --brand-primary-rgb: 0, 99, 151;
  --success-rgb: 8, 145, 102;
  --primary-btn-hover-rgb: 0, 136, 210;
}