/* ============================================================
   BRAND CSS VARIABLES — CHANGE THESE TO REBRAND COLORS
   ============================================================ */
:root {
  --brand-primary: #F14882;
  --brand-primary-light: #FF7EB3;
  --brand-primary-dark: #C91D5C;
  --brand-primary-very-dark: #8B0F3A;
  --brand-accent: #f59e0b;
}

/* Utility classes that use the CSS variables */
.bg-brand {
  background-color: var(--brand-primary);
}
.bg-brand-light {
  background-color: var(--brand-primary-light);
}
.bg-brand-dark {
  background-color: var(--brand-primary-dark);
}
.text-brand {
  color: var(--brand-primary);
}
.text-brand-light {
  color: var(--brand-primary-light);
}
.border-brand {
  border-color: var(--brand-primary);
}
.from-brand {
  --tw-gradient-from: var(--brand-primary) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(99 66 146 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.to-brand-light {
  --tw-gradient-to: var(--brand-primary-light) var(--tw-gradient-to-position);
}