.main-content{height:100%;width:100%;background-color:#c4e5cf;display:flex}.chat{flex-grow:1;background-color:#d9d9d9;display:flex;flex-direction:column;justify-content:center;align-items:center}.chat__header{position:relative;background-color:#88a892;height:100px;width:100%;text-align:center;line-height:100px;border-radius:0 0 5px 5px;box-shadow:0 2px 4px #00000040}.chat__header>h1{font-size:20px;font-style:italic;font-weight:500}.chat__header .header__menu-button{position:absolute;right:30px;top:36px;height:30px;width:30px;background-color:transparent;border:none}.chat__header .header__menu-button>img{width:100%;height:100%}.chat__header .header__menu-button:hover{cursor:pointer}.chat__messages-container{flex-grow:1;width:100%;display:flex;flex-direction:column;justify-content:end;padding:0 45px}.chat__messages-container .messages-container__day-messages{display:flex;flex-direction:column;width:100%}.chat__messages-container .messages-container__day-messages .day-messages__date-stamp{align-self:center;color:#999;font-size:12px;font-weight:500;margin-bottom:30px}.chat__messages-container .messages-container__day-messages .day-messages__message{position:relative;height:fit-content;min-width:125px;max-width:600px;padding:15px;background-color:#c4e5cf;margin-bottom:35px;font-size:12px;text-wrap:balance;text-align:start}.chat__messages-container .messages-container__day-messages .opponent{align-self:flex-start;border-radius:0 25px 5px}.chat__messages-container .messages-container__day-messages .user{align-self:flex-end;border-radius:5px 25px 0}.chat__messages-container .messages-container__day-messages .media{padding:0;background-color:transparent}.chat__footer{height:70px;width:100%;background:#88a892;border-radius:5px 5px 0 0;padding:0 30px}.chat__footer .footer__send-message-form{width:100%;height:100%;display:flex;justify-content:start;align-items:center}.chat__footer .footer__send-message-form .send-message-form__attach-file-button{background-color:transparent;border:none;margin-right:30px}.chat__footer .footer__send-message-form .send-message-form__attach-file-button:hover{cursor:pointer}.chat__footer .footer__send-message-form .app__main-input{flex-grow:1;height:40px;margin-top:0;margin-right:30px;font-size:16px}.chat__footer .footer__send-message-form .send-message-form__send-button{background-color:transparent;border:none}.chat__footer .footer__send-message-form .send-message-form__send-button:hover{cursor:pointer}.menu{height:100%;width:350px;border-right:1px solid rgba(0,0,0,.25);display:flex;flex-direction:column;justify-content:start}.menu__menu-header{width:100%;height:100px;min-height:100px;box-shadow:0 2px 4px #00000040;border-radius:0 0 5px 5px;padding:14px 28px;display:flex;align-items:center;justify-content:start}.menu__menu-header .menu-header__avatar{width:60px;height:60px;border-radius:5px;background-color:#d9d9d9;border:1px solid #02561E}.menu__menu-header .menu-header__avatar img{height:100%;width:100%;object-fit:cover}.menu__menu-header .menu-header__profile-name{margin-left:36px;font-size:20px;font-style:italic;font-weight:500}.menu__menu-search{width:100%;height:100px;min-height:100px;box-shadow:0 2px 4px #00000040;border-radius:0 0 5px 5px;display:flex;align-items:center;justify-content:start;height:40px;min-height:40px;padding:4px 8px}.menu__menu-search .app__main-input{margin:0;width:100%;height:100%;border-radius:10px;font-size:18px}.menu>.app__main-link{align-self:center}.chat-item{width:100%;height:100px;min-height:100px;box-shadow:0 2px 4px #00000040;border-radius:0 0 5px 5px;padding:14px 28px;display:flex;align-items:center;justify-content:start;height:80px;min-height:80px}.chat-item__avatar{width:50px;height:50px;border-radius:5px;background-color:#d9d9d9;border:1px solid #02561E;margin-right:20px}.chat-item__avatar img{height:100%;width:100%;object-fit:cover}.chat-item__chat-info{display:flex;flex-direction:column;justify-content:start;height:100%;width:180px;padding-right:20px}.chat-item__chat-info .chat-info__chat-name{font-size:18px;font-weight:400}.chat-item__chat-info .chat-info__last-message{flex-grow:1;display:-webkit-box;width:100%;max-width:100%;overflow:hidden;text-overflow:ellipsis;line-clamp:2;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:12px}.chat-item__messages-count{flex-grow:1;height:100%;display:flex;flex-direction:column;justify-content:space-between;align-items:center}.chat-item__messages-count .messages-count__time-stamp{font-size:12px}.chat-item__messages-count .messages-count__counter{width:25px;height:25px;border-radius:12.5px;background-color:#02561e;display:flex;justify-content:center;align-items:center;font-size:14px;font-weight:600;color:#fff}.chat-item__messages-count .messages-count__counter[class*=disabled]{visibility:hidden}.chat-item:hover{cursor:pointer;background-color:#a4d0b1}.chat-item[class*=active]{background-color:#02561e}.chat-item[class*=active] .main-content__menu_chat-item_messages-count_counter{background-color:#fff;color:#000}.profile{width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:#d9d9d9}.profile__header .header__profile-name{margin-top:48px;font-size:20px;font-weight:600;text-align:center}.profile__credentials{margin-top:66px;width:510px;font-weight:500}.profile__credentials>ul{width:100%;list-style:none;display:flex;flex-direction:column;gap:16px}.profile__credentials>ul .credentials__credentials-item{display:flex;justify-content:space-between}.profile__credentials>ul .credentials__credentials-item .credentials-item__value{color:#999}.profile__credentials>ul .credentials__credentials-item>span{font-size:16px}.profile__menu{margin-top:84px;width:510px;display:flex;flex-direction:column;justify-content:flex-start;gap:22px}.profile__menu>button{max-width:140px;background-color:transparent;border:none;font-size:13px;text-align:start;color:#0654e5}.profile__menu>button:hover{cursor:pointer;font-weight:700}.profile__menu .red{color:red}.profile .app__nav-button{position:absolute;left:40px;top:50%;transform:translate(-50%)}.not-found{width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;background-color:#d9d9d9}.not-found__logo{display:flex;flex-direction:column;justify-content:flex-start;align-items:center}.not-found__logo>h1{font-style:italic;font-weight:500;margin-top:48px}.not-found__500,.not-found__404{color:#999}.not-found__500>h2,.not-found__404>h2{font-size:128px;font-weight:600}.not-found__500>p,.not-found__404>p{font-size:64px;font-weight:600}.not-found>nav{margin-top:48px;font-size:20px;font-weight:700}.bad-server{width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;background-color:#d9d9d9}.bad-server__logo{display:flex;flex-direction:column;justify-content:flex-start;align-items:center}.bad-server__logo>h1{font-style:italic;font-weight:500;margin-top:48px}.bad-server__500,.bad-server__404{color:#999}.bad-server__500>h2,.bad-server__404>h2{font-size:128px;font-weight:600}.bad-server__500>p,.bad-server__404>p{font-size:64px;font-weight:600}.bad-server>nav{margin-top:48px;font-size:20px;font-weight:700}.preview-page__links{min-height:fit-content;height:630px;width:630px;border-radius:15px;box-shadow:0 4px 4px #00000040;background-color:#d9d9d9;padding:10px 30px;display:flex;flex-direction:column;justify-content:start;align-items:center;justify-content:center;gap:20px}.preview-page__links li{list-style-type:none;min-width:150px;text-align:center}.preview-page__links li a{text-decoration:none;color:#000}.preview-page__links li a:hover{color:#02561e;cursor:pointer}.preview-page__links li a:focus{outline:none;text-decoration:underline}*{box-sizing:border-box;font-family:Inter,sans-serif;margin:0;padding:0}#app{height:100vh;width:100vw;display:flex;justify-content:center;align-items:center}.app__main-button{background-color:#02561e;border:1px solid black;border-radius:8px;min-width:150px;min-height:50px;padding:10px 45px;margin-top:20px;font:inherit;color:#fff;font-weight:300;font-size:16px}.app__main-button:hover{cursor:pointer;color:#c4e5cf}.app__main-button:focus{outline:1px solid black}.app__main-link{color:#0654e5;font-size:13px;text-decoration:none;margin-top:10px}.app__main-link:hover{cursor:pointer;font-weight:700}.app__main-link:focus{outline:none;text-decoration:underline}.app__main-input{height:35px;width:220px;border-radius:25px;border:none;padding:5px 15px;margin-top:10px;font-family:inherit;font-size:13px}.app__main-input:focus{outline:none}.app__invalid-input{width:220px;padding-left:14px;margin-top:2px;font-size:11px;color:red}.shown{visibility:visible;opacity:1}.hidden{visibility:hidden;opacity:0;position:absolute}.app__main-logo{margin-top:30px}.app-timestamp{color:#999;position:absolute;font-size:9px;bottom:10px;right:10px}.app__nav-button{border:none;background-color:transparent}.app__nav-button:hover{cursor:pointer}#modal{visibility:hidden;opacity:0}#modal .modal__overlay{position:absolute;width:100%;height:100%;top:50%;left:50%;background-color:#00000039;z-index:9900;transform:translate(-50%,-50%)}#modal .modal__overlay:hover{cursor:pointer}#modal .modal__content{width:100%;height:100px;box-shadow:0 2px 4px #00000040;padding:14px 28px;display:flex;align-items:center;justify-content:start;width:fit-content;height:fit-content;min-width:100px;min-height:100px;background-color:#d9d9d9;border-radius:10px;position:absolute;top:50%;left:50%;z-index:9999;transform:translate(-50%,-50%)}#modal.opened{visibility:visible;opacity:1;transition:opacity .2s ease-in}.credentials__form{height:fit-content;display:flex;flex-direction:column;justify-content:center;align-items:center}.credentials__form .app__main-button{font-size:13px;min-width:100px;min-height:30px}.credentials__form .app__file-input{opacity:0;visibility:hidden;position:absolute}.credentials__form .app__file-input-button:hover{cursor:pointer}.authorization{min-height:fit-content;height:630px;width:630px;border-radius:15px;box-shadow:0 4px 4px #00000040;background-color:#d9d9d9;padding:10px 30px;display:flex;flex-direction:column;justify-content:start;align-items:center}.authorization__auth-form{height:fit-content;display:flex;flex-direction:column;justify-content:center;align-items:center}