/**
 * Theme Accordion Styles
 * 
 * This file contains all custom styles for accordion blocks using the 
 * ESAB accordion component.
 * 
 * If additional accordion styles or variants are added and the file becomes 
 * too large, create a sub-file (e.g., theme_accordion-mobile.css) to organize 
 * the code better.
 */

.wp-block-uagb-container.cont-acc {
  gap: var(--gap-m);
}

/* Padding auf den Inhalt statt auf .esab__body -> beim Auf/Zu wird nur die Höhe animiert (iOS) */
#main .wp-block-uagb-container.cont-acc .wp-block-esab-accordion .esab__body {
  padding: 0;
}

#main
  .wp-block-uagb-container.cont-acc
  .wp-block-esab-accordion
  .esab__body
  > * {
  padding: var(--gap-m) calc(var(--gap-m) * 0.8);
}

.wp-block-uagb-container.cont-acc .wp-block-esab-accordion .esab__container {
  gap: 0;
}

.wp-block-uagb-container.cont-acc .wp-block-esab-accordion .esab__head {
  border-bottom: 2px solid var(--ast-global-color-1);
  border-radius: 0 !important;
}

.wp-block-uagb-container.cont-acc .wp-block-esab-accordion .esab__heading_tag {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: var(--base-font-size);
  font-family: var(--mainfont);
  font-weight: 300;
  line-height: 1.71;
  gap: 15px;
}

.esab__heading_tag::after {
  content: "";
  display: block;
  --my-size: 1em;
  width: var(--my-size);
  height: var(--my-size);
  transition: rotate 0.5s ease 0s;
  background-image: url("/wp-content/themes/astra-impuls-child/img/acc-plus.svg");
  background-size: contain;
  flex-shrink: 0;
}

.wp-block-esab-accordion-child.esab__active_accordion
  .esab__heading_tag::after {
  rotate: -90deg;
}

@media (max-width: 768px) {
  .wp-block-esab-accordion .esab__head {
    gap: 0 !important;
  }

  .wp-block-uagb-container.cont-acc
    .wp-block-esab-accordion
    .esab__heading_tag {
    gap: 15px;
    line-height: 1.3;
  }

  .wp-block-uagb-container.cont-acc .wp-block-esab-accordion .esab__head {
    border-bottom: 1px solid var(--ast-global-color-1);
  }
}
