.chat-app{display:flex;height:820px;background:#fff;border:1px solid #c4c8cd}.chat-sidebar{width:434px;border-right:1px solid #c4c8cd;position:relative}.sidebar-header{padding:8px 15px;border-bottom:1px solid #c4c8cd}.chat-search{width:100%;padding:8px}.chat-filters{display:flex;gap:10px}.chat-filters button{padding:2.5px 20.6px;border:none;cursor:pointer;background:0 0;border:1px solid #939eab;color:#939eab;border-radius:5px}.chat-filters .active{background:#89b85a;color:#fff;border-color:#89b85a}.chat-item{display:flex;align-items:center;padding:21.1px 16px;cursor:pointer;position:relative;border-bottom:1px solid #c4c8cd}.chat-item.active{background:#edf3fa}.chat-item.unread h4{font-weight:700}.avatar{width:46px;height:46px;flex:0 0 46px;background:#4a90e2;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-right:10px;overflow:hidden}.avatar.purple{background:#9b59b6}.chat-info h4{margin:0;font-size:14px}.chat-info p{margin:0;font-size:12px;color:#777}.badge{background:red;color:#fff;font-size:13px;padding:0 0;border-radius:50%;width:18px;height:18px;display:flex;align-items:center;justify-content:center;font-family:GothamBold;line-height:119%}.chat-item.selecting .checkbox{display:block}.chat-content{flex:1;display:flex;flex-direction:column}.chat-header,.chat-header-left-sidebar{padding:0 15px;border-bottom:1px solid #c4c8cd;display:flex;gap:0;align-items:center;position:relative}.chat-header-left-sidebar{justify-content:space-between}.chat-header-left-sidebar>button{background:0 0;border:none}.h-64{height:64px}.chat-messages{flex:1;padding:5px 4px 0 16px;overflow-y:auto;margin-right:4px;margin-top:10px;margin-bottom:15px}.message{max-width:fit-content;padding:11px 15.5px 15px;border-radius:8px;font-size:14px;max-width:394px;width:fit-content;color:#394657;position:relative}.message.received{background:#edf3fa}.message.sent{background:#f3f4f4;margin-left:auto}.time{font-size:12px;color:#747e89;margin-top:3px;display:block;text-align:right}.preview-box{height:150px;background:#c4c8cd;display:flex;align-items:center;justify-content:center}.chat-input{padding:13px 13px 13px 16px;border-top:1px solid #c4c8cd;display:flex;gap:5px;position:relative;display:none}.chat-input.showInput{display:flex}.chat-input input[type=text]{flex:1;padding:0 18px;padding-right:90px;border-radius:5px;box-shadow:0 0 5px 1px rgb(0 0 0 / 8%);border:1px solid transparent;height:52px;font-size:14px}.chat-item .checkbox{display:none;width:20px;height:20px;border:1px solid #394657;border-radius:2px;margin-right:14px;position:relative;flex-shrink:0;background:#fff}.chat-item.selecting .checkbox{display:block}.chat-item.selected .checkbox{background:#cf0000;border-color:#cf0000}.chat-item.selected .checkbox::after{content:"";color:#fff;font-size:14px;position:absolute;left:50%;top:50%;background:url(../images/chat/tick-white.svg);width:12px;height:9px;background-repeat:no-repeat;background-size:contain;transform:translate(-50%,-50%)}.chat-item.selected{background:inherit}.chat-item.selected{background:inherit}.chat-messages::-webkit-scrollbar{width:6px}.chat-messages::-webkit-scrollbar-track{background:#ededed;border-radius:10px}.chat-messages::-webkit-scrollbar-thumb{background:#468ac9;border-radius:10px}.chat-messages::-webkit-scrollbar-thumb:hover{background:#468ac9}.mb-4px{margin-bottom:4px!important}.search-input{padding:9px 15px;border-bottom:1px solid #c4c8cd;position:relative}.search-input input{width:100%;border-radius:5px;border:none;background:#f3f4f4;font-size:14px;padding-left:36px;height:46px}.search-input>img{position:absolute;left:30px;top:50%;transform:translateY(-50%)}.chat-item>.avatar{width:71px;height:71px;flex:0 0 71px;font-size:20px;font-weight:500;margin-right:16px}.chat-item>.avatar>img{width:100%;height:100%;object-fit:cover}.chat-item:before{content:'';position:absolute;left:0;top:0;width:0;height:100%;background:#89b85a;transition:.3s ease-in-out}.chat-item.active:before{width:4px}.chat-header>div{display:flex;flex-direction:column}.tick-icon{width:16px;height:auto;margin-left:4px}.message-wrap{display:flex;margin-bottom:19px;gap:7px}.message-avatar{background-color:#468ac9;width:36px;height:36px;flex:0 0 36px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:14px;font-weight:500;overflow:hidden}.avatar>*,.message-avatar>*{width:100%;height:100%;object-fit:cover}.message-wrap.sent .message-avatar{background:#89b85a}.chat-date{margin:0 auto 19px;text-align:center}.chat-date>p{background:#fff;font-size:14px;color:#747e89;padding:3px 17.6px;display:inline-block;box-shadow:0 0 5px 1px rgb(0 0 0 / 8%);border-radius:5px}.message>a>img,.message>video{max-width:192px!important;aspect-ratio:1/1;background:#000;margin:6px 1px}.chat-input #sendBtn{background:#89b85a;border-radius:50%;width:38px;height:38px;border:1px solid #89b85a;color:#fff;display:flex;align-items:center;justify-content:center;position:absolute;right:calc(13px + 10px);top:50%;transform:translateY(-50%)}.chat-input>#attachBtn{position:absolute;right:calc(18px + 18px + 38px);background:0 0;border:none;max-width:17px;width:100%;top:50%;transform:translateY(-50%)}.chat-input>#attachBtn>img{max-width:100%}.message>p{max-width:100%;word-break:break-word}.info-tab-message{max-width:257px}.chat-item.selecting .info-tab-message{max-width:227px}.chat-header>div>h4,.chat-header>div>small,.info-tab-message>*{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-info{display:flex;justify-content:space-between;width:100%}.time-of-chat-last-talked{display:flex;flex-direction:column;align-items:flex-end;gap:6px}.time-last-messaged{font-size:14px;color:#878787}.btn-nothing{background:0 0;border:none}.when-edit-open{position:absolute;left:0;top:0;padding:0 15px;width:100%;height:100%;background:#fff;display:flex;align-items:center;justify-content:space-between;opacity:0;visibility:hidden;transition:.3s ease-in-out}.selecting-items-left-header .when-edit-open{opacity:1;visibility:visible}.when-edit-open>div{display:flex;align-items:center;gap:9px}.when-edit-open>div>button{margin-bottom:2px}.btn-delete{display:flex;align-items:center;justify-content:center;position:relative}.btn-delete>span{width:12px;height:12px;border-radius:50%;background:red;color:#fff;font-family:GothamBold;display:flex;align-items:center;justify-content:center;font-size:8px;position:absolute;right:-8px;top:-6px}.chat-header-responsive-btn{display:none;width:34px;height:34px;flex:0 0 34px;flex-direction:column;align-items:center;justify-content:space-between;background:#fff;border:1px solid #468ac9;border-radius:2px;padding:8px 5px;margin-right:10px}.lines-sub-menu{width:100%;height:2px;background:#fff}.icons-download-open{display:flex;align-items:center;justify-content:flex-end;gap:5px;margin-top:5px;margin-bottom:5px;width:100%}.icons-download-open>a{background:#89b85a;display:flex;align-items:center;justify-content:center;color:#fff;border-radius:3px;width:30px;height:30px;text-align:center;border:1px solid #89b85a;transition:.3s ease-in-out;text-decoration:none!important;border-radius:50%}.icons-download-open>a>img{transition:.3s ease-in-out;filter:brightness(0) invert(1);max-width:16px}.icons-download-open>a:hover{background:0 0;color:#89b85a}.icons-download-open>a:hover img{filter:none}@media (max-width:1439px){.chat-item>.avatar{width:50px;height:50px;flex:0 0 50px;font-size:16px;margin-right:8px}.chat-sidebar{width:364px}.chat-item .checkbox{margin-right:8px;width:18px;height:18px}.chat-item.selecting .info-tab-message{max-width:200px}.info-tab-message{max-width:227px}}@media(max-width:991px){.chat-header-responsive-btn{display:flex}.chat-app{position:relative;overflow:hidden}.chat-sidebar{position:absolute;background:#fff;z-index:111;height:100%;width:100%;border-right:0;left:0;transition:.3s ease-in-out;display:flex;flex-direction:column}.chat-sidebar.hide-portion{left:-100%}.chat-header-responsive-btn>img{max-width:100%;height:100%}.chat-list{flex:1;overflow-y:auto}.chat-input input[type=text]{padding-right:90px}}@media(max-width:575px){.h-64{height:50px}.chat-item>.avatar{width:40px;height:40px;flex:0 0 40px;font-size:14px}.chat-item{padding:16px 12px}.chat-header,.chat-header-left-sidebar,.search-input,.sidebar-header{padding:8px 12px}.time-last-messaged{font-size:12px}.chat-filters button{font-size:14px;padding:2.5px 16px}.search-input input{height:40px}.info-tab-message{max-width:calc(100% - 40px)}.chat-info{max-width:calc(100% - 48px)}.chat-item.selecting .info-tab-message{max-width:calc(100% - 40px)}.chat-item.selecting .chat-info{max-width:calc(100% - 74px)}.avatar{width:30px;height:30px;flex:0 0 30px;font-size:12px}.chat-header-responsive-btn{width:24px;height:24px;flex:0 0 24px;padding:4px;margin-right:5px;flex-direction:row;justify-content:center}.chat-header>div>h4.mb-4px{margin-bottom:0!important}.chat-header-responsive-btn>img{max-width:10px;height:auto}.info-tab-message .mb-11{margin-bottom:3px!important}.chat-content{max-width:100%}}.highlight{background-color:#89b85a;color:#fff;font-weight:900}.edit-msg-icon{position:absolute;left:-12.5px;top:-12.5px;width:25px;height:25px;display:flex;align-items:center;justify-content:center;background:#4180bb;border-radius:50%;cursor:pointer}.edit-msg-icon>img{filter:brightness(0) invert(1);max-width:50%}.file-box{overflow-wrap:break-word}