/*Status Active Empieza*/
.storeStatus{
    position: fixed;
    bottom: .5rem;
    left: .5rem;
    cursor: default;
    z-index: 50;
    background: linear-gradient(0, #f0f0f0, #f8f8f8);
    border-radius: .5rem;
    box-shadow: 0 5px 8px rgba(0,0,0, .150);
    border: 1px solid #fff;
    display: flex;
    flex-direction: column;
    pointer-events: none;
}

.storeStatus .online{
    display:none;
    align-items: center;
    gap: .5rem;
    flex-direction: column;
    font-size: clamp(.5rem, 2vw, .7rem);
    text-align: center;
    color: green;
    padding: .5rem;
    border-radius: 7px;  
}
.storeStatus .offline{
    display:none;
    align-items: center;
    gap: .5rem;
    flex-direction: column;
    font-size: clamp(.5rem, 2vw, .7rem);
    text-align: center;
    color: #504444;
    padding: .5rem;
    border-radius: 7px;
}



.storeStatus .online strong,
.storeStatus .offline strong{
    font-size: clamp(.6rem, 2vw, .8rem);
    font-weight: 200;
}

.storeStatus p .greenOnline{
    width: 15px;
    height: 15px;
    display: block;
    border-radius:50%;
    position: relative;
    background: #10a729;
}
.storeStatus .online.active,
.storeStatus .offline.active{
    display: flex;
}



.storeStatus p .greenOnline::before{
    content: '';
    position: absolute;
    left: -5px;
    top: -5px;
    height: 25px;
    width: 25px;
    border-radius: 50%;
    animation: pulse 1.5s infinite ease-in;
    background: #10a729;
}


.storeStatus p .redOffline{
    width: 15px;
    height: 15px;
    display: block;
    border-radius:50%;
    position: relative;
    background: #ff1900;
}
.storeStatus p .redOffline::before{
    content: '';
    position: absolute;
    left: -5px;
    top: -5px;
    height: 25px;
    width: 25px;
    border-radius: 50%;
    animation: pulse 1.5s infinite ease-in;
    background: #ff1900;
}

@keyframes pulse{
    from{
        transform: scale(0.5);
        opacity: 1;
    }to{
        scale: (1.5);
        opacity: 0;
    }
}



/* @media(max-width:500px){
    .storeStatus{
        top: .5rem;
        left: .5rem;
        bottom: unset;
    }
} */
/*Status Active Termina*/