/**
 * 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.
 */

#main .wp-block-esab-accordion-child.esab__active_accordion .esab__head {
    background: none !important;
}

#main .wp-block-esab-accordion-child.esab__active_accordion .esab__heading_tag {
    /* color: var(--color-4) !important;*/
}

#main .esab__expand svg {
    /*fill: var(--color-4) !important;*/
}

#main .wp-block-esab-accordion-child.esab__active_accordion .esab__body {
    background-color: transparent !important;
}

.esab__head {
    border-bottom: 1px solid var(--color-5);
}

.esab__body .wp-block-uagb-container {
    padding: 1em;
}

.esab__body .wp-block-uagb-container * {
    color: var(--ast-global-color-3);
}

.wp-block-esab-accordion .esab__container>.wp-block-esab-accordion-child {
    border-color: transparent !important;
    background-color: #ffff;
}

.wp-block-esab-accordion>.esab__container {
    gap: 4px !important;
}

.wp-block-esab-accordion .wp-block-esab-accordion-child>.esab__head {
    padding-left: var(--gap-m) !important;
    padding: 0.9em var(--gap-m) !important;
}

.wp-block-esab-accordion .wp-block-esab-accordion-child>.esab__head .esab__icon img {
    min-width: 10px !important;
}

.wp-block-esab-accordion .esab__head {
    gap: 10px !important;
}

.wp-block-esab-accordion .esab__active_accordion .esab__heading_txt>.esab__heading_tag {
    color: var(--ast-global-color-3) !important;
}

.wp-block-esab-accordion .wp-block-esab-accordion-child>.esab__active.esab__body {
    border-color: #fff !important;
}

.esab__container .wp-block-esab-accordion-child:first-of-type {
    border-radius: var(--border-radius-m) var(--border-radius-m) 0 0 !important;
}

.esab__container .wp-block-esab-accordion-child:last-of-type {
    border-radius: 0 0 var(--border-radius-m) var(--border-radius-m) !important;
}

.esab__active_accordion .esab__head {
    background-color: #fff !important;
}

/* Akkordeon zweispaltig .cont-acc */

.cont-acc {
    align-items: flex-start !important;
    border-radius: var(--border-radius-m);
    overflow: hidden;
}

#main .wp-block-esab-accordion-child .esab__body {
    background-color: transparent !important;
    border: none !important;
}

.wp-block-esab-accordion .esab__container .esab__head p::before {
    content: "";
    display: flex;
    height: 0.65em;
    width: 0.65em;
    background-image: url(/wp-content/themes/astra-impuls-child/img/acc-plus.svg);
    background-size: contain;
    background-position: center center;
    margin-top: 0.45em;
    rotate: 180deg;
    margin-right: 0.7em;
    background-repeat: no-repeat;
    transition: all 0.5s ease 0s;
}

.wp-block-esab-accordion .esab__container .esab__head[aria-expanded="true"] p::before {
    background-image: url(/wp-content/themes/astra-impuls-child/img/acc-minus.svg);
    rotate: -180deg;
}

.esab__icon {
    display: none !important;
}

.wp-block-esab-accordion .esab__container .esab__head p {
    display: flex;
    align-items: flex-start;
    font-size: var(--h6-font-size);
    color: var(--ast-global-color-3);
    font-weight: 700;
}

.esab__body p+ul {
    margin-top: calc(var(--gap-s) * -1) !important;
}

.esab__body .uagb-buttons__wrap {
    column-gap: var(--gap-m) !important;
    row-gap: var(--gap-m) !important;
}

#main .wp-block-esab-accordion-child .esab__body>.wp-block-uagb-container {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.esab__body .uagb-buttons__outer-wrap .uagb-buttons__wrap {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
}

.esab__body .wp-block-uagb-buttons-child {
    justify-content: flex-start;
    display: flex;
}

.wp-block-uagb-container.cont-acc .esab__body .uagb-buttons__wrap {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.wp-block-uagb-container.cont-acc .uagb-button__wrapper {
    width: 100%;
}

@media (max-width: 1024px) {
    .cont-acc {
        align-items: flex-start !important;
        flex-direction: column !important;
    }
}

@media (max-width: 768px) {
    .wp-block-uagb-container.cont-acc .esab__body .uagb-buttons__wrap {
        display: grid;
        grid-template-columns: 1fr;
    }
}