<div class="row">
     <div class="col-xl-12">
         <a href="{{ route('dashboard.certificate') }}" class="ud-btn btn-thm default-box-shadow2 w-100 mb-2">Add Certificate</i></a>
         <div class="ps-widget bgc-white bdrs4 p30 mb30 overflow-hidden position-relative">
             <div class="navtab-style1">
                 <nav class="d-flex justify-content-between align-items-center">
                     <div class="nav nav-tabs mb30" id="nav-tab2" role="tablist">
                         <button class="nav-link active fw500 ps-0" id="nav-item1-tab" data-bs-toggle="tab" data-bs-target="#nav-item1" type="button" role="tab" aria-controls="nav-item1" aria-selected="true">All Certificate</button>
                     </div>
                 </nav>

                 <div class="tab-content" id="nav-tabContent">
                     <div class="tab-pane fade show active" id="nav-item1" role="tabpanel" aria-labelledby="nav-item1-tab">
                         <div class="packages_table table-responsive">
                             <table class="table-style3 table at-savesearch">
                                 <thead class="t-head">
                                     <tr>
                                         <th scope="col">Title</th>
                                         <th scope="col">Type</th>
                                         <th scope="col">Action</th>
                                     </tr>
                                 </thead>
                                 <tbody class="t-body">
                                     @forelse ($certificates as $cert)
                                     <tr>
                                         <th class="dashboard-img-service" scope="row">
                                             <div class="listing-style1 list-style d-block d-xl-flex align-items-start border-0 mb-0">
                                                 <div class="list-thumb flex-shrink-0 bdrs4 mb10-lg">
                                                     @if (pathinfo($cert['document'], PATHINFO_EXTENSION) === 'pdf')
                                                     <a href="{{ $cert['document'] }}" target="_blank" download="{{ $cert['title'] }}" class="btn btn-primary text-white">Preview PDF</a>
                                                     @else
                                                     <img class="img-thumbnail rounded-circle" style="width: 100px; height: 100px; object-fit: cover;" src="{{ $cert['document'] }}" alt="">
                                                     @endif
                                                 </div>
                                                 <div class="list-content flex-grow-1 py-0 pl15 pl0-lg">
                                                     <h6 class="list-title mb-0">
                                                         <a href="#">{{ $cert['title'] }}</a>
                                                     </h6>
                                                     <ul class="list-style-type-bullet ps-3 dashboard-style mb-0">
                                                         <li> {{ $cert['year_obtained'] }}</li>
                                                     </ul>
                                                 </div>
                                             </div>
                                         </th>
                                         <td class="align-top"><span class="fz14 fw400">{{ $cert['category']['name'] }}</span></td>
                                         <td class="align-top">
                                             <div class="d-flex">
                                                 <a href="{{ route('dashboard.update.certificate', $cert['uuid']) }}" class="icon me-2" data-bs-toggle="tooltip" data-bs-placement="top" title="Edit">
                                                     <span class="flaticon-pencil"></span>
                                                 </a>
                                                 <a href="#" class="icon" data-bs-toggle="tooltip" data-bs-placement="top" title="Delete" wire:click.prevent="deleteCert({{ $cert['id'] }})" onclick="return confirm('Are you sure you want to delete this certificate?');">
                                                     <span class="flaticon-delete"></span>
                                                 </a>

                                             </div>
                                         </td>
                                     </tr>
                                     @empty
                                     <tr>
                                         <td class="text-center mt10 mb-0 pagination_page_count" colspan="4">No shop certificate found</td>
                                     </tr>
                                     @endforelse
                                 </tbody>
                             </table>
                             <div class="mbp_pagination text-center mt30">
                                 <ul class="page_navigation">

                                 </ul>
                             </div>
                         </div>
                     </div>
                 </div>
             </div>
         </div>
     </div>
 </div>