{% load i18n dsfr_tags wagtailcore_tags wagtailimages_tags %}
{% image value.bg_image original as bg_img %}
<div class="fr-py-5w {{ value.vertical_margin }} cmsfr-block-full-width-background-with-sidemenu"
     {% if value.bg_color_class or bg_img or value.bg_color %}style="background:{% endif %}
     {% if bg_img %}no-repeat center url({{ bg_img.url }}){% endif %}
     {% if value.bg_color_class %} var(--background-alt-{{ value.bg_color_class }}) {% elif value.bg_color %}{{ value.bg_color }}{% endif %}
     {% if value.bg_color_class or bg_img or value.bg_color %};"{% endif %}>
  <div class="fr-container">
    <div class="fr-grid-row fr-grid-row--gutters fr-mb-3w">
      <div class="fr-col fr-col-md-4 fr-col-12">
        <nav class="fr-sidemenu fr-mb-0-5v">
          <div class="fr-sidemenu__inner">
            <button class="fr-sidemenu__btn"
                    hidden
                    aria-controls="fr-sidemenu-wrapper-{{ block.id }}"
                    aria-expanded="false">{% translate "In this section" %}</button>
            <div class="fr-collapse" id="fr-sidemenu-wrapper-{{ block.id }}">
              {% if value.sidemenu_title %}
                <div class="fr-sidemenu__title" id="fr-sidemenu-title">{{ value.sidemenu_title }}</div>
              {% endif %}
              {% include "sites_conformes_content_manager/blocks/blocks_stream.html" with stream=value.sidemenu_content %}
            </div>
          </div>
        </nav>
      </div>
      <div class="fr-col fr-col-md-8 fr-col-12">
        {% include "sites_conformes_content_manager/blocks/blocks_stream.html" with stream=value.main_content %}
      </div>
    </div>
  </div>
</div>
