{% macro collapsible_section(title, section_id, classes='', sync_group='') -%}
  <details id="{{ section_id }}"
           class="settings-section settings-section--collapsible form-card full-width {{ classes }}"
           data-component="settings-section"
           {% if sync_group %}data-sync-group="{{ sync_group }}"{% endif %}>
    <summary class="settings-section__summary">
      <span class="settings-section__heading">{{ title }}</span>
      <span class="settings-section__chevron" aria-hidden="true"></span>
    </summary>
    <div class="settings-section__content">{{ caller() }}</div>
  </details>
{%- endmacro %}