:root{--theme-bg-color:#fff;--input-bg:#f8f8fa;--input-chat-color:#a2a2a2;--border-color:#eef2f4;--body-color:#134e5c;--msg-message:#969eaa;--chat-text-bg:#f1f2f6;--theme-color:#135fc3;--theme-dark-color:#134e5c;--msg-date:#414141;--button-bg-color:#f0f7ff;--button-color:var(--theme-color);--detail-font-color:#919ca2;--msg-hover-bg:rgba(238,242,244,0.4);--active-conversation-bg:linear-gradient(90deg,rgba(238,242,244,0.4) 0%,rgba(238,242,244,0));--overlay-bg-chat:linear-gradient(180deg,rgba(247,245,240,0),rgba(247,245,240,0.78) 50%,#f7f5f0);--chat-header-bg:linear-gradient(180deg,#fff 0%,#fff 78%,hsla(0,0%,100%,0))}.chat_desktop img{max-width:100%}.chat_desktop #participantModal .modal-body p{color:#fff;font-weight:400;font-size:.9rem}.chat_desktop #participantModal .modal-body p:first-child{font-size:1.3rem;font-weight:700}.chat_desktop #participantModal .modal-body p:last-child{color:#7ebb51}.chat_desktop #participantModal .modal-body .btn{border:1px solid #fff;background:transparent;color:#fff;border-radius:1px}.chat_desktop .chat-app{display:flex;flex-direction:column;width:80vw;height:calc(100vh - 118px);margin:0 auto;overflow:hidden;backdrop-filter:blur(50px) saturate(120%);-webkit-backdrop-filter:blur(50px) saturate(120%);background:rgba(247,245,240,.2);border-radius:10px}@supports not ((-webkit-backdrop-filter:none) or (backdrop-filter:none)){.chat_desktop .chat-app{background:#f7f5f0;opacity:.9}}.chat_desktop .header{width:100%;border-bottom:1px solid var(--border-color);display:flex;align-items:center;padding:10px 20px;background:#f7f5f0}.chat_desktop .header h4{font-size:18px;font-weight:600;text-transform:uppercase}.chat_desktop .wrapper{width:100%;display:flex;flex-grow:1;overflow:hidden}.chat_desktop .link-area{width:120px;flex-shrink:0;background:#134e5c}.chat_desktop .searchbox{position:relative;display:inline-block;width:300px;margin-bottom:1rem}.chat_desktop .searchbox input:focus{outline:none;border:none;transition:all .35s}.chat_desktop .searchbox input{z-index:0;width:100%;height:40px;background:#fff;border-radius:25px;border:none;transition:all .35s}.chat_desktop .searchbox input::-moz-placeholder{color:#bbb;font-size:.8rem;text-transform:uppercase;position:absolute;top:50%;transform:translateY(-50%);-moz-transition:.5s all;transition:all .5s}.chat_desktop .searchbox input:-ms-input-placeholder{color:#bbb;font-size:.8rem;text-transform:uppercase;position:absolute;top:50%;transform:translateY(-50%);-ms-transition:.5s all;transition:all .5s}.chat_desktop .searchbox input::placeholder{color:#bbb;font-size:.8rem;text-transform:uppercase;position:absolute;top:50%;transform:translateY(-50%);transition:all .5s}.chat_desktop .searchbox .bi-search{position:absolute;top:30%;right:5%;color:#8b8b8b}.chat_desktop .searchbox .search{color:#1e316b;font-weight:500;padding-right:50px;padding-left:10px;font-size:.8rem;z-index:3;transition:all .5s}.chat_desktop .searchbox form{display:inline-block}.chat_desktop .participant-area{flex-grow:1}.chat_desktop .loader,.chat_desktop .loader:after{border-radius:50%;width:7em;height:7em}.chat_desktop .loader{margin:60px auto;font-size:10px;position:relative;text-indent:-9999em;border-top:1.1em solid hsla(0,0%,100%,.2);border-right:1.1em solid hsla(0,0%,100%,.2);border-bottom:1.1em solid hsla(0,0%,100%,.2);border-left:1.1em solid #fff;transform:translateZ(0);-webkit-animation:load8 1.1s linear infinite;animation:load8 1.1s linear infinite}@-webkit-keyframes load8{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes load8{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.chat_desktop .link-area{border-right:1px solid var(--border-color);overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;position:relative}.chat_desktop .participant-area{overflow:auto;height:auto;max-height:100%;padding-bottom:80px}.chat_desktop .participant-area .participant{background-color:#fff;display:flex;justify-content:flex-start;align-items:center;padding:10px;cursor:pointer}.chat_desktop .participant-area .participant figure{margin-bottom:0}.chat_desktop .participant-area .participant .details{max-width:100%}.chat_desktop .participant-area .participant .details p{font-size:.7rem;color:#1e316b;max-width:120px;overflow:hidden}.chat_desktop .participant-area .participant .details p:first-child{color:#d34f1d;font-weight:700;font-size:.9rem}.chat_desktop .participant-area .participant .vue-avatar--wrapper{position:relative}.chat_desktop .participant-area .participant .vue-avatar--wrapper.online:before{content:"";position:absolute;background-color:#7ebb51;width:12px;height:12px;border-radius:50%;border:2px solid var(--theme-bg-color);right:2px;bottom:0}.chat_desktop .participant-area .participant .vue-avatar--wrapper.offline:before{content:"";position:absolute;background-color:red;width:12px;height:12px;border-radius:50%;border:2px solid var(--theme-bg-color);right:2px;bottom:0}.chat_desktop .participant-area .participant p{font-size:.8rem;margin-bottom:0}@media (max-width:780px){.chat_desktop .chat-app{width:100vw;height:100vh}}.chat_desktop .in-mobile{display:flex;width:100%}.chat_desktop #onlineModal .modal-content{background:rgba(247,245,240,.6);border-radius:20px}.chat_desktop #onlineModal .modal-content .modal-body{-webkit-backdrop-filter:blur(20px) saturate(120%);backdrop-filter:blur(20px) saturate(120%);color:#fff;border-radius:20px;margin:0 auto}.chat_desktop #onlineModal .modal-content .modal-body .onlinetogglebtn{display:flex;align-items:center}.chat_desktop #onlineModal .modal-content .modal-body .onlinetogglebtn .switch{position:relative;display:inline-block;width:60px;height:34px;margin-bottom:0;margin-left:10px}.chat_desktop #onlineModal .modal-content .modal-body .onlinetogglebtn .text-label{color:#fff;text-transform:uppercase;font-weight:600;letter-spacing:.5px;font-size:1rem;cursor:pointer}.chat_desktop #onlineModal .modal-content .modal-body .onlinetogglebtn .switch input{opacity:0;width:0;height:0}.chat_desktop #onlineModal .modal-content .modal-body .onlinetogglebtn .slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#969696;transition:.4s}.chat_desktop #onlineModal .modal-content .modal-body .onlinetogglebtn .slider:before{position:absolute;content:"";height:26px;width:26px;left:4px;bottom:4px;background-color:#fff;transition:.4s}.chat_desktop #onlineModal .modal-content .modal-body .onlinetogglebtn input:checked+.slider{background-color:orange}.chat_desktop #onlineModal .modal-content .modal-body .onlinetogglebtn input:focus+.slider{box-shadow:0 0 1px orange}.chat_desktop #onlineModal .modal-content .modal-body .onlinetogglebtn input:checked+.slider:before{transform:translateX(26px)}.chat_desktop #onlineModal .modal-content .modal-body .onlinetogglebtn .slider.round{border-radius:34px}.chat_desktop #onlineModal .modal-content .modal-body .onlinetogglebtn .slider.round:before{border-radius:50%}.chat_desktop .onlinetogglebtn{display:flex;align-items:center}.chat_desktop .onlinetogglebtn .switch{position:relative;display:inline-block;width:60px;height:34px;margin-bottom:0;margin-left:10px}.chat_desktop .onlinetogglebtn .text-label{color:#fff;text-transform:uppercase;font-weight:600;letter-spacing:.5px;font-size:1rem;cursor:pointer}.chat_desktop .onlinetogglebtn .switch input{opacity:0;width:0;height:0}.chat_desktop .onlinetogglebtn .slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#969696;transition:.4s}.chat_desktop .onlinetogglebtn .slider:before{position:absolute;content:"";height:26px;width:26px;left:4px;bottom:4px;background-color:#fff;transition:.4s}.chat_desktop .onlinetogglebtn input:checked+.slider{background-color:orange}.chat_desktop .onlinetogglebtn input:focus+.slider{box-shadow:0 0 1px orange}.chat_desktop .onlinetogglebtn input:checked+.slider:before{transform:translateX(26px)}.chat_desktop .onlinetogglebtn .slider.round{border-radius:34px}.chat_desktop .onlinetogglebtn .slider.round:before{border-radius:50%}@media (min-width:320px) and (max-width:1024px){.chat-app .link-area{display:none}.chat-app .participant-area .participant .details p{max-width:80px}}@media (min-width:768px) and (max-width:1024px) and (orientation:landscape){.chat-app .link-area{display:none}.chat-app .participant-area .participant .details p{max-width:80px}}