/**
 * Barre minimale lecture immersive : flèche retour
 */

.immersive-reading-back-bar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    /* Au-dessus de .immersive-reading-intro (z-index 10000) pour rester cliquable */
    z-index: 10050;
    padding: 1rem 1.25rem;
    pointer-events: none;
}

.immersive-reading-back-bar__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 50%;
    color: rgba(255, 255, 255, 0.7);
    transition: color 0.2s ease, background-color 0.2s ease;
    pointer-events: auto;
}

.immersive-reading-back-bar__link:hover {
    color: rgba(255, 255, 255, 0.95);
    background-color: rgba(255, 255, 255, 0.06);
}

.immersive-reading-back-bar__link:focus {
    outline: none;
}

.immersive-reading-back-bar__link:focus-visible {
    color: rgba(255, 255, 255, 0.95);
    outline: 2px solid rgba(255, 255, 255, 0.4);
    outline-offset: 2px;
}

.immersive-reading-back-bar__arrow {
    display: flex;
    align-items: center;
    justify-content: center;
}

.immersive-reading-back-bar__arrow svg {
    width: 24px;
    height: 24px;
}

html.day-mode .immersive-reading-back-bar__link {
    color: rgba(43, 43, 43, 0.7);
}

html.day-mode .immersive-reading-back-bar__link:hover {
    color: rgba(43, 43, 43, 0.95);
    background-color: rgba(0, 0, 0, 0.04);
}

html.day-mode .immersive-reading-back-bar__link:focus-visible {
    color: rgba(43, 43, 43, 0.95);
    outline-color: rgba(43, 43, 43, 0.4);
}