{#
/**
 * @file
 * Template for a Bootstrap 5 Accordion Item.
 *
 * Available variables:
 * - title: The label for the accordion toggle button.
 * - heading_level: (optional) The HTML heading tag level (1-6). Defaults to 3.
 * - open_by_default: (boolean) Whether the item should be expanded on load.
 * - accordion_id: (optional) The ID of the parent accordion container to 
 * enable "single-open" behavior.
 *
 * Available blocks:
 * - accordion_body: The content area of the accordion item.
 *
 * @ingroup themeable
 */
#}

{# Initialize unique IDs and default values. #}
{% set heading_level = heading_level|default(3) %}
{% set item_id = 'accordion-item-' ~ random() %}
{% set heading_id = 'heading-' ~ item_id %}
{% set expanded = open_by_default ? 'true' : 'false' %}

<div class="accordion-item">
  <h{{ heading_level }} class="accordion-header" id="{{ heading_id }}">
    <button
      class="accordion-button {% if not open_by_default %}collapsed{% endif %}"
      type="button"
      data-bs-toggle="collapse"
      data-bs-target="#{{ item_id }}"
      aria-expanded="{{ expanded }}"
      aria-controls="{{ item_id }}"
    >
      {{ title }}
    </button>
  </h{{ heading_level }}>

  <div
    id="{{ item_id }}"
    class="accordion-collapse collapse {% if open_by_default %}show{% endif %}"
    aria-labelledby="{{ heading_id }}"
    {# Only attach data-bs-parent if a valid parent ID is provided. #}
    {% if accordion_id is defined and accordion_id|trim %}
      data-bs-parent="#{{ accordion_id }}"
    {% endif %}
  >
    <div class="accordion-body">
      {% block accordion_body %}
        {# Content injected via block for flexibility in nested templates. #}
      {% endblock %}
    </div>
  </div>
</div>