{% set classes = ['aae-a-loop-pagination', 'e-con', 'e-atomic-element', base_styles.base] | merge(settings.classes | default([])) | join(' ') %}
{# Edge-state classes, known at render time: on the first page Prev is useless,
   on the last page Next/Load More are — CSS hides them (frontend only, the
   editor keeps every piece visible/styleable). NO ternary — Twing breaks. #}
{% set pg_c = pg_current | default(1) %}
{% set pg_t = pg_total | default(1) %}
<div class="{{ classes }} {{ editor_classes | default('') }}{% if pg_c <= 1 %} aae-pg-first{% endif %}{% if pg_c >= pg_t %} aae-pg-last{% endif %}"
    data-id="{{ id }}"
    data-element_type="{{ type }}"
    data-e-type="{{ type }}"
    data-interaction-id="{{ interaction_id }}"
    data-aae-pagination="1"
    data-aae-method="{{ pg_method | default('ajax') }}"
    data-aae-current="{{ pg_current | default(1) }}"
    data-aae-total="{{ pg_total | default(1) }}"
    data-aae-config="{{ pg_config | default('{}') | e('html_attr') }}"
    {% if settings._cssid is defined and settings._cssid is not empty %}
        id="{{ settings._cssid | e('html_attr') }}"
    {% endif %}
    {% if settings.attributes is defined and settings.attributes is not empty %}
        {{ settings.attributes | raw }}
    {% endif %}
    {{ editor_attributes | default('') | raw }}>
    {{ children_placeholder | raw }}
</div>