.accent_0 {
  --accentColor: #0066ff;
}
.accent_1 {
  --accentColor: #7a86cb;
}
.accent_2 {
  --accentColor: #ba68c6;
}
.accent_3 {
  --accentColor: #fd8b64;
}
.accent_4 {
  --accentColor: #acd580;
}
.accent_5 {
  --accentColor: #fcd450;
}
.accent_6 {
  --accentColor: #4db6ac;
}
.accent_7 {
  --accentColor: #ee6390;
}
.accent_8 {
  --accentColor: #e57375;
}
.accent_9 {
  --accentColor: #ff8a66;
}
.bg1 {
  background: var(--primaryColor);
}

.bg2 {
  background: var(--secondaryColor);
}
.bg3 {
  background: var(--diplomaColor);
}
.bg4 {
  background: var(--degreeColor);
}
html {
  --textColor: white;
  --primaryColor: rgba(255, 255, 255, 0.028);
  --secondaryColor: rgba(255, 255, 255, 0.056);
  --diplomaColor: rgba(255, 255, 255, 0.104);
  --degreeColor: rgba(255, 255, 255, 0.179);
  --hoverColor: rgba(255, 255, 255, 0.056);
}
* {
  color: var(--textColor);
}
.fancy_theme {
  --textColor: white;
}
.dark_theme {
  --textColor: white;
}
.black_theme {
  --textColor: white;
  --primaryColor: rgb(9, 9, 9);
  --secondaryColor: black;
  --diplomaColor: black;
  --degreeColor: black;
  .blurred_bg {
    background: black;
    backdrop-filter: none;
  }
}
.light_theme {
  background: white !important;
  --textColor: black;
  --primaryColor: rgb(255, 255, 255);
  --secondaryColor: rgb(246, 248, 250);
  --diplomaColor: rgb(250, 250, 250);
  --degreeColor: rgb(255, 255, 255);
  input {
    color: black !important;
  }
  svg {
    filter: invert(1);
  }
  input::placeholder {
    color: black !important;
  }
}
