/* Estilos personalizados para la paginación de WooCommerce */

.woocommerce-pagination {
    text-align: center;
    margin-top: 2rem;
}

.woocommerce-pagination ul.page-numbers {
    display: flex;
    justify-content: center;
    align-items: center;
    list-style: none;
    padding: 0;
    margin: 0;
    gap: 0.5rem;
    border: none !important; /* Eliminar bordes heredados si los hay */
}

.woocommerce-pagination ul.page-numbers li {
    display: inline-block;
    margin: 0;
    border: none !important;
}

.woocommerce-pagination ul.page-numbers li .page-numbers {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 2.5rem;
    height: 2.5rem;
    padding: 0 0.5rem;
    font-family: 'Poppins', sans-serif; /* Asegurar fuente del tema */
    font-size: 1rem;
    font-weight: 500;
    color: #374151; /* Gray 700 */
    background-color: transparent;
    border: 1px solid #e5e7eb; /* Gray 200 */
    border-radius: 0.375rem; /* Rounded-md */
    text-decoration: none;
    transition: all 0.2s ease-in-out;
}

/* Estado Hover */
.woocommerce-pagination ul.page-numbers li a.page-numbers:hover {
    background-color: #f3f4f6; /* Gray 100 */
    color: #637C90; /* Color principal */
    border-color: #637C90;
}

/* Estado Activo (Current) */
.woocommerce-pagination ul.page-numbers li .page-numbers.current {
    background-color: #637C90; /* Color principal */
    color: #ffffff;
    border-color: #637C90;
    cursor: default;
}

/* Puntos suspensivos (...) */
.woocommerce-pagination ul.page-numbers li .page-numbers.dots {
    border: none;
    background-color: transparent;
    color: #9ca3af; /* Gray 400 */
}

/* Flechas Siguiente/Anterior */
.woocommerce-pagination ul.page-numbers li .next.page-numbers,
.woocommerce-pagination ul.page-numbers li .prev.page-numbers {
    font-size: 1.2rem;
    line-height: 1;
}
