<div class="dataTableFeatures">
    <div class="dataTableFooterNavigation">

        {% if not isDataTableEmpty and (properties.show_offset_information or properties.show_pagination_control) %}
            <div class="row dataTablePaginationControl">
                {% if properties.show_pagination_control %}
                    <span class="dataTablePrevious">&lsaquo; {% if clientSideParameters.dataTablePreviousIsFirst is defined %}{{ 'General_First'|translate }}{% else %}{{ 'General_Previous'|translate }}{% endif %}</span>
                    &nbsp;
                {% endif %}
                {% if properties.show_offset_information %}
                    <span class="dataTablePages"></span>
                {% endif %}
                {% if properties.show_pagination_control %}
                    &nbsp;<span class="dataTableNext">{{ 'General_Next'|translate }} &rsaquo;</span>
                {% endif %}
            </div>
        {% endif %}

        <div class="row">
            <div class="col s9 m9 dataTableControls">
                {% include "@CoreHome/_dataTableActions.twig" %}
            </div>

            {% if not isDataTableEmpty and (properties.show_footer_icons and properties.show_pagination_control or properties.show_limit_control) %}
                <div class="col s3 m3 limitSelection"></div>
            {% endif %}
        </div>

        {% if (properties.related_reports is not empty) and properties.show_related_reports %}
            <div class="row datatableRelatedReports">
                {{ properties.related_reports_title|raw }}
                <ul style="list-style:none;{% if properties.related_reports|length == 1 %}display:inline-block;{% endif %}">
                    <li><span href="{{ properties.self_url }}" style="display:none;">{{ properties.title }}</span></li>

                    {% for reportUrl,reportTitle in properties.related_reports %}
                        <li><span href="{{ reportUrl }}">{{ reportTitle }}</span></li>
                    {% endfor %}
                </ul>
            </div>
        {% endif %}
    </div>

    <span class="loadingPiwik" style="display:none;">
        {% include "@CoreHome/_loader.twig" %}
        {{ 'General_LoadingData'|translate }}
    </span>

    {% if properties.show_footer_message is defined and properties.show_footer_message is not empty %}
        <div class='datatableFooterMessage'>{{ properties.show_footer_message | raw }}</div>
    {% endif %}

</div>

<span class="loadingPiwikBelow" style="display:none;">
    {% include "@CoreHome/_loader.twig" %}
    {{ 'General_LoadingData'|translate }}
</span>

<div class="dataTableSpacer"></div>
