.magic-tools-faq-component .faq-header {
  display: flex;
  align-items: center;
  justify-content: center;
}

.magic-tools-faq-component .faq-icon {
  font-size: 14px;
  color: #e53e3e;
}

.magic-tools-faq-component .faq-title {
  color: #111827;
  font-weight: 800;
  font-size: 14px;
  letter-spacing: 0.3px;
}

/* Accordion Item Styling */
.magic-tools-faq-component .faq-accordion-item {
  background-color: transparent;
  border: 1px solid #ff7b54 !important;
  border-radius: 8px !important;
  overflow: hidden;
}

/* Overriding React-Bootstrap Accordion Button Defaults */
.magic-tools-faq-component .faq-accordion .accordion-button {
  background-color: transparent !important;
  box-shadow: none !important;
  padding: 12px 16px;
  color: #1b0a2a;
  font-size: 13px;
  font-weight: 800;
}

.magic-tools-faq-component .faq-accordion .accordion-button:focus {
  box-shadow: none !important;
}

/* Custom + / - Icon Logic */
.magic-tools-faq-component .faq-accordion .accordion-button::after {
  background-image: none !important; /* Remove Bootstrap default arrow */
  content: "+";
  font-size: 18px;
  font-weight: 800;
  color: #4c1d95;
  width: auto;
  height: auto;
  transform: none !important; /* Disable default icon rotation */
  line-height: 1;
}

/* Change icon to minus (−) when accordion is open */
.magic-tools-faq-component .faq-accordion .accordion-button:not(.collapsed)::after {
  content: "−";
}

/* Accordion Body Border Line */
.magic-tools-faq-component .faq-accordion .accordion-collapse {
  border-top: 1px solid #ff7b54;
}

.magic-tools-faq-component .faq-accordion-body {
  background-color: transparent;
  padding: 12px 16px;
}

.magic-tools-faq-component .faq-answer-text {
  color: #4b5563;
  font-size: 12.5px;
  line-height: 1.5;
  font-weight: 500;
}