<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers"
      data-namespace-typo3-fluid="true">

<f:if condition="{pagination.numberOfPages} > 1">
    <nav class="news-pagination mt-10 flex justify-center" aria-label="Sayfalama">
        <ul class="flex items-center gap-1">

            <f:if condition="{pagination.previousPageNumber}">
                <li>
                    <f:link.action action="list"
                                   arguments="{currentPage: pagination.previousPageNumber}"
                                   class="flex items-center justify-center w-10 h-10 rounded-lg border border-gray-300 text-gray-600 hover:border-primary hover:text-primary transition-colors"
                                   aria-label="Önceki sayfa">
                        ‹
                    </f:link.action>
                </li>
            </f:if>

            <f:for each="{pages}" as="page">
                <li>
                    <f:if condition="{page.isCurrent}">
                        <f:then>
                            <span class="flex items-center justify-center w-10 h-10 rounded-lg bg-primary text-white font-semibold">
                                {page.pageNumber}
                            </span>
                        </f:then>
                        <f:else>
                            <f:link.action action="list"
                                           arguments="{currentPage: page.pageNumber}"
                                           class="flex items-center justify-center w-10 h-10 rounded-lg border border-gray-300 text-gray-600 hover:border-primary hover:text-primary transition-colors">
                                {page.pageNumber}
                            </f:link.action>
                        </f:else>
                    </f:if>
                </li>
            </f:for>

            <f:if condition="{pagination.nextPageNumber}">
                <li>
                    <f:link.action action="list"
                                   arguments="{currentPage: pagination.nextPageNumber}"
                                   class="flex items-center justify-center w-10 h-10 rounded-lg border border-gray-300 text-gray-600 hover:border-primary hover:text-primary transition-colors"
                                   aria-label="Sonraki sayfa">
                        ›
                    </f:link.action>
                </li>
            </f:if>

        </ul>
    </nav>
</f:if>

</html>
