.bx-im-list-channel__container {
	--im-list-channel__background-color_pinned-section: #f8fafb;
	--im-list-channel__background-color_pinned-section-border: var(--ui-color-palette-gray-10);
	--im-list-channel__font-color_empty-title: var(--im-color-palette-gray-50);

	--im-list-channel__background-color: var(--im-color-palette-white-base);

	height: 100%;
	display: flex;
	flex-direction: column;
}

.bx-im-list-channel__scroll-container {
	flex-grow: 1;
	overflow: hidden;
	overflow-y: scroll;
	background-color: var(--im-list-channel__background-color)
}

.bx-im-list-channel__empty {
	display: flex;
	justify-content: center;
	align-items: center;

	margin-top: 43px;
}

.bx-im-list-channel__empty_icon {
	width: 24px;
	height: 24px;
	margin-right: 8px;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3.999 6.077c0-.706.573-1.28 1.28-1.28h9.346c.706 0 1.28.574 1.28 1.28v6.37a1.28 1.28 0 01-1.28 1.28H9.952l-2.567 2.567a.24.24 0 01-.41-.17v-2.397H5.278a1.28 1.28 0 01-1.28-1.28v-6.37z' fill='%23D5D7DB'/%3E%3Cpath d='M9.951 15.711v.705c0 .706.573 1.28 1.28 1.28h3.54l1.703 1.987a.24.24 0 00.422-.156v-1.832h1.697a1.28 1.28 0 001.28-1.28v-6.37a1.28 1.28 0 00-1.28-1.279h-.704v5.266a1.68 1.68 0 01-1.68 1.68H9.951z' fill='%23D5D7DB'/%3E%3C/svg%3E");
}

.bx-im-list-channel__empty_text {
	font: var(--im-font-size-md) var(--im-font-family-system);
	font-weight: var(--im-font-weight-medium);
	color: var(--im-list-channel__font-color_empty-title);
}

.bx-im-list-channel__general_container {
	margin: 4px 4px 6px 4px;
}
.bx-im-list-channel-item__wrap {
	--im-list-channel-item__background-color: var(--im-color-palette-white-base);
	--im-list-channel-item__background-color_hover: #f1f4f6;
	--im-list-channel__background-color_selected: #00ace3;
	--im-list-channel__background-color_separator: rgba(82,92,105,0.08);

	--im-list-channel__font_message: var(--im-font-size-md)/19px var(--im-font-family-system);
	--im-list-channel__font-color_message: var(--im-color-palette-gray-60);
	--im-list-channel__font_date: var(--im-font-size-xs)/var(--im-font-line-height-3xs) var(--im-font-family-system);
	--im-list-channel__font-color_date: var(--im-color-palette-gray-40);

	background-color: var(--im-list-channel-item__background-color);
	transition: background-color .1s;
	position: relative;
	border-radius: var(--im-border-radius-sm);
}

.bx-im-list-channel-item__wrap:before {
	content: '';
	position: absolute;
	width: calc(100% - 10px);
	height: 1px;
	background-color: var(--im-list-channel__background-color_separator);
	margin-left: 5px;
	opacity: 1;
	transition: opacity .3s;
}

.bx-im-list-channel-item__wrap:first-child {
	margin-top: var(--im-space-stack-2xs);
}

.bx-im-list-channel-item__wrap:hover {
	background-color: var(--im-list-channel-item__background-color_hover);
}

.bx-im-list-channel-item__wrap:hover + .bx-im-list-channel-item__wrap:before,
.bx-im-list-channel-item__wrap.--selected + .bx-im-list-channel-item__wrap:before,
.bx-im-list-channel-item__wrap:hover:before,
.bx-im-list-channel-item__wrap:first-child:before {
	opacity: 0;
}

/* container */
.bx-im-list-channel-item__container {
	display: flex;
	height: 70px;
	padding: 0 8px 0 10px;
	transition: background .3s;
	cursor: pointer;
}
/* end container */

/* avatar */
.bx-im-list-channel-item__avatar_container {
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	height: 100%;
	margin-right: 13px;
}

.bx-im-list-channel-item__avatar_content {
	position: relative;
}
/* end avatar */

/* content */
.bx-im-list-channel-item__content_container {
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-width: 0;
	flex: 1;
	height: 70px;
	padding-right: 3px;
}

.bx-im-list-channel-item__content_header {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	margin-bottom: 3px;
}

.bx-im-list-channel-item__content_bottom {
	display: flex;
	justify-content: space-between;
	height: 38px;
}
/* end content */

.bx-im-list-channel-item__date {
	display: flex;
	flex-shrink: 0;
	align-items: center;
	justify-content: right;
	height: 18px;
	margin-left: 3px;
	font: var(--im-list-channel__font_date);
	color: var(--im-list-channel__font-color_date);
}

/* message */
.bx-im-list-channel-item__message_container {
	display: flex;
	font: var(--im-list-channel__font_message);
	font-weight: var(--im-font-weight-normal);
	color: var(--im-list-channel__font-color_message);
}

.bx-im-list-channel-item__wrap.--selected .bx-im-list-channel-item__message_container {
	color: var(--im-color-palette-white-base);
}

.bx-im-list-channel-item__message_text {
	text-overflow: ellipsis;
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	word-break: break-word;
}

.bx-im-list-channel-item__message_author-icon.--self {
	display: inline-block;
	width: 11px;
	min-width: 11px;
	height: 11px;
	margin-right: 4px;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='11' height='11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M5.95 4.575H2.5l2.1-2.25c.3-.3.3-.8 0-1.1-.3-.3-.75-.3-1.05 0L.2 4.825c-.05.05-.05.1-.1.1 0 0 0 .05-.05.05 0 .05-.05.05-.05.1v.6c0 .05.05.05.05.1v.05c.05.05.05.1.1.1l3.35 3.6c.15.15.35.25.55.25.2 0 .4-.1.55-.25.3-.3.3-.8 0-1.1l-2.1-2.25h3.45c1.65 0 3 1.4 3 3.2 0 .45.35.8.75.8s.75-.35.75-.8c0-2.65-2.05-4.8-4.5-4.8z' fill='%23A8ADB4'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}

.bx-im-list-channel-item__message_author-avatar {
	display: inline-block;
	margin-right: 4px;
	max-height: 14px;
	filter: saturate(70%);
	vertical-align: text-bottom;
	margin-bottom: 1px;
}
/* end message */

/* Active item */
.bx-im-list-channel-item__wrap.--selected {
	background-color: var(--im-list-channel__background-color_selected);
}

.bx-im-list-channel-item__wrap.--selected .bx-im-chat-title__text {
	color: var(--im-color-palette-white-base);
}

.bx-im-list-channel-item__wrap.--selected .bx-im-list-channel-item__message_container {
	color: var(--im-color-palette-white-base);
}

.bx-im-list-channel-item__wrap.--selected .bx-im-list-channel-item__date {
	color: rgba(var(--im-color-palette-white-base-rgb), 0.7);
}

.bx-im-list-channel-item__wrap.--selected .bx-im-list-channel-item__message_author-icon.--self {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='11' height='11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M5.95 4.575H2.5l2.1-2.25c.3-.3.3-.8 0-1.1-.3-.3-.75-.3-1.05 0L.2 4.825c-.05.05-.05.1-.1.1 0 0 0 .05-.05.05 0 .05-.05.05-.05.1v.6c0 .05.05.05.05.1v.05c.05.05.05.1.1.1l3.35 3.6c.15.15.35.25.55.25.2 0 .4-.1.55-.25.3-.3.3-.8 0-1.1l-2.1-2.25h3.45c1.65 0 3 1.4 3 3.2 0 .45.35.8.75.8s.75-.35.75-.8c0-2.65-2.05-4.8-4.5-4.8z' fill='%23fff'/%3E%3C/svg%3E");
}
/* End active item */