<div id="{{ currentWidget.getWidgetId() }}"  data-widget-id="{{ currentWidget.getWidgetId() }}" class="moto-widget moto-widget-mototeam-advanced_contact_form moto-widget_with-content-editor {{ currentWidget.getSpacing('classes') }} {{ currentWidget.getVisibleOn('classes') }}" data-widget="moto_team@advanced_contact_form" data-preset="{{ currentWidget.properties.preset }}">
    {% if isPreview %}
        <div class="moto-widget-empty"></div>
        <div class="moto-widget-cover"></div>
    {% endif %}
    {% if currentWidget.properties.customDesign.enabled %}
    <style type="text/css">
    /* NORMAL STATE START */
{% if (currentWidget.properties.customDesign.normalState['font-color'] or currentWidget.properties.customDesign.normalState['border-color'] or currentWidget.properties.customDesign.normalState['background-color']) %}
    #{{ currentWidget.getWidgetId() }} .moto-form__attachments-item,
    #{{ currentWidget.getWidgetId() }} .moto-form__element .moto-form__field-control {
        {% if currentWidget.properties.customDesign.normalState['font-color'] %}color: {{ currentWidget.properties.customDesign.normalState['font-color'] }};{% endif %}
        {% if currentWidget.properties.customDesign.normalState['border-color'] %}border-color: {{ currentWidget.properties.customDesign.normalState['border-color'] }};{% endif %}
        {% if currentWidget.properties.customDesign.normalState['background-color'] %}background-color: {{ currentWidget.properties.customDesign.normalState['background-color'] }};{% endif %}
    }
{% endif %}
{% if currentWidget.properties.customDesign.normalState['font-color'] %}
    #{{ currentWidget.getWidgetId() }} .moto-form__element.moto-form__element_checkbox .moto-form__field-label,
    #{{ currentWidget.getWidgetId() }} .moto-form__element.moto-form__element_radio .moto-form__field-label {
        color: {{ currentWidget.properties.customDesign.normalState['font-color'] }};
    }
{% endif %}
{% if currentWidget.properties.customDesign.normalState['placeholder-color'] %}
    #{{ currentWidget.getWidgetId() }} .moto-form__element .moto-form__field-control::-webkit-input-placeholder {
        color: {{ currentWidget.properties.customDesign.normalState['placeholder-color'] }};
    }
    #{{ currentWidget.getWidgetId() }} .moto-form__element .moto-form__field-control::-moz-placeholder {
        color: {{ currentWidget.properties.customDesign.normalState['placeholder-color'] }};
    }
    #{{ currentWidget.getWidgetId() }} .moto-form__element .moto-form__field-control:-ms-input-placeholder {
       color: {{ currentWidget.properties.customDesign.normalState['placeholder-color'] }};
    }
{% endif %}
{% if currentWidget.properties.customDesign.normalState['icon-color'] %}
    #{{ currentWidget.getWidgetId() }} .moto-form__element .moto-form__field-icon {
        color: {{ currentWidget.properties.customDesign.normalState['icon-color'] }};
    }
{% endif %}
    /* NORMAL STATE END */
    /* FOCUS STATE START */
{% if (currentWidget.properties.customDesign.focusState['font-color'] or currentWidget.properties.customDesign.focusState['border-color'] or currentWidget.properties.customDesign.focusState['background-color']) %}
    #{{ currentWidget.getWidgetId() }} .moto-form__attachments-item:hover,
    #{{ currentWidget.getWidgetId() }} .moto-form__field-control:focus {
        {% if currentWidget.properties.customDesign.focusState['font-color'] %}color: {{ currentWidget.properties.customDesign.focusState['font-color'] }};{% endif %}
        {% if currentWidget.properties.customDesign.focusState['border-color'] %}border-color: {{ currentWidget.properties.customDesign.focusState['border-color'] }};{% endif %}
        {% if currentWidget.properties.customDesign.focusState['background-color'] %}background-color: {{ currentWidget.properties.customDesign.focusState['background-color'] }};{% endif %}
    }
{% endif %}
{% if currentWidget.properties.customDesign.focusState['placeholder-color'] %}
    #{{ currentWidget.getWidgetId() }} .moto-form__element .moto-form__field-control:focus::-webkit-input-placeholder {
        color: {{ currentWidget.properties.customDesign.focusState['placeholder-color'] }};
    }
    #{{ currentWidget.getWidgetId() }} .moto-form__element .moto-form__field-control:focus::-moz-placeholder {
        color: {{ currentWidget.properties.customDesign.focusState['placeholder-color'] }};
    }
    #{{ currentWidget.getWidgetId() }} .moto-form__element .moto-form__field-control:focus:-ms-input-placeholder {
        color: {{ currentWidget.properties.customDesign.focusState['placeholder-color'] }};
    }
{% endif %}
{% if currentWidget.properties.customDesign.focusState['icon-color'] %}
    #{{ currentWidget.getWidgetId() }} .moto-form__field-control_input:focus + .moto-form__field-icon {
        color: {{ currentWidget.properties.customDesign.focusState['icon-color'] }};
    }
{% endif %}
        /* FOCUS STATE END */
        /* ERROR STATE START */
{% if (currentWidget.properties.customDesign.errorState['font-color'] or currentWidget.properties.customDesign.errorState['border-color'] or currentWidget.properties.customDesign.errorState['background-color']) %}
    #{{ currentWidget.getWidgetId() }} .moto-form__attachments-item_error,
    #{{ currentWidget.getWidgetId() }} .moto-form__element_invalid .moto-form__field-control {
        {% if currentWidget.properties.customDesign.errorState['font-color'] %}color: {{ currentWidget.properties.customDesign.errorState['font-color'] }};{% endif %}
        {% if currentWidget.properties.customDesign.errorState['border-color'] %}border-color: {{ currentWidget.properties.customDesign.errorState['border-color'] }};{% endif %}
        {% if currentWidget.properties.customDesign.errorState['background-color'] %}background-color: {{ currentWidget.properties.customDesign.errorState['background-color'] }};{% endif %}
    }
{% endif %}
{% if currentWidget.properties.customDesign.errorState['font-color'] %}
    #{{ currentWidget.getWidgetId() }} .moto-form__errors-items .moto-form__error-item {
        color: {{ currentWidget.properties.customDesign.errorState['font-color'] }};
    }
{% endif %}
{% if currentWidget.properties.customDesign.errorState['placeholder-color'] %}
    #{{ currentWidget.getWidgetId() }} .moto-form__element_invalid .moto-form__field-control::-webkit-input-placeholder {
        color: {{ currentWidget.properties.customDesign.errorState['placeholder-color'] }};
    }
    #{{ currentWidget.getWidgetId() }} .moto-form__element_invalid .moto-form__field-control::-moz-placeholder {
        color: {{ currentWidget.properties.customDesign.errorState['placeholder-color'] }};
    }
    #{{ currentWidget.getWidgetId() }} .moto-form__element_invalid .moto-form__field-control:-ms-input-placeholder {
        color: {{ currentWidget.properties.customDesign.errorState['placeholder-color'] }};
    }
{% endif %}
{% if currentWidget.properties.customDesign.errorState['icon-color'] %}
#{{ currentWidget.getWidgetId() }} .moto-form__element.moto-form__element_invalid .moto-form__field-icon {
    color: {{ currentWidget.properties.customDesign.errorState['icon-color'] }};
}
#{{ currentWidget.getWidgetId() }} .moto-form__element_invalid .moto-form__element_checkbox .moto-form__field-icon,
#{{ currentWidget.getWidgetId() }} .moto-form__element_invalid .moto-form__element_radio .moto-form__field-icon {
    color: {{ currentWidget.properties.customDesign.errorState['icon-color'] }};
}
{% endif %}
/* ERROR STATE END */
    </style>
    {% endif %}
    <form data-moto-widget-contact-form-advanced{% if not isPreview %} data-token="{{ currentWidget.getContactFormAccessToken() }}"{% endif %}
          ng-class="{
                'moto-widget-advanced_contact_form_invalid': $FORM.$submitted && $FORM.$invalid,
                'moto-widget-advanced_contact_form_filling': $FORM._$filling,
                'moto-widget-advanced_contact_form_sending': $FORM._$sending,
                'moto-widget-advanced_contact_form_sending-success': $FORM._$sendingSuccess,
                'moto-widget-advanced_contact_form_sending-error': $FORM._$sendingError
            }"
          data-settings="{{ currentWidget.exportSettings()|json_encode }}"
          class="moto-widget-advanced_contact_form__form" role="form" name="$FORM" ng-submit="submitForm()" novalidate>
        <div class="moto-widget-advanced_contact_form__content-wrapper">
            {% for item in currentWidget.children %}
                {% if isServer %}
                    {{ widget(item) }}
                {% else %}
                    {% widget item %}{% endWidget %}
                {% endif %}
            {% endfor %}
        </div>
    </form>
</div>