/* Navigation globale — retour en haut v1 étape 0100 */
.back-to-top {
    align-items: center;
    background: var(--turquoise-dark, #176b68);
    border: 1px solid
        color-mix(
            in srgb,
            var(--paper, #ffffff) 35%,
            transparent
        );
    border-radius: 999px;
    bottom: max(1.15rem, env(safe-area-inset-bottom));
    box-shadow:
        0 0.75rem 1.8rem rgb(18 55 53 / 25%),
        0 0 0 0.22rem rgb(255 255 255 / 70%);
    color: var(--paper, #ffffff);
    cursor: pointer;
    display: inline-flex;
    height: 3.15rem;
    justify-content: center;
    padding: 0;
    position: fixed;
    right: max(1.15rem, env(safe-area-inset-right));
    transition:
        background-color 160ms ease,
        box-shadow 160ms ease,
        transform 160ms ease;
    width: 3.15rem;
    z-index: 950;
}

.back-to-top[hidden] {
    display: none !important;
}

.back-to-top:hover {
    background: var(--turquoise, #2ba99b);
    transform: translateY(-2px);
}

.back-to-top:focus-visible {
    outline: 0.22rem solid
        color-mix(
            in srgb,
            var(--turquoise, #2ba99b) 55%,
            transparent
        );
    outline-offset: 0.2rem;
}

@media (max-width: 640px) {
    .back-to-top {
        bottom: max(0.8rem, env(safe-area-inset-bottom));
        height: 2.85rem;
        right: max(0.8rem, env(safe-area-inset-right));
        width: 2.85rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .back-to-top {
        transition: none;
    }
}

/* Navigation globale — retour en haut réellement flottant v3 étape 0100 */
body > [data-back-to-top] {
    position: fixed !important;
    right: max(1rem, env(safe-area-inset-right)) !important;
    bottom: max(1rem, env(safe-area-inset-bottom)) !important;
    top: auto !important;
    left: auto !important;
    z-index: 2147483000 !important;
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: none !important;
    margin: 0 !important;
}

body > [data-back-to-top][hidden] {
    display: inline-flex !important;
}

@media (min-width: 48rem) {
    body > [data-back-to-top] {
        right: max(1.5rem, env(safe-area-inset-right)) !important;
        bottom: max(1.5rem, env(safe-area-inset-bottom)) !important;
    }
}
