@php
    $color=['table-custom','table-primary','table-secondary','table-success','table-danger','table-warning','table-info','table-light','table-primary','table-secondary','table-success','table-danger','table-warning','table-info','table-light','table-primary','table-secondary','table-success','table-danger','table-warning','table-info','table-light','table-primary','table-secondary','table-success','table-danger','table-warning','table-info','table-light','table-primary','table-secondary','table-success','table-danger','table-warning','table-info','table-light'];
    $btn_color=['btn btn-green','btn btn-lime','btn btn-yellow','btn btn-orange','btn btn-red','btn btn-pink','btn btn-purple','btn btn-indigo','btn btn-azure','btn btn-blue','btn btn-teal','btn btn-cyan','btn btn-gray','btn btn-gray-dark'];
    $public_url=url('/uploads/product_img_580x800');
    $public_link_url=url('/uploads/product_img_1160x1600');
@endphp

<table class="table border  text-md-nowrap mb-0">
                                            {{-- <thead  class="table-info"> --}}
                                                {{-- border-bottom: 1px solid #e9edf4; --}}
                                                <tbody >
                                                    <tr class="{{$color[0]}} table-border">
                                                    <td>Name</td>
                                                    <td>:</td>
                                                    <td>{{$product->product_name_en}}</td>
                                                    </tr>

                                                    <tr class="{{$color[0]}} table-border">
                                                    <td>SKU</td>
                                                    <td>:</td>
                                                    <td>{{$product->product_sku}}</td>
                                                    </tr>

                                                    <tr class="{{$color[0]}} table-border">
                                                    <td>Category</td>
                                                    <td>:</td>
                                                    <td>{{$product->category_name}}</td>
                                                    </tr>

                                                    @if($product->subcategory_name)
                                                    <tr class="{{$color[0]}} table-border">
                                                    <td>Subcategory</td>
                                                    <td>:</td>
                                                    <td>{{$product->subcategory_name}}</td>
                                                    </tr>
                                                    @endif

                                                    <tr class="{{$color[0]}} table-border">
                                                    <td>Brand</td>
                                                    <td>:</td>
                                                    <td>{{$product->brand_name}}</td>
                                                    </tr>

                                                
                                    

                                                    <tr class="{{$color[0]}} table-border">
                                                    <td>Price</td>
                                                    <td>:</td>
                                                    <td >{{sprintf("%.2f", $product->product_price)}}</td>
                                                    </tr>
                                               

                                                    <tr class="{{$color[0]}} table-border">
                                                    <td>Stock Alert Limit</td>
                                                    <td>:</td>
                                                    <td >{{sprintf("%.0f", $product->reorder_point)}}</td>
                                                    </tr>
                                                    <tr class="{{$color[0]}} table-border">
                                                    <td>Description</td>
                                                    <td>:</td>
                                                    <td ><p>{{$product->product_desc_en}}</p></td>
                                                    </tr>
                                                    <tr class="{{$color[0]}} table-border">
                                                    <td>Title Image</td>
                                                    <td>:</td>
                                                    <td class="text-center" ><a style="cursor: pointer;" target="_blank" href="{{$public_link_url}}/{{$product->product_title_img}}"><img width="290" height="400"  src="{{$public_url}}/{{$product->product_title_img}}"  ></a></td>
                                                    </tr>
                                                    @if($product->product_img_1)
                                                    <tr class="{{$color[0]}} table-border">
                                                    <td>Sub Image 1</td>
                                                    <td>:</td>
                                                    <td class="text-center" ><a style="cursor: pointer;" target="_blank" href="{{$public_link_url}}/{{$product->product_img_1}}"><img  width="290" height="400" src="{{$public_url}}/{{$product->product_img_1}}"  ></a></td>
                                                    </tr>
                                                    @endif
                                                    @if($product->product_img_2)
                                                    <tr class="{{$color[0]}} table-border">
                                                    <td>Sub Image 2</td>
                                                    <td>:</td>
                                                    <td class="text-center" ><a style="cursor: pointer;" target="_blank" href="{{$public_link_url}}/{{$product->product_img_2}}"><img width="290" height="400" src="{{$public_url}}/{{$product->product_img_2}}"  ></a></td>
                                                    </tr>
                                                    @endif
                                                    @if($product->product_img_3)
                                                    <tr class="{{$color[0]}} table-border">
                                                    <td>Sub Image 3</td>
                                                    <td>:</td>
                                                    <td class="text-center" ><a style="cursor: pointer;" target="_blank" href="{{$public_link_url}}/{{$product->product_img_3}}"><img width="290" height="400"  src="{{$public_url}}/{{$product->product_img_3}}"  ></a></td>
                                                    </tr>
                                                    @endif
                                                    @if($product->product_img_4)
                                                    <tr class="{{$color[0]}} table-border">
                                                    <td>Sub Image 4</td>
                                                    <td>:</td>
                                                    <td class="text-center" ><a style="cursor: pointer;" target="_blank" href="{{$public_link_url}}/{{$product->product_img_4}}"><img width="290" height="400"  src="{{$public_url}}/{{$product->product_img_4}}"  ></a></td>
                                                    </tr>
                                                    @endif
                                                     @php
                                                     $h=$i=$j=1;
                                                    @endphp
                                                    <tr class="{{$color[0]}} table-border">
                                                        <td style="background-color:#abafab;"  class="text-center" colspan="3">Available Variants</td>
                                                     </tr>

                                                    <tr class="{{$color[0]}} table-border text-left">
                                                    <td colspan="3" class="text-center">

                                                        <button type="button" class="{{$btn_color[0]}} dropdown-toggle" data-bs-toggle="dropdown">
                                                        <i class="fa fa-server"></i>&nbsp;{{$product->variant_name}}
                                                        </button>
                                                        <div class="dropdown-menu">
                                                            <a class="dropdown-item" href="javascript:void(0)">Available Stock - {{$product->product_stock}}</a>
                                                        </div>

                                                        @foreach ($child_products as $child_product) 
                                                        @php
                                                            $margin_top=0;
                                                        @endphp
                                                        @if ($h>=4)
                                                        @php
                                                            $margin_top=2;
                                                        @endphp
                                                            <br>                                                            
                                                        @endif
                                                         <button type="button" style="margin-top:{{$margin_top}}%" class="{{$btn_color[$h]}} dropdown-toggle" data-bs-toggle="dropdown">
                                                        <i class="fa fa-server"></i>&nbsp;{{$child_product->variant_name}}
                                                        </button>
                                                        <div class="dropdown-menu">
                                                            <a class="dropdown-item" href="javascript:void(0)">Available Stock - {{$child_product->product_stock}}</a>
                                                        </div>
                                                         @php
                                                            $h++;
                                                         @endphp   
                                                        @endforeach

                                                        </td>
                                                    </tr>
                                                    @if (!empty($product_specifications))
                                                    @foreach ($product_spec_group as $product_spec_group)
                                                     <tr class="{{$color[0]}} table-border">
                                                        <td style="background-color: #abafab;"  class="text-center" colspan="3">Specifications</td>
                                                     </tr>
                                                    @foreach ($product_specifications as $product_specification)
                                                    @if ($product_specification->spec_product_id==$product_spec_group->spec_product_id)
                                                    @if ($product_specification->spec_heading=="Device Specification")
                                                    <tr class="{{$color[0]}} table-border text-left">
                                                    <td class="text-center w-25">{{$i}}</td>
                                                    <td colspan="2">{{$product_specification->spec_description}}</td>
                                                    </tr>
                                                    @php
                                                        $i++;
                                                    @endphp
                                                    @endif
                                                    @endif
                                                     @endforeach
                                                     @endforeach
                                                     @endif
                                                    

                                        </table>