{% set id = firstTabTitle|striptags|lower|replace({' ': '-' }) %}
<div 
  x-data="{ activeTab: '{{ id }}' }" 
  class="tabs container max-w-[1920px] w-full flex flex-col items-center justify-center font-inter md:w-1/2 font-medium bg-gray-100"
>    
  <!-- Tab Buttons -->

  <div class="w-full flex border-gray-400">
    {{ tabTitleContent }}
  </div>

  <!-- Tab Content -->
  <div class="w-full p-6 text-left">
    {{ tabContents }}
  </div>
</div>
