<div class="container" {% render 'overwrite-theme-style', settings: section.settings %}>
    <h2>{{ 'footer.newsletter.title' | t }}</h2>
    <p>{{ 'footer.newsletter.description' | t }}</p>

    {%- assign formId = 'Contact' -%}
    {% form 'customer', id: formId, novalidate: 'novalidate' %}
        {%- if form.posted_successfully? -%}
        <p class="form-message form-message--success" tabindex="-1" data-form-status>
            {{ 'footer.newsletter.success_message' | t }}
        </p>
        {%- endif -%}
        <input type="hidden" name="contact[tags]" value="newsletter">
        <div class="footer-column-newsletter-inputs">
            <input type="email"
                name="contact[email]"
                id="{{ formId }}-email"
                class="newsletter-input{% if form.errors %} input--error{% endif %}"
                value="{{ form.email }}"
                placeholder="{{ 'footer.newsletter.field_placeholder' | t }}"
                aria-required="true"
                required
                autocorrect="off"
                autocapitalize="off"
                {% if form.errors %}
                    aria-invalid="true"
                    aria-describedby="{{ formId }}-email-error"
                    data-form-status
                {% endif %}>
            <button type="submit" class="btn newsletter-submit" name="commit">{{ 'footer.newsletter.button' | t }}</button>
        </div>
        {% if form.errors contains 'email' %}
        <span id="{{ formId }}-email-error" class="input-error-message">
            <span class="visually-hidden">{{ 'footer.newsletter.error_message' | t }}</span>
            <span class="site-footer__newsletter-error">{{ form.errors.translated_fields['email'] | capitalize }} {{ form.errors.messages['email'] }}.</span>
        </span>
        {% endif %}
    {% endform %}

    <p class="footer-column-newsletter-privacy-policy">{{ 'footer.newsletter.policy_text' | t }}<a href="policies/privacy-policy">{{ 'footer.newsletter.policy_link' | t }}</a>.</p>
</div>

{% schema %}
{
    "name": "t:sections.section-newsletter.name",
    "settings": [
        {
            "type": "header",
            "content": "t:sections.general.margin"
        },
        {
            "type": "range",
            "id": "overwrite_theme_margin_top",
            "label": "t:sections.section-newsletter.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-newsletter.settings.overwrite_theme_margin_bottom",
            "min": -50,
            "max": 50,
            "step": 1,
            "unit": "px",
            "default": 0
        }
    ],
    "presets": [
        {
            "name": "t:sections.section-newsletter.name"
        }
    ]
}
{% endschema %}