How to change order of Blog Navigation (PREVIOUS = Next / NEXT = Previous)?

#1. All Blog Pages

To change the order of Blog Navigation (Pagination) on all blog pages

You can use this code to Custom CSS box

body[class*="type-blog"] {
section#itemPagination {
    flex-direction: row-reverse;
    justify-content: space-between;
}
.item-pagination-link--prev {
    margin-right: 0;
    flex-direction: row-reverse;
}
.item-pagination-link--prev svg {
    transform: rotate(180deg);
}
.item-pagination-link--next {
    margin-left: 0 !important;
    flex-direction: row-reverse;
}
.item-pagination-link--next svg {
    transform: rotate(180deg);
}
.item-pagination-icon.icon.icon--stroke {
    padding: 0px !important;
}
.item-pagination-link--next h2 {
    text-align: left !important;
}}

Result:

#2. Specific Blog Pages

First, you need to find the Blog Page ID. In my example, it is:

• #collection-6677756d03a4f15ba27ce9d8

Next, you need to change # to dot . symbol, so the new ID will be:

• .collection-6677756d03a4f15ba27ce9d8

Next, use this code to Custom CSS box

/* Pagination Invert */
.collection-6677756d03a4f15ba27ce9d8 {
section#itemPagination {
    flex-direction: row-reverse;
    justify-content: space-between;
}
.item-pagination-link--prev {
    margin-right: 0;
    flex-direction: row-reverse;
}
.item-pagination-link--prev svg {
    transform: rotate(180deg);
}
.item-pagination-link--next {
    margin-left: 0 !important;
    flex-direction: row-reverse;
}
.item-pagination-link--next svg {
    transform: rotate(180deg);
}
.item-pagination-icon.icon.icon--stroke {
    padding: 0px !important;
}
.item-pagination-link--next h2 {
    text-align: left !important;
}}