/* need to convert it tailwind */
/* start */
.off-line {
    position: absolute;
    bottom: 0;
    right: 0;
    background: #5b5c5d;
    border: 2px solid #fff;
    border-radius: 100%;
    width: 16px;
    height: 16px;
}

.offline-label {
    position: absolute;
    bottom: 0;
    right: 0;
    background: #5b5c5d;
    border: 2px solid #fff;
    border-radius: 100%;
    width: 22px;
    height: 22px;
}
/* end  */



.online {
    width: 12px;
    height: 12px;
    background: #4caf50;
    border-radius: 20px;
    position: absolute;
    /* bottom: 12%; */
    right: 6%;
    transition: border 0.1s;
}

.offline {
    width: 12px;
    height: 12px;
    background: #878887;
    border-radius: 20px;
    position: absolute;
    /* bottom: 12%; */
    right: 6%;
    transition: border 0.1s;
}

.away {
    width: 12px;
    height: 12px;
    background: #d17557;
    border-radius: 20px;
    position: absolute;
    right: 6%;
    transition: border 0.1s;
}

.counting {
    position: absolute;
    top: -4px;
    right: -5px;
    background: #D9534F;
    border: 2px solid #fff;
    border-radius: 100%;
    width: 10px;
    height: 10px;
}


.jobs__detail{
    max-height: fit-content;
}