/* Shared public list navigation: real links and native GET jump forms. */
.pagination-wrapper {
    --pager-bg: var(--card-bg, #fff);
    --pager-fg: var(--text-main, #1e293b);
    --pager-muted: #526071;
    --pager-border: var(--border-color, #cbd5e1);
    display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
    gap: 14px; width: fit-content; max-width: 100%; margin: 32px auto 16px;
    padding: 14px; box-sizing: border-box; border: 1px solid var(--pager-border);
    border-radius: 12px; background: var(--pager-bg); color: var(--pager-fg);
}
.pagination-wrapper.public-pagination { position: static; left: auto; transform: none; }
.pagination-wrapper .total-interfaces {
    margin: 0; padding: 0; height: auto; border: 0; color: var(--pager-muted);
    font-size: .9rem; line-height: 1.6; white-space: normal; text-align: center;
}
.pagination-wrapper nav { max-width: 100%; min-width: 0; }
.pagination-wrapper .pagination {
    display: flex; flex-wrap: wrap; justify-content: center; align-items: center;
    gap: 6px; margin: 0; padding: 0; list-style: none;
}
.pagination-wrapper .page-item { display: flex; margin: 0; }
.pagination-wrapper .page-link {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 44px; min-height: 44px; padding: 6px; margin: 0; box-sizing: border-box;
    border: 1px solid var(--pager-border); border-radius: 6px;
    background: var(--pager-bg); color: var(--pager-fg); font-size: .95rem;
    line-height: 1.2; text-decoration: none;
}
.pagination-wrapper .page-item.active .page-link { background: #1565c0; border-color: #1565c0; color: #fff; }
.pagination-wrapper .page-link:hover { border-color: #1565c0; }
.pagination-wrapper .page-item>span.page-link { border-color: transparent; min-width: 20px; }
.pagination-wrapper .pagination-jump {
    display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
    gap: 8px; max-width: 100%; margin: 0; padding: 0; height: auto;
    border: 0; color: var(--pager-muted); font-size: .9rem;
}
.pagination-wrapper .pagination-jump label { margin: 0; }
.pagination-wrapper .jump-input-group { display: flex; align-items: center; gap: 6px; }
.pagination-wrapper .jump-input-group input {
    width: 70px; min-height: 44px; padding: 6px; box-sizing: border-box;
    border: 1px solid var(--ap-control-border, #728196); border-radius: 6px; text-align: center;
    background: var(--pager-bg); color: var(--pager-fg); font: inherit;
}
.pagination-wrapper .btn-jump {
    min-height: 44px; padding: 8px 14px; border: 1px solid #1565c0; border-radius: 6px;
    background: #1565c0; color: #fff; font: inherit; cursor: pointer;
}
.pagination-wrapper .btn-jump:hover { background: #0d47a1; }
.pagination-wrapper :is(a,input,button):focus-visible { outline: 3px solid #2563eb; outline-offset: 3px; }
body.dark-mode .pagination-wrapper { --pager-bg: #1f2937; --pager-fg: #f1f5f9; --pager-muted: #cbd5e1; --pager-border: #64748b; }
@media(max-width:768px) {
    .pagination-wrapper { width: 100%; padding: 12px; gap: 12px; }
    .pagination-wrapper .total-interfaces, .pagination-wrapper nav, .pagination-wrapper .pagination-jump { width: 100%; }
}
