@foreach ($domains as $key => $domain)
    <div class="accordion-item">
        <h2 class="accordion-header" id="heading{{encryptStr($domain->id)}}">
            <div class="accordion-button {{ ($key > 0) ? 'collapsed' : ''}}" id="accordionBtn{{encryptStr($domain->id)}}" data-id="{{encryptStr($domain->id)}}" type="button" data-bs-toggle="collapse" data-bs-target="#collapse{{encryptStr($domain->id)}}" aria-expanded="true" aria-controls="collapse{{encryptStr($domain->id)}}">
                <div class="col-6">
                    {{$domain->domain}} {{(isset($domain->pageMaster)) ? '('.($domain->pageMaster->status*12.5).'%)' : ''}}
                </div>    
                <div class="col-6">
                    <span class="badge badge-{{($domain->status == 1) ? 'success' : 'danger'}}"  {{($domain->status == 0) ? 'data-bs-toggle=tooltip' : ''}} title="" data-bs-original-title="{{($domain->status == 0) ? 'The verification process can take 6 to 12 hours to complete, most of the time it’s completed in 1 hour.' : '' }}" aria-label="{{($domain->status == 0) ? 'The verification process can take 6 to 12 hours to complete, most of the time it’s completed in 1 hour.' : '' }}">{{($domain->status == 1) ? 'Active' : 'Verification Pending'}}</span>
                </div>
            </div>
        </h2>
        <div id="collapse{{encryptStr($domain->id)}}" class="accordion-collapse collapse {{ ($key == 0) ? 'show' : ''}}" aria-labelledby="heading{{$key}}" data-bs-parent="#domainAccordion">
            <div class="accordion-body">
                <div class="row">
                    <div class="col-6 d-flex pt-3">
                        <div class="px-5">
                            <i class="fas fa-{{($domain->spf) ? 'check' : 'times'}}-circle fa-lg text-{{($domain->spf) ? 'success' : 'secondary'}}" data-bs-toggle="tooltip" title="" data-bs-original-title="{{($domain->spf) ? 'SPF verified' : 'SPF Verification Pending' }}" aria-label="{{($domain->spf) ? 'SPF verified' : 'SPF Verification Pending' }}"></i>
                        </div>
                        <div class="px-5">
                            <i class="fas fa-{{($domain->dkim) ? 'check' : 'times'}}-circle fa-lg text-{{($domain->dkim) ? 'success' : 'secondary'}}" data-bs-toggle="tooltip" title="" data-bs-original-title="{{($domain->dkim) ? 'DKIM verified' : 'DKIM Verification Pending' }}" aria-label="{{($domain->dkim) ? 'DKIM verified' : 'DKIM Verification Pending' }}"></i>
                        </div>
                        <div class="px-5">
                            <i class="fas fa-{{($domain->mx1) ? 'check' : 'times'}}-circle fa-lg text-{{($domain->mx1) ? 'success' : 'secondary'}}" data-bs-toggle="tooltip" title="" data-bs-original-title="{{($domain->mx1) ? 'MX1 verified' : 'MX1 Verification Pending' }}" aria-label="{{($domain->mx1) ? 'MX1 verified' : 'MX1 Verification Pending' }}"></i>
                        </div>
                        <div class="px-5">
                            <i class="fas fa-{{($domain->mx2) ? 'check' : 'times'}}-circle fa-lg text-{{($domain->mx2) ? 'success' : 'secondary'}}" data-bs-toggle="tooltip" title="" data-bs-original-title="{{($domain->mx2) ? 'MX2 verified' : 'MX2 Verification Pending' }}" aria-label="{{($domain->mx2) ? 'MX2 verified' : 'MX2 Verification Pending' }}"></i>
                        </div>
                        <div class="px-5">
                            <i class="fas fa-{{($domain->cname) ? 'check' : 'times'}}-circle fa-lg text-{{($domain->cname) ? 'success' : 'secondary'}}" data-bs-toggle="tooltip" title="" data-bs-original-title="{{($domain->cname) ? 'CNAME verified' : 'CNAME Verification Pending' }}" aria-label="{{($domain->cname) ? 'CNAME verified' : 'CNAME Verification Pending' }}"></i>
                        </div>
                    </div>
                    <div class="col-6 d-flex justify-content-end">
                        <a href="javascript:void(0);" data-id="{{encryptStr($domain->id)}}" class="text-danger menu-link btn btn-light-danger px-5 py-3 me-2 delete-domain-btn" data-bs-toggle="tooltip" title="" data-bs-original-title="Remove Domain" aria-label="Remove Domain"><i class="far fa-trash-alt p-0"></i></a>
                    </div>
                </div>
                <div class="card shadow-sm mt-5">
                    <div class="card-header">
                        <h3 class="card-title">Senders</h3>
                        @if($domain->status == 1)
                            <div class="card-toolbar">
                                <a href="javascript:void(0)" class="menu-link btn btn-light-primary px-5 py-3 me-2" onclick="td_modal.defaultModal('{{route('email-drip-campaigns.add-sender-modal',['id' => encryptStr($domain->id), 'domain' => $domain->domain])}}', 'Add Sender');">+ Add sender</a>
                            </div>
                        @endif
                    </div>
                    <div id="addSenderData{{encryptStr($domain->id)}}" class="m-3 text-center"></div>
                </div>
            </div>
        </div>
    </div>
@endforeach