<!-- section/testimonials.liquid -->
{{ 'testimonials.css' | asset_url | stylesheet_tag }}
{{ 'top-head.css' | asset_url | stylesheet_tag }}
{%- style -%}
  #{{section.id}} .hdt-slider__dots{display:flex}
  @media(min-width:1150px){
    #{{section.id}} .hdt-slider__dots:not(.hdt-show-dot-true){
      display:none
    }
  }
  #shopify-section-{{section.id}}{
    --section-pt:{{section.settings.padding_top}}px;
    --section-pb:{{section.settings.padding_bottom}}px;
    --section-prate:{{section.settings.padding_rate}}
    }
{%- endstyle -%}
<div id="{{ section.id }}" class="hdt-section-testimonials hdt-section-spacing hdt-s-gradient hdt-relative" color-scheme="{{ section.settings.color_scheme }}" style="--color-pr-rating:{{ section.settings.pr_rating }}">
  {%- if section.settings.image_bg != blank -%}
    <div class="hdt-testimonial_imagebg hdt-h-full hdt-w-full hdt-full-width-link">
      {{ section.settings.image_bg | image_url: width: section.settings.image_bg.width | image_tag: loading: 'lazy', width: section.settings.image_bg.width, height: section.settings.image_bg.height, class: 'hdt-w-full hdt-h-full hdt-object-cover', sizes: "100vw", widths: "375, 550, 750, 1100, 1500, 1780, 2000, 3000, 3840" }}
    </div>
  {%- endif -%}
  <div class="hdt-container{%- if section.settings.section_fullwidth -%} -full{% endif %} hdt-tesimonials-main-content hdt-relative">
    <div class="hdt-testimonials-headings">
      {% content_for 'block', type: 'section-heading', id: 'testimonials' %}
      <div class="hdt-main-testimonial">
        <hdt-slider  autoheight id="Slider-{{ section.id }}" class="hdt-slider hdt-dots-outline hdt-hidden-slider-nav hdt-hidden-slider-dots hdt-testimonials-{{ section.settings.testimonial_des }} hdt-slide-spacing-15 md:hdt-slide-spacing-30 lg:hdt-slides-{{ section.settings.col_dk }} md:hdt-slides-{{ section.settings.col_tb }} hdt-slides-{{ section.settings.col_mb }} {% if section.settings.navUI %} hdt-nav-btns-{{ section.settings.nav_des }}{% endif %} hdt-relative hdt-nav-{{ section.settings.nav_pos }}" config='{"navUI":{{ section.settings.navUI }}, "dotUI":true,"autoHeight": true }'>
          <div class="hdt-slider__viewport hdt-relative">
						<div class="hdt-slider__container">
							{% content_for 'blocks' %}
						</div>
					</div>
					{%- if section.settings.navUI -%}
            <button aria-controls="Slider-{{ section.id }}" class="hdt-slider__button hdt-hidden@mobile hdt-slider-nav hdt-slider-btn_{{ section.settings.nav_des }} hdt-inline-flex hdt-align-center hdt-justify-center hdt-slider__button--prev hdt-rounded-full" type="button" name="previous">
              {%- if section.settings.nav_des != "simple" -%}
                <svg xmlns="http://www.w3.org/2000/svg" width="7" height="11" viewBox="0 0 7 11" fill="none"><path d="M5.5 11L0 5.5L5.5 0L6.47625 0.97625L1.9525 5.5L6.47625 10.0238L5.5 11Z" fill="currentColor"/></svg>
              {%- else -%}
                <svg xmlns="http://www.w3.org/2000/svg" width="19" height="14" viewBox="0 0 19 14" fill="none"><path d="M7.00033 14L8.63366 12.3083L4.49199 8.16667H18.667V5.83333H4.49199L8.63366 1.69167L7.00033 0L0.000326157 7L7.00033 14Z" fill="currentColor"/></svg>
              {%- endif -%}
            </button>
            <button aria-controls="Slider-{{ section.id }}" class="hdt-slider__button hdt-hidden@mobile hdt-slider-nav hdt-slider-btn_{{ section.settings.nav_des }} hdt-inline-flex hdt-align-center hdt-justify-center hdt-slider__button--next hdt-rounded-full" type="button" name="next">
              {%- if section.settings.nav_des != "simple" -%}
                <svg xmlns="http://www.w3.org/2000/svg" width="7" height="11" viewBox="0 0 7 11" fill="none"><path d="M1.5 11L7 5.5L1.5 0L0.52375 0.97625L5.0475 5.5L0.52375 10.0238L1.5 11Z" fill="currentColor"/></svg>
              {%- else -%}
                <svg xmlns="http://www.w3.org/2000/svg" width="19" height="14" viewBox="0 0 19 14" fill="none"><path d="M11.6667 14L10.0333 12.3083L14.175 8.16667H0V5.83333H14.175L10.0333 1.69167L11.6667 0L18.6667 7L11.6667 14Z" fill="currentColor"/></svg>
              {%- endif -%}
            </button>
          {%- endif -%}
            <div hdt-slider-dots aria-controls="Slider-{{ section.id }}" class="hdt-slider__dots hdt-show-dot-{{ section.settings.dotUI }} hdt-flex hdt-align-center hdt-justify-center" hidden style="--dis_dot:{{ section.settings.dis_dot }}px"></div>
        </hdt-slider>
      </div>
    </div>
  </div>
</div>
{% schema %}
{
  "name": "t:sections.testimonials.name",
  "class": "hdt-section hdt-testimonials",
  "disabled_on": {
    "groups": [
      "*"
    ]
  },
  "settings": [
    {
      "type": "header",
      "content": "t:sections.all.section_general_options"
    },
    {
      "type": "select",
      "id": "content_align",
      "label": "t:sections.testimonials.settings.content_align.label",
      "default": "start",
      "options": [
        {
          "value": "start",
          "label": "t:sections.testimonials.settings.content_align.option_1.label"
        },
        {
          "value": "center",
          "label": "t:sections.testimonials.settings.content_align.option_2.label"
        }
      ]
    },
    {
      "type": "select",
      "id": "testimonial_des",
      "label": "t:sections.testimonials.settings.testimonials_des.label",
      "default": "1",
      "options": [
        {
          "value": "1",
          "label": "t:sections.testimonials.settings.testimonials_des.option_1.label"
        },
        {
          "value": "2",
          "label": "t:sections.testimonials.settings.testimonials_des.option_2.label"
        },
        {
          "value": "3",
          "label": "t:sections.testimonials.settings.testimonials_des.option_3.label"
        },
        {
          "value": "4",
          "label": "t:sections.testimonials.settings.testimonials_des.option_4.label"
        }
      ]
    },
    {
      "type": "select",
      "id": "col_dk",
      "label": "t:sections.all.items_row.desktop",
      "default": "4",
      "options": [
        {
          "label": "1",
          "value": "1"
        },
        {
          "label": "2",
          "value": "2"
        },
        {
          "label": "3",
          "value": "3"
        },
        {
          "label": "4",
          "value": "4"
        }
      ]
    },
    {
      "type": "select",
      "id": "col_tb",
      "label": "t:sections.all.items_row.tablet",
      "default": "2",
      "options": [
        {
          "label": "1",
          "value": "1"
        },
        {
          "label": "2",
          "value": "2"
        },
        {
          "label": "3",
          "value": "3"
        }
      ]
    },
    {
      "type": "select",
      "id": "col_mb",
      "label": "t:sections.all.items_row.mobile",
      "default": "1",
      "options": [
        {
          "label": "1",
          "value": "1"
        },
        {
          "label": "2",
          "value": "2"
        }
      ]
    },
    {
      "type": "header",
      "content": "t:sections.all.slider.label"
    },
    {
      "type": "checkbox",
      "id": "navUI",
      "label": "t:sections.all.slider.navUI",
      "default": false
    },
    {
      "type": "select",
      "id": "nav_pos",
      "label": "t:sections.all.slider.nav_pos.label",
      "info": "t:sections.all.slider.nav_pos.info",
      "options": [
        {
          "value": "middle_in",
          "label": "t:sections.all.slider.nav_pos.options.middle_in"
        },
        {
          "value": "middle_out",
          "label": "t:sections.all.slider.nav_pos.options.middle_out"
        }
      ],
      "default": "middle_out"
    },
    {
      "type": "select",
      "id": "nav_des",
      "label": "t:sections.all.slider.nav_des.label",
      "options": [
        {
          "value": "default",
          "label": "t:sections.all.slider.nav_des.options.default"
        },
        {
          "value": "outline",
          "label": "t:sections.all.slider.nav_des.options.outline"
        },
        {
          "value": "simple",
          "label": "t:sections.all.slider.nav_des.options.simple"
        }
      ],
      "default": "default"
    },
    {
      "type": "checkbox",
      "id": "dotUI",
      "label": "t:sections.all.slider.dotUI",
      "default": false
    },
    {
      "type": "range",
      "id": "dis_dot",
      "min": 0,
      "max": 100,
      "step": 1,
      "label": "Distance from dots to quote items",
      "default": 30
    },
    {
      "type": "header",
      "content": "t:sections.footer.settings.header-option"
    },
    {
      "type": "color_scheme",
      "id": "color_scheme",
      "label": "t:sections.all.colors.label"
    },
    {
      "type": "color",
      "id": "pr_rating",
      "label": "t:sections.testimonials.settings.pr_rating.label",
      "default": "#FF7B54"
    },
    {
      "type": "image_picker",
      "id": "image_bg",
      "label": "t:sections.testimonials.settings.image.label"
    },
    {
      "type": "checkbox",
      "id": "section_fullwidth",
      "label": "t:sections.all.section_fullwidth",
      "default": false
    },
    {
      "type": "header",
      "content": "t:sections.all.padding.section_padding_heading"
    },
    {
      "type": "range",
      "id": "padding_top",
      "min": 0,
      "max": 150,
      "step": 2,
      "unit": "px",
      "label": "t:sections.title.settings.padding_top.label",
      "default": 30
    },
    {
      "type": "range",
      "id": "padding_bottom",
      "min": 0,
      "max": 150,
      "step": 2,
      "unit": "px",
      "label": "t:sections.title.settings.padding_bottom.label",
      "default": 30
    },
    {
      "type": "range",
      "id": "padding_rate",
      "min": 0,
      "max": 100,
      "step": 1,
      "unit": "%",
      "label": "t:sections.all.padding.padding_rate",
      "default": 75
    }
  ],
  "blocks": [
    {
      "type": "_quote"
    }
  ],
  "presets": [
    {
      "name": "t:sections.testimonials.name",
      "blocks": [
        {
          "type": "_quote"
        },
        {
          "type": "_quote"
        },
        {
          "type": "_quote"
        },
        {
          "type": "_quote"
        }
      ]
    }
  ]
}
{% endschema %}
