:root {
  --bs-primary: #d63384;
  --bs-primary-rgb: 214, 51, 132;
  --bs-primary-text-emphasis: #55153A;
  --bs-primary-bg-subtle: #F8D7E7;
  --bs-primary-border-subtle: #F1AFCE;
}

.btn-primary {
  --bs-btn-bg: var(--bs-primary);
  --bs-btn-border-color: var(--bs-primary);
  --bs-btn-hover-bg: #b02a70;
  --bs-btn-hover-border-color: #b02a70;
  --bs-btn-active-bg: #a5276a;
  --bs-btn-active-border-color: #9b2463;
}

.btn-outline-primary {
  --bs-btn-color: var(--bs-primary);
  --bs-btn-border-color: var(--bs-primary);
  --bs-btn-hover-bg: var(--bs-primary);
  --bs-btn-hover-border-color: var(--bs-primary);
  --bs-btn-active-bg: var(--bs-primary);
  --bs-btn-active-border-color: var(--bs-primary);
}

.text-primary {
  color: var(--bs-primary) !important;
}

.bg-primary {
  background-color: var(--bs-primary) !important;
}

.border-primary {
  border-color: var(--bs-primary) !important;
}

/* Add other Bootstrap components that use primary color as needed */