.accordion-button:not(.collapsed),
.accordion-button:focus {
  outline: none;
  border-color: transparent;
  box-shadow: none;
  background-color: transparent;
}
.accordion-button::after {
  width: 18px;
  height: 18px;
  border-radius: 100%;
  background-color: var(--bs-danger);
  background-image: none !important;
}
.accordion-button.collapsed::after {
  background-color: var(--bs-gray-300);
}
.accordion-button:not(.collapsed){color:#000;}
/* Remove the accordion group effect */
.accordion {
  border: none; /* removes border on wrapper */
}

/* Give each item its own box */
.accordion-item {
  border: 1px solid #ddd;   /* box border */
  border-radius: 8px;       /* rounded corners */
  margin-bottom: 15px;      /* spacing between items */
  overflow: hidden;         /* keep corners clean */
  box-shadow: 0 2px 6px rgba(0,0,0,0.08); /* subtle shadow */
}

/* Ensure the button looks clean */
.accordion-button {
  border-radius: 0; 
  background-color: #fff; padding:1.5rem;
}

.accordion-button:not(.collapsed) {
  background-color: #f6f4ef; /* active state */
  box-shadow: none;
}

/* Remove the default Bootstrap border between items */
.accordion-item + .accordion-item {
  border-top: 1px solid #ddd;
}