<style>
  {% if section.settings.variant_swacth == 'two'  %} 
  .selector-wrapper {
    display:none;
  }
  {% endif %}
</style>
<div class="product-template__container product-{{ product.id }} page-width" itemscope itemtype="http://schema.org/Product" id="ProductSection-{{ section.id }}" data-section-id="{{ section.id }}" data-section-type="product" data-enable-history-state="true"> 
 <div> {{ product.metafields.alireviews.seo_rating_review_key }} </div>
  <meta itemprop="name" content="{{ product.title }}">
  <meta itemprop="url" content="{{ shop.url }}{{ product.url }}">
  <meta itemprop="image" content="{{ product.featured_image.src | img_url: '800x' }}">

  {% comment %}
  Get first variant, or deep linked one
  {% endcomment %}
  {%- assign current_variant = product.selected_or_first_available_variant -%}

  {%- assign product_image_zoom_size = '1024x1024' -%}
  {%- assign product_image_scale = '2' -%}
  {%- assign enable_zoom = section.settings.enable_zoom -%}

  <div class="grid product-single">
    <div class="grid__item product-single__photos medium-up--one-half">
      {%- assign featured_image = product.featured_image -%}
      {% for image in product.images %}
      {% capture img_id %}FeaturedImage-{{ section.id }}-{{ image.id }}{% endcapture %}
      {% capture img_class %}product-featured-img{% endcapture %}
      {% capture zoom_img_id %}FeaturedImageZoom-{{ section.id }}-{{ image.id }}{% endcapture %}
      {% capture img_wrapper_id %}{{ zoom_img_id }}-wrapper{% endcapture %}
      {%- assign img_url = image | img_url: '1x1' | replace: '_1x1.', '_{width}x.' -%}

      {% include 'image-style' with small_style: true, width: 530, height: 530, wrapper_id: img_wrapper_id, img_id: img_id %}

      <div id="{{ img_wrapper_id }}" class="product-single__photo-wrapper small--hide js">
        <div id="{{ zoom_img_id }}" style="padding-top:{{ 1 | divided_by: image.aspect_ratio | times: 100}}%;" class="product-single__photo{% if enable_zoom %} js-zoom-enabled{% endif %}{% if product.images.size > 1 %} product-single__photo--has-thumbnails{% endif %}{% unless featured_image == image %} hide{% endunless %}" data-image-id="{{ image.id }}"{% if enable_zoom %} data-zoom="{{ image | img_url: product_image_zoom_size, scale: product_image_scale }}"{% endif %}>
          <img id="{{ img_id }}"
               class="feature-row__image {{ img_class }} lazyload{% unless featured_image == image %} lazypreload{% endunless %}"
               src="{{ image | img_url: '300x300' }}"
               data-src="{{ img_url }}"
               data-widths="[180, 360, 540, 720, 900, 1080, 1296, 1512, 1728, 2048]"
               data-aspectratio="{{ image.aspect_ratio }}"
               data-sizes="auto"
               alt="{{ image.alt | escape }}">
        </div>
      </div>
      {% endfor %}

      <noscript>
        {% capture product_image_size %}530x{% endcapture %}
        <img src="{{ featured_image | img_url: product_image_size, scale: product_image_scale }}" alt="{{ featured_image.alt }}" id="FeaturedImage-{{ section.id }}" class="product-featured-img" style="max-width: 530px;">
      </noscript>


      {% if product.images.size > 1 %}
      {%- assign enable_thumbnail_slides = true -%}
      {% endif %}

      <div class="thumbnails-wrapper {% if product.images.size == 1 %}medium-up--hide{% endif %}{% if enable_thumbnail_slides == true %} thumbnails-slider--active{% endif %}">
        {% if enable_thumbnail_slides == true %}
        <button type="button" class="btn btn--link small--hide thumbnails-slider__btn thumbnails-slider__prev thumbnails-slider__prev--{{ section.id }}">
          {% include 'icon-chevron-left' %}
          <span class="icon__fallback-text">{{ 'sections.slideshow.previous_slide' | t }}</span>
        </button>
        {% endif %}
        <ul class="grid grid--uniform product-single__thumbnails product-single__thumbnails-{{ section.id }}">
          {% for image in product.images %}
          <li class="grid__item {% unless enable_thumbnail_slides == true %}{{ product_thumbnail_width }} {% endunless %}{% if product.images.size > 1 %}product-single__thumbnails-item{% endif %} js">
            <a href="{{ image.src | img_url: product_image_zoom_size, scale: product_image_scale }}"
               class="text-link product-single__thumbnail product-single__thumbnail--{{ section.id }}"
               data-thumbnail-id="{{ image.id }}"
               {% if enable_zoom %}data-zoom="{{ image.src | img_url: product_image_zoom_size, scale: product_image_scale }}"{% endif %}>
              <img class="product-single__thumbnail-image medium-up--hide" src="{{ image.src | img_url: '480x480', scale: 2 }}" alt="{{ image.alt | escape }}">
              <img class="product-single__thumbnail-image small--hide" src="{{ image.src | img_url: 'compact' }}" alt="{{ image.alt | escape }}">
            </a>
          </li>
          {% endfor %}
        </ul>
        {% if enable_thumbnail_slides == true %}
        <button type="button" class="btn btn--link small--hide thumbnails-slider__btn thumbnails-slider__next thumbnails-slider__next--{{ section.id }}">
          {% include 'icon-chevron-right' %}
          <span class="icon__fallback-text">{{ 'sections.slideshow.next_slide' | t }}</span>
        </button>
        {% endif %}
      </div>

      <form style="display: none;" method="post" action="/cart">

        <input  type="submit" class="custome_checkout" value="checkout" name="checkout"/>

      </form>
    </div>
    <div class="grid__item medium-up--one-half">
      <div class="product-single__meta">

        <h1 itemprop="name" class="product-single__title heading">{{ product.title }}</h1>

        {% if section.settings.show_vendor %}
        <p itemprop="brand" class="product-single__vendor">{{ product.vendor }}</p>
        {% endif %}

        <div itemprop="offers" itemscope itemtype="http://schema.org/Offer">
          {% include 'judgeme_widgets', widget_type: 'judgeme_preview_badge', jm_style: '', concierge_install: true %}
          
          <meta itemprop="priceCurrency" content="{{ shop.currency }}">

          <link itemprop="availability" href="http://schema.org/{% if product.available %}InStock{% else %}OutOfStock{% endif %}">

          <p class="product-single__price product-single__price-{{ section.id }}{% unless current_variant.available %} product-price--sold-out{% endunless %}">
            {% if current_variant.compare_at_price > current_variant.price %}
            <span class="visually-hidden">{{ 'products.product.regular_price' | t }}</span>
            <s id="ComparePrice-{{ section.id }}">{{ current_variant.compare_at_price | money }}</s>
            <span class="product-price__price product-price__price-{{ section.id }} product-price__sale product-price__sale--single">
              <span id="ProductPrice-{{ section.id }}"
                    itemprop="price" content="{{ current_variant.price | divided_by: 100.00 }}">
                {{ current_variant.price | money_with_currency	 }}
              </span>
              {% if section.settings.show_saved_amount %}
              <!-- Dscount price in percentage  -->
              {% if product.compare_at_price_max > product.price %}<span class="per_discount">
              {{ product.compare_at_price_min | minus: product.price | times: 100.0 | 
                  divided_by: product.compare_at_price_min | money_without_currency | times: 100 
              | replace: '.0', ''}}{{ 'products.product.on_save' | t }}{% endif %}</span>
              <!-- Dscount price in percentage  -->
              {% endif %}
            </span>
            {% else %}
            <span class="visually-hidden">{{ 'products.product.regular_price' | t }}</span>
            <s id="ComparePrice-{{ section.id }}" class="hide">{{ current_variant.compare_at_price | money }}</s>
            <span class="product-price__price product-price__price-{{ section.id }}">
              <span id="ProductPrice-{{ section.id }}"
                    itemprop="price" content="{{ current_variant.price | divided_by: 100.00 }}">
                {{ current_variant.price | money }}
              </span>

            </span>
            {% endif %}
          </p>
          {% if section.settings.product_review  %}
          <span class="shopify-product-reviews-badge" data-id="{{ product.id }}"></span>
          {% endif %}
          {% if section.settings.product_description == 'under_the_price'%}
          <div class="product-single__description rte" itemprop="description">
            <ul class="tabs">
              <li><a href="#tab-1">{{ 'products.product_tab.product_tab_1' | t }}</a></li>

            </ul>
            <div id="tab-1">
              <div class="product-description">
                {{ product.description }}
              </div>
            </div>

          </div>
          {% endif %}

          <form action="/cart/add" id="AddToCartForm"  method="post" enctype="multipart/form-data" class="product-form product-form-{{ section.id }}{% unless section.settings.show_variant_labels %} product-form--hide-variant-labels{% endunless %}" data-section="{{ section.id }}" data-product="{{ product | json | escape }}"
        data-product-id="{{ product.id }}">
            {% if section.settings.show_quantity_selector %}
            <div class="product-form__item one-whole medium-up--hide product-form__item--quantity_1">
              <label for="Quantity">{{ 'products.product.quantity' | t }}</label>
              <div class="qty_selector">
                <span class='qtyminus' field='quantity'>{% include 'icon-minus' %}</span>
                <input type="number" id="Quantity" name="quantity" value="1" min="1" class="product-form__input qty" pattern="[0-9]*">
                <span class='qtyplus' field='quantity'>{% include 'icon-plus' %}</span>
              </div>            
            </div>
            {% else %}
            <input type="hidden" id="Quantity" name="quantity" value="1" class="product-form__input">
            {% endif %}

            {% unless product.has_only_default_variant %}
            {% if section.settings.show_tags %}
            <div class="prod_tags">
              <h5>{{ 'products.product.tags' | t }} : </h5>
              {% for tag in product.tags %}
              <span>{{ tag }}</span>
              {% endfor %}
            </div>
            {% endif %}
            {% for option in product.options_with_values %}

            <div class="selector-wrapper small--one-whole js product-form__item">
              <label {% if option.name == 'default' %}class="label--hidden" {% endif %}for="SingleOptionSelector-{{ forloop.index0 }}">
                {{ option.name }}
              </label>
              <select class="single-option-selector single-option-selector-{{ section.id }} product-form__input" id="SingleOptionSelector-{{ forloop.index0 }}" data-index="option{{ forloop.index }}">
                {% for value in option.values %}
                <option value="{{ value | escape }}"{% if option.selected_value == value %} selected="selected"{% endif %}>{{ value }}</option>
                {% endfor %}
              </select>
            </div>
            {% endfor %}
            {% endunless %}

            <select name="id" id="ProductSelect-{{ section.id }}" data-section="{{ section.id }}" class="product-form__variants no-js">
              {% for variant in product.variants %}
              {% if variant.available %}
              <option {% if variant == product.selected_or_first_available_variant %} selected="selected" {% endif %} value="{{ variant.id }}">
                {{ variant.title }}
              </option>
              {% else %}
              <option disabled="disabled">{{ variant.title }} - {{ 'products.product.sold_out' | t }}</option>
              {% endif %}
              {% endfor %}
            </select>

            <!-- PRODUCT SWATCH CODE IF ENABLE -->
            {% if section.settings.variant_swacth == 'two'  %}  
            {% if product.variants.size > 1 %}
            <div class="swatch_options">
            {% for option in product.options %}
            {% include 'swatch' with option %}
            {% endfor %} 
            </div>
            {% endif %}
            {% endif %} 
            <!-- END PRODUCT SWATCH CODE IF ENABLE -->
            {% include 'product-page-features' %}
            <input required type="hidden" id="upsellcheckquantity" name="properties[upsellcheckquantity]">
          </form>
          {% include 'banana-stand-product-page-container' %}

          {% if section.settings.enable_sticky %}

          <style>

            @media(max-width:767px) {
              /*               .counter_box.show{display:none !important;} */
              /*
              div#progressBar{ 
              display:none !important;
            }
              .counter_box.show {
              display: none !important;
            } */

              .product-form__item.product-form__item--quantity,  
              .product-form__item.product-form__item--quantity + div {
                display : none !important;
              }
              .only_desktop{
                display:none !important;
              }
              #AddToCartForm .row_grid_qnt{display:none;}
              .stiky_form div#mst-stiky-box {
                left: 0 !important;
                width: 100%;
                right:0;
              }
              .price-lable {
                font-size: 16px !important;
                font-weight: 500 !important;
                text-align: center;
                margin-bottom: 12px;
              }
              .mst-stiky-div.fix-search {
                position: fixed;
                top: 8px;
                z-index: 999;
                width: 310px;
                right: 0;
                display: block!important;
              }
            }

            @media(min-width:769px){



              button#AddToCart {
                visibility: visible !important;
              }

            }
          </style>

          {% if section.settings.enable_buy_it_stiky_qty %}
          <style> 
            @media screen and (max-width:768px) {
              #mst-stiky-box div#sticky_btnn.product-form__item--quantity{ display:none !important; } 
              #AddToCartForm1.stiky_form button#AddToCart{ width:100% !important; } 
              #progress_bar1,#progressBar{ display: none !important; } 
            }
            {% if section.settings.enable_buy_it_stiky_qty and section.settings.sticky_button == 'show_progress_bar' %}
            #progress_bar2,#progressBar1{ display: block !important; }
            #AddToCartForm1.stiky_form .product-form__item.product-form__item--quantity input#Quantity {
              padding: 9px;
            }
            {% endif %}

          </style>
          {% else %}

          <style> 
            @media screen and (max-width:768px) {
              #mst-stiky-box div#sticky_btnn.product-form__item--quantity{ display:block !important;float: left;width: 25% !important;padding-right: 0 !important; } 
            }
          </style>

          {% endif  %}


          {% assign price_var1=current_variant.price | withoutmoney %}  
          <div id="AddToCartForm1" class="product-form product-form-{{ section.id }}{% unless section.settings.show_variant_labels %} product-form--hide-variant-labels{% endunless %} stiky_form{% if price_var1 == 0 %} zerocost_from_box {% endif %}" data-section="{{ section.id }}" >
            <div id="mst-stiky-box" class="mst-stiky-div">
              {% if section.settings.enable_timer_stg_on == 'enable_timer_stg_on' %}  
              {% if section.settings.sticky_button == 'show_timer' %}
              {% assign tg = 'show' %}

              {% if settings.disable_timer_use_tag %}
              {% for tag in product.tags %}
              {% if "no-timer" == tag %}
              {% assign tg = 'hide' %}
              {% endif %}
              {% endfor %}
              {% endif %}
              <div class="price-lable {{tg }}">{{ 'products.product.sticky_timer_text' | t }} 
                {% include 'sticky_timer_mobile'%}
              </div>
              {% endif %}
              {% endif %}
              {% if section.settings.sticky_button == 'show_progress_bar' %}
              {% include 'product-progress-bar-mobile' %}
              {% endif %}

              {% if price_var1 == 0 %}          
              <button type="button" name="add" id="AddToCartZero" class="btn stiky_button">
                <span id="AddToCartText">{{ 'products.product.free_add_to_cart' | t }}</span>
              </button>
              {% else %}          
              {% assign zeroCost='' %}  
              <button type="button" name="add" id="AddToCart" class="btn_sp addtocart_btn stiky_button">
                <span class="AddToCartText addtocarttext">
                  {% unless current_variant.available %}
                  {{ 'products.product.sold_out' | t }}
                  {% else %}
                  {{ 'products.product.add_to_cart' | t }}
                  {% endunless %}
                </span>
              </button>
              {% endif %} 
            </div> 
          </div>


          {% endif %}
        </div>
        {% if section.settings.product_description == 'under_the_timer'%}
        <div class="product-single__description rte" itemprop="description">
          <ul class="tabs">
            <li><a href="#tab-1">{{ 'products.product_tab.product_tab_1' | t }}</a></li>

          </ul>
          <div id="tab-1">
            <div class="product-description">
              {{ product.description }}
            </div>
          </div>

        </div>
        {% endif %}
        {% if section.settings.visitor_counter_enable %}
        <input type="hidden" value="{{section.settings.visitor_counter_number}}" id="min_max_number">
        <p class="fake_counter_p">
          <i class="fas fa-eye"></i>
          <span class="fake_counter_b {{ section.settings.visitor_counter_style }}"> 
            <span id="dynamic_counter1"> </span> 
          </span>
          <span class="fake_counter fake-cntr" > {{ 'products.product.visitor_counter_text' | t}}</span>       
          {% endif %}
        <div class="delivery_time_new">
          {% if section.settings.show_del_time %} 
          <p class="showdeltime">   
            <i class="fas fa-plane" aria-hidden="true"></i> 
            <span>{{ 'products.product.deliiver_time_text_1' | t }} {{ section.settings.delivery_time_number}} {{ 'products.product.deliiver_time_text_2' | t }} </span>
          </p>
          {% endif %}
        </div>
        {% if section.settings.show_social %}
        {% include 'social-sharing', share_title: product.title, share_permalink: product.url, share_image: product %}
        {% endif %}
        {% if section.settings.enable_trust_badges %}
        <div class="payment-icon">
          <p class="line">
            {{ 'products.product.badges_title' | t }}
          </p>
          <span class="payment-img">
            {% unless section.settings.enable_trust_badges_image == blank %}
            <img src="{{ section.settings.enable_trust_badges_image | img_url: '550x' }}">
            {% else %}
            <img src="{{ 'pay_right.png' | asset_img_url: '500x100' }}">               
            {% endunless %}  
          </span>
        </div>
        {% endif %}



        {% if section.settings.product_review  %}

        <div id="shopify-product-reviews" data-id="{{product.id}}">{{ product.metafields.spr.reviews }}</div> 

        {% endif %}
      </div>
    </div>
  </div>
</div>



{% unless product == empty %}
<script type="application/json" id="ProductJson-{{ section.id }}">
    {{ product | json }}
</script>
{% endunless %}
<!-- enable random number-->


{% if  section.settings.enable_progressbar_text and settings.enable_inventory_stock_number == "enable_stock_number_random"%}
<script>
  // for stock left number
  var myLeftnum = ['3','4', '5', '6', '7', '8','9','10','11','12'];    
  var randLeftnum = Math.floor(Math.random() * myLeftnum.length);
  var currentLeftnum = myLeftnum[randLeftnum];

  document.getElementById("stock_left_num").value= currentLeftnum;
  document.getElementById("stock_final_num").value= currentLeftnum;
  document.getElementById("counter_left").innerHTML= currentLeftnum;
/*=================== MOBILE PROGRESS BAR =========================*/
  document.getElementById("stock_left_num1").value= currentLeftnum;
  document.getElementById("stock_final_num1").value= currentLeftnum;
  document.getElementById("counter_left1").innerHTML= currentLeftnum;
/*=================== END MOBILE PROGRESS BAR =========================*/
  //alert(currentLeftnum);
</script>

{% endif %} 


<!-- READ MORE BUTTON SCRIPT AND STYLE -->
{% if section.settings.readmore_enable %}
{{ 'readmore.min.js' | asset_url | script_tag }}
<script>
  function readmore(){
    $(function(){
      $('.product-description').readmore({
        collapsedHeight: 153,
        heightMargin: 16,
        moreLink: '<a href="javascript:void(0)" class="more_load read--btn">{{ "products.timer.readmore" | t }}</a>',
        lessLink: '<a href="javascript:void(0)" class="more_load read--less-btn">{{ "products.timer.readless" | t }}</a>'
      });
    });
  };
  $(document).ready(function(e){
    readmore();
  });
  $(document).on('shopify:section:select', function(e) {
    readmore();
  });
  $(document).on('shopify:section:deselect', function(e){  
    readmore();
  });

</script>
{% endif %}


<!-- END READ MORE BUTTON SCRIPT AND STYLE -->
<!-- Start Ajax Cart script -->
<script>
  function relate_pop(){
    //   alert("{{free_product}}");
    $('#yes_button_text').click(function() {	
      $("#Quantity").val({{ quantity_upsell }});
      $("#upsellcheckquantity").val({{ quantity_upsell }});

      /*add start free product */
      var product_id ='';
      {% for variant in all_products[free_product].variants %}

      {% if variant == all_products[free_product].selected_or_first_available_variant %} 
      product_id = {{variant.id}}
        {% endif %}
        {% endfor %}

        var freeproductBy= Number("{{ freeproductBy }}");

                                  var free_product_parent_id="{{product.id}}";

                                  $("#other_product").val(product_id);

      // var data = 'id='+ product_id + '&title=12121212&quantity=1&properties[other_product]'+freeproductBy;
      var data = 'id='+ product_id + '&quantity=1&properties[free_product]=true&properties[free_product_parent_id]='+free_product_parent_id;
      /* end start free product*/
    });
    // for form not submit
    var popQuantity=$("#Quantity").val();
    if(popQuantity == 1){
      // $('#myModal').modal('show'); 
      $('#related_popup_upsell').modal('show'); 
      return false;
    }else{
      $("#AddToCartForm").submit();
      $("#AddToCartForm1").submit();
    }  
    $("body").on('click','.modal-backdrop', function(){
      $("#AddToCartForm").submit();
      $("#AddToCartForm1").submit();
    });
    $(".available").on("click",function(){ 

      if($(this).hasClass('color') || $(this).hasClass('colour')){
      }else{
        var index1 = $(this).parent('div').parent('div').attr("data-option-index");
        $(".formyswatch" + index1).find('.forremoving').removeClass("hitactive");
        $(this).find('label').addClass("hitactive");
      }
    });    
  }

</script>

<script>
  function related_poup(){

    {% if settings.enable_related_upsell %}

    var test = $("#check_collection_emty").val();

    if(test==1) {

      $("#related_popup_upsell").modal('show');
      $("#comment_child_like").html('<img src="{{ 'ajax-loader.gif' | asset_url  }}" class="loder_black"  >');
                                    $("#comment_child_like").load(location.href + " #comment_parent_like" , function(){
        //         jQuery('.related_pupup_rendome_parent  > .related_pupup_rendome').pick(3);
      } );
      setTimeout(function(){ 
        $('body').addClass('modal-open');
      }, 1500);
    }else{
      where_to_go();
    }
    {%else%}
    where_to_go();
    {% endif %}
  }
  $(document).on('hide.bs.modal','#related_popup_upsell', function () {
    where_to_go();
  });
  //   $(document).on('click', function () {
  //     where_to_go();
  //   });

  function  where_to_go(){

    {% if section.settings.buy_it_now_action == 'thank_you_message' %}
    setTimeout(function(){ 
      $(".close").trigger("click");
    }, 1500);

    {% elsif section.settings.buy_it_now_action == 'direct_to_checkout' %}
    $(".custome_checkout").trigger("click");
    {% else %}
    window.location.href='/cart';
    {% endif %}
  }

</script>
<!-- End Ajax Cart script -->

<!-- START UPSELL AND ADD TO CART CODE -->

{% if section.settings.buy_it_now_action == 'thank_you_message' %}

{% elsif section.settings.buy_it_now_action == 'direct_to_checkout' %}
<input type="hidden" name="return_to" value="/checkout" />
{% else %}
<input type="hidden" name="return_to" value="/cart" />
{% endif %}

<!-- END UPSELL AND ADD TO CART CODE -->
{% if section.settings.visitor_counter_enable %}
<script>
  /*********************
rendomly number avialable user on current page
***********************/ 
  jQuery(function($) {
    var min_max =  $("#min_max_number").val();
    min_max1 = min_max.split("-");

    var min1 =  parseInt(min_max1[0]);
    var max1 =  parseInt(min_max1[1]);

    min = Math.ceil(min1);
    max = Math.floor(max1);
    setInterval(function(){  
      var  r =  Math.floor(Math.random()*(max-min+1)+min);
      if(r >= min1  && r <= max1)
      {
        var digits = (""+r).split("");
        var d = '';
        for(var j=0;j<digits.length;j++){

          d += '<span>'+ digits[j] +'</span>';

        }          
        jQuery("#dynamic_counter1").html(d); 
      } 
    }, 5000);
  });

</script>
{% endif %}

<!--  Start Sticky Button Script  -->
<script>
  {% if section.settings.enable_sticky %}
  $("#mst-stiky-box").addClass('fix-search');
  $(".stiky_button").on("click",function(){ 
    $('#AddToCartForm').find('button[type="submit"]').trigger("click");
  });

  $(document).scroll(function () {

    var y = $(this).scrollTop();
    var t = $('#mst-stiky-box').parentsUntil('.template-product').find('#shopify-section-footer').offset().top - 400;

    if (y > t) {
      $('.mst-stiky-div').fadeOut('fast');
      $("#mst-stiky-box").removeClass('fix-search').hide();

    } else {
      $('.mst-stiky-div').fadeIn('fast');
      $("#mst-stiky-box").addClass('fix-search').show();
      //alert();
    }
  });


  {% endif %}
</script>
<!--  End Sticky Button Script  -->


<!-- Pick an option code -->

{% comment %}
See https://docs.shopify.com/themes/customization/products/how-to-add-a-pick-an-option-to-drop-downs
{% endcomment %}
{% if section.settings.enable_default_variant %}


{% unless product.selected_variant %}
{% if product.variants.size > 1 %}
<script>
  function pickasize() {
    var productOptions = [];
    {% for option in product.options %}
    var optionObj = {};
    optionObj[ {{ forloop.index0 }} ] = "{{ product.options[forloop.index0] }}";
    productOptions.push(optionObj);
    {% endfor %}

    if( typeof(productOptions ) != "undefined" ){

      for(i=0;i<productOptions.length;i++) {
        $('.single-option-selector:eq('+ i +')')
        .filter(function() {
          return $(this).find('option').length > 1
        })
        .prepend('<option value="">{{"products.product.pick_a_text" | t}} ' + productOptions[i][i] + '</option>')
        .val('')
        .trigger('change');
      }
    }
  }
  $(document).ready(function(){
    pickasize();
  });
  $(document)
  .on('shopify:section:select', function(e){
    pickasize();
  });

  $(document)
  .on('shopify:section:deselect', function(e){
    pickasize();
  });

</script>  

{% endif %}
{% endunless %}
{% endif %}
<!-- End Pick an option code -->


{% schema %}
  {
    "name": "Product page",
    "settings": [
	  {
        "type": "header",
        "content": "Product page [NEED HELP?](https:\/\/help.boostertheme.com\/hc\/en-us\/articles\/360003047493-How-to-setup-the-product-page-)"
      },
  	  {
        "type": "select",
        "id": "buy_it_now_action",
        "label": "Buy it Now Action",
        "default": "direct_to_cart",
          "options": [
          {
            "value": "thank_you_message",
            "label": "Added To Cart Message"
          },
		  {	
            "value": "direct_to_checkout",
            "label": "Direct to Checkout"
          },
		  {	
            "value": "direct_to_cart",
            "label": "Direct to Cart"
          }
        ] 
      },
      { 
		"type": "checkbox",
      	"id": "show_saved_amount",
      	"label": "Show Saved %",
      	"default": true
      },
	  {
        "type": "checkbox",
        "id": "enable_default_variant",
        "label": "Enable Make a Selection Option"
      },
	  {
        "type": "checkbox",
        "id": "show_quantity_selector",
        "label": "Show Quantity",
        "default": false
      },
	  {
        "type": "checkbox",
        "id": "show_vendor",
        "label": "Show Vendor",
        "default": false
	  },
      {
        "type": "checkbox",
        "id": "enable_zoom",
        "label": "Enable image zoom",
        "default": true
      },
      {
        "type": "checkbox",
        "id": "readmore_enable",
        "label": "Enable Read more button",
		"default": true
      },
      {
        "type": "checkbox",
        "id": "enable_progressbar_text",
        "label": "Enable Progress Bar",
        "default": true
      },
	  {
        "type": "checkbox",
        "id": "enable_timer_top_message",
        "label": "Enable Stock Left Message",
        "default": true
      },
  	  {
        "type": "checkbox",
        "id": "enable_shipping",
        "label": "Enable Free + Shipping",
        "default": false
      },
	  {
        "type": "checkbox",
        "id": "show_tags",
		"label": "Show tags",
        "default": false
  	  },
	  {
        "type": "checkbox",
        "id": "show_social",
		"label": "Show social buttons",
        "default": false
  	  },
	  {
        "type": "radio",
        "id": "enable_timer_stg_on",
        "default": "enable_timer_stg_on",
        "options": [
          {
            "value": "enable_timer_stg_on",
            "label": "ON timer"
          },
          {
            "value": "enable_timer_stg_off",
            "label": "OFF timer"
          }
        ],
        "label": "Timer Setting ON\/OFF"
      },
	  {
        "type": "header",
        "content": "Variant Option [NEED HELP?](https:\/\/help.boostertheme.com\/hc\/en-us\/articles\/360002471493-How-to-Upload-Your-Color-Swatches-in-Booster-2-0-)"
      },
      {
        "type": "radio",
        "id": "variant_swacth",
        "label":"Variant type",
        "info": "Choose between color swatch or drop down menu for the variant",
        "options": [
          {
            "value": "one",
          	"label": "Drop down menu"
          },
          {
            "value": "two",
            "label": "Color swatch"
          }
        ],
          "default": "two"
      },
      {
        "type":"header",
        "content":"Swatch Option"
      },
      {
        "type": "radio",
        "id": "swatch_option",
        "label":"Color Swatch style",
        "options": [
          {
            "value": "with_background",
          	"label": "Background Color or image"
          },
          {
            "value": "without_background",
            "label": "Show color title like other swatches"
          }
        ],
          "default": "without_background"
      },
      {
        "type":"paragraph",
        "content":"When you choose 'background Color or image' option, you can change colors shape by using below option"
      },
      {
        "type": "radio",
        "id": "color_style",
        "label":"Shape of Color Swatch",        
        "options": [
          {
            "value": "square_box",
          	"label": "Square"
          },
          {
            "value": "round_shape",
            "label": "Round"
          }
        ],
          "default": "round_shape"
      },
      {
        "type":"header",
        "content":"Product Review"
      },
      {
        "type":"checkbox",
        "label":"Enable rating and review",
        "id":"product_review",
        "info":"make sure your shopify review app must be install",
        "default": true
      },
      {
        "type":"header",
        "content":"Visitor Counter"
      },
	  {
        "type": "checkbox",
        "id": "visitor_counter_enable",
        "label": "Visitor Counter Enable"
      },
      {
        "type": "select",
        "id": "visitor_counter_number",
        "label": "Visitor counter",
        "default": "1-15",
          "options": [
          {
            "value": "1-5",
            "label": "1 to 5"
          },
          {
            "value": "1-10",
            "label": "1 to 10"
          },
		  {
            "value": "1-15",
            "label": "1 to 15"
          } 
        ] 
      },
      {
        "type":"header",
        "content":"Delivery Time"
      },
	  {
        "type":"checkbox",
        "id": "show_del_time",
		"label":"Enable Delivery Time",
        "default": true
      },
	  {
        "type": "select",
        "id": "delivery_time_number",
        "label": "Delivery time",
        "default": "1-3",
          "options": [
          {
            "value": "1-3",
            "label": "1 to 3"
          },
          {
            "value": "3-5",
            "label": "3 to 5"
          },
          {
            "value": "5-10",
            "label": "5 to 10"
          },
		  {
            "value": "7-14",
            "label": "7 to 14"
          },
		  {	
            "value": "14-21",
            "label": "14 to 21"
          },
		  {	
            "value": "14-30",
            "label": "14 to 30"
          },
		  {	
            "value": "21 - 30",
            "label": "21 to 30"
          } 
        ] 
      },	  
	  {
		"type": "header",
		"content": "Desktop"
	  },
	  {
        "type": "select",
        "id": "product_description",
        "label": "Product Description",
        "default": "under_the_price",
          "options": [
          {
            "value": "under_the_price",
            "label": "Under the price"
          },
		  {	
            "value": "under_the_timer",
            "label": "Under the timer"
          } 
        ] 
      },
	  {
		"type": "header",
		"content": "Mobile"
	  },
	  {
        "type": "checkbox",
        "id": "enable_sticky",
        "label": "Enable Sticky button",
        "default": true
      },
	  {
        "type": "select",
        "id": "sticky_button",
        "label": "Sticky Button",
        "default": "show_timer",
        "options": [
          {
            "value": "show_timer",
            "label": "Show timer"
          },
		  {	
            "value": "show_progress_bar",
            "label": "Show progress bar"
          } 
        ] 
      },
	  {
		"type": "header",
		"content": "Badges"
	  },
      {
        "type": "checkbox",
        "id": "enable_trust_badges",
        "label": "Enable Badges",
        "default": true
      },
	  {
        "type": "image_picker",
        "id": "enable_trust_badges_image",
        "label": "Payment icons"
      }
    ]
  }
{% endschema %}