@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";.profile-settings{max-width:880px;margin:30px auto;padding:30px;background:#fff;border-radius:16px;box-shadow:0 6px 20px #00000014;font-family:Inter,sans-serif;transition:.3s ease}.profile-settings h2{font-size:26px;font-weight:600;margin-bottom:20px;color:#222}.profile-settings .profile-content{display:flex;gap:40px;align-items:flex-start}@media (max-width: 768px){.profile-settings .profile-content{flex-direction:column;align-items:center;gap:20px}}.profile-settings .avatar-section{display:flex;flex-direction:column;align-items:center;gap:14px}.profile-settings .avatar-section .avatar-preview{width:140px;height:140px;border-radius:50%;overflow:hidden;background:#f0f0f0;border:3px solid #eee;box-shadow:0 3px 8px #0000001a}.profile-settings .avatar-section .avatar-preview img{width:100%;height:100%;object-fit:cover}.profile-settings .avatar-section input[type=file]{display:none}.profile-settings .avatar-section label.upload-label{padding:8px 16px;font-size:14px;font-weight:500;background:#1976d2;color:#fff;border-radius:6px;cursor:pointer;transition:.2s}.profile-settings .avatar-section label.upload-label:hover{background:#115293}.profile-settings .avatar-section .avatar-actions{display:flex;gap:10px}.profile-settings .avatar-section .avatar-actions button{border-radius:6px;font-size:14px}.profile-settings .info-section{flex:1;display:flex;flex-direction:column;gap:22px}.profile-settings .info-section .field-block{display:flex;flex-direction:column;gap:6px}.profile-settings .info-section .field-block label{font-weight:500;color:#444;font-size:14px}.profile-settings .info-section .save-actions{display:flex;align-items:center;gap:14px}.profile-settings .info-section .save-actions button{border-radius:8px;font-weight:500}.profile-settings .info-section .save-actions .status{font-size:13px;color:#777}.profile-settings .info-section .save-actions .status.verified{color:green;font-weight:600}.profile-settings .message{margin-top:20px;padding:10px 14px;border-radius:8px;background:#e8f4ff;color:#1976d2;font-size:14px;font-weight:500;text-align:center}:root{font-family:Poppins,sans-serif;background-color:#c999ff;background-image:radial-gradient(at 62% 31%,hsl(236,90%,67%) 0px,transparent 50%),radial-gradient(at 95% 77%,hsl(354,66%,72%) 0px,transparent 50%),radial-gradient(at 61% 42%,hsl(21,91%,65%) 0px,transparent 50%),radial-gradient(at 97% 38%,hsl(227,97%,73%) 0px,transparent 50%),radial-gradient(at 90% 9%,hsl(222,90%,63%) 0px,transparent 50%),radial-gradient(at 87% 15%,hsl(238,95%,75%) 0px,transparent 50%),radial-gradient(at 12% 83%,hsl(355,99%,62%) 0px,transparent 50%);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{margin:0;padding:0;box-sizing:border-box;font-family:Poppins,sans-serif}body{height:100vh;overflow:hidden;display:flex;align-items:center;justify-content:center}.loginForm,.registerForm{display:flex;align-items:center;justify-content:center;flex-direction:column;padding:30px 10px;width:500px;background-color:#f3f3f9;border-radius:30px;box-shadow:0 0 10px #00000080;overflow:hidden}.loginForm .logo,.registerForm .logo{display:flex;flex-direction:row;align-items:center;justify-content:center}.loginForm .logo img,.registerForm .logo img{height:40px;margin-bottom:50px;margin-left:10px}.loginForm .logo h1,.registerForm .logo h1{font-size:3rem;font-weight:700;color:#333}.loginForm .logo h1 span,.registerForm .logo h1 span{color:#9474f4}.loginForm .heading,.registerForm .heading{display:flex;flex-direction:column;align-items:center;justify-content:center;margin-bottom:30px}.loginForm .heading h3,.registerForm .heading h3{font-size:1.1rem;font-weight:500;color:#5e5e5e}.loginForm .heading h3 span,.registerForm .heading h3 span{color:#9474f4}.loginForm form,.registerForm form{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%}.loginForm form .formGroup,.registerForm form .formGroup{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;width:80%;margin-bottom:20px;background-color:#fff;border-radius:20px;padding:15px}.loginForm form .formGroup label,.registerForm form .formGroup label{font-size:1rem;font-weight:500;color:#5e5e5e;margin-bottom:10px;text-align:left}.loginForm form .formGroup .inputGroup,.registerForm form .formGroup .inputGroup{display:flex;align-items:center;justify-content:center;width:100%;border:none;outline:none;background-color:transparent}.loginForm form .formGroup .inputGroup input,.registerForm form .formGroup .inputGroup input{width:100%;border:none;outline:none;font-size:1rem;font-weight:400;color:#5e5e5e;background-color:transparent;margin-left:10px}.loginForm form .formGroup .inputGroup input::placeholder,.registerForm form .formGroup .inputGroup input::placeholder{font-size:1rem;font-weight:400;color:#5e5e5e;font-style:italic}.loginForm form .formGroup .inputGroup .inputIcon,.registerForm form .formGroup .inputGroup .inputIcon{font-size:1rem;color:#9474f4}.loginForm form .formGroup .inputGroup .show_hide,.registerForm form .formGroup .inputGroup .show_hide{background:none;border:none;color:#9474f4;font-size:1rem;font-weight:500;cursor:pointer;transition:color .3s ease-in-out;display:flex;align-items:center;justify-content:center;padding:10px}.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{display:flex;align-items:center;justify-content:space-between;width:80%;margin-bottom:20px}.loginForm form .remember_forget .remember,.registerForm form .remember_forget .remember{display:flex;align-items:center;justify-content:center;flex-direction:row;gap:5px}.loginForm form .remember_forget .remember label,.registerForm form .remember_forget .remember label{font-size:1rem;font-weight:500;color:#5e5e5e}.loginForm form .remember_forget .forget,.registerForm form .remember_forget .forget{font-size:1rem;font-weight:500;color:#9474f4;cursor:pointer;transition:all .3s ease-in-out;text-decoration:none}.loginForm form .remember_forget .forget:hover,.registerForm form .remember_forget .forget:hover{color:#7247f3}.loginForm form .formButton,.registerForm form .formButton{width:80%;border:none;outline:none;background-color:#9474f4;color:#fafafa;font-size:1.2rem;font-weight:600;padding:1rem;border-radius:30px;cursor:pointer;transition:all .3s ease-in-out;margin:20px 0}.loginForm form .formButton:hover,.registerForm form .formButton:hover{background-color:#8965f5}.loginForm form span,.registerForm form span{font-size:1rem;font-weight:400;color:#5e5e5e;margin-top:10px}.loginForm form span a,.registerForm form span a{color:#9474f4;text-decoration:none;font-weight:500}.loginForm form span a:hover,.registerForm form span a:hover{text-decoration:none}.home{display:flex;align-items:center;justify-content:flex-start;width:70vw;height:800px;background-color:#f3f3f9;border-radius:25px;box-shadow:0 0 10px #00000080;overflow:hidden}.home .noChatMessage{display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;width:70%;height:100%;padding:20px 10px}.home .noChatMessage h4{font-size:2rem;font-weight:500;color:#9474f4;margin-bottom:10px}.home .noChatMessage p{font-size:1rem;font-weight:400;color:#5e5e5e}.home .sidebar{display:flex;align-items:center;justify-content:space-between;flex-direction:column;background-color:#fff;width:60px;height:100%;padding:20px 5px}.home .sidebar .logo{display:flex;align-items:center;justify-content:center}.home .sidebar .logo img{height:30px}.home .sidebar .sidebarMenu{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px}.home .sidebar .sidebarMenu .sidebarIcon{font-size:1.5rem;color:#9474f4;cursor:pointer;transition:all .3s ease-in-out}.home .sidebar .sidebarMenu .sidebarIcon:hover{color:#7247f3}.home .sidebar .sidebarUser{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:20px}.home .sidebar .sidebarUser .userSignOut{font-size:1.5rem;color:#9474f4;cursor:pointer;transition:all .3s ease-in-out}.home .sidebar .sidebarUser .userSignOut:hover{color:#7247f3}.home .sidebar .sidebarUser .userImg{width:40px;height:40px;border-radius:50%;border:2px solid #9474f4;object-fit:cover}.home .chatsContainer{display:flex;align-items:center;justify-content:flex-start;flex-direction:column;width:30%;background-color:#f2efff;height:100%;padding:20px 10px;overflow-y:auto}.home .chatsContainer .searchbar{display:flex;align-items:center;justify-content:flex-start;flex-direction:column;width:100%}.home .chatsContainer .searchbar .searchForm{display:flex;align-items:center;justify-content:center;flex-direction:row;width:100%;height:60px;background-color:#fff;border-radius:20px;padding:10px 20px;margin-bottom:10px;box-shadow:0 5px 10px #0909091a}.home .chatsContainer .searchbar .searchForm input[type=text]{width:100%;height:100%;border:none;outline:none;background-color:transparent;font-size:1rem;font-weight:500;color:#5e5e5e;margin-left:10px}.home .chatsContainer .searchbar .searchForm input[type=text]::placeholder{font-size:1rem;font-weight:400;color:#5e5e5e;font-style:italic}.home .chatsContainer .searchbar .searchForm .searchIcon{font-size:1.5rem;color:#9474f4;cursor:pointer;transition:all .3s ease-in-out}.home .chatsContainer .searchbar .searchForm .searchIcon:hover{color:#7247f3}.home .chatsContainer .searchbar .searchResult{display:flex;align-items:center;justify-content:flex-start;flex-direction:column;width:100%;height:100%;padding:auto;margin-bottom:10px}.home .chatsContainer .searchbar .searchResult .searchResultUser{display:flex;align-items:center;justify-content:space-between;width:100%;height:80px;background-color:#9474f4;color:#fafafa;border-radius:20px;padding:10px 20px;gap:10px;cursor:pointer}.home .chatsContainer .searchbar .searchResult .searchResultUser .searchResultUserImg{width:60px;height:60px;border-radius:50%;border:2px solid #fafafa;object-fit:cover}.home .chatsContainer .searchbar .searchResult .searchResultUser .searchResultUserInfo{display:flex;align-items:flex-start;justify-content:center;flex-direction:column}.home .chatsContainer .searchbar .searchResult .searchResultUser .searchResultUserInfo .searchResultUserName{font-size:1rem;font-weight:600;color:#fafafa}.home .chatsContainer .searchbar .searchResult .searchResultUser .searchResultUserInfo .searchResultUserProfession{font-size:1rem;font-weight:400}.home .chatsContainer .searchbar .searchResult .searchResultUser .searchResultbuttons{display:flex;align-items:center;justify-content:center;flex-direction:row;gap:5px}.home .chatsContainer .searchbar .searchResult .searchResultUser .searchResultbuttons .searchResultbutton{font-size:1.1rem;color:#fafafa;cursor:pointer}.home .chatsContainer ::-webkit-scrollbar{width:0px}.home .chatsContainer .chatsList{display:flex;justify-content:flex-start;flex-direction:column;width:100%;height:100%;gap:10px;padding:10px 0;overflow-y:scroll}.home .chatsContainer .chatsList .chatTitle{font-size:.8rem;font-weight:600;color:#9474f4}.home .chatsContainer .chatsList .chatCard{display:flex;align-items:center;justify-content:space-between;width:100%;height:90px;background-color:#fff;border-radius:20px;padding:10px 20px;gap:10px;cursor:pointer;transition:all .3s ease-in-out}.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{display:flex;align-items:center;justify-content:center;flex-direction:row;gap:20px}.home .chatsContainer .chatsList .chatCard .chatUserInfo .chatUserImg{width:70px;height:70px;border-radius:50%;border:2px solid #9474f4;object-fit:cover}.home .chatsContainer .chatsList .chatCard .chatUserInfo .chatContent{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;text-align:left;gap:10px}.home .chatsContainer .chatsList .chatCard .chatUserInfo .chatContent .chatUser{display:flex;flex-direction:column;align-items:flex-start;text-align:left}.home .chatsContainer .chatsList .chatCard .chatUserInfo .chatContent .chatUser .chatUserName{font-size:1rem;font-weight:600;color:#9474f4}.home .chatsContainer .chatsList .chatCard .chatUserInfo .chatContent .chatUser .chatUserProfession{font-size:.7rem;font-weight:500;color:#5e5e5e}.home .chatsContainer .chatsList .chatCard .chatUserInfo .chatContent .chatLastMessage{font-size:.8rem;font-weight:500;color:#5e5e5e}.home .chatsContainer .chatsList .chatCard .chatUserDetails{display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;gap:10px}.home .chatsContainer .chatsList .chatCard .chatUserDetails .timestamp{font-size:.6rem;font-weight:500;color:#5e5e5e}.home .chatsContainer .chatsList .chatCard .chatUserDetails .button{font-size:1.5rem;color:#9474f4;cursor:pointer;transition:all .3s ease-in-out}.home .chatsContainer .chatsList .chatCard .chatUserDetails .button:hover{color:#7247f3}.home .chat{display:flex;align-items:center;justify-content:space-between;flex-direction:column;width:70%;height:100%;background-color:#f4f4fa;padding:20px 10px;overflow-y:auto}.home .chat ::-webkit-scrollbar{width:5px}.home .chat ::-webkit-scrollbar-track{background:transparent}.home .chat .chatHeader{display:flex;align-items:center;justify-content:space-between;width:100%;height:80px;background-color:#fff;border-radius:20px;padding:10px 20px}.home .chat .chatHeader .chatUser{display:flex;align-items:center;justify-content:center;gap:10px;flex-direction:row}.home .chat .chatHeader .chatUser .chatImg{width:60px;height:60px;border-radius:50%;border:2px solid #9474f4;object-fit:cover}.home .chat .chatHeader .chatUser .chatImg[data-online=true]{border:2px solid #00ff00}.home .chat .chatHeader .chatUser .chatImg[data-online=false]{border:2px solid #ff0000}.home .chat .chatHeader .chatUser .chatInfo{display:flex;justify-content:center;flex-direction:column;gap:10px}.home .chat .chatHeader .chatUser .chatInfo .chatName{font-size:1rem;font-weight:600;color:#9474f4}.home .chat .chatHeader .chatUser .chatInfo .chatStatus{font-size:.8rem;font-weight:500;color:#5e5e5e}.home .chat .chatHeader .chatActions{display:flex;align-items:center;justify-content:center;gap:5px}.home .chat .chatHeader .chatActions .chatAction button{font-size:1rem;color:#9474f4;cursor:pointer;transition:all .3s ease-in-out}.home .chat .chatHeader .chatActions .chatAction button:hover{color:#7247f3}.home .chat .Messages{display:flex;justify-content:flex-start;flex-direction:column;width:100%;height:100%;padding:20px 10px;gap:20px;overflow-y:auto}.home .chat .Messages .noMessages{text-align:center;margin-top:25%;opacity:.5}.home .chat .Messages .message{display:flex;flex-direction:row;align-items:center;gap:20px}.home .chat .Messages .message.Sender{flex-direction:row-reverse}.home .chat .Messages .message.Sender>.SenderInfo{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px}.home .chat .Messages .message.Sender>.SenderInfo .SenderImg{width:40px;height:40px;border:2px solid #9474f4;border-radius:50%;object-fit:cover}.home .chat .Messages .message.Sender>.SenderInfo .timestamp{font-size:.7rem;font-weight:500;color:#5e5e5e}.home .chat .Messages .message.Sender>.messageContent{display:flex;flex-direction:column;align-items:center;justify-content:center;max-width:50%;word-break:break-word}.home .chat .Messages .message.Sender>.messageContent .messageText{display:flex;align-items:center;justify-content:center;flex-direction:column;padding:10px 20px;background-color:#9474f4;color:#fafafa;border-radius:10px 10px 0;font-size:1rem;font-weight:500;line-height:1.6;width:fit-content}.home .chat .Messages .message.Sender>.messageContent .messageImg{width:100%;height:200px;border-radius:10px;object-fit:contain}.home .chat .Messages .message.Receiver>.ReceiverInfo{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px}.home .chat .Messages .message.Receiver>.ReceiverInfo .ReceiverImg{width:40px;height:40px;border:2px solid #9474f4;border-radius:50%;object-fit:cover}.home .chat .Messages .message.Receiver>.ReceiverInfo .timestamp{font-size:.7rem;font-weight:500;color:#5e5e5e}.home .chat .Messages .message.Receiver>.messageContent{display:flex;flex-direction:column;align-items:center;justify-content:center;max-width:50%;word-break:break-word}.home .chat .Messages .message.Receiver>.messageContent .messageText{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:5px;padding:10px 20px;background-color:#fff;box-shadow:#0000001a 0 8px 10px;border-radius:10px 10px 10px 0;font-size:1rem;font-weight:500;line-height:1.6;width:fit-content}.home .chat .Messages .message.Receiver>.messageContent .messageImg{width:100%;height:200px;border-radius:10px;object-fit:contain}.home .chat .chatInput{display:flex;align-items:flex-start;justify-content:center;flex-direction:column;width:100%;gap:10px;background-color:#fff;border-radius:20px;padding:20px;box-shadow:0 4px 10px #0909091a}.home .chat .chatInput form{width:100%;display:flex;align-items:center;justify-content:center;flex-direction:row;gap:10px}.home .chat .chatInput form .imgPreviewContainer{display:flex;justify-content:center;align-items:center;gap:5px}.home .chat .chatInput form .imgPreviewContainer .imgPreview{width:80px;height:100%;border-radius:5px;object-fit:cover}.home .chat .chatInput form .imgPreviewContainer .removeImgIcon{font-size:1.5rem;color:#9474f4;cursor:pointer;transition:all .3s ease-in-out}.home .chat .chatInput form .imgPreviewContainer .removeImgIcon:hover{color:#7247f3}.home .chat .chatInput .filePreviewContainer{display:flex;justify-content:flex-start;align-items:center;width:100%;gap:5px}.home .chat .chatInput .filePreviewContainer .fileNamePreview{font-size:1rem;font-weight:500;color:#5e5e5e}.home .chat .chatInput .filePreviewContainer .removeFileIcon{font-size:1.5rem;color:#9474f4;cursor:pointer;transition:all .3s ease-in-out}.home .chat .chatInput .filePreviewContainer .removeFileIcon:hover{color:#7247f3}.home .chat .inputBase{width:100%;height:100%;border:none;outline:none;background-color:transparent;font-size:1rem;font-weight:500;color:#5e5e5e;margin-left:10px}.home .chat .inputBase::placeholder{font-size:1rem;font-weight:500;color:#5e5e5e;font-style:italic}.home .chat .chatIcons{display:flex;align-items:center;justify-content:space-between;flex-direction:row;gap:10px;width:100%}.home .chat .chatIcons .chatOptions{display:flex;align-items:center;justify-content:center;gap:8px}.home .chat .chatIcons .chatOptions .chatIcon{font-size:1.5rem;color:#9474f4;transition:all .3s ease-in-out}.home .chat .chatIcons .chatOptions .chatIcon:hover{color:#7247f3}.home .chat .chatIcons .chatSend{display:flex;align-items:center;justify-content:center;flex-direction:row;gap:10px}.home .chat .chatIcons .chatSend .chatIcon{font-size:1.5rem;color:#9474f4;transition:all .3s ease-in-out}.home .chat .chatIcons .chatSend .chatIcon:hover{color:#7247f3}.home .chat .chatIcons .chatSend .chatIconSend{font-size:2rem;color:#fff;background-color:#9474f4;border-radius:50%;transition:all .3s ease-in-out}.home .chat .chatIcons .chatSend .chatIconSend:hover{background-color:#7247f3}