html {
  --gc-light-blue: #16a8d5;
  --gc-blue: #3E00FF;
  --gc-blue-hover: #5b24ff;
  --gc-purple: #0D0764;
  --gc-purple-hover: #0b0d9d;
  --gc-green: #0FCE7C;
  --gc-green-hover: #25E899;
  --gc-light-green: rgb(211, 250, 235);
  --gc-pink: #f9006c;
  --gc-pink-hover: #f167a3;
  --gc-yellow: #F5A623;

  --gc-white: #ffffff;
  --gc-light-violet: #bbafd0;
  --gc-dark-violet: #130b88;
  --gc-black: #0d023a;
  --t: #ccc;

  --gc-grey: #fafafa;
  --gc-blue-grey: #f2f6f9;
  --gc-dark-grey: #868789;
  --gc-medium-dark-gray: #666666;
  --gc-darker-grey: #3d3d3d;

  --text-light: #D8D8D8;
  --text-dark: var(--gc-black);

  --bg-shade-0: white;
  --bg-shade-1: #EFF3F6;
  --bg-shade-2: #5f5c74;
  --bg-activity: white;
  --bg-comment-container: var(--bg-shade-1);

  --main-bg: #eff3f6;
  --form-input-bg: white;
  --form-input-color: rgba(0, 0, 0, 0.38);
  --button-radio-icon-color: #3e00ff;
  --link-color: #3e00ff;
  --townsquare-link-color: black;
  --townsquare-block-header-color: #626365;
  --active-button-border-color: var(--link-color);
  --default-text-color: var(--text-dark);
  --pinned-activity: var(--gc-green);
}

/* @media screen and (prefers-color-scheme: dark) { */
html.dark-mode {
  --gc-light-blue: #16a8d5;
  --gc-blue: #3E00FF;
  --gc-blue-hover: #5b24ff;
  --gc-purple: #0D0764;
  --gc-purple-hover: #0b0d9d;
  --gc-green: #0FCE7C;
  --gc-green-hover: #25E899;
  --gc-light-green: transparent;

  --gc-pink: #f9006c;
  --gc-pink-hover: #f167a3;
  --gc-yellow: #F5A623;

  --gc-white: #ffffff;
  --gc-light-violet: #bbafd0;
  --gc-dark-violet: #130b88;
  --gc-black: #0d023a;
  --t: #ccc;

  --gc-grey: #fafafa;
  --gc-blue-grey: #f2f6f9;
  --gc-dark-grey: #868789;
  --gc-darker-grey: #3d3d3d;
  --gc-medium-dark-gray: #bbbbbb;
  --gc-darker-grey: #3d3d3d;

  --text-light: #D8D8D8;
  --text-dark: var(--gc-black);

  --bg-shade-0: #221D3E;
  --bg-shade-1: #373351;
  --bg-shade-2: #5F5C74;
  --bg-activity: var(--bg-shade-1);
  --bg-comment-container: var(--bg-shade-0);



  --main-bg: #0a0428;
  --form-input-bg: #221D3E;
  --form-input-color: white;
  --button-radio-icon-color: white;
  --link-color: #91b5ff;
  --townsquare-link-color: white;
  --townsquare-block-header-color: white;
  --active-button-border-color: white;
  --default-text-color: white;
  --pinned-activity: white;
}

.text-highlight-purple {
  color: var(--gc-purple);
}

.text-highlight-green {
  color: var(--gc-green);
}

.text-highlight-dark-blue {
  color: var(--gc-blue);
}

.text-highlight-gc-purple {
  color: var(--gc-purple);
}

.text-highlight-gc-blue {
  color: var(--gc-blue);
}

.text-highlight-light-blue {
  color: var(--gc-light-blue);
}

.text-highlight-pink {
  color: var(--gc-pink);
}

.text-highlight-yellow {
  color: var(--gc-yellow);
}

.text-medium-dark-grey {
  color: var(--gc-medium-dark-gray);
}

.text-black {
  color: #000;
}