@if(isset($sub->subcomponents))

    <div class="accordion accordion--faq {{ $item->classes ?? '' }}" id="accordion-{{ $sub->id }}">

        @foreach($sub->subcomponents as $subitem)

            <div class="wrap light-bottom-border">

                <div class="pt-3 pb-3 pt-md-0 pb-md-3 accordion-heading-wrapper accordion-heading" data-toggle="collapse" data-target="#collapse-{{ $item->id }}-{{ $subitem->id ?? $loop->iteration }}" id="accordion-heading-{{ $item->id }}-{{ $subitem->id ?? $loop->iteration }}">

                    <h5 class="h3 text-secondary mb-0">{{ $subitem->heading }}</h5>

                </div>

                <div>
                    <div id="collapse-{{ $item->id }}-{{ $subitem->id ?? $loop->iteration }}" class="collapse accordion-content @if($loop->first) show @endif" aria-labelledby="accordion-heading-{{ $item->id }}-{{ $subitem->id ?? $loop->iteration }}" data-parent="#accordion-{{ $sub->id }}">
                        <div class="accordion-body mb-3 pb-3">
                            {!! $subitem->text !!}
                        </div>
                    </div>
                </div>
            

            </div>

        @endforeach

    </div>

@endif