.header{height:70px;align-items:center;justify-content:flex-start;border-top-right-radius:15px;border-top-left-radius:15px;color:#fff;padding:10px;font-weight:700;position:absolute;box-sizing:border-box;width:400px;display:flex;background:linear-gradient(160.18deg,var(--color-primary-darker),var(--color-primary-light),var(--color-primary));grid-template-rows:1fr;top:0}.header .extender{width:100%;height:100%;background:transparent}.header .header-title{display:flex;align-items:center;gap:20px}.header-extended{height:130px!important;display:grid!important;grid-template-rows:1fr 30px!important;padding:10px 10px 50px!important}.loader-container{width:100%;height:100%;display:flex;justify-content:center;align-items:center}.loader-container .lds-ring{display:inline-block;position:relative;max-width:50px;max-height:50px;width:100%;height:100%}.loader-container .lds-ring div{box-sizing:border-box;display:block;position:absolute;max-width:35px;width:100%;max-height:35px;height:100%;margin:8px;border:8px solid var(--color-primary);border-radius:50%;animation:lds-ring 1.2s cubic-bezier(.5,0,.5,1) infinite;border-color:var(--color-primary) transparent transparent transparent}.loader-container .lds-ring div:nth-child(1){animation-delay:-.45s}.loader-container .lds-ring div:nth-child(2){animation-delay:-.3s}.loader-container .lds-ring div:nth-child(3){animation-delay:-.15s}@keyframes lds-ring{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.avatar{width:32px;height:32px;display:flex;overflow:hidden;position:relative;font-size:1.25rem;align-items:center;flex-shrink:0;line-height:1;-webkit-user-select:none;user-select:none;justify-content:center;border-radius:50%}.avatar img{color:transparent;width:100%;height:100%;object-fit:cover;text-align:center;text-indent:10000px}.avatar svg{color:var(--icon-color-primary);object-fit:cover;text-align:center;text-indent:10000px;width:100%;height:100%}.img-loader{background:#fff;width:42px}.chatList{padding:10px 20px;display:flex;flex-direction:column;gap:5px;height:100%;overflow:auto;z-index:22;box-sizing:border-box}.chatList::-webkit-scrollbar{width:10px}.chatList::-webkit-scrollbar-track{border-radius:10px;border:none;background:#d3d3d3}.chatList::-webkit-scrollbar-thumb{background:linear-gradient(160.18deg,var(--color-primary-darker),var(--color-primary-light),var(--color-primary));border-radius:0}.chatList .chatListItem{display:grid;grid-template-columns:60px 1fr;box-sizing:border-box;background:#fff;border:1px solid rgba(0,0,0,.08);box-shadow:0 4px 4px #00000040;border-radius:15px;padding:20px;color:#949494;cursor:pointer;transition:box-shadow .25s}.chatList .chatListItem:hover{box-shadow:0 4px 4px var(--color-primary-light)}.chatList .chatListItem .chatListItemHeader{display:flex;justify-content:space-between;color:#000;flex-direction:column}.chatList .chatListItem .chatListItemHeader .sender{font-weight:800;display:flex;justify-content:space-between;align-items:center}.chatList .chatListItem .chatListItemHeader .date{color:#949494}.chatList .chatListItem .chatListItemHeader .closed-status{font-size:12px;font-weight:700;color:#fff;text-transform:uppercase;background:var(--color-primary);padding:5px;border-radius:5px}.addNewChatButton{display:flex;position:absolute;bottom:15px;justify-content:center;left:50%;transform:translate(-50%,10px)}.addNewChatButton button{border:none;background:var(--color-primary);outline:none;padding:10px 20px;border-radius:15px;cursor:pointer;color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center}.addNewChatButton button svg{width:30px;height:30px}.addNewChatButton button svg path{fill:var(--icon-color-primary)}.emptyTextHolder{display:flex;justify-content:center;align-items:center;height:100%;font-weight:700}.alignCenter{display:flex;align-items:center}.container{height:600px;display:grid;grid-template-rows:70px 1fr 70px}.container .inputContainer{display:flex;justify-content:center;align-items:center;gap:10px;padding:10px;box-sizing:border-box}.container .inputContainer .input{height:35px;width:80%;border-radius:5px;border:1px solid #818181;outline:none;padding:0 10px;font-size:17px;font-weight:500;font-family:Nunito,sans-serif}.container .inputContainer svg{width:30px;cursor:pointer}.container .chatList{display:flex;flex-wrap:nowrap;flex-direction:column;height:100%;overflow:auto;padding:10px}.container .chatList .message{background:#e3e3e3;padding:15px;border-radius:15px 15px 15px 0;max-width:100%;font-weight:700}.container .chatList .message .image{width:100%}.container .chatList .message .messageText{word-break:break-word;font-weight:500;display:flex;align-items:center}.container .chatList .message .attachmentText{cursor:pointer}.container .chatList .message .attachmentText:hover{text-decoration:underline}.container .chatList .message .messageSender{font-weight:800;margin:5px 0}.container .chatList .message .messageDate{font-size:13px;font-weight:800;color:#949494}.container .chatList .userMessage{align-self:flex-end;background:var(--color-primary-darker);color:#fff;border-radius:15px 15px 0}.container .chatList .userMessage .messageDate{font-size:13px;font-weight:800;color:#fbfbfb;margin:5px 0}body{margin:0;padding:0}@keyframes barWidth{0%{width:0%}25%{width:50%}50%{width:100%}75%{width:50%}to{width:0%}}@keyframes barWidth2{0%{width:0%}50%{width:50%}to{width:100%}}.horizontal-bar-wrap{height:4px;width:100%}.horizontal-bar-wrap .bar{position:relative;width:0%;height:100%;margin:0 auto;animation:barWidth;animation-duration:2s;animation-iteration-count:infinite;animation-timing-function:linear}.horizontal-bar-wrap .bar.bar1{animation-delay:0s;background:var(--color-primary-darken);top:0;z-index:1}.loaderContainer{display:flex;justify-content:center;flex-direction:column}.chat-header{height:70px;background:var(--color-primary);border-top-right-radius:15px;border-top-left-radius:15px;display:flex;align-items:center;color:#fff;padding:0 10px;justify-content:space-between}.chat-header svg{width:36px;height:36px;cursor:pointer}.chat-header svg path{fill:var(--icon-color-primary)}.icon{width:40px;height:40px;background:var(--color-primary);display:flex;justify-content:center;align-items:center;border-radius:10px}.icon svg{width:30px;height:30px;cursor:pointer}.icon svg path{fill:var(--icon-color-primary)}.dropzone{height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column}.image-container{display:flex;justify-content:center}.image-container img{width:80%}.button-container{margin:20px 0;display:flex;gap:10px}.button-container button{border:none;outline:none;background:#fff;padding:10px;font-family:Nunito,sans-serif;border-radius:10px;font-weight:700;background:var(--color-primary);color:#fff;cursor:pointer}.button-container button:disabled,.button-container button[disabled]{border:1px solid #999999;background-color:#ccc;color:#666}.loaderWrapper{width:20px;height:20px}.chatContainer{width:400px;height:600px;display:flex;flex-direction:column;position:relative;padding-top:80px;box-sizing:border-box;box-shadow:0 4px 4px var(--color-primary-light);border:1px solid var(--color-primary-light);background:#fff;border-radius:15px}.chatContainer-chatView{padding-top:0}.buttonHolder{display:flex;justify-content:center;align-items:center}.buttonHolder button{font-family:Nunito,sans-serif;font-size:15px;border:none;background:var(--color-primary);color:#fff;padding:10px 15px;border-radius:10px;cursor:pointer;transition:background .25s}.buttonHolder button:hover{background:var(--color-primary-darker)}.container{height:600px;display:grid;grid-template-rows:70px 1fr}.widget-icon{background:var(--color-primary);padding:15px;border-radius:50%;cursor:pointer;width:30px;height:30px;display:flex;justify-content:center;align-items:center}.widget-icon svg{width:30px;height:30px}.widget-icon svg path{fill:var(--icon-color-primary)}.app{display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-end;gap:10px;overflow:hidden}