<div {{ attributes.defaults({class: 'theme-' ~ this.customData.color|default('unknown')}) }}>
   <a {% if this.link %}href="{{ this.link }}" data-tracking-click="{{ this.gTMClickData }}" {% endif %} tabindex="-1">
      <div class="img">
         {% if this.video %}
            <twig:Video id_video="{{ this.video }}"/>
         {% else %}
            <twig:Picture img_class="img-fluid" thumbnail="{{ this.thumbnail }}" type="slider_home" is_lazy="{{ this.is_thumbnail_lazy }}"
                          fetchpriority="{{ not this.is_thumbnail_lazy ? 'high' }}"/>
         {% endif %}
      </div>
      <div class="content">
         {% if this.customData.title|default(false) %}
            <p class="title">{{ this.customData.title }}</p>
         {% endif %}
         {% if this.description %}
            <p class="descr">
               {{ this.description }}
            </p>
         {% endif %}
         {% if this.link %}
            <span class="btn btn-{{ this.customData.btncolor|default('light') }}">{{ this.customData.btn|default('Prohlédnout') }}</span>
         {% endif %}
      </div>
   </a>
   {% if this.getCustomDataProducts %}
      {% for id in this.getCustomDataProducts %}
         <twig:ProductList:PreviewItem id_product="{{ id }}"/>
      {% endfor %}
   {% endif %}
</div>
