<div id="{{ id|default('accordion') }}" class="w-full text-black {% if data.apariencia|default == 'two_col' %} columns-1 lg:columns-2 gap-x-12 {% elseif data.apariencia|default == 'one_col' %} grid grid-cols-1 {% endif %}" data-accordion="{{ accordion|default('collapse') }}"> {% for item in items %} <div class="border-b border-gray-300 inline-block w-full"> <button id="accordion_heading_{{ id|default }}_{{ loop.index }}" type="button" data-accordion-target="#accordion_body_{{ id|default }}_{{ loop.index }}" aria-expanded="false" aria-controls="accordion_body_{{ id|default }}_{{ loop.index }}" class="w-full flex flex-row justify-between items-center gap-x-2 py-5"> {% if item.titulo|default %} <span class="block w-[95%] font-semibold text-start">{{ item.titulo }}</span> {% endif %} <svg data-accordion-icon xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" class="w-4 h-4 duration-400 text-black"> <path stroke-linecap="round" stroke-linejoin="round" d="M19.5 8.25l-7.5 7.5-7.5-7.5"/> </svg> </button> <div id="accordion_body_{{ id|default }}_{{ loop.index }}" aria-labelledby="accordion_heading_{{ id|default }}_{{ loop.index }}" class="hidden pb-5"> {% if item.descripcion|default %} <div class="prose prose-sm max-w-none text-sm"> {{ item.descripcion|raw }} </div> {% endif %} </div> </div> {% endfor %}</div><style></style>