<div class="accordion {{ color ?? '' }}" id="{{ accordionId }}"> <div class="accordion-item my-2 border-0 rounded-0"> {% set itemId = [accordionId, 'accordion'|slug]|join('-')|lower %} <div class="accordion-header" id="{{ itemId }}"> <button class="d-flex align-items-center accordion-button icon collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapse-{{ itemId }}" aria-expanded="false" aria-controls="collapse-{{ itemId }}"> <span class="fw-bolder">{{ title|default('Accordion Title') }}</span> </button> </div> <div id="collapse-{{ itemId }}" class="accordion-collapse collapse" aria-labelledby="{{ itemId }}" data-bs-parent="#{{ accordionId }}"> <div class="accordion-body"> {% block accordion_body %}{% endblock %} </div> </div> </div></div>