/* ==========================================================================
   ST Accordion
   Mobile-first: base = mobile, @media (min-width: 960px) = desktop
   ========================================================================== */

.st-accordion {
  display: block;
}

.st-accordion__details {
  background: var(--st-accordion-trigger-bg, transparent);
  border-radius: var(--st-accordion-trigger-radius, 0px);
  overflow: hidden;
  border-block-start: var(--st-accordion-border-width, 0px) solid rgba(var(--color-text), 0.08);
  border-block-end: var(--st-accordion-border-width, 0px) solid rgba(var(--color-text), 0.08);
}

.st-accordion + .st-accordion .st-accordion__details {
  margin-block-start: -1px;
  border-block-start: none;
}

.st-accordion__trigger {
  display: flex;
  align-items: center;
  gap: var(--st-accordion-trigger-gap, 12px);
  padding-block: 15px;
  padding-inline-start: var(--st-accordion-trigger-padding-start, 0px);
  padding-inline-end: var(--st-accordion-trigger-padding-end, 0px);
  cursor: pointer;
  list-style: none;
}

.st-accordion__icon {
  width: 24px;
  height: 24px;
  flex-shrink: 0;
}

.st-accordion__title {
  flex: 1 0 0;
  margin: 0;
}

.st-accordion__arrow {
  flex-shrink: 0;
  transition: transform 200ms;
}

.st-accordion [open] .st-accordion__arrow {
  transform: rotate(180deg);
}

.st-accordion__content {
  padding-block-end: 15px;
  padding-inline-start: var(--st-accordion-trigger-padding-start, 0px);
  padding-inline-end: var(--st-accordion-trigger-padding-end, 0px);
}