@import "https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap";:root{font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#c999ff;background-image:radial-gradient(at 62% 31%,#5f69f7 0,#0000 50%),radial-gradient(at 95% 77%,#e78892 0,#0000 50%),radial-gradient(at 61% 42%,#f78d55 0,#0000 50%),radial-gradient(at 97% 38%,#7794fd 0,#0000 50%),radial-gradient(at 90% 9%,#4c7ff6 0,#0000 50%),radial-gradient(at 87% 15%,#8387fc 0,#0000 50%),radial-gradient(at 12% 83%,#fe3e4e 0,#0000 50%);font-family:Poppins,sans-serif}*{box-sizing:border-box;margin:0;padding:0;font-family:Poppins,sans-serif}body{justify-content:center;align-items:center;height:100vh;display:flex;overflow:hidden}.loginForm,.registerForm{background-color:#f3f3f9;border-radius:30px;flex-direction:column;justify-content:center;align-items:center;width:500px;padding:30px 10px;display:flex;overflow:hidden;box-shadow:0 0 10px #00000080}.loginForm .logo,.registerForm .logo{flex-direction:row;justify-content:center;align-items:center;display:flex}.loginForm .logo img,.registerForm .logo img{height:40px;margin-bottom:50px;margin-left:10px}.loginForm .logo h1,.registerForm .logo h1{color:#333;font-size:3rem;font-weight:700}.loginForm .logo h1 span,.registerForm .logo h1 span{color:#9474f4}.loginForm .heading,.registerForm .heading{flex-direction:column;justify-content:center;align-items:center;margin-bottom:30px;display:flex}.loginForm .heading h3,.registerForm .heading h3{color:#5e5e5e;font-size:1.1rem;font-weight:500}.loginForm .heading h3 span,.registerForm .heading h3 span{color:#9474f4}.loginForm form,.registerForm form{flex-direction:column;justify-content:center;align-items:center;width:100%;display:flex}.loginForm form .formGroup,.registerForm form .formGroup{background-color:#fff;border-radius:20px;flex-direction:column;justify-content:center;align-items:flex-start;width:80%;margin-bottom:20px;padding:15px;display:flex}.loginForm form .formGroup label,.registerForm form .formGroup label{color:#5e5e5e;text-align:left;margin-bottom:10px;font-size:1rem;font-weight:500}.loginForm form .formGroup .inputGroup,.registerForm form .formGroup .inputGroup{background-color:#0000;border:none;outline:none;justify-content:center;align-items:center;width:100%;display:flex}.loginForm form .formGroup .inputGroup input,.registerForm form .formGroup .inputGroup input{color:#5e5e5e;background-color:#0000;border:none;outline:none;width:100%;margin-left:10px;font-size:1rem;font-weight:400}.loginForm form .formGroup .inputGroup input::placeholder,.registerForm form .formGroup .inputGroup input::placeholder{color:#5e5e5e;font-size:1rem;font-style:italic;font-weight:400}.loginForm form .formGroup .inputGroup .inputIcon,.registerForm form .formGroup .inputGroup .inputIcon{color:#9474f4;font-size:1rem}.loginForm form .formGroup .inputGroup .show_hide,.registerForm form .formGroup .inputGroup .show_hide{color:#9474f4;cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:10px;font-size:1rem;font-weight:500;transition:color .3s ease-in-out;display:flex}.loginForm form .formGroup .inputGroup .show_hide:hover,.registerForm form .formGroup .inputGroup .show_hide:hover{color:#7247f3}.loginForm form .formGroup .inputGroup .show_hide:focus,.registerForm form .formGroup .inputGroup .show_hide:focus{outline:none}.loginForm form .remember_forget,.registerForm form .remember_forget{justify-content:space-between;align-items:center;width:80%;margin-bottom:20px;display:flex}.loginForm form .remember_forget .remember,.registerForm form .remember_forget .remember{flex-direction:row;justify-content:center;align-items:center;gap:5px;display:flex}.loginForm form .remember_forget .remember label,.registerForm form .remember_forget .remember label{color:#5e5e5e;font-size:1rem;font-weight:500}.loginForm form .remember_forget .forget,.registerForm form .remember_forget .forget{color:#9474f4;cursor:pointer;font-size:1rem;font-weight:500;text-decoration:none;transition:all .3s ease-in-out}.loginForm form .remember_forget .forget:hover,.registerForm form .remember_forget .forget:hover{color:#7247f3}.loginForm form .formButton,.registerForm form .formButton{color:#fafafa;cursor:pointer;background-color:#9474f4;border:none;border-radius:30px;outline:none;width:80%;margin:20px 0;padding:1rem;font-size:1.2rem;font-weight:600;transition:all .3s ease-in-out}.loginForm form .formButton:hover,.registerForm form .formButton:hover{background-color:#8965f5}.loginForm form span,.registerForm form span{color:#5e5e5e;margin-top:10px;font-size:1rem;font-weight:400}.loginForm form span a,.registerForm form span a{color:#9474f4;font-weight:500;text-decoration:none}.loginForm form span a:hover,.registerForm form span a:hover{text-decoration:none}.home{background-color:#f3f3f9;border-radius:25px;justify-content:flex-start;align-items:center;width:70vw;height:800px;display:flex;overflow:hidden;box-shadow:0 0 10px #00000080}.home .noChatMessage{text-align:center;flex-direction:column;justify-content:center;align-items:center;width:70%;height:100%;padding:20px 10px;display:flex}.home .noChatMessage h4{color:#9474f4;margin-bottom:10px;font-size:2rem;font-weight:500}.home .noChatMessage p{color:#5e5e5e;font-size:1rem;font-weight:400}.home .sidebar{background-color:#fff;flex-direction:column;justify-content:space-between;align-items:center;width:60px;height:100%;padding:20px 5px;display:flex}.home .sidebar .logo{justify-content:center;align-items:center;display:flex}.home .sidebar .logo img{height:30px}.home .sidebar .sidebarMenu{flex-direction:column;justify-content:center;align-items:center;gap:10px;display:flex}.home .sidebar .sidebarMenu .sidebarIcon{color:#9474f4;cursor:pointer;font-size:1.5rem;transition:all .3s ease-in-out}.home .sidebar .sidebarMenu .sidebarIcon:hover{color:#7247f3}.home .sidebar .sidebarUser{flex-direction:column;justify-content:center;align-items:center;gap:20px;display:flex}.home .sidebar .sidebarUser .userSignOut{color:#9474f4;cursor:pointer;font-size:1.5rem;transition:all .3s ease-in-out}.home .sidebar .sidebarUser .userSignOut:hover{color:#7247f3}.home .sidebar .sidebarUser .userImg{object-fit:cover;border:2px solid #9474f4;border-radius:50%;width:40px;height:40px}.home .chatsContainer{background-color:#f2efff;flex-direction:column;justify-content:flex-start;align-items:center;width:30%;height:100%;padding:20px 10px;display:flex;overflow-y:auto}.home .chatsContainer .searchbar{flex-direction:column;justify-content:flex-start;align-items:center;width:100%;display:flex}.home .chatsContainer .searchbar .searchForm{background-color:#fff;border-radius:20px;flex-direction:row;justify-content:center;align-items:center;width:100%;height:60px;margin-bottom:10px;padding:10px 20px;display:flex;box-shadow:0 5px 10px #0909091a}.home .chatsContainer .searchbar .searchForm input[type=text]{color:#5e5e5e;background-color:#0000;border:none;outline:none;width:100%;height:100%;margin-left:10px;font-size:1rem;font-weight:500}.home .chatsContainer .searchbar .searchForm input[type=text]::placeholder{color:#5e5e5e;font-size:1rem;font-style:italic;font-weight:400}.home .chatsContainer .searchbar .searchForm .searchIcon{color:#9474f4;cursor:pointer;font-size:1.5rem;transition:all .3s ease-in-out}.home .chatsContainer .searchbar .searchForm .searchIcon:hover{color:#7247f3}.home .chatsContainer .searchbar .searchResult{flex-direction:column;justify-content:flex-start;align-items:center;width:100%;height:100%;margin-bottom:10px;padding:auto;display:flex}.home .chatsContainer .searchbar .searchResult .searchResultUser{color:#fafafa;cursor:pointer;background-color:#9474f4;border-radius:20px;justify-content:space-between;align-items:center;gap:10px;width:100%;height:80px;padding:10px 20px;display:flex}.home .chatsContainer .searchbar .searchResult .searchResultUser .searchResultUserImg{object-fit:cover;border:2px solid #fafafa;border-radius:50%;width:60px;height:60px}.home .chatsContainer .searchbar .searchResult .searchResultUser .searchResultUserInfo{flex-direction:column;justify-content:center;align-items:flex-start;display:flex}.home .chatsContainer .searchbar .searchResult .searchResultUser .searchResultUserInfo .searchResultUserName{color:#fafafa;font-size:1rem;font-weight:600}.home .chatsContainer .searchbar .searchResult .searchResultUser .searchResultUserInfo .searchResultUserProfession{font-size:1rem;font-weight:400}.home .chatsContainer .searchbar .searchResult .searchResultUser .searchResultbuttons{flex-direction:row;justify-content:center;align-items:center;gap:5px;display:flex}.home .chatsContainer .searchbar .searchResult .searchResultUser .searchResultbuttons .searchResultbutton{color:#fafafa;cursor:pointer;font-size:1.1rem}.home .chatsContainer ::-webkit-scrollbar{width:0}.home .chatsContainer .chatsList{flex-direction:column;justify-content:flex-start;gap:10px;width:100%;height:100%;padding:10px 0;display:flex;overflow-y:scroll}.home .chatsContainer .chatsList .chatTitle{color:#9474f4;font-size:.8rem;font-weight:600}.home .chatsContainer .chatsList .chatCard{cursor:pointer;background-color:#fff;border-radius:20px;justify-content:space-between;align-items:center;gap:10px;width:100%;height:90px;padding:10px 20px;transition:all .3s ease-in-out;display:flex}.home .chatsContainer .chatsList .chatCard.selected{background-color:#9474f4}.home .chatsContainer .chatsList .chatCard.selected .chatUserInfo .chatUserImg{border:2px solid #fff}.home .chatsContainer .chatsList .chatCard.selected .chatUserInfo .chatContent .chatUser .chatUserName{color:#fff}.home .chatsContainer .chatsList .chatCard.selected .chatUserInfo .chatContent .chatUser .chatUserProfession{color:#f3f3f9}.home .chatsContainer .chatsList .chatCard.selected .chatUserInfo .chatContent .chatLastMessage,.home .chatsContainer .chatsList .chatCard.selected .chatUserDetails .timestamp,.home .chatsContainer .chatsList .chatCard.selected .chatUserDetails .button{color:#fff}.home .chatsContainer .chatsList .chatCard .chatUserInfo{flex-direction:row;justify-content:center;align-items:center;gap:20px;display:flex}.home .chatsContainer .chatsList .chatCard .chatUserInfo .chatUserImg{object-fit:cover;border:2px solid #9474f4;border-radius:50%;width:70px;height:70px}.home .chatsContainer .chatsList .chatCard .chatUserInfo .chatContent{text-align:left;flex-direction:column;justify-content:center;align-items:flex-start;gap:10px;display:flex}.home .chatsContainer .chatsList .chatCard .chatUserInfo .chatContent .chatUser{text-align:left;flex-direction:column;align-items:flex-start;display:flex}.home .chatsContainer .chatsList .chatCard .chatUserInfo .chatContent .chatUser .chatUserName{color:#9474f4;font-size:1rem;font-weight:600}.home .chatsContainer .chatsList .chatCard .chatUserInfo .chatContent .chatUser .chatUserProfession{color:#5e5e5e;font-size:.7rem;font-weight:500}.home .chatsContainer .chatsList .chatCard .chatUserInfo .chatContent .chatLastMessage{color:#5e5e5e;font-size:.8rem;font-weight:500}.home .chatsContainer .chatsList .chatCard .chatUserDetails{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:10px;display:flex}.home .chatsContainer .chatsList .chatCard .chatUserDetails .timestamp{color:#5e5e5e;font-size:.6rem;font-weight:500}.home .chatsContainer .chatsList .chatCard .chatUserDetails .button{color:#9474f4;cursor:pointer;font-size:1.5rem;transition:all .3s ease-in-out}.home .chatsContainer .chatsList .chatCard .chatUserDetails .button:hover{color:#7247f3}.home .chat{background-color:#f4f4fa;flex-direction:column;justify-content:space-between;align-items:center;width:70%;height:100%;padding:20px 10px;display:flex;overflow-y:auto}.home .chat ::-webkit-scrollbar{width:5px}.home .chat ::-webkit-scrollbar-track{background:0 0}.home .chat .chatHeader{background-color:#fff;border-radius:20px;justify-content:space-between;align-items:center;width:100%;height:80px;padding:10px 20px;display:flex}.home .chat .chatHeader .chatUser{flex-direction:row;justify-content:center;align-items:center;gap:10px;display:flex}.home .chat .chatHeader .chatUser .chatImg{object-fit:cover;border:2px solid #9474f4;border-radius:50%;width:60px;height:60px}.home .chat .chatHeader .chatUser .chatImg[data-online=true]{border:2px solid #0f0}.home .chat .chatHeader .chatUser .chatImg[data-online=false]{border:2px solid red}.home .chat .chatHeader .chatUser .chatInfo{flex-direction:column;justify-content:center;gap:10px;display:flex}.home .chat .chatHeader .chatUser .chatInfo .chatName{color:#9474f4;font-size:1rem;font-weight:600}.home .chat .chatHeader .chatUser .chatInfo .chatStatus{color:#5e5e5e;font-size:.8rem;font-weight:500}.home .chat .chatHeader .chatActions{justify-content:center;align-items:center;gap:5px;display:flex}.home .chat .chatHeader .chatActions .chatAction button{color:#9474f4;cursor:pointer;font-size:1rem;transition:all .3s ease-in-out}.home .chat .chatHeader .chatActions .chatAction button:hover{color:#7247f3}.home .chat .Messages{flex-direction:column;justify-content:flex-start;gap:20px;width:100%;height:100%;padding:20px 10px;display:flex;overflow-y:auto}.home .chat .Messages .noMessages{text-align:center;opacity:.5;margin-top:25%}.home .chat .Messages .message{flex-direction:row;align-items:center;gap:20px;display:flex}.home .chat .Messages .message.Sender{flex-direction:row-reverse}.home .chat .Messages .message.Sender>.SenderInfo{flex-direction:column;justify-content:center;align-items:center;gap:5px;display:flex}.home .chat .Messages .message.Sender>.SenderInfo .SenderImg{object-fit:cover;border:2px solid #9474f4;border-radius:50%;width:40px;height:40px}.home .chat .Messages .message.Sender>.SenderInfo .timestamp{color:#5e5e5e;font-size:.7rem;font-weight:500}.home .chat .Messages .message.Sender>.messageContent{word-break:break-word;flex-direction:column;justify-content:center;align-items:center;max-width:50%;display:flex}.home .chat .Messages .message.Sender>.messageContent .messageText{color:#fafafa;background-color:#9474f4;border-radius:10px 10px 0;flex-direction:column;justify-content:center;align-items:center;width:fit-content;padding:10px 20px;font-size:1rem;font-weight:500;line-height:1.6;display:flex}.home .chat .Messages .message.Sender>.messageContent .messageImg{object-fit:contain;border-radius:10px;width:100%;height:200px}.home .chat .Messages .message.Receiver>.ReceiverInfo{flex-direction:column;justify-content:center;align-items:center;gap:5px;display:flex}.home .chat .Messages .message.Receiver>.ReceiverInfo .ReceiverImg{object-fit:cover;border:2px solid #9474f4;border-radius:50%;width:40px;height:40px}.home .chat .Messages .message.Receiver>.ReceiverInfo .timestamp{color:#5e5e5e;font-size:.7rem;font-weight:500}.home .chat .Messages .message.Receiver>.messageContent{word-break:break-word;flex-direction:column;justify-content:center;align-items:center;max-width:50%;display:flex}.home .chat .Messages .message.Receiver>.messageContent .messageText{background-color:#fff;border-radius:10px 10px 10px 0;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:fit-content;padding:10px 20px;font-size:1rem;font-weight:500;line-height:1.6;display:flex;box-shadow:0 8px 10px #0000001a}.home .chat .Messages .message.Receiver>.messageContent .messageImg{object-fit:contain;border-radius:10px;width:100%;height:200px}.home .chat .chatInput{background-color:#fff;border-radius:20px;flex-direction:column;justify-content:center;align-items:flex-start;gap:10px;width:100%;padding:20px;display:flex;box-shadow:0 4px 10px #0909091a}.home .chat .chatInput form{flex-direction:row;justify-content:center;align-items:center;gap:10px;width:100%;display:flex}.home .chat .chatInput form .imgPreviewContainer{justify-content:center;align-items:center;gap:5px;display:flex}.home .chat .chatInput form .imgPreviewContainer .imgPreview{object-fit:cover;border-radius:5px;width:80px;height:100%}.home .chat .chatInput form .imgPreviewContainer .removeImgIcon{color:#9474f4;cursor:pointer;font-size:1.5rem;transition:all .3s ease-in-out}.home .chat .chatInput form .imgPreviewContainer .removeImgIcon:hover{color:#7247f3}.home .chat .chatInput .filePreviewContainer{justify-content:flex-start;align-items:center;gap:5px;width:100%;display:flex}.home .chat .chatInput .filePreviewContainer .fileNamePreview{color:#5e5e5e;font-size:1rem;font-weight:500}.home .chat .chatInput .filePreviewContainer .removeFileIcon{color:#9474f4;cursor:pointer;font-size:1.5rem;transition:all .3s ease-in-out}.home .chat .chatInput .filePreviewContainer .removeFileIcon:hover{color:#7247f3}.home .chat .inputBase{color:#5e5e5e;background-color:#0000;border:none;outline:none;width:100%;height:100%;margin-left:10px;font-size:1rem;font-weight:500}.home .chat .inputBase::placeholder{color:#5e5e5e;font-size:1rem;font-style:italic;font-weight:500}.home .chat .chatIcons{flex-direction:row;justify-content:space-between;align-items:center;gap:10px;width:100%;display:flex}.home .chat .chatIcons .chatOptions{justify-content:center;align-items:center;gap:8px;display:flex}.home .chat .chatIcons .chatOptions .chatIcon{color:#9474f4;font-size:1.5rem;transition:all .3s ease-in-out}.home .chat .chatIcons .chatOptions .chatIcon:hover{color:#7247f3}.home .chat .chatIcons .chatSend{flex-direction:row;justify-content:center;align-items:center;gap:10px;display:flex}.home .chat .chatIcons .chatSend .chatIcon{color:#9474f4;font-size:1.5rem;transition:all .3s ease-in-out}.home .chat .chatIcons .chatSend .chatIcon:hover{color:#7247f3}.home .chat .chatIcons .chatSend .chatIconSend{color:#fff;background-color:#9474f4;border-radius:50%;font-size:2rem;transition:all .3s ease-in-out}.home .chat .chatIcons .chatSend .chatIconSend:hover{background-color:#7247f3}