/* --- ND Scroll To Top Button --- */
.nd-stt {
    position: fixed;
    right: 16px;
    bottom: 24px;
    width: var(--nd-stt-size, 64px);
    height: var(--nd-stt-size, 64px);
    display: none;
    place-items: center;
    cursor: pointer;
    border: none;
    outline: none;
    border-radius: 999px;
    padding: 0;
    z-index: 999;
    background: none !important;
    /* Custom Properties für Elementor */
    --nd-stt-size: 64px;
    --nd-stt-icon-size: 24px;
    --nd-stt-ring-gap: 7px;
    --nd-stt-progress: var(--e-global-color-success, #03cc65);
    --nd-stt-progress-bg: var(--e-global-color-text, #d7d7d7);
    --nd-stt-progress-deg: 0deg;
}

.nd-stt:focus-visible {
    outline: 2px solid rgba(0,0,0,.25);
    outline-offset: 2px;
}

/* --- Ring nur, wenn Klasse gesetzt --- */
.nd-stt.nd-stt--ring {
    background:
            conic-gradient(var(--nd-stt-progress, #03cc65) var(--nd-stt-progress-deg, 0deg),
            var(--nd-stt-progress-bg, #d7d7d7) var(--nd-stt-progress-deg, 0deg)) !important;
}

/* --- progress=0: niemals Hintergrund --- */
.nd-stt[data-progress="0"],
.nd-stt[data-progress="0"]:hover {
    background: none !important;
}

.nd-stt .nd-stt-inner {
    display: grid;
    place-items: center;
    width: calc(100% - (var(--nd-stt-ring-gap, 7px) * 2));
    height: calc(100% - (var(--nd-stt-ring-gap, 7px) * 2));
    border-radius: inherit;
    background: var(--e-global-color-primary, #fff);
    font-size: var(--nd-stt-icon-size, 24px);
    line-height: 1;
    color: var(--e-global-color-secondary, #001a2e);
}

.nd-stt .nd-stt-inner i {
    font-size: var(--nd-stt-icon-size, 24px);
    line-height: 1;
}

.nd-stt .nd-stt-inner svg {
    width: var(--nd-stt-icon-size, 24px);
    height: var(--nd-stt-icon-size, 24px);
    fill: currentColor;
    stroke: currentColor;
}

.nd-stt .nd-stt-inner img {
    width: var(--nd-stt-icon-size, 24px);
    height: var(--nd-stt-icon-size, 24px);
    object-fit: contain;
    display: block;
}

@media (min-width: 1025px) {
    .nd-stt.nd-hide-desktop { display: none !important; }
}
@media (min-width: 768px) and (max-width: 1024px) {
    .nd-stt.nd-hide-tablet { display: none !important; }
}
@media (max-width: 767px) {
    .nd-stt.nd-hide-mobile { display: none !important; }
}
