/* =========================================================
   FLOATING TOOLS FINAL - FAMATINA EXPEDICIONES
   Orden:
   Accesibilidad
   Audio
   Bot principal
========================================================= */

/* =========================
   REDES OCULTAS
========================= */

.sf-whatsapp,
.sf-instagram,
.sf-facebook {
    display: none !important;
}

/* =========================
   BOT PRINCIPAL
========================= */

#fe-launcher {
    position: fixed !important;
    right: 12px !important;
    bottom: 15px !important;
    width: 50px !important;
    height: 50px !important;
    border-radius: 50% !important;
    border: none !important;
    cursor: pointer !important;
    z-index: 9997 !important;
    background: linear-gradient(145deg, #1D4ED8, #0F172A) !important;
    color: #fff !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 1.35rem !important;
    box-shadow: 0 12px 28px rgba(29,78,216,.45), 0 0 0 3px rgba(255,255,255,.35) !important;
    transition: transform .25s ease, box-shadow .25s ease !important;
}

    #fe-launcher:hover {
        transform: translateY(-3px) scale(1.06) !important;
    }

    #fe-launcher i,
    #fe-launcher svg {
        width: 22px !important;
        height: 22px !important;
        font-size: 1.35rem !important;
        line-height: 1 !important;
    }

.fe-launcher-pulse {
    display: none !important;
}

/* Mensaje del bot desktop */
#fe-nudge {
    position: fixed !important;
    right: 75px !important;
    bottom: 24px !important;
    z-index: 9996 !important;
}

/* Panel del bot desktop */
#fe-panel {
    right: 72px !important;
    bottom: 15px !important;
}

/* =========================
   AUDIO
========================= */

.social-float {
    position: fixed !important;
    right: 16px !important;
    bottom: 75px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    z-index: 9995 !important;
}

.sf-btn {
    width: 42px !important;
    height: 42px !important;
    border-radius: 50% !important;
    border: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #fff !important;
    font-size: 1.15rem !important;
    text-decoration: none !important;
    cursor: pointer !important;
    box-shadow: 0 8px 18px rgba(0,0,0,.25) !important;
    transition: transform .18s ease, box-shadow .18s ease, filter .18s ease !important;
}

    .sf-btn:hover {
        transform: translateY(-3px) scale(1.05) !important;
        box-shadow: 0 12px 24px rgba(0,0,0,.35) !important;
        filter: brightness(1.08) !important;
    }

.sf-audio {
    background: linear-gradient(145deg, #D2691E, #8B2323) !important;
}

/* =========================
   ACCESIBILIDAD
========================= */

.accesibilidad-dock {
    position: fixed !important;
    right: 17px !important;
    bottom: 127px !important;
    left: auto !important;
    top: auto !important;
    z-index: 9998 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    pointer-events: none !important;
}

    .accesibilidad-dock > * {
        pointer-events: auto !important;
    }

.acc-dock-toggle {
    position: relative !important;
    width: 40px !important;
    height: 40px !important;
    border-radius: 50% !important;
    border: none !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: linear-gradient(145deg, #8B2323, #5D1818) !important;
    color: #fff !important;
    font-size: 1rem !important;
    box-shadow: 0 8px 18px rgba(139,35,35,.35), 0 0 0 2px rgba(255,255,255,.35) !important;
    transition: transform .2s ease, box-shadow .2s ease !important;
}

    .acc-dock-toggle:hover {
        transform: translateY(-2px) scale(1.05) !important;
    }

.acc-dock-pulse {
    display: none !important;
}

/* Panel accesibilidad abre hacia arriba */
.acc-dock-items {
    position: absolute !important;
    right: 0 !important;
    bottom: calc(100% + 10px) !important;
    top: auto !important;
    display: flex !important;
    flex-direction: column !important;
    gap: .35rem !important;
    padding: .45rem !important;
    border-radius: 30px !important;
    background: rgba(255,255,255,.96) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    box-shadow: 0 12px 32px rgba(15,23,42,.18) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transform: translateY(8px) scale(.95) !important;
    pointer-events: none !important;
    max-height: 0 !important;
    overflow: hidden !important;
    transition: all .25s ease !important;
}

.accesibilidad-dock.open .acc-dock-items {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) scale(1) !important;
    pointer-events: auto !important;
    max-height: 700px !important;
}

/* Botones internos accesibilidad */
.acc-dock-item {
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #fff !important;
    border: 1px solid #e2e8f0 !important;
    color: #475569 !important;
    cursor: pointer !important;
    font-size: .85rem !important;
}

    .acc-dock-item.active {
        background: linear-gradient(145deg, #8B2323, #6d1717) !important;
        color: #fff !important;
    }

/* =========================
   MOBILE
========================= */

@media (max-width: 575.98px) {

    /* Bot principal */
    #fe-launcher {
        right: 10px !important;
        bottom: 8px !important;
        width: 46px !important;
        height: 46px !important;
        font-size: 1.25rem !important;
    }

        #fe-launcher i,
        #fe-launcher svg {
            width: 21px !important;
            height: 21px !important;
            font-size: 1.25rem !important;
        }

    /* Ocultar globito en mobile */
    #fe-nudge {
        display: block !important;
        right: 64px !important;
        bottom: 16px !important;
        max-width: 190px !important;
        font-size: 0.72rem !important;
        padding: 0.5rem 1.6rem 0.5rem 0.7rem !important;
        z-index: 9996 !important;
    }

        #fe-nudge.show {
            opacity: 1 !important;
            transform: translateY(0) scale(1) !important;
            pointer-events: auto !important;
        }

    /* Panel del bot mobile */
    #fe-panel {
        right: 0 !important;
        left: 0 !important;
        bottom: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        max-height: 80vh !important;
        border-radius: 18px 18px 0 0 !important;
        z-index: 9999 !important;
    }

    /* Audio */
    .social-float {
        right: 14px !important;
        bottom: 60px !important;
    }

    .sf-btn {
        width: 38px !important;
        height: 38px !important;
        font-size: 1rem !important;
    }

    /* Accesibilidad */
    .accesibilidad-dock {
        right: 15px !important;
        bottom: 106px !important;
    }

    .acc-dock-toggle {
        width: 36px !important;
        height: 36px !important;
        font-size: .9rem !important;
    }

    .acc-dock-item {
        width: 34px !important;
        height: 34px !important;
        font-size: .8rem !important;
    }
}
/* FIX: la guía de lectura nunca debe bloquear clics */
.reading-guide-line {
    pointer-events: none !important;
    z-index: 9990 !important;
}