<!-- Accordion for sections -->
<div class="row">
  <div class="col-md-12">

    <div class="draggable-sections" data-url="<%=
      sort_org_admin_template_phase_path(template, phase)
     %>">

      <%= render partial: "org_admin/sections/section_group",
                 locals: { sections: Array(prefix_section),
                           phase: phase,
                           template: template,
                           current_section: current_section,
                           modifiable: true } if prefix_section %>

      <%= render partial: "org_admin/sections/section_group",
                locals: { sections: sections,
                          phase: phase,
                          template: template,
                          current_section: current_section,
                          modifiable: modifiable } %>

      <% suffix_sections.each do |s| %>
        <%= render partial: "org_admin/sections/section_group",
                   locals: { sections: Array(s),
                             phase: phase,
                             template: template,
                             current_section: current_section,
                             modifiable: true } %>
      <% end %>

    </div>

    <% if template.latest? && (modifiable || template.customization_of.present?) %>
      <div class="panel panel-default">
        <a href="#new_section" class="heading-button"
           data-toggle="collapse" data-parent="sections-accordion"
           data-target="#collapseSectionNew"
           aria-expanded="false"
           aria-controls="#collapseSectionNew">

          <div class="panel-heading" role="tab" id="<%= "headingSectionNew" %>">
            <div class="panel-title pull-left">
              <%= _('Add a new section') %>
            </div>
            <div class="pull-right">
              <i class="fa fa-plus pull-right" aria-hidden="true"></i>
              <i class="fa fa-edit pull-right" aria-hidden="true"></i>
            </div>
            <div class="clearfix"></div>
          </div>
        </a>
        <div
          id="collapseSectionNew" class="panel-collapse collapse" role="tabpanel"
          aria-labelledby="<%= "headingSectionNew" %>">
           <div class="panel-body">
             <%= render partial: 'org_admin/sections/new',
                        locals: {
                          template: template,
                          phase: phase } %>
           </div>
        </div>
      </div>
    <% end %>
  </div>

</div>