@if ($product->serialized_product == 1 && $product->color_id <= 0 && $product->size_id <= 0)
    <div class="row mb-2">
        <div class="col-md-8"></div>
        <div class="col-md-4">
            <input type="search" class="form-control" placeholder="Scan.." id="search_{{ $index }}1" autocomplete="off" onchange="addSerial(this.value, {{ $index }}1, {{ $product->manufacture_code }}, {{ $index }})" autofocus>
        </div>
    </div>
@endif

@if (count($product->colorChild) > 0)
    @php
        $color = $product->colorChild;
    @endphp
    <div class="row">
        <div class="col-md-3 text-center">
            <label for="size"><b>{{__('obs.size')}}</b></label>
        </div>
        <div class="col-md-3 text-center">
            <label for="size"><b>{{__('obs.color')}}</b></label>
        </div>
        <div class="col-md-3 text-center">
            <label for="quantity"><b>{{__('obs.quantity')}}</b></label>
        </div>
    </div>
@elseif (count($product->sizeChild) > 0)
    <div class="row">
        <div class="col-md-3 text-center">
            <label for="size"><b>{{__('obs.size')}}</b></label>
        </div>
        <div class="col-md-3 text-center">
            <label for="quantity"><b>{{__('obs.quantity')}}</b></label>
        </div>
    </div>
@else
    <div class="row">
        <div class="col-md-3 text-center">
            <label for="quantity"><b>{{__('obs.quantity')}}</b></label>
        </div>
    </div>
@endif
@if ($product->size_id || $product->color_id)
    @php
        $size_len = count($size);
    @endphp
    @foreach($size as $skey => $s)
        @php
            $clr_center = intval(count($color)/2);
        @endphp
        @foreach($color as $ckey => $c)
            <div class="row d-flex align-items-center" style="padding-top:  {{ ($ckey > 0 ? '10px' : '0px') }};">
                <div class="col-md-3 text-center">
                    <input type="text" style="display: none" value="{{ $s->id }}" name="size{{ $index }}[]" id="size{{ $index }} {{ $i }}" class="form-control">
                    <label for="size"  style="display: {{ ($ckey == $clr_center ? '' : 'none') }}" class="p-1 px-2 border border-success rounded-circle" >{{ $s->name }}</label>
                </div>
                <div class="col-md-3 justify-content-center d-flex">
                    <input type="text" style="display: none" value="{{ $c->id }}" name="color{{ $index }}[]" id="color{{ $index }} {{ $j }}" class="form-control">
                    <div class="justify-content-center d-flex">
                        <h6 class="badge badge-pill mr-2" style="background-color: {{ strtolower($c->name) }}; height: 8px; width: 8px; margin-top: auto">&nbsp;</h6>
                        <label for="size">{{ $c->name }}</label>
                    </div>
                </div>
                <div class="col-md-3 text-center">
                    <input type="number" {{ ($product->serialized_product != 1 ? 'step=".01"' : 'readonly') }} value="0" min="0" id="quantity{{ $index }} {{ $j }}" name="quantity{{ $index }}[]" {{ (($product->serialized_product == 1) ? 'onchange="addSerialField('.$index.', '.$j.', this.value, '.$product->manufacture_code.')"' : 'onkeyup=this.value<0?this.value=0:()=>{}') }}  class="form-control addQty{{ $index }}">
                </div>
                @if ($product->serialized_product == 1)
                    <div class="col-md-3 text-center">
                        <input type="search" class="form-control" placeholder="Scan.." id="search_{{ $index }} {{ $j }}" autocomplete="off" onchange="addSerial(this.value, {{ $index }} {{ $j }}, {{ $product->manufacture_code }}, {{ $index }})" autofocus>
                    </div>
                @endif
            </div>
            <div class="row" id="div_q{{ $index }} {{ $j }}"></div>
            @php
                $j++;
            @endphp
        @endforeach
        @if ($j == 1)
            <div class="row d-flex align-items-center" style="padding-top: 10px">
                <div class="col-md-3 text-center">
                    <input type="text" style="display: none" value="{{ $s->id }}" name="size{{ $index }}[]" id="size{{ $index }} {{ $i }}" class="form-control">
                    <label for="size" class="p-1 px-2" style="border: 1px solid green;border-radius: 20px">{{ $s->name }}</label>
                </div>
                <div class="col-md-3 text-center">
                    <input type="number" value="0" {{ ($product->serialized_product != 1? 'step=".01"' : 'readonly') }} min="0" id="quantity{{ $index }} {{ $i }}" name="quantity{{ $index }}[]" {{ (($product->serialized_product == 1) ? 'onchange="addSerialField('.$index.', '.$i.', this.value, '.$product->manufacture_code.')"':'onkeyup=this.value<0?this.value=0:()=>{}')}} class="form-control addQty{{ $index }}">
                </div>
                @if ($product->serialized_product == 1)
                    <div class="col-md-3 text-center">
                        <input type="search" class="form-control" placeholder="Scan.." id="search_{{ $index }} {{ $i }}" autocomplete="off" onchange="addSerial(this.value, {{ $index }} {{ $i }}, {{ $product->manufacture_code }}, {{ $index }})" autofocus>
                    </div>
                @endif
            </div>
            <div class="row" id="div_q{{ $index }} {{ $i }}"></div>
        @endif
        @php
            $i++;
        @endphp
        @if($skey < ($size_len-1))
            <hr>
        @endif
    @endforeach
@else
    <div class="row d-flex align-items-center" style="padding-top: 10px">
        <div class="col-md-4">
            <input type="number" value="0" {{ ($product->serialized_product != 1? 'step=".01"':'readonly') }} min="0" id="quantity{{ $index }}1" name="quantity{{ $index }}[]" {{ (($product->serialized_product == 1) ? 'onchange="addSerialField('.$index.', 1, this.value, '.$product->manufacture_code.')"' : '') }} class="form-control addQty{{ $index }}">
        </div>
    </div>
    <div class="row" id="div_q{{ $index }}1"></div>
@endif