.has-black-color[class] {
  color: var(--global--color-black); }
  .has-black-color[class] > [class*="__inner-container"] {
    --local--color-primary: var(--global--color-black, #000000);
    color: var(--local--color-primary); }

.has-gray-color[class] {
  color: var(--global--color-gray); }
  .has-gray-color[class] > [class*="__inner-container"] {
    --local--color-primary: var(--global--color-gray, #000000);
    color: var(--local--color-primary); }

.has-dark-gray-color[class] {
  color: var(--global--color-dark-gray); }
  .has-dark-gray-color[class] > [class*="__inner-container"] {
    --local--color-primary: var(--global--color-dark-gray, #000000);
    color: var(--local--color-primary); }

.has-green-color[class] {
  color: var(--global--color-green); }
  .has-green-color[class] > [class*="__inner-container"] {
    --local--color-primary: var(--global--color-green, #FFFFFF);
    color: var(--local--color-primary); }

.has-blue-color[class] {
  color: var(--global--color-blue); }
  .has-blue-color[class] > [class*="__inner-container"] {
    --local--color-primary: var(--global--color-blue, #FFFFFF);
    color: var(--local--color-primary); }

.has-purple-color[class] {
  color: var(--global--color-purple); }
  .has-purple-color[class] > [class*="__inner-container"] {
    --local--color-primary: var(--global--color-purple, #FFFFFF);
    color: var(--local--color-primary); }

.has-red-color[class] {
  color: var(--global--color-red); }
  .has-red-color[class] > [class*="__inner-container"] {
    --local--color-primary: var(--global--color-red, #FFFFFF);
    color: var(--local--color-primary); }

.has-orange-color[class] {
  color: var(--global--color-orange); }
  .has-orange-color[class] > [class*="__inner-container"] {
    --local--color-primary: var(--global--color-orange, #FFFFFF);
    color: var(--local--color-primary); }

.has-yellow-color[class] {
  color: var(--global--color-yellow); }
  .has-yellow-color[class] > [class*="__inner-container"] {
    --local--color-primary: var(--global--color-yellow, #FFFFFF);
    color: var(--local--color-primary); }

.has-white-color[class] {
  color: var(--global--color-white); }
  .has-white-color[class] > [class*="__inner-container"] {
    --local--color-primary: var(--global--color-white, #FFFFFF);
    color: var(--local--color-primary); }

.has-background a,
.has-background p,
.has-background h1,
.has-background h2,
.has-background h3,
.has-background h4,
.has-background h5,
.has-background h6 {
  color: currentColor; }

.has-black-background-color[class] {
  background-color: var(--global--color-black); }
  .has-black-background-color[class] > [class*="__inner-container"] {
    --local--color-background: var(--global--color-black, #000000);
    background-color: var(--local--color-background); }

.has-dark-gray-background-color[class] {
  background-color: var(--global--color-dark-gray); }
  .has-dark-gray-background-color[class] > [class*="__inner-container"] {
    --local--color-background: var(--global--color-dark-gray, #000000);
    background-color: var(--local--color-background); }

.has-gray-background-color[class] {
  background-color: var(--global--color-gray); }
  .has-gray-background-color[class] > [class*="__inner-container"] {
    --local--color-background: var(--global--color-gray, #000000);
    background-color: var(--local--color-background); }

.has-light-gray-background-color[class] {
  background-color: var(--global--color-light-gray); }
  .has-light-gray-background-color[class] > [class*="__inner-container"] {
    --local--color-background: var(--global--color-light-gray, #FFFFFF);
    background-color: var(--local--color-background); }

.has-green-background-color[class] {
  background-color: var(--global--color-green); }
  .has-green-background-color[class] > [class*="__inner-container"] {
    --local--color-background: var(--global--color-green, #FFFFFF);
    background-color: var(--local--color-background); }

.has-blue-background-color[class] {
  background-color: var(--global--color-blue); }
  .has-blue-background-color[class] > [class*="__inner-container"] {
    --local--color-background: var(--global--color-blue, #FFFFFF);
    background-color: var(--local--color-background); }

.has-purple-background-color[class] {
  background-color: var(--global--color-purple); }
  .has-purple-background-color[class] > [class*="__inner-container"] {
    --local--color-background: var(--global--color-purple, #FFFFFF);
    background-color: var(--local--color-background); }

.has-red-background-color[class] {
  background-color: var(--global--color-red); }
  .has-red-background-color[class] > [class*="__inner-container"] {
    --local--color-background: var(--global--color-red, #FFFFFF);
    background-color: var(--local--color-background); }

.has-orange-background-color[class] {
  background-color: var(--global--color-orange); }
  .has-orange-background-color[class] > [class*="__inner-container"] {
    --local--color-background: var(--global--color-orange, #FFFFFF);
    background-color: var(--local--color-background); }

.has-yellow-background-color[class] {
  background-color: var(--global--color-yellow); }
  .has-yellow-background-color[class] > [class*="__inner-container"] {
    --local--color-background: var(--global--color-yellow, #FFFFFF);
    background-color: var(--local--color-background); }

.has-white-background-color[class] {
  background-color: var(--global--color-white); }
  .has-white-background-color[class] > [class*="__inner-container"] {
    --local--color-background: var(--global--color-white, #FFFFFF);
    background-color: var(--local--color-background); }

.has-background:not(.has-text-color).has-black-background-color[class], .has-background:not(.has-text-color).has-gray-background-color[class], .has-background:not(.has-text-color).has-dark-gray-background-color[class] {
  color: var(--global--color-white); }
  .has-background:not(.has-text-color).has-black-background-color[class] > [class*="__inner-container"], .has-background:not(.has-text-color).has-gray-background-color[class] > [class*="__inner-container"], .has-background:not(.has-text-color).has-dark-gray-background-color[class] > [class*="__inner-container"] {
    --local--color-primary: var(--global--color-background, #FFFFFF);
    color: var(--local--color-primary, var(--global--color-primary)); }
    .is-dark-theme .has-background:not(.has-text-color).has-black-background-color[class] > [class*="__inner-container"], .is-dark-theme .has-background:not(.has-text-color).has-gray-background-color[class] > [class*="__inner-container"], .is-dark-theme .has-background:not(.has-text-color).has-dark-gray-background-color[class] > [class*="__inner-container"] {
      --local--color-primary: var(--global--color-primary, #000000); }
.has-background:not(.has-text-color).has-green-background-color[class], .has-background:not(.has-text-color).has-blue-background-color[class], .has-background:not(.has-text-color).has-purple-background-color[class], .has-background:not(.has-text-color).has-red-background-color[class], .has-background:not(.has-text-color).has-orange-background-color[class], .has-background:not(.has-text-color).has-yellow-background-color[class], .has-background:not(.has-text-color).has-white-background-color[class] {
  color: var(--global--color-dark-gray); }
  .has-background:not(.has-text-color).has-green-background-color[class] > [class*="__inner-container"], .has-background:not(.has-text-color).has-blue-background-color[class] > [class*="__inner-container"], .has-background:not(.has-text-color).has-purple-background-color[class] > [class*="__inner-container"], .has-background:not(.has-text-color).has-red-background-color[class] > [class*="__inner-container"], .has-background:not(.has-text-color).has-orange-background-color[class] > [class*="__inner-container"], .has-background:not(.has-text-color).has-yellow-background-color[class] > [class*="__inner-container"], .has-background:not(.has-text-color).has-white-background-color[class] > [class*="__inner-container"] {
    --local--color-primary: var(--global--color-primary, #000000);
    color: var(--local--color-primary, var(--global--color-primary)); }
    .is-dark-theme .has-background:not(.has-text-color).has-green-background-color[class] > [class*="__inner-container"], .is-dark-theme .has-background:not(.has-text-color).has-blue-background-color[class] > [class*="__inner-container"], .is-dark-theme .has-background:not(.has-text-color).has-purple-background-color[class] > [class*="__inner-container"], .is-dark-theme .has-background:not(.has-text-color).has-red-background-color[class] > [class*="__inner-container"], .is-dark-theme .has-background:not(.has-text-color).has-orange-background-color[class] > [class*="__inner-container"], .is-dark-theme .has-background:not(.has-text-color).has-yellow-background-color[class] > [class*="__inner-container"], .is-dark-theme .has-background:not(.has-text-color).has-white-background-color[class] > [class*="__inner-container"] {
      --local--color-primary: var(--global--color-background, #FFFFFF); }

.has-purple-to-yellow-gradient-background {
  background: linear-gradient(160deg, var(--global--color-purple), var(--global--color-yellow)); }

.has-yellow-to-purple-gradient-background {
  background: linear-gradient(160deg, var(--global--color-yellow), var(--global--color-purple)); }

.has-green-to-yellow-gradient-background {
  background: linear-gradient(160deg, var(--global--color-green), var(--global--color-yellow)); }

.has-yellow-to-green-gradient-background {
  background: linear-gradient(160deg, var(--global--color-yellow), var(--global--color-green)); }

.has-red-to-yellow-gradient-background {
  background: linear-gradient(160deg, var(--global--color-red), var(--global--color-yellow)); }

.has-yellow-to-red-gradient-background {
  background: linear-gradient(160deg, var(--global--color-yellow), var(--global--color-red)); }

.has-purple-to-red-gradient-background {
  background: linear-gradient(160deg, var(--global--color-purple), var(--global--color-red)); }

.has-red-to-purple-gradient-background {
  background: linear-gradient(160deg, var(--global--color-red), var(--global--color-purple)); }