I'm having some trouble with accordion collapsion.

I'm building a network monitor and every accordion is dynamically added via foreach loops. So i have accordions in accordions and foreach loops in for each loops

-> every parent accordion is the host machine -> every child accordion in that parent accordion is each network adapter which holds the information inside.

The problem i'm facing is that due to the id and data-toggle arguments when I click on 1 accordion they all collapse, So I have changed the id for the child which controls the child and parent seperatly however every child is still the same meaning that every child collapses together and when it is collapsed when I click again it collapses the parent.

The problem probably persist in both th accordion logics as I only have teste with one host.

Question : How to fix this so every accordion host and adapter or parent and child can collapse seperatly? main code:

<div class="row">
        <div class="col-sm-12">
            <div class="accordion" id="accordionNetwork">
                @foreach(var item in hosts)
                {                    
                    <div class="accordion-item">
                        <h2 class="accordion-header" id="headingOne">
                            <button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
                                @item.Name - @item.IPv4 - @item.FQDN
                            </button>
                        </h2>

                        <div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionNetwork">
                            <div class="accordion-body">                             
                             @foreach(var adapter in item.Adapters)
                             {
                                 <div class="accordion-item">
                                    <h2 class="accordion-header" id="headingOne">
                                        <button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="true" aria-controls="collapseTwo">
                                            @adapter.Name
                                        </button>
                                    </h2>

                                    <div id="collapseTwo" class="accordion-collapse collapse show" aria-labelledby="headingTwo" data-bs-parent="#accordionNetwork">
                                        <div class="accordion-body">                             
                                                          
                                        </div>
                                    </div>
                                </div>                                     
                             }
                            </div>
                        </div>
                    </div>                    
                }
            </div>
        </div>
    </div>

child code is the inner foreach loops so:

@foreach(var adapter in item.Adapters)                             

{
                                 <div class="accordion-item">
                                    <h2 class="accordion-header" id="headingOne">
                                        <button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="true" aria-controls="collapseTwo">
                                            @adapter.Name
                                        </button>
                                    </h2>

                                    <div id="collapseTwo" class="accordion-collapse collapse show" aria-labelledby="headingTwo" data-bs-parent="#accordionNetwork">
                                        <div class="accordion-body">                             
                                                          
                                        </div>
                                    </div>
                                </div>                                     
                             }