.page_navigation {
    gap: var(--wp--preset--spacing--small);
    grid-auto-flow: column;
    grid-auto-columns: max-content;
    overflow-y: hidden;
    overflow-x: auto;
    scrollbar-width: none;
    display: grid;
    width: 100%;

    @media (width < 1200px) {
        &.wp-block-buttons {
            justify-content: start;
        }
    }

    &:is(.is-layout-flex) {
        display: grid;
    }

    .wp-block-button {
        width: auto;
        display: grid;
        gap: var(--wp--preset--spacing--x-small);

        &::after {
            content: "";
            height: 4px;
            width: 0;
            margin-inline: auto;
        }

        &:has([href]) {
            cursor: pointer;

            &:hover::after {
                background-color: var(--wp--preset--color--primary-orange-400);
                width: 100%;
            }

            &.selected {
                font-weight: 600;

                &::after {
                    background-color: var(--wp--preset--color--primary-orange-900);
                    width: 100%;
                }
            }
        }
    }
}
