/*
 * =================================================================
 *  FINAL PAGINATION FIX: MOBILE-ONLY
 *  This takes the working CSS rules and restricts them to screens
 *  smaller than Filament's 'sm' breakpoint (640px).
 * =================================================================
 */
@media (max-width: 639.98px) {

    .fi-pagination {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 4px !important;
        justify-content: center !important; /* Added for better centering */
    }

    .fi-pagination-items {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 1px !important;
    }

    /*
     * This is the final piece of the puzzle. The page numbers are in a container
     * that is explicitly hidden on mobile by default. This rule forces it to show.
    */
    .fi-pagination-navigation {
        display: flex !important;
    }

}