{% set config = element.config %}

<style>
    .moorl-newsletter-privacy, .moorl-newsletter-privacy a{
        color: {{ config.privacyColor.value }}
    }
</style>

<div class="cms-element-form cms-element-{{ element.type }}">
    <form action="{{ seoUrl('frontend.form.newsletter.register.handle') }}" method="post" data-form-csrf-handler="true" data-form-validation="true">
        <div class="moorl-input-container">
            {% sw_include '@Storefront/storefront/element/cms-element-form/form-components/cms-element-form-input.html.twig'
                with {
                fieldName: 'email',
                type: 'email',
                required: true,
                placeholder: config.placeholder.value
            }
            %}
            <button type="submit" aria-label="Submit" class="btn" style="color:{{ config.buttonTextColor.value }}; background-color:{{ config.buttonBackground.value }}">
                {{ config.buttonText.value }}
            </button>
        </div>

        {% if config.optin.value %}
            <div class="moorl-newsletter-privacy">
                {% sw_include '@Storefront/storefront/element/cms-element-form/form-components/cms-element-form-privacy.html.twig' %}
            </div>
        {% endif %}

        <div class="form-hidden-fields">
            <input type="hidden" name="option" value="{{ constant('Shopware\\Storefront\\Controller\\FormController::SUBSCRIBE') }}">
            <input type="submit" class="submit--hidden d-none"/>
        </div>
    </form>
</div>