@import url(https://fonts.googleapis.com/css2?family=Merriweather+Sans:wght@300;400;700;800&display=swap);body,html{overflow-x:hidden;position:relative}html{min-height:100%}body{background-color:#000;font-family:Merriweather Sans,sans-serif;margin:0;overflow-x:hidden}#root{background-color:#4e426d;width:100%}button{background-color:#fff;border-radius:10px;border-style:solid;font-size:16px;padding:5px;width:-moz-fit-content;width:-webkit-fit-content;width:fit-content}*{box-sizing:border-box}.login,.register{display:flex;height:-moz-fit-content;height:-webkit-fit-content;height:fit-content;justify-content:center;margin-left:auto;width:100%}@media(max-width:900px){.login,.register{flex-direction:column}}.login .logo-display,.register .logo-display{align-items:center;background-color:#5c4f81;box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;min-height:100vh;padding:60px 0;width:100%}.login .logo-display .img-container,.register .logo-display .img-container{height:230px;width:230px}.login .logo-display img,.register .logo-display img{-webkit-filter:invert(1);filter:invert(1);height:230px;width:230px}.login .logo-display img:hover,.register .logo-display img:hover{cursor:pointer}.login .logo-display h1,.register .logo-display h1{color:#fff;font-size:54px;margin:20px 0 0}.login .logo-display>img:last-child,.register .logo-display>img:last-child{display:none;height:50px;margin-top:30px}@media(max-width:900px){.login .logo-display>img:last-child,.register .logo-display>img:last-child{display:block}}.login .auth,.register .auth{-webkit-animation:slide-in-right 1s;animation:slide-in-right 1s;background-color:#4e426d;box-sizing:border-box;color:#fff;display:flex;flex:1 1;flex-direction:column;gap:30px;justify-content:center;min-height:100vh;min-width:60%;padding:60px;position:relative;right:0}@media(max-width:900px){.login .auth,.register .auth{-webkit-animation:slide-in-right-mobile 1s;animation:slide-in-right-mobile 1s}}.login .auth h1,.register .auth h1{font-size:35px;font-weight:400;margin:0}.login .auth form,.register .auth form{display:flex;flex-direction:column;gap:10px}.login .auth form div,.register .auth form div{display:flex;flex-direction:column}.login .auth form label,.register .auth form label{font-size:16px;font-weight:700}.login .auth form input,.register .auth form input{align-self:center;background-color:transparent;background-color:#fff;border:none;border-radius:3px;color:#000;height:30px;outline:none;padding:6px;width:100%}.login .auth form button,.register .auth form button{background-color:transparent;border:none;color:#fff;margin-left:auto;width:-moz-fit-content;width:-webkit-fit-content;width:fit-content}.login .auth form button:hover,.register .auth form button:hover{text-decoration:underline}.login .auth form button:last-child,.register .auth form button:last-child{background-color:#efaa86;border:none;border-radius:5px;font-weight:700;height:40px;margin-top:30px;width:100%}.login .auth button:hover,.register .auth button:hover{cursor:pointer}.login .auth p,.register .auth p{margin:0;padding-top:5px}@-webkit-keyframes slide-in-right{0%{right:-60%}to{right:0}}@keyframes slide-in-right{0%{right:-60%}to{right:0}}@-webkit-keyframes slide-in-right-mobile{0%{right:-100%}to{right:0}}@keyframes slide-in-right-mobile{0%{right:-100%}to{right:0}}.chat-sidebar{background-color:#4e426d;box-sizing:border-box;direction:rtl;display:flex;flex-direction:column;gap:30px;height:750px;overflow-x:hidden;width:max(300px,25%)}.chat-sidebar .add-chat{display:flex;flex-direction:column;position:-webkit-sticky;position:sticky;top:0}.chat-sidebar .add-chat .add-chat-header{align-items:center;border-bottom:1.5px solid #fff;box-sizing:border-box;display:flex;gap:10px;height:80px;justify-content:center;margin-top:10px}.chat-sidebar .add-chat .add-chat-header h2{align-items:center;display:flex;font-size:30px;font-weight:800;justify-content:center;margin:0;text-align:center}.chat-sidebar .add-chat .add-chat-header img{-webkit-filter:invert(1);filter:invert(1);height:25px;width:25px}.chat-sidebar .add-chat .add-chat-header:hover{cursor:pointer}.chat-sidebar .add-chat .add-chat-buttons{overflow-y:hidden}.chat-sidebar .add-chat button:hover{background-color:hsla(0,0%,100%,.1);cursor:pointer}.chat-sidebar .add-chat button{background-color:transparent;border:0;border-bottom:1.5px solid #fff;border-radius:0;color:#fff;height:80px;width:100%}.chat-sidebar .chat-form-container{display:flex;gap:30px}@media(max-width:500px){.chat-sidebar .chat-form-container{align-self:center;flex-direction:column}}@media(max-width:800px){.chat-sidebar{max-width:none;min-width:0;width:100%}}.chat-list-container .chat-list{background-color:#5c4f81;border-radius:20px;direction:ltr;height:630px;list-style:none;margin:auto 0 0;overflow-y:scroll;padding:10px}.chat-list-container .chat-list .chat:hover{background-color:hsla(0,0%,100%,.1);cursor:pointer}.chat-list-container .chat-list .chat:last-child{border-bottom:none!important}.chat-list-container .chat-list .chat{border-bottom:1px solid hsla(0,0%,100%,.5);display:flex;flex-direction:column;height:80px;justify-content:center;padding:10px}.chat-list-container .chat-list .chat h3{font-weight:400;margin:0;overflow:hidden;text-overflow:ellipsis}.chat-list-container .chat-list .chat p{font-weight:300;margin:0;overflow:hidden;overflow-x:hidden;text-overflow:ellipsis;white-space:nowrap}.chat-list-container .chat-list::-webkit-scrollbar{width:2px}.chat-list-container .chat-list::-webkit-scrollbar-thumb{background:#fff;border-radius:10px}.add-chat-forms{background-color:#5c4f81;border-radius:20px;direction:ltr;display:flex;flex-direction:column;height:630px;justify-content:space-around;list-style:none;margin:auto 0 0;padding:10px}.add-chat-forms .chat-form{align-items:center;display:flex;flex-direction:column;gap:10px;justify-content:center}.add-chat-forms .chat-form h1{align-items:center;display:flex;font-size:30px;height:80px;justify-content:center;margin:0;width:100%}.add-chat-forms .chat-form form{display:flex;flex-direction:column;gap:10px}.add-chat-forms .chat-form form div{display:flex;flex-direction:column;gap:5px;max-width:175px}.add-chat-forms .chat-form form input{align-self:center;background-color:transparent;border:1.5px solid #fff;color:#fff;height:30px;width:100%}.add-chat-forms .chat-form form input,.add-chat-forms .chat-form form label{font-size:20px}.add-chat-forms .chat-form button{background-color:transparent;border:1.5px solid #fff;border-radius:0;color:#fff;width:-moz-fit-content;width:-webkit-fit-content;width:fit-content;width:100%}.add-chat-forms .chat-form button:hover{cursor:pointer}.add-chat-forms .chat-form p{margin:0;padding-bottom:10px;text-align:center}.current-chat{align-items:center;background-color:#5c4f81;border-radius:20px;box-sizing:border-box;display:flex;flex-direction:column;height:750px;padding:10px 20px;width:75%}@media(max-width:800px){.current-chat{width:100%}}.current-chat>div{align-items:center;border-bottom:1.5px solid #fff;display:flex;gap:10px;height:80px;justify-content:center;width:100%}.current-chat>div h1{font-size:40px;font-weight:800;line-height:80px;margin:0;text-align:center}.current-chat>div img{-webkit-filter:invert(1);filter:invert(1);height:25px;width:25px}.current-chat>div:hover{cursor:pointer}.current-chat .chatbox{border-top-left-radius:20px;border-top-right-radius:20px;box-sizing:border-box;display:flex;flex-direction:column-reverse;height:95%;list-style:none;margin:0;overflow-y:scroll;padding:30px 0 0;width:95%}.current-chat .chatbox .messages-container{display:flex;flex-direction:column;gap:40px}.current-chat .chatbox .messages-container .user-message{align-self:flex-end;flex-direction:row-reverse;margin-left:auto;text-align:right}.current-chat .chatbox .messages-container .user-message .user-profile-picture{background-color:#efaa86!important}.current-chat .chatbox .messages-container .user-message .message-info{flex-direction:row-reverse}.current-chat .chatbox .messages-container .user-message .message-content{background-color:#efaa86!important}.current-chat .chatbox .messages-container .user-message .user-profile-picture{margin-left:auto}.current-chat .chatbox .messages-container .message{display:flex;gap:10px;max-width:80%;min-width:40%;width:-moz-fit-content;width:-webkit-fit-content;width:fit-content}@media(max-width:600px){.current-chat .chatbox .messages-container .message{min-width:100%}}.current-chat .chatbox .messages-container .message .user-profile-picture{background-color:#4e426d;border-radius:75px;height:75px;margin:0;min-width:75px;width:75px}.current-chat .chatbox .messages-container .message .message-info{align-items:center;display:flex;flex-wrap:wrap;gap:5px;height:-moz-fit-content;height:-webkit-fit-content;height:fit-content}.current-chat .chatbox .messages-container .message .message-info h4{font-size:26px;font-weight:400;margin:0}.current-chat .chatbox .messages-container .message .message-info .message-date{font-size:12px;font-weight:300;margin-bottom:-9px}.current-chat .chatbox .messages-container .message .message-content-container{display:flex;flex-direction:column;gap:8px;margin-top:15px}.current-chat .chatbox .messages-container .message .message-content-container .message-content{background-color:#43385d;border-radius:10px;display:flex;flex-direction:column;gap:10px;padding:12px}.current-chat .chatbox .messages-container .message .message-content-container .message-content p{font-weight:400;line-height:25px}.current-chat .chatbox .messages-container .message .user-image{align-self:center;height:auto;max-width:400px;width:100%}.current-chat .chatbox .messages-container .message p{font-weight:300;margin:0;overflow:hidden;text-overflow:ellipsis}.current-chat .message-form{align-items:center;background-color:#5c4f81;border-bottom-left-radius:20px;border-bottom-right-radius:20px;display:flex;min-height:80px;width:90%}.current-chat .message-form form{display:flex;gap:15px;width:100%}.current-chat .message-form form #message{align-self:center;background-color:transparent;background-color:#fff;border:none;border-radius:20px;color:#000;height:30px;outline:none;padding:10px;width:100%}.current-chat .message-form form ::-webkit-file-upload-button{display:none}.current-chat .message-form form div #messageImage{display:none}.current-chat .message-form form div label{align-items:center;border:1.5px solid #fff;display:flex;font-size:12px;font-weight:300;height:100%;justify-content:center;min-width:60px;text-align:center}.current-chat .message-form form div .image-input:hover{cursor:pointer}.current-chat .message-form form button{background-color:transparent;border:1.5px solid #fff;border-radius:0;color:#fff;font-weight:300;width:100px}.current-chat .message-form form button:hover{background-color:hsla(0,0%,100%,.1);cursor:pointer}.current-chat .chat-info{display:flex;flex-direction:column;height:100%;overflow-y:auto;width:100%}.current-chat .chat-info p{width:-moz-fit-content;width:-webkit-fit-content;width:fit-content}.current-chat .chat-info button{margin-left:auto;margin-top:auto}.chatbox::-webkit-scrollbar{width:2px}.chatbox::-webkit-scrollbar-thumb{background:#fff;border-radius:10px}.sidebar-chat-container{display:flex;flex:1 1;gap:20px;padding:0 20px}@media(max-width:800px){.sidebar-chat-container{flex-direction:column}}nav{background-color:#4e426d;display:flex;height:120px;padding:20px}@media(max-width:600px){nav{flex-direction:column;gap:25px;height:-moz-fit-content;height:-webkit-fit-content;height:fit-content}}nav .logo{align-items:center;display:flex;gap:20px;height:100%;justify-content:center;min-width:300px;width:25%}@media(max-width:800px){nav .logo{justify-content:start;min-width:0;width:-moz-fit-content;width:-webkit-fit-content;width:fit-content}}nav .logo h1{font-weight:400}nav .logo img{-webkit-filter:invert(1);filter:invert(1);height:85%;width:auto}@media(max-width:600px){nav .logo img{height:60px;width:auto}}nav .user-info{display:flex;gap:10px;min-width:275px;width:100%}nav .user-info .user-greeting{display:flex;flex-direction:column;justify-content:center;margin-left:auto}nav .user-info .user-greeting h2{font-weight:300;margin:0}nav .user-info .user-greeting p{color:hsla(0,0%,100%,.8);font-weight:300;margin:0 0 0 auto;width:-moz-fit-content;width:-webkit-fit-content;width:fit-content}nav .user-info .user-greeting p:hover{cursor:pointer;text-decoration:underline}nav .user-info .profile-image{align-items:center;display:flex;flex-direction:column;gap:5px;justify-content:center}nav .user-info .profile-image form{align-items:flex-end;display:flex;flex-direction:column;justify-content:center;width:-moz-fit-content;width:-webkit-fit-content;width:fit-content}nav .user-info .profile-image form input[type=file]{display:none}nav .user-info .profile-image form button{background:none;border:none;color:#fff;font-weight:400}nav .user-info .profile-image form button:hover{cursor:pointer;text-decoration:underline}nav .user-info .profile-image form label{position:relative}nav .user-info .profile-image form label p{align-items:center;background-color:#000;border-radius:75px;color:#fff;display:flex;font-size:14px;justify-content:center;left:0;margin:0;min-height:75px;opacity:0;padding:10px;position:absolute;text-align:center;top:0;transition:all .25s;width:75px}nav .user-info .profile-image form label p:hover{cursor:pointer;opacity:.75}nav .user-info .profile-image form label img{border-radius:75px;height:75px;width:75px}.main{box-sizing:border-box;color:#fff;display:flex;flex-direction:column;padding-bottom:20px;width:100%}
/*# sourceMappingURL=main.ce85aa5c.css.map*/