/* =============================================================
   bo-faq — Brand Offer FAQ Section
   Alle Klassen mit bo-faq- praefixiert
   ============================================================= */

.bo-faq-wrapper {
  background-color: var(--bfq-bg, #ffffff);
  padding: var(--bfq-pad-top, 32px) 16px var(--bfq-pad-bottom, 32px);
  box-sizing: border-box;
  width: 100%;
  display: block;
}

.bo-faq-wrapper *,
.bo-faq-wrapper *::before,
.bo-faq-wrapper *::after {
  box-sizing: border-box;
}

.bo-faq-container {
  max-width: 1280px;
  margin: 0 auto;
  background-color: var(--bfq-cont-bg, #ffffff);
  border: 1px solid var(--bfq-cont-border, #ececec);
  border-radius: var(--bfq-cont-radius, 12px);
  padding: 22px 28px;
}

/* ===== Headline / Subline ===== */
.bo-faq-headline {
  margin: 0 0 6px 0;
  color: var(--bfq-headline-color, #1a1a1a);
  font-size: var(--bfq-headline-size, 16px);
  line-height: 1.3;
  text-align: var(--bfq-headline-align, left);
  font-weight: 600;
}
.bo-faq-headline p { margin: 0; }

.bo-faq-subline {
  margin: 0 0 16px 0;
  color: var(--bfq-subline-color, #888888);
  font-size: var(--bfq-subline-size, 13px);
  line-height: 1.4;
  text-align: var(--bfq-subline-align, left);
  font-style: italic;
}
.bo-faq-subline p { margin: 0; }
.bo-faq-subline p + p { margin-top: 4px; }

/* ===== List ===== */
.bo-faq-list {
  display: flex;
  flex-direction: column;
  border-top: 1px solid var(--bfq-border, #ececec);
}

/* ===== Item ===== */
.bo-faq-item {
  background-color: var(--bfq-item-bg, transparent);
}

.bo-faq-item + .bo-faq-item {
  border-top: 1px solid var(--bfq-border, #ececec);
}

/* ===== Trigger / Summary ===== */
.bo-faq-trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 0;
  cursor: pointer;
  user-select: none;
  list-style: none;
}

.bo-faq-trigger::-webkit-details-marker {
  display: none;
}

.bo-faq-trigger::marker {
  display: none;
}

.bo-faq-trigger:hover .bo-faq-question {
  opacity: 0.85;
}

.bo-faq-question {
  flex: 1 1 auto;
  color: var(--bfq-q-color, #1a1a1a);
  font-size: var(--bfq-q-size, 14px);
  line-height: 1.4;
  font-weight: 400;
  min-width: 0;
}
.bo-faq-question p { margin: 0; display: inline; }

/* ===== Plus / Minus Icon (CSS-only) ===== */
.bo-faq-icon {
  position: relative;
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  color: var(--bfq-icon-color, #888888);
}

.bo-faq-icon::before,
.bo-faq-icon::after {
  content: '';
  position: absolute;
  background-color: currentColor;
  border-radius: 1px;
}

.bo-faq-icon::before {
  /* horizontale Linie */
  top: 50%;
  left: 0;
  right: 0;
  height: 2px;
  transform: translateY(-50%);
}

.bo-faq-icon::after {
  /* vertikale Linie */
  left: 50%;
  top: 0;
  bottom: 0;
  width: 2px;
  transform: translateX(-50%);
  transition: transform 0.2s ease;
}

.bo-faq-item[open] .bo-faq-icon::after {
  transform: translateX(-50%) scaleY(0);
}

/* ===== Answer ===== */
.bo-faq-answer {
  padding: 0 0 16px 0;
}

.bo-faq-answer-inner {
  color: var(--bfq-a-color, #555555);
  font-size: var(--bfq-a-size, 14px);
  line-height: 1.55;
  padding-right: 30px;
}

.bo-faq-answer-inner p { margin: 0; }
.bo-faq-answer-inner p + p { margin-top: 8px; }

.bo-faq-answer-inner ul,
.bo-faq-answer-inner ol {
  margin: 0 0 8px 0;
  padding-left: 18px;
}
.bo-faq-answer-inner li { margin: 0 0 4px 0; }
.bo-faq-answer-inner li:last-child { margin-bottom: 0; }

/* ===== Mobile ===== */
@media screen and (max-width: 749px) {
  .bo-faq-wrapper {
    padding-left: 12px;
    padding-right: 12px;
  }

  .bo-faq-container {
    padding: 18px 18px;
  }

  .bo-faq-trigger {
    padding: 14px 0;
  }

  .bo-faq-answer-inner {
    padding-right: 0;
  }
}
