/**
 * SR Elementor Module – Styles
 */

/* -------------------------------------------------------------
 * SR Imageslider – Cursor-Navigation
 * ------------------------------------------------------------- */

.sr-imageslider {
    position: relative;
    --sr-cursor-size: 92px;
    --sr-cursor-bg: #e4573d;
    --sr-cursor-color: #fff;
}

/* Echter Mauszeiger verschwindet nur dort, wo der Kreis ihn ersetzt */
@media (hover: hover) and (pointer: fine) {
    .sr-imageslider.sr-has-cursor-nav {
        cursor: none;
    }

    /* Pagination bleibt normal bedienbar */
    .sr-imageslider.sr-has-cursor-nav .rsiswiper-pagination-container {
        cursor: auto;
    }
}

/* Im Elementor-Editor bleibt der Systemcursor sichtbar, damit man arbeiten kann */
.elementor-editor-active .sr-imageslider.sr-has-cursor-nav {
    cursor: auto;
}

/* Positions-Wrapper: wird per JS bewegt, bekommt bewusst keine Transition */
.sr-imageslider-cursor {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 5;
    pointer-events: none;
    will-change: transform;
}

/* Der sichtbare Kreis: zentriert auf dem Mauspunkt, animiert nur Ein-/Ausblenden */
.sr-imageslider-cursor__inner {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5em;
    width: var(--sr-cursor-size);
    height: var(--sr-cursor-size);
    border-radius: 50%;
    background: var(--sr-cursor-bg);
    color: var(--sr-cursor-color);
    font-size: 15px;
    line-height: 1.15;
    letter-spacing: 0.05em;
    text-align: center;
    text-transform: uppercase;
    opacity: 0;
    visibility: hidden;
    transform: translate(-50%, -50%) scale(0.75);
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
}

.sr-imageslider.sr-cursor-visible .sr-imageslider-cursor__inner {
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, -50%) scale(1);
}

/* Pfeil als CSS-Chevron, damit er die Textfarbe erbt */
.sr-imageslider-cursor__arrow {
    flex: none;
    width: 8px;
    height: 8px;
    border-top: 1px solid currentColor;
    border-right: 1px solid currentColor;
}

.sr-imageslider-cursor__arrow--next {
    transform: rotate(45deg);
}

.sr-imageslider-cursor__arrow--prev {
    transform: rotate(-135deg);
}

/* Standardzustand = "Next", die Prev-Teile liegen versteckt daneben */
.sr-imageslider-cursor__arrow--prev,
.sr-imageslider-cursor__label--prev {
    display: none;
}

.sr-imageslider.sr-cursor-prev .sr-imageslider-cursor__arrow--prev,
.sr-imageslider.sr-cursor-prev .sr-imageslider-cursor__label--prev {
    display: block;
}

.sr-imageslider.sr-cursor-prev .sr-imageslider-cursor__arrow--next,
.sr-imageslider.sr-cursor-prev .sr-imageslider-cursor__label--next {
    display: none;
}

/* Touch-Geräte: nur wischen, kein Kreis */
@media (hover: none), (pointer: coarse) {
    .sr-imageslider-cursor {
        display: none;
    }
}