/** Shopify CDN: Minification failed

Line 16:0 Unexpected "<"
Line 19:5 Expected identifier but found "%"
Line 20:6 Unexpected "<"
Line 21:9 Expected identifier but found "%"
Line 22:10 Unexpected "<"
Line 27:9 Expected identifier but found "%"
Line 28:6 Unexpected "<"
Line 29:5 Expected identifier but found "%"
Line 30:2 Unexpected "<"
Line 35:7 Expected identifier but found "%"
... and 10 more hidden warnings

**/
<slider-component>

  <div class="slider slider--everywhere">
    {% for block in section.blocks %}
      <div class="slider__slide">
        {% if block.settings.image != blank %}
          <img
            src="{{ block.settings.image | img_url: '1500x' }}"
            alt="{{ block.settings.image.alt | escape }}"
            class="image"
          >
        {% endif %}
      </div>
    {% endfor %}
  </div>

  <!-- Slider dots + nav buttons -->
  <div class="slider-buttons">
    <div class="slider-counter slider-counter--dots">
      {% for block in section.blocks %}
        <button
          type="button"
          class="slider-counter__link slider-counter__link--dots{% if forloop.first %} slider-counter__link--active{% endif %}"
          data-step="{{ forloop.index0 }}"
          aria-label="Go to slide {{ forloop.index }}"
        >
          <span class="dot"></span>
        </button>
      {% endfor %}
    </div>
  </div>

</slider-component>

{% style %}
  /* FORCE SLIDER DOTS TO ALWAYS SHOW */
  #shopify-section-{{ section.id }} .slider-buttons {
    display: flex !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  #shopify-section-{{ section.id }} .slider-counter--dots {
    display: flex !important;
    opacity: 1 !important;
    visibility: visible !important;
  }
{% endstyle %}
