{% with F="displaypage/partials/section_edit/field.html" M="displaypage/partials/section_edit/media_picker.html" %}
<span data-modal-wide hidden></span>
<h2 class="editor-modal__title">Edit text &amp; media section</h2>
<form class="editor-modal-form dp-section-form" action="{% url 'displaypage:section_edit' section.pk %}" method="post" data-owner="{{ section.owner_ref }}" data-dp-section-form="text_media">
  {% include "displaypage/partials/section_edit/form_start.html" %}
  <div class="editor-text-media-grid dp-edit-grid">
    <div class="editor-text-media-col editor-text-media-col--main">
      {% include F with field=form.title label="Title" hint="(optional)" %}
      <div class="editor-form__field editor-form__field--body">
        <label for="{{ form.body.id_for_label }}">Text</label>
        {{ form.body }}
        {% if form.body.errors %}<div class="editor-form__errors" role="alert">{{ form.body.errors }}</div>{% endif %}
      </div>
      <div class="editor-form__grid editor-form__grid--two">
        {% include F with field=form.more_link label="Button link" hint="(optional)" %}
        {% include F with field=form.more_link_text label="Button text" hint="(default: Read more)" %}
      </div>
    </div>
    <div class="editor-text-media-col editor-text-media-col--settings">
      {% include F with field=form.layout label="Layout" %}
      {% include F with field=form.media_type label="Media" %}

      {% include M with field=form.section_image type="image" label="Image" hint="(for a self-hosted video: its poster)" show_if="media_type:image,video" %}
      {% include M with field=form.section_mobile_image type="image" label="Image for phones" hint="(optional)" show_if="media_type:image" %}

      {% include F with field=form.video_url label="Video URL" hint="(YouTube, Vimeo, or a configured video host)" show_if="media_type:video" %}
      {% include M with field=form.section_video_file type="video" label="Or a self-hosted video" hint="(used instead of the URL; plays as a silent background in the 'over media' layouts)" show_if="media_type:video" %}
      {% include M with field=form.section_mobile_video_file type="video" label="Background video for phones" hint="(optional)" show_if="media_type:video" %}

      {% include "displaypage/partials/section_edit/gallery_picker.html" with field=form.gallery_image_ids label="Gallery images" show_if="media_type:gallery" %}

      {% include F with field=form.caption label="Caption" hint="(optional)" %}
      {% include F with field=form.media_position label="Media position" show_if="layout:side" %}
      {% include F with field=form.media_width label="Media width on desktop" show_if="layout:side" %}
      {% include F with field=form.content_position label="Text position" show_if="layout:inside-page,inside-full" %}
      {% if form.colour_scheme %}{% include F with field=form.colour_scheme label="Colour scheme" %}{% endif %}
      {% include "displaypage/partials/section_edit/style_fields.html" %}
    </div>
  </div>
  {% include "displaypage/partials/section_edit/actions.html" %}
</form>
{% endwith %}