/** 
 * Color Variables
 */
.block-accordion {
  padding: 0 20%;
}

.block-accordion__header {
  padding: 15px;
  cursor: pointer;
  border-bottom: 1px solid #ccc;
  margin-bottom: 5px;
  display: flex;
  justify-content: space-between; /* Align text and icon on opposite ends */
  align-items: center; /* Center vertically */
  font-weight: bold;
}

.block-accordion__header:hover {
  background-color: #ddd;
}

.block-accordion__icon {
  font-weight: normal;
  transition: transform 0.3s ease; /* Smooth transition for the icon */
  color: #a17de6;
}

.block-accordion__content {
  display: none; /* Hide content by default */
  padding: 10px;
}

.block-accordion__item--active .block-accordion__content {
  display: block; /* Show content when the item is active */
}

.block-accordion__item--active .block-accordion__icon {
  content: "-";
  transform: rotate(180deg); /* Optional: add rotation effect */
}

.block-accordion {
  padding: 0 20%;
}

/* Responsive adjustments */
@media (max-width: 1024px) {
  .block-accordion {
    padding: 0 15%;
  }
}
@media (max-width: 768px) {
  .block-accordion {
    padding: 0 10%;
  }
}
@media (max-width: 480px) {
  .block-accordion {
    padding: 0 5%;
  }
}