How can i change the output of posts_nav_link();

posts_nav_link() just outputs get_previous_posts_link() and get_next_posts_link() with a separator between them. The helpful thing is does is handle the visibility of the separator depending on whether both pages exist. Since you always want to show something on either side, you don’t need it. What you can do is output the next and previous links manually, but with a check to see of there is a link. If there isn’t you can output a span instead.

That would look like this:

if ( get_previous_posts_link() ){
    previous_posts_link( 'Previous' );
} else {
    echo '<span aria-hidden="true">Previous</span>';
}

echo '|';

if ( get_next_posts_link() ){
    next_posts_link( 'Next' );
} else {
    echo '<span aria-hidden="true">Next</span>';
}

Now you can style <span> as the inactive link.

Note that I’ve used aria-hidden="true" to tell screen readers to ignore the text of the inactive ‘links’ as an accessibility featured.