{% load static i18n cookies_tags %}

{% translate cookie_modal_button_accept as accept_text %}
{% translate cookie_modal_button_accept_all as accept_all_text %}
{% translate cookie_modal_button_decline as decline_text %}
{% translate cookie_modal_button_settings as settings_text %}

<div id="cookie-consent-modal-wrapper" class="ga-cookie-modal-wrapper noselect">
    <div class="ga-cookie-modal">

        <div class="ga-cookie-modal-header">
            <div class="ga-cookie-modal-title">
                <h2>{{cookie_modal_title}}</h2>
                {% if cookie_modal_logo %}
                    <a href="{{cookie_modal_logo_url}}" target="_blank" rel="external noopener" aria-label="{% translate "Open link in a new tab" %}">
                        <img class="icon" src="{% static cookie_modal_logo %}" alt="{{cookie_modal_title}}" />
                    </a>
                {% endif %}
            </div>
            <div class="ga-cookie-modal-description">
                <p>{{cookie_modal_description}}</p>
            </div>
        </div>

        <div class="ga-cookie-modal-tabs">
            <div class="ga-cookie-modal-tab open ga-cookie-modal-form-tab" id="ga-cookie-modal-main-tab">
                
                <form class="ga-cookie-modal-form" method="post" action="{{cookie_modal_form_action}}">
                    {% csrf_token %}
                    <div class="ga-cookie-modal-actions p-2">
                        <button type="submit" class="mr-1 mb-1 ga-cookie-modal-accept btn btn-primary" name="{{cookie_modal_accept_all_value}}" value="{{cookie_modal_accept_all_value}}">
                            {{accept_all_text}}
                        </button>
                        <button type="button" class="mr-1 mb-1 ga-cookie-modal-settings btn btn-primary btn-outline" id="ga-cookie-modal-settings">
                            {{settings_text}}
                        </button>
                        <button type="submit" class="mr-1 mb-1 ga-cookie-modal-decline btn btn-danger btn-outline">
                            {{decline_text}}
                        </button>
                    </div>
                </form>

            </div>

            <div class="ga-cookie-modal-tab ga-cookie-modal-tab-settings" id="ga-cookie-modal-tab-settings">

                <form class="ga-cookie-modal-form" method="post" action="{{cookie_modal_form_action}}">
                    {% csrf_token %}
                    <input type="hidden" name="cookie_modal_form_type" value="cookie_modal_accept_all_cookies" />
                    <div class="ga-cookie-modal-content">
                        {% for form_field in cookie_modal_form %}
                            <div class="form-group">

                                {% if form_field.field.widget.input_type == "checkbox" %}
                                    {{ form_field }}
                                    <label for="{{ form_field.id_for_label }}">
                                        <span class="label-text">{{ form_field.label }}</span>
                                    </label>
                                {% else %}
                                    <label for="{{ form_field.id_for_label }}">{{ form_field.label }}</label>
                                    <div class="form-field{%if form_field.errors|length > 0%} has-errors{%endif%}">
                                        {{ form_field }}
                                    </div>
                                {% endif %}
                                {% if fields_show_errors and form_field.errors %}
                                    <div class="alert alert-danger">
                                        {% for error in form_field.errors %}
                                            <small>{{ error }}</small>
                                        {% endfor %}
                                    </div>
                                {% endif %}
                                {% if form_field.help_text %}
                                    <small id="{{ form_field.id_for_label }}-help" class="form-help-text text-muted">{{ form_field.help_text }}</small>
                                {% endif %}
                            </div>
                        {% endfor %}
                        {% for item in cookie_modal_extras %}
                            {% render_with_context item %}
                        {% endfor %}
                    </div>
                    <div class="ga-cookie-modal-actions p-2">
                        <button type="submit" class="mr-1 mb-1 ga-cookie-modal-accept btn btn-primary">
                            {{accept_text}}
                        </button>
                        <button type="button" class="mr-1 mb-1 ga-cookie-modal-back btn btn-primary btn-outline" id="ga-cookie-modal-back">
                            {% translate "Back" %}
                        </button>
                    </div>
                </form>

            </div>

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