{% set classes = classes|default("") %}
{% set eyebrow = eyebrow|default("") %}
{% set heading = heading|default("") %}
{% set headingClass = headingClass|default("h2") %}
{% set paragraph = paragraph|default("") %}
{% set cta = cta|default("") %}
{% set ctaSecondary = ctaSecondary|default("") %}
{% set color = color|default("green") %}

{# Toggle light text over dark background #}
{% set isDark = (isDark|default('') and isDark == true) ? true : false %}

{# Toggle animation data attributes #}
{% set isAnimated = (isAnimated|default('') and isAnimated == true) ? true : false %}

<div class="text-group text-group-carousel {% if isDark %}text-group-carousel--light{% endif %} {{ classes }}">
    <div class="text-group-carousel__text" {{ isAnimated ? 'data-skroll-text' : '' }}>
        {% if eyebrow %}
            <div class="eyebrow text-group-carousel__eyebrow" data-skroll-eyebrow>
                <span class="eyebrow__text">{{ eyebrow }}</span>
            </div>
        {% endif %}

        {% if heading %}
            {% include "@views/components/textual/heading/carousel/template.twig" with {
                classes: "text-group-carousel__heading",
                tag: headingClass,
                text: heading,
                isAnimated: isAnimated,
            } %}
        {% endif %}

        {% if paragraph %}
            {% include "@views/components/textual/paragraph/hero/template.twig" with {
                classes: "text-group-carousel__paragraph-text",
                text: paragraph,
                isAnimated: isAnimated,
            } %}
        {% endif %}
    </div>

    {% if cta or ctaSecondary %}
        {% if cta.title %}
            {% set text = cta.title %}
            {% else %}
            {% set text = cta.text %}
        {% endif %}
        {% if cta.url %}
            {% set href = cta.url %}
            {% else %}
            {% set href = cta.href %}
        {% endif %}
        {% if ctaSecondary.title %}
            {% set secondaryText = ctaSecondary.title %}
            {% else %}
            {% set secondaryText = ctaSecondary.text %}
        {% endif %}
        {% if ctaSecondary.url %}
            {% set secondaryHref = ctaSecondary.url %}
            {% else %}
            {% set secondaryHref = ctaSecondary.href %}
        {% endif %}
        <div class="text-group-carousel__ctas" {{ isAnimated ? 'data-skroll-buttons' : '' }}>
            {% if cta %}
                {% include "@views/components/buttons/primary/template.twig" with {
                    classes: "text-group-carousel__cta",
                    text: text,
                    href: href,
                    icon: cta.icon,
                    target: cta.target,
                    params: saveCtaParams,
                    external: cta.external,
                    color: color,
                    isSolid: isDark ? true : false,
                } %}
            {% endif %}

            {% if ctaSecondary %}
                {% include "@views/components/buttons/primary/template.twig" with {
                    classes: "text-group-carousel__cta text-group-carousel__cta-meal-plan",
                    href: secondaryHref,
                    icon: ctaSecondary.icon,
                    target: ctaSecondary.target,
                    external: ctaSecondary.external,
                    text: secondaryText,
                    isSolid: false
                } %}
            {% endif %}
        </div>
    {% endif %}
</div>