@props(['data'])
@php
    $parent = reset($data);
    $child = array_values(array_slice($data, 0)); 

@endphp


<section class="2xl:container 2xl:mx-auto mb-6 md:px-[20px] lg:px-[105px]">
    <div>
        <h3 class="mb-2 text-2xl font-semibold text-[#6d0117] dark:text-white">Other than Statutory services</h3>
        <div  class="relative overflow-x-auto">
          
          <table class="w-full text-sm text-left rtl:text-right text-gray-500 dark:text-gray-400" >
            <thead  class="text-sm text-gray-700 uppercase bg-[#e9ecef] dark:bg-gray-700 dark:text-gray-400">
              <tr>
                <th scope="col" class="px-6 py-3" >Name of Clients</th>
                <th  scope="col" class="px-6 py-3">Nature of Client’s Business</th>
                <th scope="col" class="px-6 py-3">Nature of Services Rendered</th>
              </tr>
            </thead>
            <tbody>
              
              @if (!empty($child))

              @foreach ($child as $value )

              <tr class=" border-b dark:bg-gray-800 dark:border-gray-700">
                <td class="px-6 py-4">{{$value['client_name']}}</td>
                <td class="px-6 py-4">{{$value['client_business']}}</td>
                <td class="px-6 py-4">{{$value['services']}}</td>
              </tr>
                
              @endforeach
                
              @endif
              
            </tbody>
          </table>
        </div>
    </div>
</section>