{% set title = data["Title"]["value"] %}
{% set content = data["Content"]["value"] %}
{% set note = data["Note"]["value"] %}
{% set image = data["Image"] %}
{% set button_title = data["Button Title"]["value"] %}
{% set button_url = data["Button URL"]["value"] %}

{% if data["Enabled"]["value"] == 1 %}
    <section class="bmiCalculatorBlock">
        <div class="wrapper">
            <div class="bmiCalculatorBlock__inner">
                <div class="bmiCalculatorBlock__inner--column">
                    {% if title is not empty or content is not empty %}
                        <div class="bmiCalculatorBlock__info">
                            {% if title is not empty %}
                                <h2 class="bmiCalculatorBlock__info__title">{{ title }}</h2>
                            {% endif %}

                            {% if content is not empty %}
                                <div class="wysiwyg bmiCalculatorBlock__info__content">
                                    {{ content|raw }}
                                </div>
                            {% endif %}
                        </div>
                    {% endif %}

                    {% if note is not empty %}
                        <div class="bmiCalculatorBlock__bmiCard">
                            <!-- :bmi-categories="{{ bmi_categories|json_encode }}" -->
                            <!-- :assessment-link="{{ bmi_assessment_link|json_encode }}" -->
                            <bmi-calculator-graph></bmi-calculator-graph>

                            <div class="wysiwyg note">
                                {{ note|raw }}
                            </div>
                        </div>
                    {% endif %}

                    {% if button_title is not empty and button_url is not empty %}
                        <div class="bmiCalculatorBlock__actions">
                            <a href="{{ button_url }}" class="button bmiCalculatorBlock__actions__button">
                                {{ button_title }}
                            </a>
                        </div>
                    {% endif %}
                </div>

                <div class="bmiCalculatorBlock__inner--column bmiCalculatorBlock__inner--lightBg">
                    <weight-loss-graph>
                        {% if image["value"] is not empty %}
                            <picture class="bmiCalculatorBlock__imageWrapper">
                                <img
                                    src="/{{ image_folders["cms_images"]["bmi_calculator"]["path"] }}/{{
                                    image["value"]
                                    }}"
                                    width="635"
                                    height="635"
                                    alt="{{ image["alt"] }}"
                                />
                            </picture>
                        {% endif %}
                    </weight-loss-graph>
                </div>
            </div>
        </div>
    </section>
{% endif %}
