@import"https://fonts.googleapis.com/css2?family=Inter:opsz,wght@14..32,400..600&display=swap";:root{--main-color: #1e1e1e;--primary-color: #3369f3;--white-color: #ffffff;--error-color: #ff0000;--secondary-color-100: #fbfbfb;--secondary-color-200: #efefef;--secondary-color-300: #eaeaea;--secondary-color-400: #999999;--secondary-color-500: #52525280;--selection-color-100: #f8f8f8;--selection-color-200: #e4edfd}*{border:none}body{font-family:Inter,sans-serif;font-weight:500;font-size:13px;line-height:13px;color:var(--main-color);margin:0}h1{font-family:Inter,sans-serif;font-weight:500;font-size:40px;line-height:40px;color:var(--main-color);margin:10px}h2{font-family:Inter,sans-serif;font-weight:500;font-size:20px;line-height:20px;color:var(--main-color);margin:10px}.main-layout{display:flex;align-items:center;justify-content:center;width:100%;height:100vh;box-sizing:border-box}.chat-layout{display:grid;width:100%;height:100vh;grid-template-columns:310px auto;box-sizing:border-box;overflow:hidden}.chat-layout__sidebar{display:flex;flex-direction:column;padding:10px 0;box-sizing:border-box;background-color:var(--secondary-color-100);border:1px solid var(--secondary-color-300)}.chat-layout__chat{height:100%;overflow:hidden;box-sizing:border-box}.chat-layout .empty-message{display:flex;align-items:center;justify-content:center;height:100%;font-family:Inter,sans-serif;font-weight:500;font-size:12px;line-height:12px;color:var(--secondary-color-400)}.login__card{width:340px;height:460px}.signin__card{width:340px;height:615px}.profile{display:grid;grid-template-columns:64px auto;height:100vh;box-sizing:border-box}.profile__return-btn{display:flex;align-items:center;justify-content:center;background-color:var(--secondary-color-100);border-right:1px solid var(--secondary-color-300)}.profile__return-icon{width:28px;aspect-ratio:1;display:flex;align-items:center;justify-content:center;border-radius:50%;background-color:var(--primary-color);color:var(--white-color)}.profile__body{display:flex;flex-direction:column;justify-content:center;align-items:center;width:510px;gap:60px}.profile__avatar{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:21px}.profile__name{font-family:Inter,sans-serif;font-weight:600;font-size:16px;line-height:16px;color:var(--main-color)}.profile__info,.profile__actions{display:flex;flex-direction:column;width:100%}.system-message{display:flex;flex-direction:column}.system-message__content{display:flex;flex-direction:column;justify-content:start;align-items:center}.system-message__actions{display:flex;flex-direction:column;align-items:center;justify-content:end;height:80px}.chats-list{display:flex;flex-direction:column}.sidebar{display:flex;flex-direction:column;overflow:hidden}.sidebar__body{scrollbar-width:thin;scrollbar-color:rgba(136,136,136,.6235294118) transparent;overflow:auto;flex-grow:1 0}.sidebar__body::-webkit-scrollbar{width:2px}.sidebar__body::-webkit-scrollbar-track{background:transparent}.sidebar__body::-webkit-scrollbar-thumb{background:#8888889f;border-radius:1px}.sidebar__body::-webkit-scrollbar-button{display:none}.user-panel{padding:10px}.user-panel__btn{font-family:Inter,sans-serif;font-weight:500;font-size:12px;line-height:12px;color:var(--secondary-color-400);margin:0 0 0 auto;display:flex;align-items:center;justify-content:end;background-color:inherit}.user-panel__icon{color:var(--secondary-color-400)}.chats-search{padding:10px}.chats-search__input{width:100%;height:32px;padding:10px;box-sizing:border-box;border-radius:5px;outline:0;background-color:var(--secondary-color-200);font-family:Inter,sans-serif;font-weight:500;font-size:12px;line-height:12px;color:var(--main-color)}.chats-search__input::placeholder{text-align:center}.chat-list-item{height:70px;box-sizing:border-box;padding:12px 10px;display:flex}.chat-list-item_active{background-color:var(--selection-color-200)}.chat-list-item__content{display:flex;flex-direction:column;flex:1 0;padding:0 10px;gap:4px}.chat-list-item__header{display:flex;justify-content:space-between;align-items:start}.chat-list-item__username{font-family:Inter,sans-serif;font-weight:600;font-size:13px;line-height:13px;color:var(--main-color)}.chat-list-item__date{font-family:Inter,sans-serif;font-weight:500;font-size:9px;line-height:13px;color:var(--secondary-color-400)}.chat-list-item__message{display:flex;justify-content:space-between;align-items:start;flex-grow:1;overflow:hidden;gap:20px}.chat-list-item__text{font-family:Inter,sans-serif;font-weight:500;font-size:12px;line-height:12px;color:var(--secondary-color-400);line-height:15px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;text-overflow:ellipsis}.chat-list-item__text b{font-family:Inter,sans-serif;font-weight:500;font-size:12px;line-height:12px;color:var(--main-color)}.chat-list-item__counter{display:flex;height:100%;align-items:end}.chat-list-item__counter div{font-family:Inter,sans-serif;font-weight:500;font-size:11px;line-height:11px;color:var(--white-color);background-color:var(--primary-color);width:20px;aspect-ratio:1;box-sizing:border-box;border-radius:50%;display:flex;align-items:center;justify-content:center}.chat{display:flex;flex-direction:column;height:100%;padding:10px 0;flex-grow:1;box-sizing:border-box}.chat-header{display:flex;justify-content:space-between;align-items:center;height:34px;padding:0 20px}.chat-header__interlocutor-info{display:flex;align-items:center;gap:10px}.chat-conversation{display:flex;flex-direction:column;padding:0 20px;flex:1 0;gap:21px;overflow:auto;scrollbar-width:thin;scrollbar-color:rgba(136,136,136,.6235294118) transparent}.chat-conversation::-webkit-scrollbar{width:2px}.chat-conversation::-webkit-scrollbar-track{background:transparent}.chat-conversation::-webkit-scrollbar-thumb{background:#8888889f;border-radius:1px}.chat-conversation::-webkit-scrollbar-button{display:none}.message{display:flex}.message__text{position:relative;box-sizing:border-box;max-width:380px;padding:11px 20px 17px 11px;border-radius:16px 16px 0;font-family:Inter,sans-serif;font-weight:500;font-size:12px;color:var(--main-color);line-height:15px}.message_outgoing{justify-content:end}.message__image{display:flex;justify-content:center;align-items:center;max-height:220px;overflow:hidden;border-radius:12px;border:1px solid var(--secondary-color-300);position:relative}.message__image,.message__text{background-color:var(--selection-color-100)}.message_outgoing .message__text,.message_outgoing .message__image{background-color:var(--selection-color-200)}.message__view-info{position:absolute;bottom:5px;right:7px;font-family:Inter,sans-serif;font-weight:500;font-size:9px;line-height:9px;color:var(--secondary-color-400)}.message__view-info_outgoing{color:var(--primary-color)}.message__view-info_background{padding:2px 7px;border-radius:30px;color:var(--white-color);background-color:var(--secondary-color-500)}.chat-footer{display:flex;align-items:center;gap:10px;padding:0 20px}.chat-footer__message-input{flex:1 0;background-color:var(--secondary-color-300);border-radius:30px;padding:10px 20px}.chat-footer__message-input::placeholder{font-family:Inter,sans-serif;font-weight:500;font-size:12px;line-height:15px;color:var(--secondary-color-400)}.view-form{display:flex;justify-content:space-between}.view-form__value{font-family:Inter,sans-serif;font-weight:500;font-size:13px;line-height:13px;color:var(--secondary-color-400)}.avatar{aspect-ratio:1;box-sizing:border-box;border-radius:50%;background-color:var(--secondary-color-300)}.ui-card{display:flex;flex-direction:column;width:100%;height:100%;box-sizing:border-box;padding:30px;border-radius:12px;box-shadow:0 0 6px #00000024}.ui-card__title{font-family:Inter,sans-serif;font-weight:500;font-size:20px;line-height:20px;color:var(--main-color);padding:20px;text-align:center}.ui-card__content{display:flex;flex:1 0;flex-direction:column;gap:16px;padding:20px 0}.ui-card__actions{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:14px}.ui-divider{height:0;border:1px solid;border-bottom:none;border-left:none;border-right:none}.ui-divider_secondary{border-color:var(--secondary-color-300)}.ui-divider_primary{border-color:var(--primary-color)}.ui-btn{font-family:Inter,sans-serif;font-weight:500;font-size:13px;line-height:13px;color:var(--primary-color);display:flex;align-items:center;justify-content:center}.ui-btn_filled{width:100%;height:37px;border-radius:8px;background-color:var(--primary-color);color:var(--white-color)}.ui-btn_text{background-color:inherit}.ui-btn_filled.ui-btn_primary{background-color:var(--primary-color)}.ui-btn_filled.ui-btn_secondary{background-color:var(--secondary-color-200)}.ui-btn_filled.ui-btn_red{background-color:var(--error-color)}.ui-btn_text.ui-btn_primary{color:var(--primary-color)}.ui-btn_text.ui-btn_red{color:var(--error-color)}.ui-btn_text.ui-btn_secondary{color:var(--secondary-color-400)}.ui-btn_font-size-10{font-size:10px}.ui-btn_font-size-11{font-size:11px}.ui-btn_font-size-12{font-size:12px}.ui-btn_font-size-13{font-size:13px}.ui-btn_font-size-14{font-size:14px}.ui-btn_font-size-15{font-size:15px}.ui-btn_font-size-16{font-size:16px}.ui-btn_font-size-17{font-size:17px}.ui-btn_font-size-18{font-size:18px}.ui-btn_font-size-19{font-size:19px}.ui-btn_font-size-20{font-size:20px}.ui-input{display:flex;flex-direction:column}.ui-input__label{font-family:Inter,sans-serif;font-weight:500;font-size:13px;line-height:13px;color:var(--secondary-color-400);pointer-events:none;transition:transform .2s ease-in-out;transform-origin:left;transform:translateY(17px)}.ui-input__item{outline:0;font-family:Inter,sans-serif;font-weight:500;font-size:13px;line-height:13px;color:var(--main-color)}.ui-input__error{font-family:Inter,sans-serif;font-weight:500;font-size:8px;line-height:8px;color:var(--error-color);margin-top:7px}.ui-input:focus-within .ui-input__label,.ui-input:has(.ui-input__item:not(:placeholder-shown)) .ui-input__label{transform:translateY(0) scale(.7)}