/* themes come from the backend, and should be added to the parent element*/
.theme-blue {
  --theme-color: #96a6bf;
}

.theme-green {
  --theme-color: #7ea295;
}

.theme-purple {
  --theme-color: #a99fbb;
}

.theme-red {
  --theme-color: #dba8a3;
}

.theme-yellow {
  --theme-color: #d8a25c;
}

/* Once you have a theme color in the parent element, you can use these classes to style your content */

.theme-text {
  color: var(--theme-color);
}

.theme-background {
  background-color: var(--theme-color);
}

.theme-border {
  border-color: var(--theme-color);
}