/* ── NxSlider – Reusable Carousel Base Styles ── */

.nx-slider {
    --nx-slider-gap: 0px;
    position: relative;
}

.nx-slider__viewport {
    position: relative;
    overflow: hidden;
    margin-left: calc(var(--nx-slider-gap) / -2);
    margin-right: calc(var(--nx-slider-gap) / -2);
}

.nx-slider__track {
    display: flex;
    will-change: transform;
}

.nx-slider__track > * {
    flex-shrink: 0;
    box-sizing: border-box;
    padding-left: calc(var(--nx-slider-gap) / 2);
    padding-right: calc(var(--nx-slider-gap) / 2);
}

/* ── Arrows ── */

.nx-slider__arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    width: 2rem;
    height: 2rem;
    border: none;
    background: transparent no-repeat center / 1.1rem;
    cursor: pointer;
    box-shadow: none;
    padding: 0;
    font-size: 0;
    color: transparent;
}

.nx-slider__arrow--prev {
    left: 0.75rem;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 25.34 50.77'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:none;stroke:%23fff;stroke-width:1.5px%7D%3C/style%3E%3C/defs%3E%3Cpolyline class='cls-1' points='24.8 0.52 1.04 25.39 24.8 50.25'/%3E%3C/svg%3E");
}

.nx-slider__arrow--next {
    right: 0.75rem;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 25.34 50.77'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:none;stroke:%23fff;stroke-width:1.5px%7D%3C/style%3E%3C/defs%3E%3Cpolyline class='cls-1' points='0.54 50.25 24.3 25.39 0.54 0.52'/%3E%3C/svg%3E");
}

/* ── Dots ── */

.nx-slider__dots {
    display: flex;
    justify-content: center;
    gap: var(--dot-size);
    margin-top: 1.5em;
    padding: 0;
}

.nx-slider__dot {
    width: var(--dot-size);
    height: var(--dot-size);
    padding: 0;
    border: none;
    border-radius: 50%;
    background-color: #eceaf7;
    box-shadow: none;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.nx-slider__dot.is-active {
    background-color: var(--clr-purple);
}

/* ── Screen-reader live region ── */

.nx-slider__live {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
