<script>
// Obtener todos los elementos con la clase .fb-docs__list
const fbDocsLists = document.querySelectorAll(".fb-log__accordion");

// Iterar a través de cada elemento y aplicar la lógica
fbDocsLists.forEach((fbDocsList) => {
  const lastItem = fbDocsList.querySelector(".fb-log__item:last-child");
  const lastItemHeight = lastItem.offsetHeight;
  const beforeHeight = `calc(100% - ${lastItemHeight}px)`;

  fbDocsList.style.setProperty("--before-height", beforeHeight);
});

</script>

<script>

// Función para observar cambios en el DOM y asignar aria-expanded y aria-controls
function observeAccordionItems() {
  const accordionItems = document.querySelectorAll('.fb-accessible__item');

  // Crea un nuevo observador
  const observer = new MutationObserver(mutationsList => {
    mutationsList.forEach(mutation => {
      const item = mutation.target;
      const button = item.querySelector('.fb-accessible__title');
      const isOpen = item.classList.contains('brx-open');

      // Asigna el atributo 'aria-expanded' en función del estado
      button.setAttribute('aria-expanded', isOpen ? 'true' : 'false');
    });
  });

  // Observa cambios en los atributos de clase de los elementos del acordeón
  accordionItems.forEach((item, index) => {
    const button = item.querySelector('.fb-accessible__title');
    const controlId = `sect${index + 1}`;

    // Asigna el atributo 'aria-controls' con valores únicos
    button.setAttribute('aria-controls', controlId);

    // Inicialmente, verifica si el elemento tiene la clase 'brx-open' y actualiza aria-expanded
    const isOpen = item.classList.contains('brx-open');
    button.setAttribute('aria-expanded', isOpen ? 'true' : 'false');

    // Observa cambios en los atributos de clase de los elementos del acordeón
    observer.observe(item, { attributes: true, attributeFilter: ['class'] });
  });
}

// Llama a la función para comenzar a observar cambios
observeAccordionItems();


</script>