// Bootstrap 5 automatically initializes tabs with data-bs-toggle="tab"
// but we need to ensure they work after HTMX swaps
(function() {
    'use strict';

    const initBootstrapTabs = () => {
        const customTabList = document.querySelectorAll('#myTab button[data-bs-toggle="tab"]');
        customTabList.forEach(function(tabButton) {
            new bootstrap.Tab(tabButton);
        });

        const expertTabList = document.querySelectorAll('#expertTab button[data-bs-toggle="tab"]');
        expertTabList.forEach(function(tabButton) {
            new bootstrap.Tab(tabButton);
        });
    }

    if (document.readyState === 'loading') {
        document.addEventListener('DOMContentLoaded', initBootstrapTabs);
    } else {
        initBootstrapTabs();
    }

    document.addEventListener('htmx:afterSwap', function(event) {
        if (event.detail.target.id === 'service-form' ||
            event.detail.target.classList.contains('crd-form')) {
            initBootstrapTabs();
        }
    });
})();
