{% set classes = classes|default("") %}
{% set color = color|default("blue") %}
{% if isDark is same as(true)  %}
    {% set isDark = true %}
{% else %}
    {% set isDark = false %}
{% endif %}
{% set classes = isDark ? classes ~ ' is-dark' : classes %}
{% if isSolid is same as(true)  %}
    {% set isSolid = true %}
{% else %}
    {% set isSolid = false %}
{% endif %}
{% set classes = isSolid ? classes ~ ' is-solid' : classes %}
{% set classes = isLargeMobile ? classes ~ ' is-large-mobile' : classes %}
{% set classes = isTransparent ? classes ~ ' is-transparent' : classes %}
{% set direction = direction|default('next') %}

<button class="button button-circle button-circle-arrow button-circle-arrow--{{ direction }} {{ classes }}" aria-label="{{ direction }}">
    <span class="button-circle__wrap">
        <span class="button-circle__icon">
            {% include "@assets/vectors/icons-18/arrow.svg" %}
            <span class="visuallyhidden">Arrow Icon</span>
        </span>

        {% include "@views/components/buttons/button-background.twig" with {
            isDark: isDark,
            isSolid: isSolid,
            isTransparent: isTransparent,
        } %}
    </span>
</button>