.inbox .inbox__side {
    padding-bottom: 0px !important
}

.elements__list {
    overflow-y: auto;
    width: calc(100% + 48px);
    padding-left: 24px;
    padding-right: 24px;
    padding-bottom: 24px;
    margin-left: -24px
}

.elements__list::-webkit-scrollbar,#inbox_filters_form::-webkit-scrollbar,#editGroupSelectedMember::-webkit-scrollbar,#messages-group-feed-scroll::-webkit-scrollbar {
    width: 4px;
    height: 4px
}

.elements__list::-webkit-scrollbar-thumb,#inbox_filters_form::-webkit-scrollbar-thumb,#editGroupSelectedMember::-webkit-scrollbar-thumb,#messages-group-feed-scroll::-webkit-scrollbar-thumb {
    border-radius: 250px;
    background-color: #1c45c2
}

.inbox {
    min-height: 100vh;
    padding-top: 52.8px;
    padding-left: 56px;
    padding-right: 0px;
    padding-bottom: 0px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.inbox .elem__chat {
    margin-bottom: 24px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.inbox .elem__chat .message {
    width: 100%
}

.inbox .elem__chat .message .desc>p {
    margin: 0px;
    font-size: 14px;
    line-height: 130%;
    font-weight: 400;
    color: #1F2A37;
    margin-bottom: 15px
}

.inbox .elem__chat .message .desc>p:last-child {
    margin-bottom: 0px
}

.inbox .elem__chat .message>.title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-bottom: 2px
}

.inbox .elem__chat .message>.title>span {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    font-size: 12px;
    line-height: 150%;
    font-weight: 400;
    color: #6B7280;
    padding-top: 4px
}

.inbox .elem__chat .message>.title>p {
    margin: 0px;
    margin-right: 4px;
    font-size: 16px;
    line-height: 150%;
    font-weight: 600;
    color: #111928
}

.inbox .elem__chat .author {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-right: 8px
}

.inbox .elem__chat .author.logo>span>img {
    max-width: 24px;
    max-height: 24px
}

.inbox .elem__chat .author>span {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-width: 45px;
    max-width: 45px;
    min-height: 45px;
    max-height: 45px;
    border-radius: 250px
}

.inbox .chat__list {
    padding: 16px;
    width: 100%;
    height: calc(100% - 403px);
    overflow-y: auto
}

.inbox .chat__list.no__controls {
    height: calc(100% - 78px)
}

.inbox .chat__list .day__mark {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 24px 0px
}

.inbox .chat__list .day__mark:nth-child(1) {
    margin-top: 0px
}

.inbox .chat__list .day__mark>span {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 100%;
    min-height: 1px;
    background-color: #E5E7EB
}

.inbox .chat__list .day__mark>p {
    margin: 0px;
    margin: 0px 15px;
    white-space: nowrap;
    font-size: 14px;
    line-height: 20px;
    color: #6B7280;
    font-weight: 400
}

.inbox .chat__list::-webkit-scrollbar {
    width: 4px;
    height: 4px
}

.inbox .chat__list::-webkit-scrollbar-thumb {
    border-radius: 250px;
    background-color: #1c45c2
}

.inbox .chat__wrapper {
    width: 100%;
    min-height: 100%;
    flex: 2 1 0;
    overflow: auto;
}

.inbox .chat__wrapper .chat__controls {
    width: 100%;
    padding-left: 16px;
    padding-bottom: 24px;
    padding-top: 30px;
    padding-right: 16px
}

.inbox .chat__wrapper .chat__controls .bottom__buttons {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 12px 20px;
    border-left: 1px solid #E5E7EB;
    border-right: 1px solid #E5E7EB;
    border-bottom: 1px solid #E5E7EB;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px
}

.inbox .chat__wrapper .chat__controls .bottom__buttons .right {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.inbox .chat__wrapper .chat__controls .bottom__buttons .right>button {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding-left: 27px;
    padding-right: 27px;
    background-color: #111928;
    -webkit-transition: .3s ease all;
    transition: .3s ease all
}

.inbox .chat__wrapper .chat__controls .bottom__buttons .right>button:hover {
    background-color: #1C45C2
}

.inbox .chat__wrapper .chat__controls .bottom__buttons .right>button:active {
    background-color: #1C45C2
}

.inbox .chat__wrapper .chat__controls .bottom__buttons .right>span {
    display: block;
    /* margin-right: 24px; */
    margin-right: 15px;
    font-size: 12px;
    line-height: 150%;
    font-weight: 400;
    color: #4B5563;
}

.inbox .chat__wrapper .chat__controls .bottom__buttons .right>span span {
    color: #111928
}

.inbox .chat__wrapper .chat__controls .bottom__buttons ul {
    padding: 0px;
    list-style-type: none;
    margin: 0px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.inbox .chat__wrapper .chat__controls .bottom__buttons ul>li {
    margin-right: 15px
}

.inbox .chat__wrapper .chat__controls .bottom__buttons ul>li>a {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-decoration: none
}

.inbox .chat__wrapper .chat__controls .bottom__buttons ul>li>a.opened.stroke svg path {
    fill: none;
    stroke: #1C45C2
}

.inbox .chat__wrapper .chat__controls .bottom__buttons ul>li>a.opened svg path {
    fill: #1C45C2
}

.inbox .chat__wrapper .chat__controls .bottom__buttons ul>li>a:hover.stroke svg path {
    fill: none;
    stroke: #1C45C2
}

.inbox .chat__wrapper .chat__controls .bottom__buttons ul>li>a:hover svg path {
    fill: #1C45C2
}

.inbox .chat__wrapper .chat__controls .bottom__buttons ul>li>a svg path {
    -webkit-transition: .3s ease all;
    transition: .3s ease all
}

.inbox .chat__wrapper .chat__controls .bottom__buttons ul>li:last-child {
    margin-right: 0px
}

.inbox .chat__wrapper .chat__controls>textarea, .inbox .chat__wrapper .chat__controls div>textarea {
    width: 100%;
    height: 115px;
    background-color: #fff;
    border: 0px;
    outline: none;
    border-left: 1px solid #E5E7EB;
    border-right: 1px solid #E5E7EB;
    border-bottom: 1px solid #E5E7EB;
    padding: 15px 20px;
    font-size: 14px;
    color: #000
}

.inbox .chat__wrapper .chat__controls .top__buttons {
    border: 1px solid #E5E7EB;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    overflow-x: auto;
    overflow-y: hidden;
    background-color: #fff;
    position: relative;
    height: 36px
}

.inbox .chat__wrapper .chat__controls .top__buttons::-webkit-scrollbar {
    width: 4px;
    height: 4px
}

.inbox .chat__wrapper .chat__controls .top__buttons::-webkit-scrollbar-thumb {
    border-radius: 250px;
    background-color: #1c45c2
}

.inbox .chat__wrapper .chat__controls .top__buttons ul {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    padding: 0px;
    list-style-type: none;
    margin: 0px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.inbox .chat__wrapper .chat__controls .top__buttons ul>li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-right: 1px solid #E5E7EB
}

.inbox .chat__wrapper .chat__controls .top__buttons ul>li:last-child {
    border-right: 0px
}

.inbox .chat__wrapper .chat__controls .top__buttons ul>li>a {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 100%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 12px;
    line-height: 18px;
    color: #4B5563;
    font-weight: 500;
    text-decoration: none;
    padding: 7px 15px;
    -webkit-transition: .3s ease all;
    transition: .3s ease all
}

.inbox .chat__wrapper .chat__controls .top__buttons ul>li>a.current {
    background-color: #F9FAFB
}

.inbox .chat__wrapper .chat__controls .top__buttons ul>li>a:hover {
    background-color: #F9FAFB
}

.inbox .chat__wrapper .chat__controls .top__buttons ul>li>a span {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-right: 4px
}

.inbox .chat__wrapper .chat__controls .top__buttons ul>li>a span img {
    min-width: 16px;
    max-width: 16px
}

.inbox .chat__wrapper .chat__members {
    width: 100%;
    padding: 10px 16px;
    border-bottom: 1px solid #E5E7EB;
    background-color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.inbox .chat__wrapper .chat__members::-webkit-scrollbar {
    width: 4px;
    height: 4px
}

.inbox .chat__wrapper .chat__members::-webkit-scrollbar-thumb {
    border-radius: 250px;
    background-color: #1c45c2
}

.inbox .chat__wrapper .chat__members>.elem {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 8px 12px;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    margin-right: 7px
}

.inbox .chat__wrapper .chat__members>.elem>p {
    margin: 0px;
    font-size: 12px;
    line-height: 150%;
    font-weight: 500;
    color: #111928;
    white-space: nowrap
}

.inbox .chat__wrapper .chat__members>.elem>span {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-width: 18px;
    max-width: 18px;
    min-height: 18px;
    max-height: 18px;
    border-radius: 250px;
    background-color: #F0EFFE;
    margin-right: 10px;
    font-size: 8px;
    line-height: 150%;
    font-weight: 500;
    color: #1C45C2
}

.inbox .chat__wrapper .chat__members>.elem>span img {
    max-width: 12px;
    min-width: 12px
}

.inbox .chat__wrapper .chat__members>.elem:last-child {
    margin-right: 0px
}

.inbox .chat__wrapper .chat__top {
    width: 100%;
    padding: 20px 16px;
    background-color: #fff;
    border-bottom: 1px solid #E5E7EB;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.inbox .chat__wrapper .chat__top>.right,.inbox .chat__wrapper .chat__members>.right {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.inbox .chat__wrapper .chat__top>.right .btns,.inbox .chat__wrapper .chat__members>.right .btns {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.inbox .chat__wrapper .chat__top>.right .btns>a, .inbox .chat__wrapper .chat__members>.right .btns>a {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-right: 8px;
    min-height: 37px;
    white-space: nowrap;
}

.inbox .chat__wrapper .chat__top>.right .btns>a:last-child, .inbox .chat__wrapper .chat__members>.right .btns>a:last-child {
    margin-right: 0px
}

.inbox .chat__wrapper .chat__top>.left {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.inbox .chat__wrapper .chat__top>.left .type {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.inbox .chat__wrapper .chat__top>.left .type>img {
    min-width: 20px;
    max-width: 20px;
    margin-right: 4px
}

.inbox .chat__wrapper .chat__top>.left .type>span {
    font-size: 14px;
    line-height: 150%;
    font-weight: 400;
    color: #4B5563
}

.inbox .chat__wrapper .chat__top>.left>h6 {
    margin: 0px;
    margin-right: 15px;
    font-size: 18px;
    line-height: 150%;
    font-weight: bold;
    color: #111928
}

.inbox .contacts__list {
    min-width: 320px;
    max-width: 320px;
    margin-right: auto;
    background-color: #fff;
    position: relative;
    border-right: 1px solid #E5E7EB
}

.inbox .contacts__list .contacts__list--box {
    height: calc(100% - 132px);
    position: absolute;
    left: 0px;
    top: 132px;
    overflow-y: auto;
    width: 100%
}

.inbox .contacts__list .contacts__list--box>.contact__element, #messages-group-feed-scroll .contact__element{
    padding:15px;
    text-decoration: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-transition: .3s ease all;
    transition: .3s ease all;
    border-bottom: 1px solid #E5E7EB;
    position: relative
}

.inbox .contacts__list .contacts__list--box>.contact__element.new:before {
    content: "";
    position: absolute;
    top: 12px;
    left: 10px;
    min-width: 8px;
    max-width: 8px;
    min-height: 8px;
    max-height: 8px;
    border-radius: 250px;
    background-color: #EB903A
}

.inbox .contacts__list .contacts__list--box>.contact__element:last-child {
    border-bottom: 0px
}

.inbox .contacts__list .contacts__list--box>.contact__element.current {
    background-color: #F9FAFB
}

.inbox .contacts__list .contacts__list--box>.contact__element:hover , #messages-group-feed-scroll .contact__element:hover {
    background-color: #F9FAFB
}

.inbox .contacts__list .contacts__list--box>.contact__element .desc p, #messages-group-feed-scroll .contact__element .desc p ,.inbox .contacts__list .contacts__list--box>.contact__element .desc div, #messages-group-feed-scroll .contact__element .desc div{
    margin: 0px;
    font-size: 14px;
    line-height: 150%;
    font-weight: 400;
    color: #374151;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical
}

.inbox .contacts__list .contacts__list--box>.contact__element .request, #messages-group-feed-scroll .contact__element .request {
    margin-bottom: 4px
}

.inbox .contacts__list .contacts__list--box>.contact__element .request>span , #messages-group-feed-scroll .contact__element .request>span {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    font-size: 14px;
    line-height: 150%;
    font-weight: 500;
    color: #111928
}

.inbox .contacts__list .contacts__list--box>.contact__element .request>span>img , #messages-group-feed-scroll .contact__element .request>span>img {
    min-width: 16px;
    max-width: 16px;
    margin-right: 3px
}

.inbox .contacts__list .contacts__list--box>.contact__element>.top , #messages-group-feed-scroll .contact__element>.top{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: 4px
}

.inbox .contacts__list .contacts__list--box>.contact__element>.top .time, #messages-group-feed-scroll .contact__element>.top .time {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.inbox .contacts__list .contacts__list--box>.contact__element>.top .time .star, #messages-group-feed-scroll .contact__element>.top .time .star {
    cursor: pointer;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.inbox .contacts__list .contacts__list--box>.contact__element>.top .time>span, #messages-group-feed-scroll .contact__element>.top .time>span {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-right: 8px;
    font-size: 14px;
    line-height: 150%;
    font-weight: 400;
    color: #6B7280
}

.inbox .contacts__list .contacts__list--box>.contact__element>.top>p , #messages-group-feed-scroll .contact__element>.top>p {
    margin: 0px;
    font-size: 16px;
    line-height: 140%;
    font-weight: 600;
    color: #111928
}

.inbox .contacts__list .contacts__list--box::-webkit-scrollbar {
    width: 4px;
    height: 4px
}

.inbox .contacts__list .contacts__list--box::-webkit-scrollbar-thumb {
    border-radius: 250px;
    background-color: #1c45c2
}

.inbox .contacts__list .switcher ul {
    padding: 0px;
    list-style-type: none;
    margin: 0px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    overflow: hidden
}

.inbox .contacts__list .switcher ul>li {
    border-right: 1px solid #E5E7EB;
    width: 100%
}

.inbox .contacts__list .switcher ul>li:last-child {
    border-right: 0px
}

.inbox .contacts__list .switcher ul>li>a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-decoration: none;
    min-height: 34px;
    -webkit-transition: .3s ease all;
    transition: .3s ease all;
    font-size: 14px;
    line-height: 130%;
    font-weight: 400;
    color: #374151
}

.inbox .contacts__list .switcher ul>li>a.current {
    color: #111928;
    background-color: #F9F9F9
}

.inbox .contacts__list .switcher ul>li>a:hover {
    color: #111928;
    background-color: #F9F9F9
}

.inbox .contacts__list .top__contacts {
    padding-top: 24px;
    padding-left: 16px;
    padding-right: 16px;
    padding-bottom: 4px;
    position: relative
}

.inbox .contacts__list .top__contacts .filter__contacts {
    position: absolute;
    width: 100%;
    border-radius: 6px;
    border: 1px solid #E5E7EB;
    background-color: #fff;
    z-index: 3;
    left: 0px;
    top: 70px;
    -webkit-box-shadow: 0px 8px 12px rgba(0, 0, 0, 0.04);
    box-shadow: 0px 8px 12px rgba(0, 0, 0, 0.04)
}

.inbox .contacts__list .top__contacts .filter__contacts form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    margin: 0px;
    padding: 0px
}

.inbox .contacts__list .top__contacts .filter__contacts .controls {
    padding: 16px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%;
    border-bottom: 0px
}

.inbox .contacts__list .top__contacts .filter__contacts .controls>button,.config-inbox-submit,.add-group-member,.next__group__step {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-height: 36px;
    border-radius: 100px;
    cursor: pointer;
    padding-left: 16px;
    padding-right: 16px;
    background-color: #111928;
    outline: none;
    cursor: pointer;
    border: 0px;
    font-size: 14px;
    line-height: 140%;
    font-weight: 600;
    -webkit-transition: .3s ease all;
    transition: .3s ease all;
    color: #FFFFFF
}

.inbox .contacts__list .top__contacts .filter__contacts .controls>button:hover,.config-inbox-submit:hover,.add-group-member:hover,.next__group__step:hover {
    background-color: #1C45C2
}

.inbox .contacts__list .top__contacts .filter__contacts .controls>a {
    font-size: 14px;
    line-height: 140%;
    font-weight: 600;
    color: #111928;
    text-decoration: none;
    border-radius: 38px;
    background-color: #F3F3F3;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-height: 36px;
    padding-left: 16px;
    padding-right: 16px;
    -webkit-transition: .3s ease all;
    transition: .3s ease all
}

.inbox .contacts__list .top__contacts .filter__contacts .controls>a:hover {
    background-color: #1C45C2;
    color: #fff
}

.inbox .contacts__list .top__contacts .filter__contacts form>.field {
    width: 100%;
    padding: 16px;
    padding-bottom: 10px;
    border-bottom: 1px solid #E5E7EB
}

.inbox .contacts__list .top__contacts .filter__contacts form>.field .checks>.group__checkbox {
    margin-bottom: 14px
}

.inbox .contacts__list .top__contacts .filter__contacts form>.field .checks>.group__checkbox label {
    cursor: pointer
}

.inbox .contacts__list .top__contacts .filter__contacts form>.field .checks>.group__checkbox:last-child {
    margin-bottom: 0px
}

.inbox .contacts__list .top__contacts .filter__contacts form>.field>.top {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: 12px
}

.inbox .contacts__list .top__contacts .filter__contacts form>.field>.top>a {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    font-size: 14px;
    line-height: 150%;
    font-weight: 400;
    color: #1C45C2;
    text-decoration: none;
    -webkit-transition: .3s ease all;
    transition: .3s ease all
}

.inbox .contacts__list .top__contacts .filter__contacts form>.field>.top>a:hover {
    opacity: .7
}

.inbox .contacts__list .top__contacts .filter__contacts form>.field>.top>p {
    margin: 0px;
    font-size: 14px;
    line-height: 150%;
    margin-right: 12px;
    font-weight: 400;
    color: #1F2A37
}

.inbox .contacts__list .top__contacts .filter__contacts .title {
    padding: 16px;
    border-bottom: 1px solid #E5E7EB
}

.inbox .contacts__list .top__contacts .filter__contacts .title>p {
    margin: 0px;
    font-size: 14px;
    line-height: 150%;
    font-weight: 500;
    color: #111928
}

.inbox .contacts__list .top__contacts form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding-bottom: 16px;
    margin-bottom: 16px;
    border-bottom: 1px solid #E5E7EB
}

.inbox .contacts__list .top__contacts form .buttons {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-left: 9px;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.inbox .contacts__list .top__contacts form .buttons>a {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-decoration: none;
    min-width: 52px;
    margin-right: 9px;
    min-height: 36px;
    border-radius: 8px
}

.inbox .contacts__list .top__contacts form .buttons>a:last-child {
    margin-right: 0px
}

.inbox .contacts__list .top__contacts form>.search {
    width: 100%;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative
}

.inbox .contacts__list .top__contacts form>.search button {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    cursor: pointer;
    border: 0px;
    outline: none;
    background-color: transparent;
    position: absolute;
    left: 10px
}

.inbox .contacts__list .top__contacts form>.search button svg path {
    -webkit-transition: .3s ease all;
    transition: .3s ease all
}

.inbox .contacts__list .top__contacts form>.search>input {
    width: 100%;
    height: 36px;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    background-color: #F9FAFB;
    outline: none;
    padding-left: 42px;
    padding-right: 15px
}

.inbox .inbox__side {
    min-width: 220px;
    max-width: 220px;
    padding: 24px;
    border-right: 1px solid #E5E7EB;
    background-color: #fff
}

.inbox .inbox__side .elements__wrapper {
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom: 1px solid #E5E7EB
}

.inbox .inbox__side .elements__wrapper:last-child {
    border-bottom: 0px
}

.inbox .inbox__side .elements__wrapper .channels__wrapper .connect {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    padding: 8px;
    border-radius: 8px;
    text-decoration: none;
    font-size: 14px;
    line-height: 150%;
    font-weight: 500;
    color: #1F2A37;
    -webkit-transition: .3s ease all;
    transition: .3s ease all
}

.inbox .inbox__side .elements__wrapper .channels__wrapper .connect:hover {
    background-color: #F9FAFB
}

.inbox .inbox__side .elements__wrapper .channels__wrapper .connect span {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-right: 8px
}

.inbox .inbox__side .elements__wrapper .tags__wrapper ul {
    padding: 0px;
    list-style-type: none;
    margin: 0px
}

.inbox .inbox__side .elements__wrapper .tags__wrapper ul>li {
    margin-bottom: 4px
}

.inbox .inbox__side .elements__wrapper .tags__wrapper ul>li>a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    text-decoration: none;
    padding: 8px;
    font-size: 14px;
    line-height: 150%;
    border-radius: 8px;
    font-weight: 500;
    color: #1F2A37;
    -webkit-transition: .3s ease all;
    transition: .3s ease all
}

.inbox .inbox__side .elements__wrapper .tags__wrapper ul>li>a.current {
    background-color: #F9FAFB
}

.inbox .inbox__side .elements__wrapper .tags__wrapper ul>li>a:hover {
    background-color: #F9FAFB
}

.inbox .inbox__side .elements__wrapper .tags__wrapper ul>li>a span {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-right: 8px;
    font-size: 14px;
    line-height: 150%;
    font-weight: 400;
    color: #6B7280;
}

.inbox .inbox__side .elements__wrapper .tags__wrapper ul>li:last-child {
    margin-bottom: 0px
}

.inbox .inbox__side .elements__wrapper .folders__wrapper ul {
    padding: 0px;
    list-style-type: none;
    margin: 0px
}

.inbox .inbox__side .elements__wrapper .folders__wrapper ul>li {
    margin-bottom: 4px
}

.inbox .inbox__side .elements__wrapper .folders__wrapper ul>li>a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    text-decoration: none;
    padding: 8px;
    -webkit-transition: .3s ease all;
    transition: .3s ease all;
    border-radius: 8px
}

.inbox .inbox__side .elements__wrapper .folders__wrapper ul>li>a.current {
    background-color: #F9FAFB
}

.inbox .inbox__side .elements__wrapper .folders__wrapper ul>li>a:hover {
    background-color: #F9FAFB
}

.inbox .inbox__side .elements__wrapper .folders__wrapper ul>li>a>p {
    font-size: 14px;
    line-height: 150%;
    font-weight: 500;
    color: #1F2A37;
    margin: 0px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.inbox .inbox__side .elements__wrapper .folders__wrapper ul>li>a>p span {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-right: 8px
}

.inbox .inbox__side .elements__wrapper .folders__wrapper ul>li>a>span {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-left: 6px;
    font-size: 14px;
    line-height: 150%;
    font-weight: 400;
    color: #6B7280
}

.inbox .inbox__side .elements__wrapper .folders__wrapper ul>li:last-child {
    margin-bottom: 0px
}

.inbox .inbox__side .elements__wrapper .title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: 16px
}

.inbox .inbox__side .elements__wrapper .title>p {
    margin: 0px;
    font-size: 12px;
    line-height: 150%;
    font-weight: 500;
    color: #6B7280
}

.inbox .inbox__side .elements__wrapper .title>a {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.inbox .inbox__side .elements__wrapper:last-child {
    margin-bottom: 0px;
    padding-bottom: 0px
}

.inbox .inbox__side .inbox__top {
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom: 1px solid #E5E7EB
}

.inbox .inbox__side .inbox__top .controls {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.inbox .inbox__side .inbox__top .controls .compose {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    position: relative
}

.inbox .inbox__side .inbox__top .controls .compose .compose__dropdown {
    position: absolute;
    top: 44px;
    left: 0px;
    min-width: 175px;
    max-width: 175px;
    background-color: #FFFFFF;
    padding: 4px 0px;
    -webkit-box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1)
}

.inbox .inbox__side .inbox__top .controls .compose .compose__dropdown ul {
    padding: 0px;
    list-style-type: none;
    margin: 0px
}

.inbox .inbox__side .inbox__top .controls .compose .compose__dropdown ul>li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    width: 100%
}

.inbox .inbox__side .inbox__top .controls .compose .compose__dropdown ul>li>a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    text-decoration: none;
    padding: 10px 15px;
    width: 100%;
    font-size: 14px;
    line-height: 130%;
    font-weight: 400;
    -webkit-transition: .3s ease all;
    transition: .3s ease all;
    color: #4B5563
}

.inbox .inbox__side .inbox__top .controls .compose .compose__dropdown ul>li>a:hover {
    background-color: #F9FAFB;
    color: #111928
}

.inbox .inbox__side .inbox__top .controls .compose .compose__dropdown ul>li>a:hover span svg path {
    fill: #111928
}

.inbox .inbox__side .inbox__top .controls .compose .compose__dropdown ul>li>a span {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-right: 4px
}

.inbox .inbox__side .inbox__top .controls .compose .compose__dropdown ul>li>a span svg path {
    -webkit-transition: .3s ease all;
    transition: .3s ease all
}

.inbox .inbox__side .inbox__top .controls .compose>a {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-height: 36px;
    min-width: 132px;
    background-color: #111928;
    font-size: 14px;
    line-height: 150%;
    font-weight: 500;
    color: #FFFFFF;
    border-radius: 8px;
    text-decoration: none;
    -webkit-transition: .3s ease all;
    transition: .3s ease all
}

.inbox .inbox__side .inbox__top .controls .compose>a svg {
    -webkit-transition: .3s ease all;
    transition: .3s ease all
}

.inbox .inbox__side .inbox__top .controls .compose>a.active {
    background-color: #1C45C2;
    -webkit-box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1)
}

.inbox .inbox__side .inbox__top .controls .compose>a.active svg {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.inbox .inbox__side .inbox__top .controls .compose>a:hover {
    background-color: #1C45C2
}

.inbox .inbox__side .inbox__top .controls .compose>a svg path {
    -webkit-transition: .4s ease all;
    transition: .4s ease all
}

.inbox .inbox__side .inbox__top .controls .compose>a span {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-right: 8px
}

.inbox .inbox__side .inbox__top .controls .settings {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

.inbox .inbox__side .inbox__top .controls .settings>a {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-left: 16px
}

.inbox .inbox__side .inbox__top .controls .settings>a.active svg path {
    fill: #1C45C2
}

.inbox .inbox__side .inbox__top>h2 {
    margin: 0px;
    margin-bottom: 12px;
    font-size: 28px;
    line-height: 150%;
    font-weight: bold;
    color: #111928
}

.contact__element {
    padding:15px;
}

.elements__wrapper .title>a svg path {
    -webkit-transition: .3s ease all;
    transition: .3s ease all
}

.inbox .inbox__side .inbox__top .controls .settings>a svg path {
    -webkit-transition: .3s ease all;
    transition: .3s ease all
}

.inbox .inbox__side .inbox__top .controls .settings>a:hover svg path {
    fill: #1C45C2
}

.elements__wrapper .title>a:hover svg path {
    fill: #1C45C2
}

.inbox .chat__wrapper .chat__controls .top__buttons ul {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.inner__profile {
    min-width: 320px;
    max-width: 320px;
    border-left: 1px solid #E5E7EB;
    background-color: #fff;
    position: relative;
    padding-top: 45px;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 25px;
    max-height: 100%;
    overflow-y: auto
}

.inner__profile::-webkit-scrollbar {
    width: 4px;
    height: 4px
}

.inner__profile::-webkit-scrollbar-thumb {
    border-radius: 250px;
    background-color: #1c45c2
}

.inner__profile .accordions__wrapper .elem__accordion {
    padding: 20px;
    border: 1px solid #E5E7EB;
    border-radius: 12px;
    margin-bottom: 12px;
    cursor: pointer
}

.inner__profile .accordions__wrapper .elem__accordion.opened>.title.stroke>p>span svg path {
    stroke: none;
    fill: #1C45C2
}

.inner__profile .accordions__wrapper .elem__accordion.opened>.title>p>span svg path {
    stroke: #1C45C2
}

.inner__profile .accordions__wrapper .elem__accordion:last-child {
    margin-bottom: 0px
}

.inner__profile .accordions__wrapper .elem__accordion>.content {
    display: none;
    margin-top: 16px
}

.inner__profile .accordions__wrapper .elem__accordion>.content .contact__info>.elem {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-bottom: 16px;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.inner__profile .accordions__wrapper .elem__accordion>.content .contact__info>.elem:last-child {
    margin-bottom: 0px
}

.inner__profile .accordions__wrapper .elem__accordion>.content .contact__info>.elem>span {
    font-size: 16px;
    line-height: 140%;
    font-weight: 500;
    overflow-wrap: anywhere;
    color: #374151
}

.inner__profile .accordions__wrapper .elem__accordion>.content .contact__info>.elem>p {
    margin-top: 0px;
    margin-bottom: 4px;
    font-size: 14px;
    line-height: 150%;
    font-weight: 500;
    color: #4B5563
}

.inner__profile .accordions__wrapper .elem__accordion>.title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.inner__profile .accordions__wrapper .elem__accordion>.title>span {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

.inner__profile .accordions__wrapper .elem__accordion>.title>p {
    margin: 0px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 16px;
    line-height: 140%;
    font-weight: 500;
    color: #111928;
    margin-right: 12px;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.inner__profile .accordions__wrapper .elem__accordion>.title>p span {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-right: 12px
}

.inner__profile .profile__main {
    padding-bottom: 16px;
    margin-bottom: 16px;
    border-bottom: 1px solid #E5E7EB
}

.inner__profile .profile__main .btns {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.inner__profile .profile__main .btns>a {
    font-size: 12px;
    margin-bottom: 12px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-decoration: none;
    min-height: 37px
}

.inner__profile .profile__main .btns>a:last-child {
    margin-bottom: 0px
}

.inner__profile .profile__main .desc {
    text-align: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 16px
}

.inner__profile .profile__main .desc>span {
    font-size: 14px;
    line-height: 150%;
    font-weight: 400;
    color: #1F2A37
}

.inner__profile .profile__main .desc>p {
    margin-top: 0px;
    margin-bottom: 4px;
    font-size: 16px;
    line-height: 140%;
    font-weight: 600;
    color: #111928
}

.inner__profile .profile__main>span {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 8px
}

.inner__profile .profile__main>span>img {
    min-width: 80px;
    max-width: 80px;
    min-height: 80px;
    max-height: 80px;
    border-radius: 250px;
    -o-object-fit: cover;
    object-fit: cover
}

.inner__profile>.close__button {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    position: absolute;
    top: 24px;
    left: 24px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.inner__profile>.close__button:hover svg path {
    stroke: #1C45C2
}

.inner__profile>.close__button svg path {
    -webkit-transition: .3s ease all;
    transition: .3s ease all
}

.settings__dropdown {
    min-width: 290px;
    max-width: 290px;
    padding: 16px;
    background-color: #FFFFFF;
    border: 1px solid #F3F3F3;
    border-radius: 6px;
    -webkit-box-shadow: 0px 8px 12px rgba(0, 0, 0, 0.04);
    box-shadow: 0px 8px 12px rgba(0, 0, 0, 0.04);
    position: absolute;
    z-index: 10
}

.settings__dropdown .setting__switcher {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.settings__dropdown .setting__switcher>label {
    margin-right: 8px
}

.settings__dropdown .setting__switcher .desc {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.settings__dropdown .setting__switcher .desc>p {
    margin-top: 0px;
    margin-bottom: 0px;
    font-size: 14px;
    line-height: 150%;
    font-weight: 500;
    color: #0E1217
}

.settings__dropdown .setting__switcher .desc>span {
    font-size: 12px;
    line-height: 150%;
    font-weight: 400;
    color: #56595D
}

.settings__dropdown .radios {
    padding-top: 15px;
    margin-top: 15px;
    border-top: 1px solid #E7E7E8
}

.settings__dropdown .radios .elem {
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 15px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.settings__dropdown .radios .elem:last-child {
    margin-bottom: 0px
}

.settings__dropdown .radios .elem label {
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.settings__dropdown .radios .elem label input:checked+span+p {
    color: #111928;
    font-weight: 500
}

.settings__dropdown .radios .elem label>p {
    margin: 0px;
    margin-left: 8px;
    font-size: 14px;
    line-height: 130%;
    font-weight: 400;
    color: #4B5563
}

.contacts__form .filter__btn svg path {
    -webkit-transition: .3s ease all;
    transition: .3s ease all
}

.contacts__form .filter__btn.active svg path {
    fill: #1C45C2
}

.contacts__form .buttons {
    position: relative
}

.contacts__form .buttons .sort__wrapper {
    position: absolute;
    min-width: 220px;
    max-width: 220px;
    position: absolute;
    top: 40px;
    right: 0px;
    border: 1px solid #E5E7EB;
    border-radius: 6px;
    background-color: #fff;
    z-index: 3;
    -webkit-box-shadow: 0px 8px 12px rgba(0, 0, 0, 0.04);
    box-shadow: 0px 8px 12px rgba(0, 0, 0, 0.04)
}

.contacts__form .buttons .sort__wrapper .sort__list>.elem__sort {
    padding-left: 16px;
    padding-top: 16px;
    padding-right: 16px;
    padding-bottom: 28px
}

.contacts__form .buttons .sort__wrapper .sort__list>.elem__sort ul {
    padding: 0px;
    list-style-type: none;
    margin: 0px
}

.contacts__form .buttons .sort__wrapper .sort__list>.elem__sort ul>li {
    margin-bottom: 2px
}

.contacts__form .buttons .sort__wrapper .sort__list>.elem__sort ul>li>a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    padding: 8px 16px;
    font-size: 14px;
    line-height: 130%;
    border-radius: 8px;
    font-weight: 400;
    color: #0E1217;
    text-decoration: none;
    -webkit-transition: .3s ease all;
    transition: .3s ease all;
    position: relative
}

.contacts__form .buttons .sort__wrapper .sort__list>.elem__sort ul>li>a:before {
    content: "";
    position: absolute;
    width: 18px;
    height: 18px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 16px;
    background: url("../img/checkblue.svg");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    opacity: 0;
    -webkit-transition: .3s ease all;
    transition: .3s ease all
}

.contacts__form .buttons .sort__wrapper .sort__list>.elem__sort ul>li>a.current:before {
    opacity: 1
}

.contacts__form .buttons .sort__wrapper .sort__list>.elem__sort ul>li>a:hover {
    background-color: #F9FAFB
}

.contacts__form .buttons .sort__wrapper .sort__list>.elem__sort ul>li:last-child {
    margin-bottom: 0px
}

.contacts__form .buttons .sort__wrapper .sort__list>.elem__sort>p {
    margin-top: 0px;
    text-transform: uppercase;
    margin-bottom: 8px;
    font-size: 12px;
    line-height: 150%;
    font-weight: 500;
    color: #6E7174
}

.contacts__form .buttons .sort__wrapper .title {
    padding: 16px;
    border-bottom: 1px solid #E7E7E8
}

.contacts__form .buttons .sort__wrapper .title>p {
    margin: 0px;
    font-size: 14px;
    line-height: 150%;
    font-weight: 500;
    color: #0E1217
}

.sort__inbox svg path {
    -webkit-transition: .3s ease all;
    transition: .3s ease all
}

.sort__inbox.active svg path {
    fill: #1C45C2
}

.inbox .contacts__list .contacts__list--box>.contact__element>.top .time, #messages-group-feed-scroll .contact__element>.top .time {
    margin-left: 12px;
    margin-bottom: auto;
    padding-top: 2px
}

.inbox .chat__wrapper .chat__top>.left {
    margin-right: 8px
}

.select__template--wrapper {
    position: absolute;
    z-index: 10;
    border-radius: 6px;
    border: 1px solid #E5E7EB;
    background-color: #fff;
    max-width: 335px;
    -webkit-box-shadow: 0px 8px 12px rgba(0, 0, 0, 0.04);
    box-shadow: 0px 8px 12px rgba(0, 0, 0, 0.04)
}

.select__template--wrapper .inner .list {
    max-height: 195px;
    overflow-y: auto
}

.select__template--wrapper .inner .list::-webkit-scrollbar {
    width: 4px;
    height: 4px
}

.select__template--wrapper .inner .list::-webkit-scrollbar-thumb {
    border-radius: 250px;
    background-color: #1c45c2
}

.select__template--wrapper .inner .list>.elem {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    padding: 14px 15px;
    text-decoration: none;
    border-bottom: 1px solid #E5E7EB;
    -webkit-transition: .3s ease all;
    transition: .3s ease all
}

.select__template--wrapper .inner .list>.elem:hover {
    background-color: #F9FAFB
}

.select__template--wrapper .inner .list>.elem:last-child {
    border-bottom: 0px
}

.select__template--wrapper .inner .list>.elem>p {
    font-size: 12px;
    line-height: 150%;
    font-weight: 400;
    color: #4B5563;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin: 0px
}

.select__template--wrapper .inner .list>.elem>.top {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 4px;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.select__template--wrapper .inner .list>.elem>.top>p {
    margin: 0px;
    font-size: 14px;
    line-height: 150%;
    font-weight: 500;
    color: #111928
}

.select__template--wrapper .inner .list>.elem>.top>span {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-right: 4px
}

.select__template--wrapper .inner .list>.elem>.top>span img {
    min-width: 16px;
    max-width: 16px
}

.select__template--wrapper .inner .search {
    padding: 12px 16px;
    border-bottom: 1px solid #E5E7EB
}

.select__template--wrapper .inner .search>input {
    width: 100%;
    height: 40px;
    padding-left: 12px;
    padding-right: 12px;
    border: 1px solid #E5E7EB;
    border-radius: 8px
}

.select__template--wrapper .inner>.title {
    padding: 12px 16px;
    border-bottom: 1px solid #E5E7EB
}

.select__template--wrapper .inner>.title>p {
    margin: 0px;
    font-size: 14px;
    line-height: 150%;
    font-weight: 600;
    color: #111928
}

.select__tags {
    width: 100%;
    max-width: 335px;
    background-color: #FFFFFF;
    border-radius: 6px;
    border: 1px solid #E5E7EB;
    -webkit-box-shadow: 0px 8px 12px rgba(0, 0, 0, 0.04);
    box-shadow: 0px 8px 12px rgba(0, 0, 0, 0.04);
    z-index: 10;
    position: absolute
}

.select__tags .workroom ul {
    padding: 0px;
    list-style-type: none;
    margin: 0px;
    max-height: 150px;
    overflow-y: auto
}

.select__tags .workroom ul::-webkit-scrollbar {
    width: 4px;
    height: 4px
}

.select__tags .workroom ul::-webkit-scrollbar-thumb {
    border-radius: 250px;
    background-color: #1c45c2
}

.select__tags .workroom ul>li>a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    padding: 8px 16px;
    text-decoration: none;
    font-size: 14px;
    line-height: 150%;
    color: #0E1217;
    font-weight: 400;
    -webkit-transition: .4s ease all;
    transition: .4s ease all
}

.select__tags .workroom ul>li>a:hover {
    background-color: #F3F3F3
}

.select__tags .workroom>p {
    margin-top: 0px;
    margin-bottom: 4px;
    font-size: 14px;
    line-height: 150%;
    font-weight: 500;
    color: #0E1217;
    padding-left: 16px;
    padding-right: 16px
}

.select__tags .search__tags {
    padding: 12px 16px
}

.select__tags .search__tags form {
    width: 100%
}

.select__tags .search__tags form>input {
    width: 100%;
    height: 40px;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    padding-left: 12px;
    padding-right: 12px;
    outline: none;
    color: #000
}

.select__tags .title {
    padding: 12px 16px;
    border-bottom: 1px solid #E5E7EB
}

.select__tags .title>p {
    margin: 0px;
    font-size: 14px;
    line-height: 150%;
    font-weight: 600;
    color: #0E1217
}

.choose__time>a.active svg path {
    fill: #1C45C2
}

.choose__template--box {
    min-width: 335px;
    max-width: 335px;
    -webkit-box-shadow: 0px 8px 12px rgba(0, 0, 0, 0.04);
    box-shadow: 0px 8px 12px rgba(0, 0, 0, 0.04);
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    background-color: #fff;
    border-radius: 6px;
    margin-left: 75px;
    border: 1px solid #E5E7EB;
    z-index: 9;
    bottom: 100%;
    top: auto;
    margin-bottom: 18px;
}

.choose__template--box .schedule {
    border-top: 1px solid #E5E7EB
}

.choose__template--box .schedule>a {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    text-decoration: none;
    font-size: 14px;
    line-height: 150%;
    font-weight: 600;
    color: #111928;
    padding: 13px 16px;
    -webkit-transition: .3s ease all;
    transition: .3s ease all
}

.choose__template--box .schedule>a span {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-right: 4px
}

.choose__template--box .schedule>a:hover {
    opacity: .7
}

.choose__template--box .list {
    padding: 8px 0px
}

.choose__template--box .list>a {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    text-decoration: none;
    padding: 8px 16px;
    font-size: 14px;
    line-height: 150%;
    width: 100%;
    font-weight: 400;
    color: #111928;
    -webkit-transition: .3s ease all;
    transition: .3s ease all
}

.choose__template--box .list>a:hover {
    background-color: #F9FAFB
}

.choose__template--box>.head {
    padding: 12px 16px;
    border-bottom: 1px solid #E5E7EB
}

.choose__template--box>.head>p {
    margin: 0px;
    font-size: 14px;
    line-height: 150%;
    font-weight: 500;
    color: #111928
}

.choose__time {
    position: relative
}

.inbox .elem__chat:last-child {
    margin-bottom: 0px
}

.scheduled__message {
    width: calc(100% - 53px);
    margin-left: auto;
    margin-bottom: 16px
}

.scheduled__message:last-child {
    margin-bottom: 0px
}

.scheduled__message .inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 8px 12px;
    border-radius: 6px;
    background-color: #E5E7EB
}

.scheduled__message .inner .right {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.scheduled__message .inner .right>a {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-right: 8px
}

.scheduled__message .inner .right>a:last-child {
    margin-right: 0px
}

.scheduled__message .inner .left {
    margin-right: 12px
}

.scheduled__message .inner .left>p {
    margin: 0px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 14px;
    color: rgba(17, 25, 40, 0.7);
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.scheduled__message .inner .left>p>span {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-right: 8px
}

.top__buttons {
    position: relative
}

.top__buttons .main__button {
    position: relative
}

.top__buttons .main__button>span {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    position: absolute;
    top: 50%;
    right: 10px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.top__buttons .main__button>a {
    height: 36px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-decoration: none;
    font-size: 12px;
    line-height: 16px;
    color: #4B5563;
    font-weight: 500;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    padding-left: 15px
}

.top__buttons .main__button>a span {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-right: 4px
}

.inbox .chat__wrapper .chat__controls .top__buttons ul {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.inbox .chat__wrapper .chat__controls .top__buttons {
    position: relative
}

.inbox .chat__wrapper .chat__controls .top__buttons {
    overflow-x: visible;
    overflow-y: visible
}

.inbox .chat__wrapper .chat__controls .top__buttons ul {
    bottom: 100%;
    top: auto;
    border: 1px solid #E5E7EB;
    background-color: #fff;
    max-height: 180px;
    overflow-y: auto;
    border-radius: 6px
}

.inbox .chat__wrapper .chat__controls .top__buttons ul::-webkit-scrollbar {
    width: 4px;
    height: 4px
}

.inbox .chat__wrapper .chat__controls .top__buttons ul::-webkit-scrollbar-thumb {
    border-radius: 250px;
    background-color: #1c45c2
}

.inbox .chat__wrapper .chat__controls .top__buttons ul>li>a {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.inbox .contacts__list .contacts__list--box>.contact__element>.top>p , #messages-group-feed-scroll .contact__element>.top>p {
    width: calc(100% - 100px);
    overflow: hidden;
    display: inline-block;
    text-overflow: ellipsis;
    white-space: nowrap
}

.inbox .contacts__list .contacts__list--box>.contact__element.smaller, #messages-group-feed-scroll .contact__element.smaller {
    padding-left: 20px
}

.owned {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: 4px
}

.owned .controls {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.owned .controls>span {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-right: 8px
}

.owned .controls>span:last-child {
    margin-right: 0px
}

.owned>.left {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    width: calc(100% - 60px)
}

.owned>.left>span {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-right: 8px
}

.owned>.left>p {
    margin: 0px;
    font-size: 16px;
    line-height: 140%;
    font-weight: 600;
    color: #111928;
    overflow: hidden;
    display: inline-block;
    text-overflow: ellipsis;
    white-space: nowrap
}

.chat__wrapper .right .btns .square {
    min-height: 37px;
    padding: 0px;
    min-width: 37px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

@media (max-width: 1440px) {
    .inbox .chat__wrapper .chat__top>.left>h6 {
        font-size: 17px
    }
}

@media (max-width: 1400px) {
    .inner__profile {
        min-width: 280px;
        max-width: 280px
    }
}

@media (max-width: 1360px) {
    .inbox .chat__wrapper .chat__top {
        padding: 12px 16px
    }

    .inbox .chat__wrapper .chat__controls>textarea, .inbox .chat__wrapper .chat__controls div>textarea {
        height: 80px
    }

    .inbox .chat__wrapper .chat__controls {
        padding-top: 15px;
        padding-bottom: 15px
    }

    .inbox .chat__wrapper .chat__controls .bottom__buttons {
        padding: 7px 20px
    }
}

@media (max-width: 1280px) {
    .choose__template--box {
        margin-left: 70px
    }

    .choose__template--box {
        min-width: 275px;
        max-width: 275px
    }

    .select__template--wrapper {
        max-width: 300px;
        margin-left: 42px;
        margin-top: 10px
    }

    .inbox .chat__wrapper {
        display: none
    }

    .inbox .contacts__list .top__contacts .filter__contacts {
        max-height: 480px;
        overflow-y: auto
    }

    .inbox .contacts__list .top__contacts .filter__contacts::-webkit-scrollbar {
        width: 4px;
        height: 4px
    }

    .inbox .contacts__list .top__contacts .filter__contacts::-webkit-scrollbar-thumb {
        border-radius: 250px;
        background-color: #1c45c2
    }

    .inner__profile {
        position: absolute;
        right: 0px;
        top: 53px;
        max-height: calc(100% - 53px)
    }

    .inbox .inbox__side {
        position: absolute;
        top: 53px;
        left: -220px;
        height: calc(100% - 53px);
        z-index: 8;
        -webkit-transition: .4s ease all;
        transition: .4s ease all
    }

    .inbox .contacts__list {
        width: 100%;
        min-width: 0px;
        max-width: 100%
    }
}

.inbox .contacts__list .top__contacts form .buttons>a:nth-child(2) {
    margin-right: 0px
}

@media (max-width: 767px) {
    .scheduled__message .inner {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

    .scheduled__message .inner .left {
        margin-right: 0px;
        margin-bottom: 8px
    }

    .scheduled__message .inner .right {
        width: 100%
    }

    .inbox .inbox__side.opened {
        left: 44px
    }

    .inbox .chat__list .day__mark {
        margin: 15px 0px
    }

    .inbox .chat__wrapper .chat__controls>textarea, .inbox .chat__wrapper .chat__controls div>textarea {
        height: 65px
    }

    .inbox .chat__wrapper .chat__top {
        padding: 8px 16px
    }

    .inbox .chat__wrapper .chat__top>.left>h6 {
        font-size: 15px;
        line-height: 20px
    }

    .inbox .chat__wrapper .chat__top>.left .type>span {
        font-size: 12px
    }

    .inbox .chat__wrapper .chat__top>.left .type>img {
        min-width: 15px;
        max-width: 15px
    }

    .inbox .chat__wrapper .chat__top>.left {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start
    }

    .inbox .chat__wrapper .chat__top>.left>h6 {
        margin-right: 0px;
        margin-bottom: 5px
    }

    .inbox .contacts__list .top__contacts {
        padding-top: 16px
    }

    .inbox .contacts__list .contacts__list--box>.contact__element.new:before {
        top: 21px;
        left: 11px
    }

    .inbox .contacts__list .contacts__list--box>.contact__element, #messages-group-feed-scroll .contact__element {
        padding-right: 14px;
        padding-top: 14px;
        padding-bottom: 14px;
        padding-left: 25px
    }

    .inbox .inbox__side {
        left: -220px
    }

    .inbox .chat__wrapper .chat__controls .bottom__buttons .right>button {
        padding-left: 11px;
        padding-right: 11px
    }

    .inbox .chat__wrapper .chat__controls .bottom__buttons .right>span {
        margin-right: 8px
    }

    .inbox .chat__wrapper .chat__controls .bottom__buttons ul>li {
        margin-right: 8px
    }

    .inbox .chat__wrapper .chat__top {
        padding: 8px 10px
    }

    .inbox .chat__wrapper .chat__members {
        padding: 8px 10px
    }

    .inbox .chat__list {
        padding: 10px
    }

    .inbox .chat__wrapper .chat__controls {
        padding: 10px
    }

    .inbox .chat__wrapper .chat__controls .bottom__buttons {
        padding: 7px 12px
    }
}

@media (max-width: 640px) {
    .inbox .chat__wrapper .chat__top>.right .btns span, .inbox .chat__wrapper .chat__members>.right .btns span {
        margin-right: 0px !important
    }

    .inbox .chat__wrapper .chat__top>.right .btns>a, .inbox .chat__wrapper .chat__members>.right .btns>a {
        min-height: 30px;
        min-width: 30px;
        padding-left: 0px;
        padding-right: 0px;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center
    }

    .inbox .chat__wrapper .chat__top>.right .btns>a svg, .inbox .chat__wrapper .chat__members>.right .btns>a svg {
        width: 13px
    }

    .inbox .chat__wrapper .chat__top>.right .btns>a, .inbox .chat__wrapper .chat__members>.right .btns>a {
        font-size: 0px;
        margin-right: 5px
    }
}

@media (max-width: 480px) {
    .inner__profile {
        min-width: 0px;
        max-width: 100%;
        width: calc(100% - 44px)
    }

    .inbox .chat__wrapper .chat__controls .bottom__buttons .right>span {
        font-size: 11px
    }

    .inbox .chat__wrapper .chat__controls .bottom__buttons ul>li {
        margin-right: 6px
    }

    .inbox .chat__wrapper .chat__top>.left>h6 {
        font-size: 14px;
        line-height: 19px;
        margin-bottom: 2px
    }
}

#email_subject,#template_title {
    display: none;
    width: 100%;
    height: 40px;
    padding-left: 12px;
    padding-right: 12px;
    border: 1px solid #E5E7EB;
}

#user_email_signature {
    display: none;
}

#inbox_phone_div, #inbox_notes_div {
    border: 1px solid #E5E7EB;
    display: none;
}

#phone_call_notes {
    height: 80px;
}

#inbox_lead_notes {
    position: relative;
    min-height: 30px;
    border: 1px solid #ccc;
    padding: 5px;
}

#inbox_lead_notes:empty:before {
    content: attr(data-placeholder);
    color: #aaa;
    /* Placeholder color */
    position: absolute;
    top: 15px;
    left: 20px;
    pointer-events: none;
}

#inbox_phone_div {
    padding: 5px 12px;
}

#inbox_lead_notes {
    min-height: 115px;
    padding: 15px 20px;
    border: 1px solid #e4eaec;
    background: #ffffff;
}

.phone_wrapper #inbox_phone_flex_div {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}

#inbox_phone_div>textarea {
    width: 100%;
    background-color: #fff;
    border: 0px;
    outline: none;
    border-left: 1px solid #E5E7EB;
    border-right: 1px solid #E5E7EB;
    border-bottom: 1px solid #E5E7EB;
    padding: 15px 20px;
    font-size: 14px;
    color: #000;
}

.phone_wrapper #inbox_phone_flex_div #phone_notes_div {
    grid-column: 1 / -1;
}

#inbox_phone_div label {
    font-size: 12px;
    margin: 6px 0px;
}

.form-control {
    height: 36px;
    border-color: #e4eaec;
    box-sizing: border-box;
    font-weight: 300;
    box-shadow: none;
    transition: box-shadow .25s linear, border .25s linear, color .25s linear, background-color .25s linear;
    -webkit-appearance: none;
    -moz-appearance: none;
    display: block;
    width: 100%;
    padding: 6.006px 14px;
    font-size: 14px;
    line-height: 1.57142857;
    color: #76838f;
    border: 1px solid #e4eaec;
}

#include_signature_wrapper {
    padding: 5px;
    display: none;
}

#include_signature {
    width: 16px;
    height: 12px;
}

#include_signature_label {
    font-weight: 600;
    font-size: 12px;
}

#messages-content-scrollbar {
    height: 50vh !important;
}

#messages-content-scrollbar.individual {
    bottom: 150px;
    top: 90px;
    position: absolute;
    height: auto !important;
}

.chat__controls.individual {
    position: fixed;
    bottom: 0;

}

#no-chat-history {
    text-align: center;
}

.emaillist__parent, .not_allowed_wrapper {
    display: none;
}

.sendMessageBtn:disabled,.sendTemplateBtn:disabled,.regular-btn:disabled {
    background-color: lightgrey !important;
}

.not_allowed_wrapper {
    padding: 5px 15px !important;
    background-color: #feeeef !important;
    border: 1px solid #f9b2b7;
}

.inbox .contacts__list .contacts__list--box>.contact__element>.top>p, #messages-group-feed-scroll .contact__element>.top>p {
    width: calc(100% - 50px) !important;
}

.inbox .contacts__list .contacts__list--box>.contact__element>.top .time>span, #messages-group-feed-scroll .contact__element>.top .time>span {
    font-size: 12px;
}


/* Spinner 3Balls Scale */


.sp {
    width: 32px;
    height: 32px;
    clear: both;
    margin: auto;
}

.sp-3balls, .sp-3balls:before, .sp-3balls:after {
    border-radius: 50%;
    width: 18px;
    height: 18px;
    transform-origin: center center;
    display: block;
}

.sp-3balls {
    position: relative;
    background-color: #ed525d;
    opacity: 1;
    -webkit-animation: spScaleAlpha 1s infinite linear;
    animation: spScaleAlpha 1s infinite linear;
}

.sp-3balls:before {
    content: '';
    position: relative;
    opacity: 0.25;
    background-color: #3a66ed;
}

.sp-3balls:after {
    content: '';
    position: relative;
    opacity: 0.25;
    background-color: #f8bf4a;
    margin-top: 5px;
}

.sp-3balls:before {
    left: 30px;
    top: 0px;
    -webkit-animation: spScaleAlphaBefore 1s infinite linear;
    animation: spScaleAlphaBefore 1s infinite linear;
}

.sp-3balls:after {
    left: -30px;
    top: -23px;
    -webkit-animation: spScaleAlphaAfter 1s infinite linear;
    animation: spScaleAlphaAfter 1s infinite linear;
}

@-webkit-keyframes spScaleAlpha {
    0% {
        opacity: 1;
    }

    33% {
        opacity: 0.25;
    }

    66% {
        opacity: 0.25;
    }

    100% {
        opacity: 1;
    }
}

@keyframes spScaleAlpha {
    0% {
        opacity: 1;
    }

    33% {
        opacity: 0.25;
    }

    66% {
        opacity: 0.25;
    }

    100% {
        opacity: 1;
    }
}

@-webkit-keyframes spScaleAlphaBefore {
    0% {
        opacity: 0.25;
    }

    33% {
        opacity: 1;
    }

    66% {
        opacity: 0.25;
    }
}

@keyframes spScaleAlphaBefore {
    0% {
        opacity: 0.25;
    }

    33% {
        opacity: 1;
    }

    66% {
        opacity: 0.25;
    }
}

@-webkit-keyframes spScaleAlphaAfter {
    33% {
        opacity: 0.25;
    }

    66% {
        opacity: 1;
    }

    100% {
        opacity: 0.25;
    }
}

@keyframes spScaleAlphaAfter {
    33% {
        opacity: 0.25;
    }

    66% {
        opacity: 1;
    }

    100% {
        opacity: 0.25;
    }
}

.loader-main-wrapper {
    position: absolute;
    top: 40%;
    left: 50%;
    right: 50%;
}

.loader-main-chat-wrapper {
    position: absolute;
    top: 40%;
    left: 70%;
    right: 50%;
}


.edit-conversation-tag, .delete-conversation-tag {
    font-size: 12px;
    display: none;
    cursor: pointer;
}

.assign-conversation-type__li {
    position: relative;
}

.assign-conversation-type__li .conv-count {
    right: 16%;
    position: absolute;
}

.assign-conversation-type__li .inbox-unread-count {
    right: -4%;
    position: absolute;
}

.assign-conversation-type__li .delete-conversation-tag {
    right: 5%;
    position: absolute;
}

.assign-conversation-type__li .edit-conversation-tag {
    right: 15%;
    position: absolute;
}

.assign-conversation-type__li:hover .edit-conversation-tag,
.assign-conversation-type__li:hover .delete-conversation-tag {
    display: block;
}

.assign-conversation-type__li:hover .conv-count,
.assign-conversation-type__li:hover .inbox-unread-count.unread-shown {
    display: none !important;
}

.assign__wrapper {
    position: absolute;
    min-width: 220px;
    max-width: 220px;
    top: 120px;
    right: 50px;
    border: 1px solid #E5E7EB;
    border-radius: 6px;
    background-color: #fff;
    z-index: 3;
    -webkit-box-shadow: 0px 8px 12px rgba(0, 0, 0, 0.04);
    box-shadow: 0px 8px 12px rgba(0, 0, 0, 0.04);
}

.assign__wrapper .sort__list {
    max-height: 60vh;
    overflow: hidden;
    overflow-y: auto;
}


.assign__wrapper .sort__list::-webkit-scrollbar {
    width: 4px;
    height: 4px
}

.assign__wrapper .sort__list::-webkit-scrollbar-thumb {
    border-radius: 250px;
    background-color: #1c45c2
}

.assign__wrapper .sort__list>.elem__sort {
    padding: 16px;
}

.assign__wrapper .sort__list> .elem__sort:first-child {
    border-bottom: 1px solid #E7E7E8;
}

.assign__wrapper .sort__list>.elem__sort>p {
    margin-top: 0px;
    text-transform: uppercase;
    margin-bottom: 8px;
    font-size: 12px;
    line-height: 150%;
    font-weight: 500;
    color: #6E7174;
}

.assign__wrapper .sort__list>.elem__sort ul {
    padding: 0px;
    list-style-type: none;
    margin: 0px;
}

.assign__wrapper .sort__list>.elem__sort ul>li {
    margin-bottom: 2px;
}

.assign__wrapper .sort__list>.elem__sort ul>li>a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    padding: 8px 16px;
    font-size: 14px;
    line-height: 130%;
    border-radius: 8px;
    font-weight: 400;
    color: #0E1217;
    text-decoration: none;
    -webkit-transition: .3s ease all;
    transition: .3s ease all;
    position: relative;
}

li.hide-assign-option {
    display: none;
}

.inbox .chat__wrapper .chat__members .tags-list>.elem,.inbox .chat__wrapper .chat__members .users-list>.elem {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 8px 12px;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    margin-right: 7px;
}

.inbox .chat__wrapper .chat__members .tags-list>.elem>span , .inbox .chat__wrapper .chat__members .users-list>.elem>span{
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-width: 18px;
    max-width: 18px;
    min-height: 18px;
    max-height: 18px;
    border-radius: 250px;
    background-color: #F0EFFE;
    margin-right: 10px;
    font-size: 8px;
    line-height: 150%;
    font-weight: 500;
    color: #1C45C2;
}

.inbox .chat__wrapper .chat__members .tags-list>.elem>p,.inbox .chat__wrapper .chat__members .users-list>.elem>p {
    margin: 0px;
    font-size: 12px;
    line-height: 150%;
    font-weight: 500;
    color: #111928;
    white-space: nowrap;
}

.chat__members .tags-list,.chat__members .users-list {
    display: flex;
}

.remove-assign-tag , .remove-assign-user {
    cursor: pointer;
}

.modal__wrapper .inner__modal .confirm__modal {
    background-color: #fff;
    width: 100%;
    max-width: 605px;
    border-radius: 8px;
    border: 1px solid #E5E7EB;
    padding: 0px 10px;
}

.confirm-title-wrapper {
    padding: 20px 6px;
}

.modal__wrapper .inner__modal .confirm__modal .controls {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-top: 1px solid #E5E7EB;
    padding: 14px;
}

.modal__wrapper .inner__modal .confirm__modal .controls>.cancel-btn:hover {
    opacity: .7;
}
.modal__wrapper .inner__modal .confirm__modal .controls>.cancel-btn {
    min-height: 48px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-left: 20px;
    padding-right: 20px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 8px;
    font-size: 16px;
    line-height: 150%;
    color: #1C45C2;
    font-weight: 500;
    text-decoration: none;
    margin-right: 8px;
    -webkit-transition: .3s ease all;
    transition: .3s ease all;
}


.modal__wrapper .inner__modal .confirm__modal .controls .regular-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-height: 36px;
    font-size: 16px;
    background-color: #111928;
    -webkit-transition: .3s ease all;
    transition: .3s ease all;
    padding-left: 20px;
    padding-right: 20px;
}

#inbox_filters_form {
    max-height: 50vh;
    overflow-y: auto;
}

.opt-keyword-filter {
    margin : 12px 0px;
}

.group__element .contact__type__image__wrapper {
    display: none !important;
}

.decrease-top {
    top: 12% !important;
}

.decrease-top-add-new {
    top: 20% !important;
}

.decrease-top-unset {
    top: unset !important;
}

.sendTemplateBtn,#messageTemplateTextArea {
    display: none;
}

#validlabel,#invalidLabel {
    color: #8a8b93;
}

#invalidUserList {
    max-height: 400px;
    overflow: hidden;
    overflow-y: auto;
}
#invalidUserList .one-message-feed {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 1px;
    padding: 5px 15px;
    border-bottom: 1px solid gainsboro;
}

#invalidUserList .one-message-feed > div:nth-child(1) {
    width: 30px;
    -webkit-box-flex: 30px;
    -ms-flex: 30px;
    flex: 30px;
    min-width: 30px;
    max-width: 30px;
}

#invalidUserList label.profile-image-name {
    height: 25px;
    width: 25px;
    background-color: #eceffc;
    display: flex;
    border-radius: 100%;
    justify-content: center;
    align-items: center;
    margin: 0;
    cursor: pointer;
    font-size: 10px;
    padding: 0;
    float: left;
}

#invalidUserList  label {
    color: #8a8b93;
    text-transform: initial;
    letter-spacing: 0.1px;
    font-weight: 500;
    text-align: center;
}


#invalidUserList .one-message-feed > div:nth-child(2) {
    width: calc(100% - 30px);
    -webkit-box-flex: calc(100% - 30px);
    -ms-flex: calc(100% - 30px);
    flex: calc(100% - 30px);
    min-width: calc(100% - 30px);
    max-width: calc(100% - 30px);
    text-align: left;
}

#invalidUserList p {
    margin-bottom: 0 !important;
    font-size: 14px;
    text-transform: capitalize !important;
    padding-left: 5px;
}

.one-message-feed .one-messagen-name {
    font-weight: 600;
    color: #1c2538;
    font-size: 14px;
}

.one-message-feed p {
    margin: 0 !important;
    margin-bottom: 5px !important;
}

.inner__profile #responsible__info .elem,.inner__profile #member__info .elem {
    display: flex !important;
    flex-direction: row !important;
}

.inner__profile .list-profile-image-name {
    background-color: #D5F5F6;
    color: #54ABB9;
    display: -webkit-box;
    display: -ms-flexbox;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-width: 45px;
    max-width: 45px;
    min-height: 45px;
    max-height: 45px;
    border-radius: 250px;
    margin-right: 5%;
}

.add__conversation .request span,.add__group__member .request span {
    display: inline-block;
    background: #f8f8f8;
    padding: 5px 4px;
    border-radius: 12px;
    font-size: 10px !important;
    width: calc(40% - 4px);
    float: left;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    margin: 0px 4px 0 0 !important;
    color: #000000;
    border: 1px solid #dedede;
    text-align: center;
    line-height: 100% !important;
}

.start__conversation__text {
    display: none;
    margin-bottom: 10%;
}

.start__conversation__text p {
    text-align: center;
    float: left;
}

#config-inbox-submit {
    margin-top: 5%;
}

.selected-image-preview {
    overflow: hidden;
    position: relative;
    width: 100%;
    border-bottom: 1px solid #9e9e9e6b;
    padding: 15px 15px;
    display: none;
}

.selected-image-preview .selected-image-preview-inner {
    height: 100px;
    width: 100px;
    overflow: hidden;
    position: relative;
}

.selected-image-preview .selected-image-preview-inner .preview-img {
    width: 100%;
    max-width: 100%;
    height: 100%;
    object-fit: cover;
    max-width: initial;
    border-radius: 8px;
}

.selected-image-preview .selected-image-preview-inner .preview-img-remove {
    position: absolute;
    top: 5px;
    right: 5px;
    z-index: 9;
    height: 19px;
    background: #eceffc;
    border-radius: 100%;
    cursor: pointer;
}

#groupMessageDetails .one-message-content-attachment img {
    height: 150px;
    max-width: 300px;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
}

div.group__members__list {
    padding: 40px 10px 10px;
}

.group__members__list .one-selected-member {
    margin-right: 5px;
    border: 1px solid rgb(199, 211, 249);
    display: inline-flex;
    align-items: center;
    padding: 4px;
    marign-right: 6px;
    margin-bottom: 12px;
    border-radius: 50px;
}

div.group__members__list .one-selected-member span {
    font-size: 11px;
}

.one-selected-member span {
    font-size: 14px;
    color: rgb(28, 37, 56);
    margin-right: 10px;
}

.one-selected-member span:nth-child(2) img {
    width: 15px;
    height: auto;
    display: block;
}

.next__group__step {
    float:right;
    display: none;
    margin-bottom: 2%;
}

#add-group-pic {
    padding-bottom: 25px;
    border-bottom: 1px solid #f1f1f1;
}
#add-group-pic {
    padding: 18px;
}

#add-group-pic #add-group-top-row {
    margin-bottom: 25px;
}
#add-group-pic #add-group-top-row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

#add-group-pic #add-group-top-row > div:nth-child(1) {
    width: 100px;
    -webkit-box-flex: 100px;
    -ms-flex: 100px;
    flex: 100px;
    min-width: 100px;
    max-width: 100px;
    margin-right: 10px;
}

#add-group-pic #add-group-top-row > div:nth-child(1) img {
    width: 100%;
    max-width: 100%;
    height: 100px;
    object-fit: cover;
    max-width: initial;
    border-radius: 100%;
}

#add-group-pic #add-group-top-row > div:nth-child(2) {
    width: calc(100% - 110px);
    -webkit-box-flex: calc(100% - 110px);
    -ms-flex: calc(100% - 110px);
    flex: calc(100% - 110px);
    min-width: calc(100% - 110px);
    max-width: calc(100% - 110px);
}

.upload-btn-wrapper {
    position: relative;
    overflow: hidden;
    display: block;
    margin-bottom: 5px;
}

.upload-btn-wrapper .btn,.create__group__button .btn,.edit__group__button .btn {
    border: 1px solid gray;
    background-color: black;
    padding: 6px 8px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    color: #ffffff;
}

.upload-btn-wrapper input[type=file] {
    font-size: 100px;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

.create__group__button,.edit__group__button {
    text-align: center;
}

#groupLogo {
    color: transparent;
}

#add-group-pic #add-group-top-row > div:nth-child(2) p.add-pic-details {
    color: #b7babf;
    font-size: 12px;
}

#add-group-photo-members,#edit-group-photo-members {
    padding: 25px 18px;
}

#add-group-photo-members .profile-box-header,#edit-group-photo-members .profile-box-header {
    font-size: 12px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #b7babf;
    font-weight: 500;
    margin-bottom: 20px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.one-group-member {
    justify-content: left;
    align-items: center;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 20px;
}

label.list-profile-image-name {
    height: 40px;
    width: 40px;
    background-color: #eceffc;
    display: flex;
    border-radius: 100%;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    cursor: pointer;
    font-size: 15px;
}

.one-group-member.edit-members > div:nth-child(1) {
    width: 40px;
    -webkit-box-flex: 40px;
    -ms-flex: 40px;
    flex: 40px;
    min-width: 40px;
    max-width: 40px;
}

.one-group-member.edit-members > div:nth-child(2) {
    width: calc(100% - 80px);
    -webkit-box-flex: calc(100% - 80px);
    -ms-flex: calc(100% - 80px);
    flex: calc(100% - 80px);
    min-width: calc(100% - 80px);
    max-width: calc(100% - 80px);
    padding-left: 10px;
}

.one-group-member.edit-members > div:nth-child(3) {
    width: 40px;
    -webkit-box-flex: 40px;
    -ms-flex: 40px;
    flex: 40px;
    min-width: 40px;
    max-width: 40px;
    text-align: right;
}

label.list-profile-image-name {
    height: 40px;
    width: 40px;
    background-color: #eceffc;
    display: flex;
    border-radius: 100%;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    cursor: pointer;
    font-size: 15px;
}

.one-group-member .group-member-email {
    overflow-wrap: break-word;
}

.one-group-member .group-member-name {
    margin-top: 5px;
    font-size: 13px;
    color: #1c2538;
    font-weight: 500;
    overflow-wrap: anywhere;
    margin-bottom: 1px;
}

.one-group-member .group-member-phone {
    margin-top: 5px;
    font-size: 12px;
    color: #1c2538;
    overflow-wrap: anywhere;
    margin-bottom: 0;
}

.one-group-member.edit-members .delete-member {
    display: inline-block;
    padding: 4px 10px;
    line-height: 1.1;
    border-radius: 20px;
    background: rgba(243, 83, 94, 0.08);
    border: 2px solid #f3535e;
}

.create__group__wrapper,.edit__group__wrapper {
    display: none;
}

#add-group-pic input[type="text"], #add-group-pic input[type="email"], #add-group-pic select {
    padding-left: 15px;
    height: 42px;
}
#add-group-pic input[type="text"], #add-group-pic input[type="email"], #add-group-pic select, #add-group-pic textarea {
    width: 100%;
    background: #f9f9f9;
    border: 0;
    font-weight: 500;
    border-radius: 10px;
    font-size: 14px;
    color: #1c2538;
}

#groupSelectedMember {
    max-height: 30vh;
    overflow: hidden;
    overflow-y: auto;
}

.loader-main-wrapper b {
    white-space: nowrap;
    margin-left: -45px;
}

.profile__main .controls {
    text-align: right;
    cursor: pointer;
}

#add-group-photo-members .add-members-block .contacts-header {
    padding: 0;
}

.contact-search {
    width: 100%;
}

#messages-group-feed-scroll,#editGroupSelectedMember {
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-height: 50vh;
    padding-right: 10px;
}

.editGroupUser .one-group-member.one-add-member {
    padding: 10px 0px;
    margin: 0;
}

.contact-search form>.search {
    width: 100%;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
}

.contact-search  form>.search>input {
    width: 100%;
    height: 36px;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    background-color: #F9FAFB;
    outline: none;
    padding-left: 42px;
    padding-right: 15px;
}

.contact-search form>.search button {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    cursor: pointer;
    border: 0px;
    outline: none;
    background-color: transparent;
    position: absolute;
    left: 10px;
}

#messages-group-feed-scroll .contact__element {
    padding-right: 0px;
    padding-left: 0px;
}

#messages-group-feed-scroll .contact__element>.top>p {
    width: 100%;
}

.add-member.added {
    border-color: #eceffc;
    background: #eceffc;
    font-weight: 500;
    display: inline-block;
    font-size: 12px;
    padding: 4px 10px;
    border-radius: 20px;
    border: 2px solid #3c68ec;
    color: #3c68ec;
}

.one-group-member > div:nth-child(1) img {
    width: 40px;
    height: 40px;
    border-radius: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
}

.schedule-time.selected,
.schedule-time.selected * {
    background: aliceblue;
    color: #000 !important;
    width: 100%;
}

.clear-schedule-time{
    display: none;
}

.delete-message {
    cursor: pointer;
}

.chat__top {
    min-height: 75px;
}

.chat__members {
    min-height: 55px;
}

.chat__controls {
    min-height: 150px;
}

span.inbox-unread-count {
  background: #f3535e;
  border-radius: 999px;
  height: auto;
  min-width: 25px;
  text-align: center;
  line-height: 1;
  font-size: 10px !important;
  margin-left: 6px;
  color: #ffffff !important;
  font-weight: 500;
  display: none;
  justify-content: center;
  align-items: center;
  vertical-align: middle;
  white-space: nowrap;
  padding: 2px 6px;
}

span.tag-type-image {
  margin-right: 5px;
  padding-top: 5px;
}

.main__wrapper.inbox {
    display: flex;
}

.message__count.warning {
  color: red !important;
}

.message__remaining__count.warning {
  color: red !important;
}

.message .title img {
    height: 16px;
    width: 16px;
}

.inbox .contacts__list .contacts__list--box>.contact__element>.top .time {
    white-space: nowrap;
}

.inbox_email_preview {
    width: 56% !important;
    display: none;
    max-width: 600px;
}

.inbox_email_preview div.profile-details-div {
    position: fixed;
    max-width: 600px;
}

.profile-details-div {
    width: 100%;
}

.inbox_email_preview div#inbox_email_preview_body {
    padding: 10px 5px;
    margin: 10px 0px;
    height: 80vh;
    border: 1px solid color(srgb 0.945 0.9451 0.9452);
    border-radius: 5px;
    background-color: #ffffff;
}


.email-newsletter-full-preview {
    padding: 18px;
    background-color: #ffffff;
    display: none;
    position: absolute;
    z-index: 99;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    border-left: 1px solid #f1f1f1;
    border-top: 1px solid #f1f1f1;
}

.email-newsletter {
    background-color: #f1f1f1;
    padding: 10px 18px;
    border-radius: 12px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    cursor: pointer;
}

.inbox_email_preview .profile-header-buttons {
    float: right;
}

.inbox_email_preview .notes-list-close {
    position: relative;
    top: 3px;
    height: 20px;
    width: 20px;
    background-position: center;
    left: 0;
    opacity: 0.6;
    border: none;
    background-color: transparent;
    grid-column: 3/4;
    grid-row: 1/2;
    background-repeat: no-repeat;
    background-size: 12px 12px;
    background-position: center 10px;
    background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' fill='none' xmlns='http://…-4.5 4.5-1.3-1.3L4.7 6 .2 1.5 1.5.2 6 4.7z' fill='%231C2538'/%3E%3C/svg%3E");
}

#inbox_email_preview_div {
    padding: 25px 18px;
}

#close_email_preview_popup {
    cursor: pointer;
}

button.add-group-member {
    white-space: nowrap;
}

.chat__top .left {
    flex-wrap: wrap;
}

#top-bar-duplicate-count {
    flex-basis: auto;
    margin-left: 0;
    width: 100%;
    display: none;
}

#show_duplicate_popup .popup-center .duplicate_list {
    height: 56vh;
    max-height: 620px;
    padding-right: 10px;
    overflow-x: auto;
}

#top-bar-name {
text-transform: capitalize;
}

.pipeline-column-item-avatar-empty {
    height: 40px;
    width: 40px;
    margin-top: 5px;
    border-radius: 50%;
    background-color: #ecf0fe;
    font-style: normal;
    font-weight: bold;
    font-size: 12px;
    line-height: 16px;
    text-align: center;
    color: #3c68ec;
    text-transform: uppercase;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 3px;
}

.lead-item-card-text {
padding-right: 10px;
}

.lead-item-card-name {
    font-style: normal;
    font-weight: normal;
    font-family: "Inter";
    font-size: 14px;
    line-height: 16px;
    color: #111;
}

.lead-item-card-value {
    font-style: normal;
    font-weight: normal;
    font-family: "Inter";
    font-size: 12px;
    line-height: 14px;
    color: #9a9fa7;
    padding-top: 4px;
}

.lead-item-card {
    padding: 20px 20px;
    display: flex;
    align-items: center;
    border: 1px solid #e3e3e4;
    margin-bottom: 5px;
    box-sizing: border-box;
    border-radius: 10px;
}

body.dark .lead-item-card {
    border: 1px solid var(--color-dark-tbl-border);
}

.inbox .chat__wrapper .chat__members .left {
    flex: 0 0 70%;
    max-width: 70%;
    overflow: hidden;
    overflow-x: auto;
}

.inbox .chat__wrapper .chat__members .right {
    flex: 0 0 30%;
    max-width: 30%;
}

#show_duplicate_popup .scroll-div {
    overflow: hidden;
    overflow-y: auto !important;
    max-height: 400px;
    padding-right: 20px;
}

/* Tooltip container */
.tooltip {
    position: relative;
    display: inline-block;
    cursor: pointer;
}

/* Tooltip text */
.tooltip .tooltip-text {
    visibility: hidden;
    position: absolute;
    background-color: rgba(0, 0, 0, 0.8);
    color: #fff;
    text-align: center;
    padding: 5px 10px;
    border-radius: 4px;
    white-space: nowrap;
    font-size: 14px;
    z-index: 100;
    bottom: 120%;
    left: 50%;
    transform: translateX(-10%);
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
}

/* Tooltip hover effect */
.tooltip:hover .tooltip-text {
    visibility: visible;
    opacity: 1;
}

.hide-div {
    display: none !important;
}

.note-editing-area {
    background-color: #fff !important;
}

.gln_hidden_input_container {
    display: none;
}

/* Whatsapp */
#the-keywords,
#whatsapp_template_div
{
    margin-bottom: 20px;
    padding-top: 20px;
    margin-top: 10px;
    border-top: 1px dashed rgb(243, 243, 243);
}

#the-keywords p,
#whatsapp_template_div p
{
    font-weight: bold;
    margin-bottom: 12px;
    font-size: 14px;
    margin-top: 0;
}

#the-keywords a,
#whatsapp_template_list a
{
    display: inline-block;
    margin-right: 10px;
    margin-bottom: 5px;
    font-size: 13px;
    color: rgb(28, 37, 56);
    padding: 6px 8px;
    border-radius: 4px;
    background: rgb(249, 249, 249);
    border: 1px solid rgb(240, 240, 240);
}

#whatsapp_template_list a.whatsapp_template_link:hover,
#whatsapp_template_list a.whatsapp_template_link.selected {
   background: #3c68ec;
   color: #fff;
}

.whatsapp_template_messgae_preview_div {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    padding: 2px 10px;
    border: 1px solid #E5E7EB;

    .wa-title {
        font-weight: 600;
        margin-bottom: 10px;
    }

    .wa-header {
        margin-bottom: 5px;
        padding-bottom: 5px;
        border-bottom: 1px dashed #23a74a;
        font-size: 12px !important;
    }

    .wa-body {
        font-size: 12px !important;
    }

    .wa-footer {
        margin-top: 5px;
        padding-top: 5px;
        border-top: 1px dashed #23a74a;
        font-size: 12px !important;
    }

    .whatsapp_template_msg_select_params_div {
        display: flex;
        /* gap: 10px; */
        justify-content: flex-start;
    }

    .whatsapp_template_messgae_params,
    .whatsapp_template_messgae_preview {
        width: 100%;
    }

    #whatsapp_template_messgae_preview {
        background: #018b2a;
        color: #fff;
        padding: 5px;
        border-radius: 5px;
        margin: 5px 0;
    }

    #whatsapp_template_messgae_params {
       background: #fff;
        padding: 5px;
        border-radius: 5px;
        margin-top: 5px;
    }

    .whatsapp_template_msg_params strong,
    .whatsapp_template_msg_params span {
        font-size: 12px !important;
    }

    .whatsapp_template_msg_select select {
        width: 100%;
        /* background: #f9f9f9; */
        border: 1px solid #a7a7a7;
        font-weight: 500;
        font-size: 13px;
        color: #1c2538;
        height: 25px;
        margin-bottom: 5px;
        max-width: 300px;
    }

    .whatsapp_template_msg_params {
        margin-left: 10px;
        /* min-width: 150px; */
    }
}

.gln_alert_danger {
    visibility: visible;
    max-width: 100%;
    margin: auto;
    text-align: left !important;
    border-radius: 8px;
    z-index: 1;
    font-size: 12px;
    padding: 15px 15px !important;
    background-color: #feeeef !important;
    border: 1px solid #f9b2b7;
    color: #000000 !important;
    margin-bottom: 15px;
}

.gln_inbox_link {
    margin: 0 !important;
    padding: 0 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    font-size: inherit !important;
}

.switch_to_normal_whatsapp_msg {
    cursor: pointer;
    margin-left: 10px;
    font-size: 10px;
}

#switch_to_normal_whatsapp_msg_wrapper {
    border-left: 1px solid #E5E7EB;
    width: 25%;
}

.compose__dropdown {
    z-index: 1;
}

.elements__wrapper .folders_wrapper .page-aside-section a {
    font-size: 12px;
}

.elements__wrapper .folders_wrapper .page-aside-section {
    margin-bottom: 12px;
}

.confirm-title-section {
    position: relative;
}

.confirm-title-section a {
    position: absolute;
    right: 10px;
    top: 0px;
}

#success-stop-confirm-popup .alert, #danger-stop-confirm-popup .alert {
    margin-top: 1em;
    text-align: center;
}

.inbox_close_conversion_confirm_popup .inbox_close_conversion_options {
    padding-bottom: 5px;
    margin-bottom: 14px;
    border-bottom: 1px solid #e3e3e3;
}

.inbox_close_conversion_confirm_popup .select_input_filter {
    display: flex;
    align-items: center;
}

.inbox_close_conversion_confirm_popup #inbox_cnv_dec_selected {
    height: 500px;
    overflow-y: auto;
}

.inbox_close_conversion_confirm_popup .inbox_close_conversion_buttons {
text-align: end;
margin-top: 20px;
}

.close_cnv_head_type {
    margin-left: 20px;
}

.inbox_cnv_opt {
    display: flex;
}

.inbox_close_conversion_confirm_popup .close_mul_cnv_user_list {
    border: 1px solid gray;
    border-radius: 5px;
    padding: 5px 10px;
    display: flex;
    align-items: center;
    margin-top: 8px;
    margin-bottom: 5px;
    height: 50px;
}

.inbox_close_conversion_confirm_popup label {
    cursor: pointer !important;
    display: flex !important;
    align-items: center;
    width: 100%;
}

.inbox_close_conversion_confirm_popup .input_user_info {
margin-left: 10px;
}

.select__template--wrapper .tab button.active {
    background-color: #eceffc;
    font-weight: 600;
}

.select__template--wrapper .campaign_template_title img {
    max-width: 80px;
    max-height: 50px;
    display: block;
}

.select__template--wrapper a.campaign_template_title * {
    font-size: 12px;
}

.select__template--wrapper a.campaign_template_title .top {
    display: flex;
}
.select__template--wrapper a.campaign_template_title .top p {
   margin-left: 12px;
   font-size: 14px;
}

.select__template--wrapper a.campaign_template_title span {
    color: blue;
}

.select__template--wrapper .use_campaign_template {
    margin-right: 16px;
}

.select__template--wrapper #campaign_template,.select__template--wrapper #inbox_template{
    max-width: 300px;
    width: 300px;
}

.select__template--wrapper .tab button {
    padding : 8px;
    background-color: #f3f3f3;
}

.select__template--wrapper .templates-tabs {
    display: flex;
}

#hide-preview-mail-div {
    font-weight: 600;
    color: blue;
    font-size: 10px;
    cursor: pointer;
}

#show-preview-mail-div {
    max-height: 125px;
    overflow-y: auto;
}

.select__template--wrapper a.campaign_template_title .template__actions {
    margin-top: 12px;
}

.schedule_wrapper {
    margin-bottom: -12px;
    color: var(--color-primary-blue); /* Soft blue */
    font-weight: 500;
    font-size: 14px;
    padding-left: 12px;
    display: none;
}
body.dark .schedule_wrapper {
    color: var(--color-dark-text);
}

.chat__controls .messages_form_overlay {
    background: #ffffffcc;
    width: 100%;
    height: 100%;
    position: absolute;
    margin: auto;
    z-index: 2500 !important;
}

.chat__controls .messages_form_overlay .lock_icon {
    position: absolute;
    top: 20%;
    left: 30%;
}

.chat__controls .messages_form_overlay .individual_lock_icon {
    position: absolute;
    top: 20%;
    left: 50%;
}

#phone-template-popup .confirm-title {
    overflow-wrap: anywhere;
    max-width: 500px;
}

#phone-template-popup #phone_template_contents {
    min-height: 50px;
}

.assign-conversation-type .tag-title {
    overflow-wrap: anywhere;
    max-width: 60%;
}

.info-box {
    background-color: #fff3cd;
    border: 1px solid #ffeeba;
    color: #856404;
    padding: 10px;
    border-radius: 4px;
    font-size: 14px;
}

.contacts__list--box .tag-type-image img {
    height: 18px;
    width: 16px;
}

#show_duplicate_popup {
    z-index: 99 !important;
}

.reference-section {
  border-top: 1px solid #ccc;
  padding-top: 15px;
  font-family: sans-serif;
}

.ref-title {
  margin-bottom: 12px;
  font-size: 18px;
  color: #333;
}

.ref-card {
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 8px;
  padding: 12px;
  margin-bottom: 15px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}

.ref-header {
  display: flex;
  justify-content: space-between;
  font-weight: bold;
  margin-bottom: 8px;
}

.ref-text {
  font-size: 14px;
  color: #444;
  margin-bottom: 8px;
}

.expand-text {
  font-size: 12px;
  color: #0077cc;
  cursor: pointer;
}

.ref-meta {
  font-size: 13px;
  color: #555;
}

.meta-item {
  margin-top: 4px;
}

#show-chat-references .modal__box {
    max-width: 60vw;
    padding: 0px 15px;
}

#show-chat-references .modal__box .top {
    margin-top: 15px;
    margin-bottom: 0px;
    padding-bottom: 0px;
}
   
body.dark #show-chat-references .ref-card { 
    background: var(--color-dark-bg-body);
    color: var(--color-dark-text);
    border-color: var(--color-dark-tbl-border);
}

body.dark #show-chat-references .ref-text, body.dark #show-chat-references .top h3{ 
    color: var(--color-dark-text-light);
}

body.dark #show-chat-references .reference-section { 
    border-color: var(--color-dark-tbl-border);
}

body.dark #show-chat-references .ref-title,
body.dark #show-chat-references .meta-item strong { 
    color : var(--color-dark-text);
}

body.dark #show-chat-references .meta-item a { 
    color : var(--color-dark-text-light);
}