@php
    $accordionId = $getAccordionId();
    $collapseId = $getCollapseId();
@endphp

@if ($item->children->isEmpty())
    <!-- Enlace sin submenús -->
    <div class="list-group">
        <div {{ $attributes->merge(['class' => 'list-group-item list-group-item-action py-2']) }}>
            <x-bootstrap.accordion-item-link-component :url="$item->nombre_ruta" :icon="$item->icono" :label="$item->nombre_menu" />
        </div>
    </div>
@else
    <!-- Acordeón con submenús -->
    <div class="accordion-item">
        <h2 class="accordion-header" id="{{ $accordionId }}">
            <button class="accordion-button fw-bold collapsed py-2"
                    type="button"
                    data-bs-toggle="collapse"
                    data-bs-target="#{{ $collapseId }}"
                    aria-expanded="false"
                    aria-controls="{{ $collapseId }}">
                <i class="mx-1 bi bi-{{ $item->icono }} me-2"></i> {{ $item->nombre_menu }}
            </button>
        </h2>
        <div id="{{ $collapseId }}"
             class="accordion-collapse collapse"
             aria-labelledby="{{ $accordionId }}"
             data-bs-parent="#{{ $parentAccordionId }}">
            <div class="accordion-body">
                <div class="list-group">
                    @foreach ($item->children as $child)
                        <x-bootstrap.accordion-item-component :item="$child" :parentAccordionId="$collapseId" class="fw-normal" />
                    @endforeach
                </div>
            </div>
        </div>
    </div>
@endif