/* Navegación circular UPN — scopeada bajo .upn-slider para no afectar otros Swiper del tema. */

.upn-slider__nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: var(--upn-nav-size);
    height: var(--upn-nav-size);
    border-radius: 50%;
    background: var(--upn-primary);
    color: var(--upn-arrow);
    border: none;
    padding: 0;
    cursor: pointer;
    display: grid;
    place-items: center;
    transition: background var(--upn-transition), transform var(--upn-transition), opacity var(--upn-transition);
    z-index: 10;
}

.upn-slider__nav--prev { left: -8px; }
.upn-slider__nav--next { right: -8px; }

@media (min-width: 768px) {
    .upn-slider__nav--prev { left: -22px; }
    .upn-slider__nav--next { right: -22px; }
}

.upn-slider__nav:hover,
.upn-slider__nav:focus-visible {
    background: var(--upn-primary-hover);
    transform: translateY(-50%) scale(1.08);
}

.upn-slider__nav:active {
    background: var(--upn-primary-active);
    transform: translateY(-50%) scale(0.96);
}

.upn-slider__nav:focus-visible {
    outline: 3px solid var(--upn-arrow);
    outline-offset: 2px;
}

.upn-slider__nav[aria-disabled="true"],
.upn-slider__nav.is-disabled {
    opacity: 0.35;
    cursor: not-allowed;
    pointer-events: none;
}

.upn-slider__nav-icon {
    display: inline-flex;
    width: 18px;
    height: 18px;
    color: var(--upn-arrow);
}

.upn-slider__nav-icon svg {
    width: 100%;
    height: 100%;
}

.upn-slider__nav-icon--prev svg {
    transform: rotate(180deg);
}

/* Paginación */
.upn-slider__pagination {
    position: relative;
    display: flex;
    justify-content: center;
    gap: 0.4rem;
    margin-top: 1rem;
}

.upn-slider__pagination .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--upn-pagination-inactive);
    opacity: 1;
    transition: background var(--upn-transition), transform var(--upn-transition);
    cursor: pointer;
}

.upn-slider__pagination .swiper-pagination-bullet-active {
    background: var(--upn-pagination-active);
    transform: scale(1.25);
}
