@if(!empty($details['product_details']) && count($details['product_details']) > 0)
  <div style="margin-bottom: 8px;">
    <h4 style="font-size: 12px; font-weight: 600; margin: 0 0 6px 0; color: #495057; text-transform: uppercase;">
      <i class="fa fa-box" style="margin-right: 4px;"></i>
      @lang('lang_v1.product_sold_details_register')
    </h4>
    <div class="table-responsive" style="border: 1px solid #d1d1d1; max-height: 200px; overflow-y: auto;">
      <table class="table table-bordered" style="margin: 0; font-size: 11px;">
        <thead style="background-color: #e7e7e7; position: sticky; top: 0;">
          <tr>
            <th style="width: 40px; text-align: center; padding: 4px 6px;">#</th>
            <th style="text-align: left; padding: 4px 6px;">@lang('product.sku')</th>
            <th style="text-align: left; padding: 4px 6px;">@lang('sale.product')</th>
            <th style="text-align: center; padding: 4px 6px; width: 80px;">@lang('sale.qty')</th>
            <th style="text-align: right; padding: 4px 6px; width: 100px;">@lang('sale.total_amount')</th>
          </tr>
        </thead>
        <tbody>
          @php
            $total_amount = 0;
            $total_quantity = 0;
          @endphp
          @foreach($details['product_details'] as $detail)
            <tr>
              <td style="text-align: center; padding: 3px 6px;">{{$loop->iteration}}</td>
              <td style="text-align: left; padding: 3px 6px; font-size: 10px; color: #6c757d;">{{$detail->sku}}</td>
              <td style="text-align: left; padding: 3px 6px;">
                {{$detail->product_name}}
                @if($detail->type == 'variable')
                 <small style="color: #6c757d;">({{$detail->product_variation_name}} - {{$detail->variation_name}})</small>
                @endif
              </td>
              <td style="text-align: center; padding: 3px 6px;">
                {{@format_quantity($detail->total_quantity)}}
                @php
                  $total_quantity += $detail->total_quantity;
                @endphp
              </td>
              <td style="text-align: right; padding: 3px 6px; font-weight: 600;">
                <span class="display_currency" data-currency_symbol="true">
                  {{$detail->total_amount}}
                </span>
                @php
                  $total_amount += $detail->total_amount;
                @endphp
              </td>
            </tr>
          @endforeach
        </tbody>
        <tfoot style="background-color: #e7e7e7;">
          <tr>
            <th colspan="3" style="text-align: right; padding: 4px 6px;">@lang('sale.total'):</th>
            <th style="text-align: center; padding: 4px 6px;">{{$total_quantity}}</th>
            <th style="text-align: right; padding: 4px 6px; font-weight: 700;">
              <span class="display_currency" data-currency_symbol="true">{{$total_amount}}</span>
            </th>
          </tr>
        </tfoot>
      </table>
    </div>
  </div>
@endif

@if(!empty($details['product_details_by_brand']) && count($details['product_details_by_brand']) > 0)
  <div style="margin-bottom: 8px;">
    <h4 style="font-size: 12px; font-weight: 600; margin: 0 0 6px 0; color: #495057; text-transform: uppercase;">
      <i class="fa fa-tags" style="margin-right: 4px;"></i>
      @lang('lang_v1.product_sold_details_register') (@lang('lang_v1.by_brand'))
    </h4>
    <div class="table-responsive" style="border: 1px solid #d1d1d1; max-height: 200px; overflow-y: auto;">
      <table class="table table-bordered" style="margin: 0; font-size: 11px;">
        <thead style="background-color: #e7e7e7; position: sticky; top: 0;">
          <tr>
            <th style="width: 40px; text-align: center; padding: 4px 6px;">#</th>
            <th style="text-align: left; padding: 4px 6px;">@lang('brand.brands')</th>
            <th style="text-align: center; padding: 4px 6px; width: 80px;">@lang('sale.qty')</th>
            <th style="text-align: right; padding: 4px 6px; width: 100px;">@lang('sale.total_amount')</th>
          </tr>
        </thead>
        <tbody>
          @php
            $total_amount_brand = 0;
            $total_quantity_brand = 0;
          @endphp
          @foreach($details['product_details_by_brand'] as $detail)
            <tr>
              <td style="text-align: center; padding: 3px 6px;">{{$loop->iteration}}</td>
              <td style="text-align: left; padding: 3px 6px;">{{$detail->brand_name}}</td>
              <td style="text-align: center; padding: 3px 6px;">
                {{@format_quantity($detail->total_quantity)}}
                @php
                  $total_quantity_brand += $detail->total_quantity;
                @endphp
              </td>
              <td style="text-align: right; padding: 3px 6px; font-weight: 600;">
                <span class="display_currency" data-currency_symbol="true">
                  {{$detail->total_amount}}
                </span>
                @php
                  $total_amount_brand += $detail->total_amount;
                @endphp
              </td>
            </tr>
          @endforeach
        </tbody>
        <tfoot style="background-color: #e7e7e7;">
          <tr>
            <th colspan="2" style="text-align: right; padding: 4px 6px;">@lang('sale.total'):</th>
            <th style="text-align: center; padding: 4px 6px;">{{$total_quantity_brand}}</th>
            <th style="text-align: right; padding: 4px 6px; font-weight: 700;">
              <span class="display_currency" data-currency_symbol="true">{{$total_amount_brand}}</span>
            </th>
          </tr>
        </tfoot>
      </table>
    </div>
  </div>
@endif

@if(!empty($details['types_of_service_details']) && count($details['types_of_service_details']) > 0)
  <div style="margin-bottom: 8px;">
    <h4 style="font-size: 12px; font-weight: 600; margin: 0 0 6px 0; color: #495057; text-transform: uppercase;">
      <i class="fa fa-list" style="margin-right: 4px;"></i>
      @lang('lang_v1.types_of_service_details')
    </h4>
    <div class="table-responsive" style="border: 1px solid #d1d1d1;">
      <table class="table table-bordered" style="margin: 0; font-size: 11px;">
        <thead style="background-color: #e7e7e7;">
          <tr>
            <th style="width: 40px; text-align: center; padding: 4px 6px;">#</th>
            <th style="text-align: left; padding: 4px 6px;">@lang('lang_v1.types_of_service')</th>
            <th style="text-align: right; padding: 4px 6px; width: 120px;">@lang('sale.total_amount')</th>
          </tr>
        </thead>
        <tbody>
          @php
            $total_service_sales = 0;
          @endphp
          @foreach($details['types_of_service_details'] as $detail)
            <tr>
              <td style="text-align: center; padding: 3px 6px;">{{$loop->iteration}}</td>
              <td style="text-align: left; padding: 3px 6px;">{{$detail->types_of_service_name ?? "--"}}</td>
              <td style="text-align: right; padding: 3px 6px; font-weight: 600;">
                <span class="display_currency" data-currency_symbol="true">
                  {{$detail->total_sales}}
                </span>
                @php
                  $total_service_sales += $detail->total_sales;
                @endphp
              </td>
            </tr>
          @endforeach
        </tbody>
        <tfoot style="background-color: #e7e7e7;">
          <tr>
            <th colspan="2" style="text-align: right; padding: 4px 6px;">@lang('lang_v1.grand_total'):</th>
            <th style="text-align: right; padding: 4px 6px; font-weight: 700;">
              <span class="display_currency" data-currency_symbol="true">{{$total_service_sales}}</span>
            </th>
          </tr>
        </tfoot>
      </table>
    </div>
  </div>
@endif