.home-page{display:flex;align-items:center;flex-direction:column;gap:150px}@media screen and (max-width: 400px){.home-page{gap:75px}}.home-page nav{display:flex;width:100%;justify-content:flex-end;padding:16px}.home-page nav a{padding:8px;font-size:var(--label-medium)}.home-page .welcome-container{display:flex;flex-grow:1;flex-direction:column;gap:24px;width:85%;max-width:800px}.home-page .welcome-container .website-title{font-size:var(--display);background:var(--primary-gradiant);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.home-page .welcome-container .website-description{font-size:var(--display-small);color:var(--on-background)}.home-page .welcome-container .get-started-btn-container{display:flex;justify-content:flex-end;margin-top:50px}.home-page .welcome-container .get-started-btn-container .get-started-btn{color:var(--primary);border-radius:8px;border:2px solid var(--primary);font-size:var(--label-medium);padding:12px 36px;background-color:transparent}.signup-page nav,.signin-page nav{display:flex;align-items:center;gap:16px;margin:16px;font-size:var(--body-medium)}.signup-page nav a,.signin-page nav a{display:flex;text-decoration:none;align-items:center;gap:2px;color:var(--primary);border:2px solid transparent;outline:none;transition:border .3s;padding:4px 8px;border-radius:4px}.signup-page nav a:focus-visible,.signin-page nav a:focus-visible{border:2px solid var(--on-background)}.signup-page .auth-container,.signin-page .auth-container{margin:132px auto 0;display:flex;flex-direction:column;gap:64px;width:90%;max-width:500px;padding-bottom:24px}@media screen and (max-width: 400px){.signup-page .auth-container,.signin-page .auth-container{margin-top:102px}}.signup-page .auth-container .title,.signin-page .auth-container .title{font-size:var(--display);color:var(--primary)}.signup-page .auth-container .inputs,.signin-page .auth-container .inputs{display:flex;flex-direction:column;gap:24px}.signup-page .auth-container .inputs a,.signin-page .auth-container .inputs a{outline:none;padding:8px;border-radius:8px;border:2px solid transparent;transition:border .3s}.signup-page .auth-container .inputs a:focus-visible,.signin-page .auth-container .inputs a:focus-visible{border:2px solid var(--on-background)}.signup-page .auth-container .inputs input,.signin-page .auth-container .inputs input{border:2px solid var(--primary);border-radius:8px;padding:16px 24px;background-color:transparent;color:var(--on-background);font-size:var(--body-large);transition:border .3s}.signup-page .auth-container .inputs input:focus-visible,.signin-page .auth-container .inputs input:focus-visible{border:2px solid #00a155}.signup-page .auth-container .next-button,.signin-page .auth-container .next-button{background-color:var(--surface);color:var(--on-surface);padding:12px 36px;margin-left:auto;border-radius:8px;font-size:var(--label-small);cursor:pointer;border:none;transition:border .3s;border:2px solid transparent}.signup-page .auth-container .next-button:disabled,.signin-page .auth-container .next-button:disabled{background-color:#424242;color:var(--on-background);cursor:default}.signup-page .auth-container .next-button:focus-visible,.signin-page .auth-container .next-button:focus-visible{border:2px solid var(--on-background)}.chat-page{display:flex;flex-direction:column;align-items:center;gap:8px}.chat-page .header{display:flex;gap:24px;background-color:var(--background);color:var(--on-background);width:100%}.chat-page .header .menu-icon{display:flex;position:fixed;z-index:100;top:16px;left:16px}.chat-page .header .menu-icon svg{font-size:var(--label-large);color:var(--primary);cursor:pointer}@media screen and (max-width: 400px){.chat-page .header{gap:24px}}.chat-page .header .info{flex-basis:100%;font-size:var(--label);display:flex;align-items:center;justify-content:center;gap:16px;height:56px}.chat-page .empty-messages-placeholder{display:flex;flex-grow:1;align-items:center;font-size:var(--label-large)}.chat-page .loading-messages{display:flex;flex-direction:column;flex-grow:1;justify-content:center;font-size:var(--label-medium)}.chat-page .loading-messages .loading{width:80%;max-width:360px;height:4px;background-color:var(--background);border-radius:8px;overflow:hidden;margin:8px 0}.chat-page .loading-messages .loading:after{animation:loading 1s cubic-bezier(.18,-.14,.76,1.1) infinite;background-color:var(--primary);width:60%;height:inherit;content:"";display:block;border-radius:8px}@keyframes loading{0%{transform:translate(-140%)}to{transform:translate(170%)}}.chat-page .messages-container{padding:0 16px;max-width:620px;color:var(--on-background);width:100%;display:flex;flex-grow:1;scroll-behavior:smooth;flex-direction:column-reverse;overflow-y:scroll;overflow-x:hidden}@media screen and (min-width: 400px){.chat-page .messages-container{padding:0 8px 24px}}.chat-page .inputs-container{width:100%;max-width:620px;display:flex;gap:24px;margin-bottom:24px}.chat-page .inputs-container .message-input{flex-grow:1;border-radius:16px;background-color:transparent;border:2px solid var(--primary);color:var(--on-background);font-size:var(--body-large);padding:14px 24px 18px;outline:none;transition:border .3s;resize:none;height:56px}.chat-page .inputs-container .message-input:focus-visible{border:2px solid #00a155}@media screen and (max-width: 600px){.chat-page .inputs-container{margin-bottom:0;flex-direction:column-reverse;gap:0;padding:8px;align-items:flex-end;width:100%}.chat-page .inputs-container .message-input{border-radius:4px;width:100%}}.chat-page .inputs-container .send-btn{width:52px;height:52px;min-width:52px;min-height:52px;border-radius:50%;padding:8px;background:var(--primary-gradiant);color:var(--on-primary);font-size:var(--label-large);display:flex;align-items:center;justify-content:center;border:2px solid var(--background);cursor:pointer}@media screen and (max-width: 600px){.chat-page .inputs-container .send-btn{margin-bottom:-16px;z-index:1}}.chat-page .inputs-container .send-btn .spinner{width:80%;height:80%;max-width:24px;max-height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:2px solid transparent;border-top:2px solid black;border-bottom:2px solid black;animation:spin 2s linear infinite,fade .3s}.chat-page .inputs-container .send-btn .spinner:after{width:50%;height:50%;content:"";display:block;background-color:#000;animation:spin 1.5s linear infinite}@keyframes fade{0%{opacity:0}to{opacity:1}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.chat-menu-container{position:fixed;z-index:2;width:100%;height:100%}.chat-menu-container .scrim{width:100%;height:100%;background-color:#0009;position:fixed}.chat-menu-container .chat-menu{overflow:hidden;position:fixed;width:280px;display:flex;flex-direction:column;gap:24px;padding:24px;background-color:var(--background);color:var(--on-background);justify-content:space-between;height:100%}@media screen and (max-width: 400px){.chat-menu-container .chat-menu{width:100%}.chat-menu-container .chat-menu .users-status-container{overflow-y:scroll}}.chat-menu-container .chat-menu .users-status-container{display:flex;flex-direction:column;gap:12px;margin-top:50px}.chat-menu-container .chat-menu .users-status-container .signedin-user{font-size:var(--label-large);margin-bottom:16px}.chat-menu-container .chat-menu .users-status-container .users-status{display:flex;flex-direction:column;gap:8px;font-size:var(--body-medium)}.chat-menu-container .chat-menu .users-status-container .users-status .user-status{display:flex;align-items:center;gap:6px}.chat-menu-container .chat-menu .users-status-container .users-status .status-dot{width:6px;height:6px;border-radius:24px;background-color:var(--surface-variant)}.chat-menu-container .chat-menu .users-status-container .users-status .status-dot.online{background-color:#00ca00}.chat-menu-container .chat-menu .logout-button-container{display:flex;justify-content:flex-end}.chat-menu-container .chat-menu .logout-button-container .logout-button{display:flex;align-items:center;gap:8px;cursor:pointer;padding:8px}.chat-menu-container .chat-menu .logout-button-container svg{width:20px;height:20px}.comment-container{width:100%;margin-bottom:4px}.comment-container .message{border-radius:8px;font-size:var(--body-medium);padding:12px 16px;max-width:90%;overflow-wrap:break-word;white-space:pre-wrap}.comment-container .others-comment{display:flex;flex-direction:column;gap:4px;align-items:flex-start}.comment-container .others-comment .username{padding:6px 16px;font-size:var(--body-small);border-radius:8px;background-color:var(--primary);color:var(--on-primary)}.comment-container .others-comment .message{background-color:var(--surface-variant);color:var(--on-surface-variant)}.comment-container .my-comment{display:flex;justify-content:flex-end}.comment-container .my-comment .message{background-color:var(--surface);color:var(--on-surface)}.alert-container{position:fixed;top:0;padding:16px 8px;width:100%}.alert{width:min(500px,95%);border-radius:4px;font-size:var(--body-medium);padding:16px;background-color:var(--background);border:2px solid var(--surface);color:var(--on-background);margin:0 auto}html,body,#root,.App,.page{height:100%;width:100%}body{margin:0;background-color:var(--background);font-family:Lexend,Vazirmatn}::-webkit-scrollbar{background-color:transparent;width:1px;border-radius:2px}::-webkit-scrollbar-thumb{background-color:gray;width:1px;border-radius:2px}a{color:var(--on-background);text-decoration:none}input,button,textarea{font-family:Lexend,Vazirmatn;outline:none}svg,button{-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:root{--background: #1a1a1a;--on-background: #f2f2f2;--primary: #fe0e82;--primary-gradiant: linear-gradient(to right, #fe0e81, #fc5bff);--on-primary: #131313;--surface: #6c26ff;--on-surface: #ffffff;--surface-variant: #ebebeb;--on-surface-variant: #000000;--display: 72px;--display-medium: 48px;--display-small: 32px;--label-small: 16px;--label-medium: 18px;--label-large: 28px;--body-large: 16px;--body-medium: 14px;--body-small: 12px}*{box-sizing:border-box}