/* Define custom colors */
:root {
  /* Change primary color */
  --bs-primary: #ff9601;
  --bs-primary-hover-color: #ff9601;
  --bs-primary-active-color: #ff9601; /* Define the active color */
  
  /* Change secondary color */
  --bs-secondary: #146eb2;
  --bs-secondary-hover-color: #146eb2;
  --bs-secondary-active-color: #146eb2; /* Define the active color */
}

/* Apply primary color to an element on hover */
.btn:hover {
  background-color: var(--bs-primary-hover-color, #ff9601);
  background-color: var(--bs-primary-btn-bg, #ff9601);
}

/* Apply primary color to an element when it's active (e.g., clicked) */
.btn:hover {
  background-color: var(--bs-primary-active-color, #ff9601);
}

/* Apply secondary color to another element on hover */
.btn:hover {
  background-color: var(--bs-secondary-hover-color, #146eb2);
}

/* Apply secondary color to another element when it's active (e.g., clicked) */
.btn:active {
  background-color: var(--bs-secondary-active-color, #146eb2);
}