on>
                    <button class="join-item btn" @click="goToPage(currentPage + 1)" :disabled="currentPage >= totalPages">»</button>
                </div>
            </div>
        </div>
    </div>
</div>

<style>   
    /* Using a broader selector to properly hide all x-cloak elements */
    [x-cloak] {
        display: none !important;
    }
</style>

<script>
    document.addEventListener('alpine:init', () => {
        Alpine.data('searchUI', () => ({
            speciesSearchTerm: '',
         