/**
 * scroll-to-top.css
 * Estilos para el botón de scroll-to-top y widget BMC.
 * ÚNICA FUENTE DE VERDAD PARA WIDGETS FLOTANTES.
 *
 * @version 1.3.1
 * @date 2025-08-24
 * @author Baxahaun Venture Studio https://baxahaun.com
 * // PEV_REF: WIDGETS-FINAL-FIX-V3
 */

/* ===============================================================
   1. ESTILOS BASE PARA AMBOS WIDGETS
   =============================================================== */
#scroll-top,
#bmc-wbtn {
    position: fixed;
    right: 1rem;
    width: 48px !important;
    height: 48px !important;
    border-radius: 50% !important;
    transition: opacity 0.4s ease-in-out, visibility 0.4s ease-in-out, transform 0.4s ease-in-out, bottom 0.4s ease-in-out;
}

#scroll-top {
    background-color: var(--bs-secondary);
    color: var(--bs-white);
    border: none;
    /* El botón empieza oculto y fuera de la pantalla */
    opacity: 0;
    visibility: hidden;
    transform: translateY(20px);
    z-index: 9998; /* Justo debajo de BMC */
}

/* La clase .visible lo hace aparecer con una transición suave */
#scroll-top.visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

#bmc-wbtn {
    z-index: 9999; /* Siempre encima */
}

/* ===============================================================
   2. POSICIONAMIENTO EN VISTAS MÓVILES (max-width: 768px)
   =============================================================== */
@media (max-width: 768px) {
    /* Posición por defecto (Home, etc.) */
    body:not(.single-capitulo) #scroll-top {
        bottom: 20px !important;
    }
    body:not(.single-capitulo) #bmc-wbtn {
        bottom: 92px !important; /* 20px + 48px + 24px margen AUMENTADO */
    }

    /* Excepción para páginas de capítulo (con barra de acciones) */
    body.single-capitulo #scroll-top {
        bottom: 76px !important;
    }
    body.single-capitulo #bmc-wbtn {
        bottom: 148px !important; /* 76px + 48px + 24px margen AUMENTADO */
    }
}

/* ===============================================================
   3. POSICIONAMIENTO EN VISTAS DE ESCRITORIO (min-width: 769px)
   =============================================================== */
@media (min-width: 769px) {
    #scroll-top {
        bottom: 16px !important;
        right: 18px !important;
    }
    #bmc-wbtn {
        bottom: 88px !important; /* 16px + 48px + 24px margen AUMENTADO */
        right: 18px !important;
    }
}
