{%- if editmode -%}

    {%- for i in pimcore_block('ctaHeadingBlock').iterator() -%}

        <div class="ms-40">

            <div class="row">
                <div class="col-3">
                    <div class="h6">Color</div>
                    {{ pimcore_select("color", {
                        "store": select_editables_store.theme_colors,
                        "defaultValue": "body"
                    }) }}
                </div>
                <div class="col-3">
                    <div class="h6">Thin</div>
                    {{ pimcore_checkbox("thin", {
                        "label": "Use thin weight"
                    }) }}
                </div>
            </div>

            <div class="text-{{ pimcore_select("color").data }} text-{{ alignment }} {{ heading_size }}">{{ pimcore_input('text') }}</div>

        </div>

    {%- endfor -%}

{%- else -%}

    <div class="d-flex justify-content-{{ alignment }}">

        <{{ heading_semantic }} class="text-{{ alignment }} {{ heading_size }} cta-heading"  {% if max_width and not max_width.empty %}style="max-width:{{ max_width }}rem"{% endif %}>

            <a href="{{ link.getHref }}" target="{{ link.getTarget() }}" class="d-flex">

                <div>
                
                    {%- for i in pimcore_block('ctaHeadingBlock').iterator() -%}

                        <span class="text-{{ pimcore_select("color").data }} {{ pimcore_checkbox("thin").checked ? 'thin' : '' }}">
                            {{ pimcore_input('text').data }}
                        </span>

                    {%- endfor -%}

                </div>

            </a>

        </{{ heading_semantic }}>

    </div>

{%- endif -%}