.multicollab_body_class {
	.cls-board-outer {
		.cf-mentioned-user-popup {
			margin-top: -5px;
		}
		.cf-assignable-list-popup {
			margin-top: 25px;
		}
		.cf-mentioned-user-popup,
		.cf-assignable-list-popup {
			ul {
				li {
					margin-bottom: 0;
					.cf-user-info {
						.cf-user-role {
							display: block;
							line-height: 18px;
							color: #000000;
							font-size: 12px;
							font-weight: 400;
						}
					}
				}
			}
		}
		.js-mentioned {
			font-weight: 600;
			text-decoration: none;
		}
		.assigned-meta-text {
			font-size: 12px;
			font-weight: 400;
			color: #757575;
			font-style: italic;
			margin-top: 12px;
			display: block;
		}
		.board {
			.commentContainer {
				.commentText {
					a {
						color: #0568C1;
						&.js-mentioned {
							color: #0568C1;
							display: inline-block;
						}
					}
				}
			}
		}
	}
	/*[contenteditable=true]:empty {
		// To resolve github issue #1189 
		&::before {
			content: attr(placeholder);
			display: block;
		}
	}*/
	.cf-system-user-email-list {
		max-height: 300px;
		overflow-y: scroll;
		margin: 0;
	}
	.cf-mentioned-user-popup,
	.cf-assignable-list-popup {
		display: block;
		width: 90%;
		height: auto;
		position: absolute;
		z-index: 10;
		border-radius: 5px;
		background: #fff;
		-webkit-box-shadow: 0 0px 8px 0 rgb(0, 0, 0, 0.20);
		box-shadow: 0 0px 8px 0 rgb(0, 0, 0, 0.20);
		padding: 4px 0;
		ul {
			li {
				list-style: none;
				display: -webkit-box;
				display: -ms-flexbox;
				display: flex;
				cursor: pointer;
				-webkit-box-pack: start;
				-ms-flex-pack: start;
				justify-content: flex-start;
				-webkit-box-align: center;
				-ms-flex-align: center;
				align-items: center;
				padding: 9px 12px;
				margin-bottom: 0;
				-webkit-transition: all 0.3s ease-in-out;
				-o-transition: all 0.3s ease-in-out;
				transition: all 0.3s ease-in-out;
				&:hover {
					background-color: #F8F8F8;
				}
				&:last-child {
					border-bottom: 0;
				}
				img {
					border-radius: 50%;
					width: 32px;
					height: 32px;
				}
				.cf-user-info {
					display: block;
					padding-left: 9px;
					.cf-user-email {
						margin: 0 0 5px 0px!important;
						font-size: 12px;
						font-weight: 400;
						line-height: 16px;
					}
				}
			}
			.cf-user-list-item {
				&.active {
					background-color: #EDEDED;
				}
			}
		}
	}

	.cf-mentioned-user-popup,
	.cf-assignable-list-popup {
		ul {
			padding: 0;
			margin: 0;
			&:focus-visible {
				outline: none;
			}
			li {
				.cf-user-info {
					.cf-user-display-name {
						color: #000000;
						font-size: 14px;
						font-weight: 500;
						line-height: 17px;
						text-transform: capitalize;
						margin: 0px;
					}
				}
			}
		}
	}
	.cls-board-outer {
		.dashicons,
		.dashicons-before {
			font-family: dashicons;
		}
	}

	.cf-user-info {
		mark {
			background-color: transparent;
			font-weight: 600;
			padding: 0;
		}
	}
	.readmoreComment,
	.readlessComment {
		text-decoration: underline;
		color: #0568C1;
	}
	.comment-flash {
		background-color: rgba(252,239,69,0.2);
		-webkit-transition: all 0.3s ease-in-out;
		-o-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
	}
	.cf-assign-to {
		label {
			position: relative;
			display: -webkit-box;
			display: -ms-flexbox;
			display: flex;
			-webkit-box-align: center;
			-ms-flex-align: center;
			align-items: center;
			i {
				display: block;
				padding-left: 25px;
			}
		}
		.js-cf-show-assign-list {
			&:hover {
				cursor: pointer;
			}
		}
		input[type=checkbox] {
			position: absolute;
			top: 6px;
			border-radius: 3px;
			border-color: #191E23;
			width: 16px;
			height: 16px;
			@media screen and (max-width:780px) {
				position: absolute;
				top: 5px
			}
		}
	}
	.cf-no-assignee {
		display: block;
		padding: 10px 12px;
	}
	.cf-board-assigned-to {
		width: 100%;
		height: auto;
		position: relative;
		z-index: 0;
		.assigned-user-details {
			display: -webkit-box;
			display: -ms-flexbox;
			display: flex;
			-webkit-box-align: center;
			-ms-flex-align: center;
			align-items: center;
			border-radius: 10px 10px 0 0;
			-webkit-box-pack: start;
			-ms-flex-pack: start;
			justify-content: flex-start;
			padding: 16px 14px;
			background-color: #EFF7FF;
			color: rgb(60,64,67);
			.user-avatar {
				width: 32px;
				img {
					border-radius: 50%;
					margin-right: 10px;
					padding: 0;
					border: none;
					height: 100%;
					max-width: 100%;
				}
			}
			.user-info {
				p {
					&.display-name {
						margin: 0;
						line-height: 17px;
						font-weight: 500;
						font-size: 14px;
						color: #1D2327;
						word-break: break-all;
					}
				}
				span {
					&.badge {
						font-size: 12px;
						line-height: 14px;
						color: #1D2327;
					}
				}
			}
		}
	}
}
