/*
Theme Name: Five2one
Theme URI: https://five2oneestate.com/
Description: Child Theme personalizado
Author: Select Themes
Author URI: https://qodeinteractive.com
Version: 1.0
Text Domain: hiroshi
Template: hiroshi
*/


/*======================================
=            CONTENEDOR
======================================*/

.five2one-whatsapp-wrapper{
    position:fixed;
    right:25px;
    bottom:25px;
    z-index:999999;
    display:flex;
    align-items:center;
    gap:12px;
}


/*======================================
=            BOTÓN
======================================*/

.five2one-whatsapp{

    position:relative;
    display:block;
    width:74px;
    height:74px;
    overflow:visible;      /* IMPORTANTE */
    transition:.30s ease;

}

.five2one-whatsapp:hover{

    transform:scale(1.08);

}


/* La imagen es la que se hace redonda */

.five2one-whatsapp img{

    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
    border-radius:50%;
    box-shadow:0 10px 30px rgba(0,0,0,.18);

}


/*======================================
=            BOLITA
======================================*/

.five2one-whatsapp::after{

    content:"";
    position:absolute;
    top:-2px;
    right:-2px;
    width:16px;
    height:16px;
    border-radius:50%;
    background:#ef4444;
    border:1px solid #fff;
    z-index:100;
    transition:.3s;

}


/* Disponible */

.five2one-whatsapp.activo::after{

    background:#22c55e;
    animation:five2oneWhatsappPulse 1.8s infinite;

}


/*======================================
=            BOCADILLO
======================================*/

.five2one-whatsapp-message{

    position:relative;
    background:#fff;
    padding:12px 16px;
    border-radius:12px;
    box-shadow:0 8px 25px rgba(0,0,0,.15);
    min-width:190px;
    opacity:0;
    visibility:hidden;
    transform:translateX(10px);
    transition:.25s;
    pointer-events:none;

}

.five2one-whatsapp-message strong{

    display:block;
    font-size:15px;
    margin-bottom:2px;

}

.five2one-whatsapp-message span{

    display:block;
    font-size:13px;
    color:#666;

}


.five2one-whatsapp-message::after{

    content:"";

    position:absolute;
    right:-8px;
    top:50%;
    transform:translateY(-50%);
    border-top:8px solid transparent;
    border-bottom:8px solid transparent;
    border-left:8px solid #fff;

}


.five2one-whatsapp-wrapper:hover .five2one-whatsapp-message{

    opacity:1;
    visibility:visible;
    transform:translateX(0);

}


/*======================================
=            PULSO
======================================*/

@keyframes five2oneWhatsappPulse{

    0%{
        box-shadow:0 0 0 0 rgba(34,197,94,.7);
    }

    70%{
        box-shadow:0 0 0 10px rgba(34,197,94,0);
    }

    100%{
        box-shadow:0 0 0 0 rgba(34,197,94,0);
    }

}


/*======================================
=            TABLET
======================================*/

@media (max-width:1024px){

    .five2one-whatsapp-wrapper{

        right:20px;
        bottom:20px;

    }

    .five2one-whatsapp{

        width:68px;
        height:68px;

    }

}


/*======================================
=            MÓVIL
======================================*/

	
@media (max-width: 767px) {

    .five2one-whatsapp-wrapper{
        right: 16px;
        bottom: 16px;
    }

    .five2one-whatsapp{
        width: 56px !important;
        height: 56px !important;
    }

    .five2one-whatsapp-message{
        display: none;
    }
}