<div [style.visibility]="documentViewer.loaded() ? 'visible' : 'hidden'" class="pagination noselect">
    <div (click)="pdf.navigatePreviousPage()">
        <mat-icon class="chevron-icon" svgIcon="iqser:nav-prev"></mat-icon>
    </div>

    <div>
        <input
            #pageInput
            (change)="pdf.navigateTo(pageInput.value)"
            [max]="pdf.totalPages()"
            [value]="pdf.currentPage()"
            class="page-number-input"
            id="currentPageNumber"
            min="1"
            type="number"
        />
    </div>

    <div class="separator">/</div>

    <div id="totalNumberOfPages">
        {{ pdf.totalPages() }}
    </div>

    <div (click)="pdf.navigateNextPage()">
        <mat-icon class="chevron-icon" svgIcon="iqser:nav-next"></mat-icon>
    </div>
</div>
