@if(isset($data['breadcrumb']))

<nav aria-label="breadcrumb" class="breadcrumb-nav mt-4" id="frontend-breadcrumb">
    <div class="container-fluid" @if(@$layout) style="margin-bottom: -5%;" @endif>
        <ol class="breadcrumb @if(@$layout) bg-body @else bg-ivory @endif p-2">
            <li class="breadcrumb-item"><a href="/">Home</a></li>
            @foreach($data['breadcrumbs'] as $breadcrumb)
                <li @if($loop->last) class="breadcrumb-item active" aria-current="page" @else class="breadcrumb-item" @endif>{!! $breadcrumb !!}</li>
            @endforeach
        </ol>
    </div>
</nav>
<input type="hidden" id="show_menu" value="no" />
@else
    <input type="hidden" id="show_menu" value="yes" />
@endif

{{-- Start Display Custom Sets Message --}}
<div class="container-fluid d-none" id="cnt-set-customization-notice">
    <div class="notice notice-success">
        You have <span id="span_count_custom_sets"></span> custom surgical sets, you can add more instruments in your sets or create more custom sets, once done you can order after making the required changes, <a id="link_display_custom_sets" href="javascript:;" class="text-success">click here to see your sets</a>.
    </div>
</div>
{{-- End Display Custom Sets Message --}}

{{-- Start Display Modal for Custom Sets List --}}
<div class="modal fade" id="custom_sets_modal" tabindex="-1" role="dialog" aria-labelledby="custom_sets_modal_center_title" aria-hidden="true">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="custom_sets_modal_long_title">My Custom Surgical Sets</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body" style="max-height: 80vh;overflow-y: auto;">
        <div id="c_custom_products_container">
            <div class="panel-group" id="accordion">
                <div id="c_custom_products_accordion_panel" class="panel panel-default">
                </div>  
            </div>
        </div>
      </div>
    </div>
  </div>
</div>
{{-- End Display Modal for Custom Sets List --}}

{{-- Start Display Modal for Add Item to Custom Sets --}}
<form id="frm_add_product_to_custom_set" method="post">
<div class="modal fade" id="custom_add_to_sets_modal" tabindex="-1" role="dialog" aria-labelledby="custom_add_to_sets_modal_center_title" aria-hidden="true">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="custom_add_to_sets_modal_long_title">Add to My Custom Set</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body" style="max-height: 80vh;overflow-y: auto;">
        
        <p><strong>Review the product you want to add and select the quantity</strong></p>
        <div id="cats_product_info">
            

            <table class="table table-striped" id="cats_product_tbl">
                <tbody>
                <tr>
                    <td rowspan="6" width="40%"><img id="cats_product_img" src="" class="img-fluid" alt="Product Image"></td>
                    <td class="align-middle" id="cats_product_sku"></td>
                </tr>
                <tr>
                    <td class="align-middle" id="cats_product_name"></td>
                </tr>
                <tr>
                    <td class="align-middle">
                        <span class="strong">Unit Price:</span> &nbsp; <span id="cats_product_price_txt"></span>
                    </td>
                </tr>
                <tr>
                    <td class="align-middle">
                        
                        <div class="input-group mb-2 mr-sm-2">
                            <span class="input-group-text" style="font-size: 12px;">Quantity:</span>
                            {{-- <input type="number" style="margin-top:0px;" onchange="updateCatsProductQty(this.value);" min="1" class="form-control" id="cats_product_qty" name="cats_product_qty" placeholder="Quantity ..."> --}}
                            <select style="margin-top:0px;" onchange="updateCatsProductQty(this.value);" class="form-control" id="cats_product_qty" name="cats_product_qty" placeholder="Quantity ...">
                                @for($i = 0 ; $i < 100 ; $i++)
                                <option value="{{ $i }}">{{ $i }}</option>
                                @endfor
                            </select>
                        </div>
                
                    </td>
                </tr>
                <tr>
                    <td class="align-middle">
                        <span class="strong">Total Price:</span> &nbsp; <span id="cats_product_total_price_txt"></span>
                        <!-- <button type="button" class="btn btn-primary" id="btn_sale_submit">Submit</button>
                        <button type="button" class="btn btn-warning" id="btn_sale_cancel">Cancel</button> -->
                    </td>
                </tr>
                </tbody>
            </table>

            <input type="hidden" id="cats_hd_id" name="hd_id" />
            <input type="hidden" id="cats_hd_sku" name="hd_sku" />
            <input type="hidden" id="cats_hd_name" name="hd_name" />
            <input type="hidden" id="cats_hd_price" name="hd_price" />
            <input type="hidden" id="cats_hd_weight" name="hd_weight" />
            <input type="hidden" id="cats_hd_sale_price" name="hd_sale_price" />
            <input type="hidden" id="cats_hd_image" name="hd_image" />


        </div>

        <p><strong>Select the Custom Set in which you want to add this product</strong></p>
        <div id="cats_select_set"></div>

      </div>
      <div class="modal-footer">
        <button type="button" class="button button-sm" data-dismiss="modal">Cancel</button>
        <button type="button" class="button button-sm btn-dark" id="btn-add-product-to-custom-set">Add to Custom Set</button>
      </div>
    </div>
  </div>
</div>
    </form>
{{-- End Display Modal for Add Item to Custom Sets --}}