:root {
  --border-radius-primary: 6px;
  --border-radius-secondary: 9px;
  --border-radius-tertiary: 12px;

  --divider: #8e8e93; /* this is temporary, when site-wide dark mode is implemented, this will be moved to the next section */

  --text-primary: #3a3a3a;
  --text-secondary: #fff;

  --bg-primary: #f3f7f9;
  --bg-secondary: #f8f9fa;
  --bg-tertiary: #fff;

  --theme-primary: #3e6588;
  --theme-secondary: #2887af;
  --theme-tertiary: #edf6fa;

  --blue1: #d4e7ef;
  --blue2: #c4e2ee;

  --white: #ffffff;

  --gray1: #00000066;
  --gray2: #00000099;
  --gray3: #c4c4c4;
  --gray4: #c4c4c499;
  --gray5: #757575;
  --gray6: #f2f2f2;
  --gray7: #000000cc;
  --gray8: #666666;

  --yellow1: #ffe699;
  --yellow2: #ffd86b;
  --yellow3: #fcbc19;

  --red1: #de1c1c;
  --green: #4caf50;

  --disabled: var(--gray5);
}

:root[data-theme="dark"] {
}