@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700&display=swap);*,:after,:before{box-sizing:border-box}.button-userlist-search2{background:grey;border:none;border-radius:5px;color:#fff;cursor:pointer;display:block;font-size:17px;margin-left:20px;margin-right:5px;outline:none;padding:7px;text-align:center;text-decoration:none;width:80px}.button-userlist-search2:focus,.button-userlist-search2:hover{background-color:grey}.details-modal{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#fff;background-color:#f9fafb;border-radius:16px;box-shadow:0 10px 20px rgba(0,0,0,.2);color:#6b7280;display:flex;flex-direction:column;font-family:Inter,sans-serif;font-size:70%;font-weight:400;left:50%;line-height:1.4;max-height:480px;max-width:330px;min-height:480px;min-width:330px;padding-bottom:10px;pointer-events:none;position:absolute;text-align:left;top:50%;-webkit-transform:translate(-50%,-10%);transform:translate(-50%,-10%)}.details-modal .details-modal-close{align-items:center;color:#111827;display:flex;height:4.5em;justify-content:center;pointer-events:none;position:absolute;right:0;top:0;width:4.5em}.details-modal .details-modal-close svg{display:block}.details-modal .details-modal-title{color:#111827;padding:1.5em 2em;pointer-events:all;position:relative;width:calc(100% - 4.5em)}.details-modal .details-modal-title h1{font-size:1.25rem;font-weight:600;line-height:normal}.details-modal .details-modal-content{-ms-overflow-style:none;border-bottom-left-radius:16px;border-top:1px solid #e0e0e0;overflow:auto;padding:10px 20px;pointer-events:all;scrollbar-width:none}.details-modal .details-modal-content::-webkit-scrollbar{display:none}.details-modal .details-modal-content .userChat{border-bottom:1px solid rgba(0,0,0,.2);font-size:15px;height:60px;margin-bottom:5px}.details-modal .details-modal-content .userChat img{height:35px;width:35px}.details-modal-overlay{background:rgba(15,23,42,.8);bottom:0;left:0;opacity:0;pointer-events:none;position:fixed;right:0;top:0;transition:opacity .2s ease-out}details[open] .details-modal-overlay{opacity:.5;pointer-events:all}details summary{list-style:none}details summary:focus{outline:none}details summary::-webkit-details-marker{display:none}*{box-sizing:border-box;font-family:Poppins,sans-serif;margin:0;padding:0;text-decoration:none}body{align-items:center;background:#f7f7f7;display:flex;justify-content:center;min-height:100vh;padding:0 10px}.wrapper{background:#fff;border-radius:16px;box-shadow:0 0 128px 0 rgba(0,0,0,.1),0 32px 64px -48px rgba(0,0,0,.5);max-width:400px;width:100%}.form{padding:25px 30px}.form header{border-bottom:1px solid #e6e6e6;font-size:25px;font-weight:600;padding-bottom:10px}.form form{margin:20px 0}.form form .error-text{background:#f8d7da;border:1px solid #f5c6cb;border-radius:5px;color:#721c24;margin-bottom:10px;padding:8px 10px;text-align:center}.form form .name-details{display:flex}.form .name-details .field:first-child{margin-right:10px}.form .name-details .field:last-child{margin-left:10px}.form form .field{display:flex;flex-direction:column;margin-bottom:10px;position:relative}.form form .field label{margin-bottom:2px}.form form .input input{border:1px solid #ccc;border-radius:5px;font-size:16px;height:40px;padding:0 10px;width:100%}.form form .field input{outline:none}.form form .image input{font-size:17px}.form form .button input{background:#333;border:none;border-radius:5px;color:#fff;cursor:pointer;font-size:17px;height:45px;margin-top:13px}.form form .field i{color:#ccc;cursor:pointer;position:absolute;right:15px;top:70%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.form form .field i.active:before{color:#333;content:"\f070"}.form .link{font-size:17px;margin:10px 0;text-align:center}.form .link a{color:#333}.form .link a:hover{text-decoration:underline}.users{-ms-overflow-style:none;max-height:500px;min-height:500px;min-width:350px;overflow-y:scroll;padding:25px 30px;scrollbar-width:none}.users::-webkit-scrollbar{display:none}.users header{background-color:#fff;position:-webkit-sticky;position:sticky;top:0;z-index:999}.users header,.users-list a{align-items:center;border-bottom:1px solid #e6e6e6;display:flex;justify-content:space-between;padding-bottom:20px}.wrapper img{border-radius:50%;object-fit:cover}.users header img{height:50px;width:50px}:is(.users,.users-list) .content{align-items:center;display:flex}:is(.users,.users-list) .content .details{color:#000;margin-left:20px}:is(.users,.users-list) .details span{font-size:18px;font-weight:700}.users header .logout{background:#333;border:none;border-radius:5px;color:#fff;display:block;font-size:17px;outline:none;padding:7px 15px;text-decoration:none}.users .search{align-items:center;display:flex;justify-content:space-between;margin:20px 0;position:relative}.users .search .text{font-size:18px}.users .search input{border:1px solid #e6e6e6;border-radius:5px 0 0 5px;font-size:16px;height:42px;opacity:0;outline:none;padding:0 13px;pointer-events:none;position:absolute;transition:all .2s ease;width:calc(100% - 50px)}.users .search input.show{opacity:1;pointer-events:auto}.users .search button{background:#fff;background:#333;border:none;border-radius:0 5px 5px 0;color:#333;color:#fff;cursor:pointer;font-size:17px;height:42px;outline:none;position:relative;transition:all .2s ease;width:47px;z-index:1}.search button.active i:before{content:"\f00d"}.users-list{max-height:350px;overflow-y:auto}:is(.users-list,.chat-box)::-webkit-scrollbar{width:0}.users-list a{border-radius:15px;margin-bottom:15px;padding:10px 15px 10px 10px}.users-list a:hover{background-color:rgba(0,0,0,.1);cursor:pointer}.users-list a:last-child{border-bottom:none;margin-bottom:0}.users-list a img{height:40px;width:40px}.users-list a .details{font-weight:700}.users-list a .details p{color:#67676a;font-weight:400}.users-list a .status-dot{color:#468669;font-size:12px;padding-left:10px}.users-list a .status-dot.offline{color:#ccc}.chat-area header{align-items:center;display:flex;padding:18px 30px}.chat-area header .back-icon{color:#333;font-size:18px}.chat-area header img{border:50%;height:45px;margin:0 15px;width:45px}.chat-area header .details span{font-size:17px;font-weight:700}.chat-box{-ms-overflow-style:none;background-image:url(https://res.cloudinary.com/druttjvrf/image/upload/v1687523861/8c98994518b575bfd8c949e91d20548b_dfkavx.jpg);background-repeat:no-repeat;box-shadow:inset 0 32px 32px -32px rgb(0 0 0/5%),inset 0 -32px 32px -32px rgb(0 0 0/5%);max-height:500px;max-width:400px;min-height:500px;object-fit:fill;overflow-y:auto;padding:10px 30px 20px;position:relative;scrollbar-width:none}.chat-box::-webkit-scrollbar{display:none}.chat-box .text{left:50%;position:absolute;text-align:center;top:45%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);width:calc(100% - 50px)}.chat-box .chat{margin:10px 0}.chat-box .chat p{word-wrap:break-word;box-shadow:0 0 32px rgb(0 0 0/8%),0 16px 16px -16px rgba(0,0,0,.1);padding:8px 16px}.chat-box .outgoing{display:flex}.chat-box .outgoing .details{margin-left:auto;max-width:calc(100% - 130px)}.outgoing .details p{background:#333;border-radius:18px 18px 0 18px;color:#fff}.outgoing .details span{display:flex;font-size:10px;justify-content:flex-end;opacity:.5}.incoming .details span{display:flex;font-size:10px;justify-content:flex-start;opacity:.5}.chat-box .incoming{align-items:flex-end;display:flex}.chat-box .incoming img{height:35px;width:35px}.chat-box .incoming .details{margin-right:auto;max-width:calc(100% - 130px)}.incoming .details p{background:#fff;border-radius:18px 18px 18px 0;color:#333}.typing-area{display:flex;justify-content:space-between;padding:18px 30px}.typing-area input{border:1px solid #e6e6e6;border-radius:5px 0 0 5px;font-size:16px;height:45px;outline:none;padding:0 13px;width:calc(100% - 58px)}.typing-area button{background:#333;border:none;border-radius:0 5px 5px 0;color:#fff;cursor:pointer;font-size:19px;opacity:.7;outline:none;pointer-events:none;transition:all .3s ease;width:55px}.typing-area button.active{opacity:1;pointer-events:auto}@media screen and (max-width:450px){.form,.users{padding:20px}.form header{text-align:center}.form form .name-details{flex-direction:column}.form .name-details .field:first-child{margin-right:0}.form .name-details .field:last-child{margin-left:0}.users header img{height:45px;width:45px}.users header .logout{font-size:16px;padding:6px 10px}:is(.users,.users-list) .content .details{margin-left:15px}.users-list a{padding-right:10px}.chat-area header{padding:15px 20px}.chat-box{min-height:400px;padding:10px 15px 15px 20px}.chat-box .chat p{font-size:15px}.chat-box .outogoing .details{max-width:230px}.chat-box .incoming .details{max-width:265px}.incoming .details img{height:30px;width:30px}.chat-area form{padding:20px}.chat-area form input{height:40px;width:calc(100% - 48px)}.chat-area form button{width:45px}}.userChat .userChatInfo span{font-weight:600}.userChat{align-items:center;display:flex;gap:20px}.userChat img{height:40px;margin:20px 0;width:40px}.three-body{--uib-size:35px;--uib-speed:0.8s;--uib-color:#000;-webkit-animation:spin78236 calc(var(--uib-speed)*2.5) infinite linear;animation:spin78236 calc(var(--uib-speed)*2.5) infinite linear;display:inline-block;height:var(--uib-size);position:relative;width:var(--uib-size)}.three-body__dot{height:100%;position:absolute;width:30%}.three-body__dot:after{background-color:var(--uib-color);border-radius:50%;content:"";height:0;padding-bottom:100%;position:absolute;width:100%}.three-body__dot:first-child{bottom:5%;left:0;-webkit-transform:rotate(60deg);transform:rotate(60deg);-webkit-transform-origin:50% 85%;transform-origin:50% 85%}.three-body__dot:first-child:after{-webkit-animation:wobble1 var(--uib-speed) infinite ease-in-out;animation:wobble1 var(--uib-speed) infinite ease-in-out;-webkit-animation-delay:calc(var(--uib-speed)*-.3);animation-delay:calc(var(--uib-speed)*-.3);bottom:0;left:0}.three-body__dot:nth-child(2){bottom:5%;right:0;-webkit-transform:rotate(-60deg);transform:rotate(-60deg);-webkit-transform-origin:50% 85%;transform-origin:50% 85%}.three-body__dot:nth-child(2):after{-webkit-animation:wobble1 var(--uib-speed) infinite calc(var(--uib-speed)*-.15) ease-in-out;animation:wobble1 var(--uib-speed) infinite calc(var(--uib-speed)*-.15) ease-in-out;bottom:0;left:0}.three-body__dot:nth-child(3){bottom:-5%;left:0;-webkit-transform:translateX(116.666%);transform:translateX(116.666%)}.three-body__dot:nth-child(3):after{-webkit-animation:wobble2 var(--uib-speed) infinite ease-in-out;animation:wobble2 var(--uib-speed) infinite ease-in-out;left:0;top:0}@-webkit-keyframes spin78236{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin78236{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@-webkit-keyframes wobble1{0%,to{opacity:1;-webkit-transform:translateY(0) scale(1);transform:translateY(0) scale(1)}50%{opacity:.8;-webkit-transform:translateY(-66%) scale(.65);transform:translateY(-66%) scale(.65)}}@keyframes wobble1{0%,to{opacity:1;-webkit-transform:translateY(0) scale(1);transform:translateY(0) scale(1)}50%{opacity:.8;-webkit-transform:translateY(-66%) scale(.65);transform:translateY(-66%) scale(.65)}}@-webkit-keyframes wobble2{0%,to{opacity:1;-webkit-transform:translateY(0) scale(1);transform:translateY(0) scale(1)}50%{opacity:.8;-webkit-transform:translateY(66%) scale(.65);transform:translateY(66%) scale(.65)}}@keyframes wobble2{0%,to{opacity:1;-webkit-transform:translateY(0) scale(1);transform:translateY(0) scale(1)}50%{opacity:.8;-webkit-transform:translateY(66%) scale(.65);transform:translateY(66%) scale(.65)}}.search-welcome{padding:10px;text-align:center}.userlist-insearch{background-color:initial;cursor:pointer;margin-left:20px;text-align:center}
/*# sourceMappingURL=main.1681699b.css.map*/