.boxchat{margin:0;padding:0;box-sizing:border-box;transition:all 150ms ease-in-out;font-family:'Poppins',sans-serif;color:#122740;overflow-y:hidden}button{border:0;background-color:transparent;cursor:pointer}div.minimize{height:40px}div.list--active{transform:translateX(0)}@media(max-width:500px){div.list--active{transform:translateX(50%)}}.conversation__bubble--left{position:relative}.conversation__bubble--left .conversation__text{float:left;max-width:85%;color:#e0f3ff;background-color:#4867cb}.conversation__bubble--left:before{content:'';position:absolute;bottom:6px;left:0;width:8px;height:8px;border-bottom-right-radius:10px;background-color:#4867cb}.conversation__bubble--right{position:relative}.conversation__bubble--right .conversation__text{float:right;max-width:85%;color:#332400;background-color:#cbad48}.conversation__bubble--right:before{content:'';position:absolute;bottom:6px;right:0;width:8px;height:8px;border-bottom-left-radius:10px;background-color:#cbad48}body{}.mask{width:300px;height:400px;overflow:hidden;position:fixed;z-index:1;bottom:0;right:5rem;border-top-left-radius:10px;border-top-right-radius:10px;animation:appear 1s ease-in 0s;box-shadow:0 10px 20px rgba(0,0,0,.15),0 3px 6px rgba(0,0,0,.1);transition:height 400ms cubic-bezier(.65,.05,.36,1)}@media(max-width:500px){.mask{right:0;width:auto;height:100vh}}.container-boxchat{width:600px;height:400px;display:flex;flex-direction:row;transform:translateX(-300px);transition:transform 400ms cubic-bezier(.65,.05,.36,1)}@media(max-width:500px){.container-boxchat{width:100%;height:100%;transform:translateX(0)}}.list,.conversation{width:300px;height:400px;display:flex;flex-direction:column;background-color:#f5f7fa}@media(max-width:500px){.list,.conversation{width:100vw;height:100vh}}.list__header,.conversation__header{display:flex;flex-direction:row;justify-content:space-between;align-items:center;z-index:1;min-height:40px;border-bottom:1px solid #ced4da}.list__header-actions,.conversation__header-actions{display:flex;flex-direction:row}.list__body,.conversation__body{height:100%;padding:.8rem;position:relative;overflow-y:auto;background-color:#eff2f6;font-size:14px}.list .btn,.conversation .btn{width:40px;height:40px}.list .btn svg,.conversation .btn svg{color:#1f4cad}.list .btn:hover,.list .btn:focus,.conversation .btn:hover,.conversation .btn:focus{background-color:#1f4cad}.list .btn:hover svg,.list .btn:focus svg,.conversation .btn:hover svg,.conversation .btn:focus svg{color:#fff}.list__header{padding:0 .8rem}.list__chat{display:flex;flex-direction:row;align-items:center;justify-content:space-between;padding:1rem;margin-bottom:1rem;background-color:#f5f7fa;box-shadow:0 1px 3px rgba(0,0,0,.2);border-radius:3px;border:1px solid transparent;cursor:pointer;text-decoration:none}.list__chat:hover,.list__chat:focus{border:1px solid #1f4cad;box-shadow:0 0 3px #4867cb}.list__user{margin-bottom:.3rem}.list__message{display:inline-block;color:#484f56;width:215px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media(max-width:500px){.list__message{width:85%}}.list__sent{display:inline-block;vertical-align:text-bottom}.list__sent svg{width:1rem;height:1rem;stroke:#008500}.list__sent svg:last-child{margin-left:-.7rem}.list__preview{width:100%}.conversation__info{display:inline-flex;flex-direction:row;align-items:center;flex-grow:1;padding-left:.8rem;color:#243366;border-left:1px solid #ced4da}.conversation__status{width:8px;height:8px;border-radius:50%;background-color:#63de17;margin-right:.4rem}.conversation__bubble{margin-bottom:.8rem}.conversation__bubble:before,.conversation__bubble:after{content:'';display:block;clear:both}.conversation__text{border-radius:3px;padding:.6rem;overflow-wrap:break-word}.conversation__footer{display:flex;flex-direction:row;justify-content:space-between;z-index:1;padding:.8rem;border-top:1px solid #ced4da}.conversation__write{width:80%;padding:.4rem;border:0;border-radius:5px;border:1px solid #ced4da;font-family:'Poppins',sans-serif;font-size:14px}.conversation__write:focus{border:1px solid #4867cb;box-shadow:0 0 3px #4867cb}.conversation .btn--send{border-radius:3px}@keyframes appear{1%{transform:translateY(30px);opacity:0}25%{transform:translateY(-15px)}65%{transform:translateY(10px);opacity:1}80%{transform:translateY(-5px)}100%{transform:translateY(0)}}.conversation__body::-webkit-scrollbar{width:6px;background-color:#a4a4a4}.conversation__body::-webkit-scrollbar-thumb{background-color:#919191}.conversation__body::-webkit-scrollbar-track{-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.3);background-color:#f5f5f5}.notificationMessageCount{display:inline-block;float:right;background-color:#ff1700de;width:26px;height:25px;border-radius:15px;text-align:center;color:#fff;font-weight:bold;padding:5px;font-size:15px}