.credit-option {
  cursor: pointer;
  transition: all 0.3s ease;
  border: 2px solid transparent;
  border-radius: 10px;
}

/* Hover effect */
.credit-option:hover {
  background-color: #f8f9fa; /* light gray */
  border-color: #0d6efd;     /* Bootstrap primary blue */
}

/* Selected (when radio is checked) */
.credit-option input:checked + .card-body {
  background-color: #0d6efd; /* Blue background when selected */
  color: #fff;               /* White text */
  border-radius: 10px;
  transition: all 0.3s ease;
}

/* Keep icon color white when selected */
.credit-option input:checked + .card-body i {
  color: #fff !important;
}