{% block root %}
    <div class="{{ content.css_classes }}">

        {% block label %}
            {% if content.label %}
                <label {% if content.id %}for="{{ content.id }}"{% endif %}>{{ content.label }}</label>
            {% endif %}
        {% endblock %}

        {% block help %}
            {% if content.help %}

                <div id="{{ content.id }}-help-wrapper" class="field-help-wrapper">
                    <input id="{{ content.id }}-help-toggle" class="toggle-input" type="checkbox" />
                    <label for="{{ content.id }}-help-toggle" class="toggle-label" title="Show help">?</label>
                    <div id="{{ content.id }}-help" class="field-help">
                        {{ content.help.render() }}
                    </div>
                </div>
            {% endif %}
        {% endblock %}

        {% block field %}
            <input
                {% if content.id %}
                    id="{{ content.id }}"
                {% endif %}
                {% if not content.valid %}
                    class="invalid"
                {% endif %}
                type="{{ content.input_type }}"
                name="{{ content.name_qualified }}"
                {% if not content.value is none %}
                    value="{{ content.html_value }}"
                {% endif %}

                {% block field_extra %}{% endblock %}

            />
        {% endblock %}

        {% block errors %}
            {% if content.errors|length %}
                <ul class="form-field-errors">
                    {% for error in content.errors %}
                        <li class="error">{{ error }}</li>
                    {% endfor %}
                </ul>
            {% endif %}
        {% endblock %}

    </div>
{% endblock %}