:root {
  --bs-red: #ec4136;
  --bs-green: #77b901;
  --bs-yellow: #ffd200;
  --bs-orange: #f68e1e;
  --bs-blue: #0066ff;
  --bs-purple: #9900cc;
}

/* ========== BACKGROUND ========== */
.bg-red {
  background-color: var(--bs-red);
}

.bg-orange {
  background-color: var(--bs-green);
}

.bg-yellow {
  background-color: var(--bs-yellow);
}

.bg-green {
  background-color: var(--bs-green);
}

.bg-blue {
  background-color: var(--bs-blue);
}

.bg-purple {
  background-color: var(--bs-purple);
}

.bg-form {
  background-color: var(--bs-form-bg);
}

.bg-gradient-red {
  background: linear-gradient(to bottom, var(--bs-red), color-mix(in srgb, var(--bs-red) 60%, black));
}

.bg-gradient-orange {
  background: linear-gradient(to bottom, var(--bs-orange), color-mix(in srgb, var(--bs-orange) 60%, black));
}

.bg-gradient-yellow {
  background: linear-gradient(to bottom, var(--bs-yellow), color-mix(in srgb, var(--bs-yellow) 60%, black));
}

.bg-gradient-green {
  background: linear-gradient(to bottom, var(--bs-green), color-mix(in srgb, var(--bs-green) 60%, black));
}

.bg-gradient-blue {
  background: linear-gradient(to bottom, var(--bs-blue), color-mix(in srgb, var(--bs-blue) 60%, black));
}

.bg-gradient-purple {
  background: linear-gradient(to bottom, var(--bs-purple), color-mix(in srgb, var(--bs-purple) 60%, black));
}

/* ========== TEXT ========== */
.text-orange {
  color: var(--bs-orange);
}

.text-red {
  color: var(--bs-red);
}

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

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

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

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

.text-brown {
  color: #FFE9A2;
}

/* ========== MIXED ========== */
.text-bg-red {
  background-color: var(--bs-red);
  color: var(--bs-white);
}

.text-bg-orange {
  background-color: var(--bs-orange);
  color: var(--bs-white);
}

.text-bg-yellow {
  background-color: var(--bs-yellow);
  color: var(--bs-white);
}

.text-bg-green {
  background-color: var(--bs-green);
  color: var(--bs-white);
}

.text-bg-blue {
  background-color: var(--bs-blue);
  color: var(--bs-white);
}

.text-bg-purple {
  background-color: var(--bs-purple);
  color: var(--bs-white);
}