{% load l10n cascade_tags %}
{% localize off %}{% spaceless %}
        {% with bootstrap_element="carousel" inline_styles=instance.inline_styles %}
<div id="cmsplugin_{{ instance.id }}" class="{{ instance.css_classes }}"{% if inline_styles %} style="{{ inline_styles }}"{% endif %} {{ instance.html_tag_attributes }}>
        <ol class="carousel-indicators">
        {% for slide in instance.child_plugin_instances %}
                <li data-target="#cmsplugin_{{ instance.id }}" data-slide-to="{{ forloop.counter0 }}"{% if forloop.first %} class="active"{% endif %}></li>
        {% endfor %}
        </ol>
        <div class="carousel-inner" role="listbox">
        {% for slide in instance.child_plugin_instances %}
                <div class="carousel-item {% if forloop.first %} active{% endif %}">
                {% render_plugin slide %}
                </div>
        {% endfor %}
        </div>
        <a class="carousel-control-prev" href="#cmsplugin_{{ instance.id }}" role="button" data-slide="prev">
                <span class="carousel-control-prev-icon" aria-hidden="true"></span>
        </a>
        <a class="carousel-control-next" href="#cmsplugin_{{ instance.id }}" role="button" data-slide="next">
                <span class="carousel-control-next-icon" aria-hidden="true"></span>
        </a>
</div>
        {% endwith %}
{% endspaceless %}{% endlocalize %}
