/* Shared solid pagination for Bootstrap, DataTables, and custom page controls. */
:root {
    --neo-page-surface: #fff;
    --neo-page-line: #e4ebf5;
    --neo-page-ink: #172b4d;
    --neo-page-muted: #718096;
    --neo-page-hover: #edf3ff;
    --neo-page-accent: var(--neo-brand-blue, #023aef);
}
[data-theme-version="dark"] {
    --neo-page-surface: #1b2239;
    --neo-page-line: #303b55;
    --neo-page-ink: #e7eefc;
    --neo-page-muted: #a3b1cc;
    --neo-page-hover: #263653;
    --neo-page-accent: #8babff;
}

#main-wrapper.neo-shell :is(.pagination, .kdp-pagination, .jdih-pagination, .audit-pagination, #archivePagination) {
    gap: 6px !important;
    flex-wrap: wrap;
    align-items: center;
}
#main-wrapper.neo-shell .pagination { margin: 0; }
#main-wrapper.neo-shell .dataTables_paginate {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 6px;
}
#main-wrapper.neo-shell .dataTables_paginate > span:not(.ellipsis) {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 6px;
}
/* Bootstrap DataTables uses list items as wrappers, not as buttons. */
#main-wrapper.neo-shell .dataTables_paginate li.paginate_button {
    display: block !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    opacity: 1 !important;
}
#main-wrapper.neo-shell :is(
    .pagination .page-link,
    .dataTables_wrapper .dataTables_paginate a.paginate_button,
    .dataTables_wrapper .dataTables_paginate button.paginate_button,
    .arsip-page-btn, .jdih-pagination__button, .audit-pagination__btn,
    .kdp-pagination button
) {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: auto !important;
    min-width: 36px;
    height: 36px;
    margin: 0 !important;
    padding: 0 10px !important;
    border: 1px solid var(--neo-page-line) !important;
    border-radius: 8px !important;
    background: var(--neo-page-surface) !important;
    color: var(--neo-page-ink) !important;
    box-shadow: none !important;
    font-size: 12px;
    font-weight: 500;
    line-height: 1;
    text-decoration: none;
    transition: background-color .15s, border-color .15s, color .15s;
}
#main-wrapper.neo-shell :is(
    .pagination .page-link,
    .dataTables_wrapper .dataTables_paginate a.paginate_button,
    .dataTables_wrapper .dataTables_paginate button.paginate_button,
    .arsip-page-btn, .jdih-pagination__button, .audit-pagination__btn,
    .kdp-pagination button
):hover {
    background: var(--neo-page-hover) !important;
    border-color: var(--neo-page-accent) !important;
    color: var(--neo-page-accent) !important;
}
#main-wrapper.neo-shell :is(
    .pagination .active .page-link,
    .dataTables_wrapper .dataTables_paginate a.paginate_button.current,
    .dataTables_wrapper .dataTables_paginate button.paginate_button.current,
    .arsip-page-btn.is-active, .jdih-pagination__button.is-active,
    .audit-pagination__btn.is-active, .kdp-pagination button.active
) {
    background: var(--neo-brand-blue, #023aef) !important;
    border-color: var(--neo-brand-blue, #023aef) !important;
    color: #fff !important;
}
#main-wrapper.neo-shell :is(
    .pagination .active .page-link,
    .dataTables_wrapper .dataTables_paginate a.paginate_button.current,
    .dataTables_wrapper .dataTables_paginate button.paginate_button.current,
    .arsip-page-btn.is-active, .jdih-pagination__button.is-active,
    .audit-pagination__btn.is-active, .kdp-pagination button.active
):hover {
    background: var(--neo-brand-blue-dark, #002ab3) !important;
    border-color: var(--neo-brand-blue-dark, #002ab3) !important;
}
#main-wrapper.neo-shell :is(
    .pagination .page-link,
    .dataTables_paginate a.paginate_button, .dataTables_paginate button.paginate_button,
    .arsip-page-btn, .jdih-pagination__button, .audit-pagination__btn,
    .kdp-pagination button
):focus-visible {
    outline: 2px solid var(--neo-page-accent);
    outline-offset: 2px;
    box-shadow: none !important;
}
#main-wrapper.neo-shell :is(
    .pagination .disabled .page-link,
    .dataTables_wrapper .dataTables_paginate a.paginate_button.disabled,
    .dataTables_wrapper .dataTables_paginate button.paginate_button.disabled,
    .arsip-page-btn:disabled, .jdih-pagination__button:disabled,
    .audit-pagination__btn:disabled, .kdp-pagination button:disabled
) {
    background: var(--neo-page-surface) !important;
    border-color: var(--neo-page-line) !important;
    color: var(--neo-page-muted) !important;
    opacity: .45;
    pointer-events: none;
    cursor: default;
}
#main-wrapper.neo-shell :is(.dataTables_paginate .ellipsis, .kdp-ellipsis, .audit-pagination-ellipsis) {
    padding: 0 4px;
    color: var(--neo-page-muted);
}
@media (max-width: 767.98px) {
    #main-wrapper.neo-shell .dataTables_paginate { justify-content: center; }
}
@media (prefers-reduced-motion: reduce) {
    #main-wrapper.neo-shell :is(.pagination .page-link, .paginate_button, .arsip-page-btn, .jdih-pagination__button, .audit-pagination__btn, .kdp-pagination button) { transition: none; }
}