/* ==========================================================================
   Query / Product Collection pagination (wp-block-query-pagination).
   Brand-minimal style consistent with the My Account pagination:
   square number buttons, filled current page, text-style prev/next links.
   Uses global color variables (colors.css).
   ========================================================================== */

@media only screen and (min-width: 320px) {
    .wp-block-query-pagination {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        gap: 0.5rem 1rem;
        margin-top: 2.5rem;
    }
    .wp-block-query-pagination-numbers {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 0.5rem;
    }

    /* Number buttons */
    .wp-block-query-pagination a.page-numbers,
    .wp-block-query-pagination span.page-numbers {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 2.5rem;
        height: 2.5rem;
        padding: 0 0.5rem;
        border: 1px solid var(--font-clr);
        font-size: 0.85rem;
        line-height: 1;
        text-decoration: none;
        color: var(--font-clr);
        transition: color var(--transition-speed) var(--transition-timing-function),
                    border-color var(--transition-speed) var(--transition-timing-function),
                    background-color var(--transition-speed) var(--transition-timing-function);
    }
    .wp-block-query-pagination a.page-numbers:hover {
        color: var(--link-hover-clr);
        border-color: var(--link-hover-clr);
    }
    .wp-block-query-pagination .page-numbers.current {
        background-color: var(--font-clr);
        color: #fff;
    }
    /* Ellipsis: plain text, no box */
    .wp-block-query-pagination .page-numbers.dots {
        min-width: 0;
        height: auto;
        padding: 0 0.25rem;
        border: 0;
    }

    /* Previous / next: minimal text links with arrow */
    .wp-block-query-pagination-previous,
    .wp-block-query-pagination-next {
        display: inline-flex;
        align-items: center;
        gap: 0.4rem;
        font-size: 0.72rem;
        font-weight: 600;
        letter-spacing: 2px;
        text-transform: uppercase;
        text-decoration: none;
        color: var(--font-clr);
        transition: color var(--transition-speed) var(--transition-timing-function);
    }
    .wp-block-query-pagination-previous:hover,
    .wp-block-query-pagination-next:hover {
        color: var(--link-hover-clr);
    }
    .wp-block-query-pagination-previous-arrow,
    .wp-block-query-pagination-next-arrow {
        margin: 0;
    }
}

@media only screen and (min-width: 768px) {

}

@media only screen and (min-width: 990px) {

}

@media only screen and (min-width: 1280px) {

}
