{% if show_dummy_data == true %}
    {% set p = {
        'pagedata': {
            'CTA Boxes': [
                {
                    'Title': {'value': 'Prescription Services'},
                    'Content': {'value': '<p>Fast and reliable prescription dispensing with free home delivery available.</p>'},
                    'URL': {'value': '/prescriptions'},
                    'Light Text': {'value': '0'},
                    'Image': {'value': 'prescription-cta.jpg', 'alt': 'Prescription services'}
                },
                {
                    'Title': {'value': 'Health Consultations'},
                    'Content': {'value': '<p>Book a private consultation with our qualified healthcare professionals.</p>'},
                    'URL': {'value': '/consultations'},
                    'Light Text': {'value': '1'},
                    'Image': {'value': 'consultation-cta.jpg', 'alt': 'Health consultations'}
                },
                {
                    'Title': {'value': 'Wellness Products'},
                    'Content': {'value': '<p>Browse our extensive range of vitamins, supplements and wellness products.</p>'},
                    'URL': {'value': '/wellness'},
                    'Light Text': {'value': '0'},
                    'Image': {'value': 'wellness-cta.jpg', 'alt': 'Wellness products'}
                }
            ]
        }
    } %}
{% endif %}

{% set categoryBoxSlider = "{
        destroy: true,
        pagination: false,
        rewind: false,
        arrows: false,
        speed: 1500,
        perMove: 1,
        perPage: 3,
        breakpoints: {
            1120: {
                perPage: 2,
                destroy: false,
                pagination: true
            },
            640: {
                perMove: 1,
                perPage: 1,
                destroy: false,
                pagination: true
            }
        }
}"
%}

<div class="ctaBoxes">

    <div class="wrapper">

        <mtc-slider
                class="ctaBoxes__grid"
                :options="{{ categoryBoxSlider }}"
        >
            {% for cta_box in p.pagedata['CTA Boxes'] %}

                {% if cta_box['Title']['value'] is not empty and cta_box['Image']['value'] is not empty %}

                    <mtc-slide class="ctaBoxes__cta">

                        {% include 'includes/partials/cta_image_box.twig' with {
                            box: cta_box
                        }%}

                    </mtc-slide> <!-- .ctaBoxes__cta -->

                {% endif %}

            {% endfor %}
          
        </mtc-slider>
        

    </div> <!-- .wrapper -->

</div> <!-- .ctaBoxes -->
