{% set upfront          = upfront|json_parse %}
{% set hasAsterisk      = hasAsterisk|json_parse %}
{% set promotion        = promotion|json_parse %}
{% set reversed         = reversed|json_parse %}
{% set fullWidth        = fullWidth|json_parse %}

<div class='d-flex flex-column flex-sm-row justify-content-center minh-100 {% if reversed %}reversed bf-color-bg-ground{% endif %}'>
    {% for index in [1,2] %}

        <div class='flex-grow-1 d-flex flex-column align-items-center minh-100 pb-4 {% if index == 2 and reversed is not defined %}reversed bf-color-bg-ground{% endif %}'>
            <div class='w-100'>

                {% if size is defined and size is not empty %}

                    <h3 class='mt-5 ml-3'>Size '{{ size }}'</h3>

                    <div class='d-flex flex-column flex-lg-row'>

                        {% include '@bf-components/price/twig/index.twig' %}

                        {% include '@bf-components/price/twig/index.twig' with {
                            language    : language|default('fr')
                        } %}

                    </div>

                {% else %}

                    <h3 class='mt-5 ml-3'>Size 'small' (default)</h3>

                    <div class='d-flex flex-column flex-lg-row'>

                        {% include '@bf-components/price/twig/index.twig' %}

                        {% include '@bf-components/price/twig/index.twig' with {
                            language    : language|default('fr')
                        } %}

                    </div>

                    <h3 class='mt-5 ml-3'>Size 'medium'</h3>

                    <div class='d-flex flex-column flex-lg-row'>

                        {% include '@bf-components/price/twig/index.twig' with {
                            size        : size|default('medium')
                        } %}

                        {% include '@bf-components/price/twig/index.twig' with {
                            size        : size|default('medium'),
                            language    : language|default('fr')
                        } %}

                    </div>

                    <h3 class='mt-5 ml-3'>Size 'large'</h3>

                    <div class='d-flex flex-column flex-lg-row'>

                        {% include '@bf-components/price/twig/index.twig' with {
                            size        : size|default('large')
                        } %}

                        {% include '@bf-components/price/twig/index.twig' with {
                            size        : size|default('large'),
                            language    : language|default('fr')
                        } %}
                    </div>

                {% endif %}

            </div>
        </div>

    {% endfor %}
</div>