<div class="container-desktop-vertical-margin" {% render 'overwrite-theme-style', desktop_settings: section.settings %}>
<div class="container-mobile-full">

    {%- capture class -%}
        {%- if section.settings.overwrite_theme_background_color != blank -%}
            {%- assign alpha = section.settings.overwrite_theme_background_color | color_extract: 'alpha' -%}

            {%- if alpha == 1 -%}
                container-horizontal-desktop
            {%- endif -%}
        {%- endif -%}
    {%- endcapture -%}

    <div class="custom-reviews {{ class }}" {% render 'overwrite-theme-style', settings: section.settings %}>
        
        {%- if section.settings.title != blank -%}
            <h2 class="container-only-mobile" style="text-align: {{ section.settings.text_alignment }};">{{ section.settings.title }}</h2>
        {%- endif -%}

        {%- if section.settings.description != blank -%}
            <div class="container-only-mobile" style="text-align: {{ section.settings.text_alignment }};">{{ section.settings.description }}</div>
        {%- endif -%}

        <div class="custom-reviews-cards swiper">
            <div class="swiper-wrapper">
                {%- for block in section.blocks -%}
                    <div class="swiper-slide">
                    <div class="custom-reviews-card container-only-mobile">
                        <div class="custom-reviews-card-image" {% unless section.settings.show_image %} style="display: none;"{% endunless %}>
                            {% render 'image', 
                                image: block.settings.image, 
                                placeholder_padding_vertical: 40,
                                placeholder_padding_horizontal: 40 %}
                        </div>
                        
                        <span {% unless block.settings.show_stars %} style="display: none;"{% endunless %}>
                            {% assign star_id = section.id | append: block.id %}
                            {% render 'review-stars', stars: block.settings.stars, id: star_id %}
                        </span>

                        <p>{{ block.settings.review }}</p>

                        <p>{{ block.settings.from }}</p>
                    </div>
                    </div>
                {% endfor %}
            </div>

            <div class="swiper-button-prev"></div>
            <div class="swiper-button-next"></div>
        </div>

    </div>
</div>
</div>

{% schema %}
{
    "name": "t:sections.section-custom-reviews.name",
    "settings": [
        {
            "type": "richtext",
            "id": "title",
            "label": "t:sections.section-custom-reviews.settings.title"
        },
        {
            "type": "richtext",
            "id": "description",
            "label": "t:sections.section-custom-reviews.settings.description"
        },
        {
            "type": "header",
            "content": "t:sections.general.settings"
        },
        {
            "type": "checkbox",
            "id": "show_image",
            "default": true,
            "label": "t:sections.section-custom-reviews.settings.show_image"
        },
        {
            "type": "select",
            "id": "text_alignment",
            "default": "left",
            "label": "t:sections.section-custom-reviews.settings.text_alignment",
            "options": [
                {
                    "value": "left",
                    "label": "t:sections.section-custom-reviews.settings.text_alignment_left"
                },
                {
                    "value": "center",
                    "label": "t:sections.section-custom-reviews.settings.text_alignment_center"
                },
                {
                    "value": "right",
                    "label": "t:sections.section-custom-reviews.settings.text_alignment_right"
                }
            ]
        },
        {
            "type": "header",
            "content": "t:sections.general.mobile_margin"
        },
        {
            "type": "range",
            "id": "overwrite_theme_margin_top",
            "label": "t:sections.section-custom-reviews.settings.overwrite_theme_margin_top",
            "min": -50,
            "max": 50,
            "step": 1,
            "unit": "px",
            "default": 0
        },
        {
            "type": "range",
            "id": "overwrite_theme_margin_bottom",
            "label": "t:sections.section-custom-reviews.settings.overwrite_theme_margin_bottom",
            "min": -50,
            "max": 50,
            "step": 1,
            "unit": "px",
            "default": 0
        },
        {
            "type": "header",
            "content": "t:sections.section-custom-reviews.settings.desktop_margin"
        },
        {
            "type": "range",
            "id": "desktop_margin_top",
            "label": "t:sections.section-custom-reviews.settings.desktop_margin_top",
            "min": -200,
            "max": 200,
            "step": 5,
            "unit": "px",
            "default": 0
        },
        {
            "type": "range",
            "id": "desktop_margin_bottom",
            "label": "t:sections.section-custom-reviews.settings.desktop_margin_bottom",
            "min": -200,
            "max": 200,
            "step": 5,
            "unit": "px",
            "default": 0
        },
        {
            "type": "header",
            "content": "t:sections.general.theme-settings.content",
            "info": "t:sections.general.theme-settings.info"
        },
        {
            "type": "color",
            "id": "overwrite_theme_background_color",
            "label": "t:sections.section-custom-reviews.settings.overwrite_theme_background_color",
            "info": "t:sections.section-custom-reviews.settings.overwrite_theme_background_color_info"
        }
    ],
    "blocks": [
        {
            "type": "review",
            "name": "t:sections.section-custom-reviews.blocks.review.name",
            "settings": [
                {
                    "type": "image_picker",
                    "id": "image",
                    "label": "t:sections.section-custom-reviews.blocks.review.settings.image"
                },
                {
                    "type": "checkbox",
                    "id": "show_stars",
                    "default": true,
                    "label": "t:sections.section-custom-reviews.blocks.review.settings.show_stars"
                },
                {
                    "type": "range",
                    "id": "stars",
                    "label": "t:sections.section-custom-reviews.blocks.review.settings.stars",
                    "min": 0,
                    "max": 5,
                    "step": 0.5,
                    "unit": "#",
                    "default": 5
                },
                {
                    "type": "richtext",
                    "id": "review",
                    "label": "t:sections.section-custom-reviews.blocks.review.settings.review"
                },
                {
                    "type": "text",
                    "id": "from",
                    "label": "t:sections.section-custom-reviews.blocks.review.settings.from"
                }
            ]
        }
    ],
    "presets": [
        {
            "name": "t:sections.section-custom-reviews.name"
        }
    ]
}
{% endschema %}