/* Likes e comentários dos trades (functions/social.php).
 * O corpo dos comentários reusa css/forum-post.css — aqui só a barra de likes,
 * o selo dos cards e o modal de "quem curtiu". */

.trade-social {
	border-top: solid 1px #3a3b3f;
	padding-top: 1rem;
}
.trade-social-bar {
	padding: .25rem .75rem 1rem .75rem;
	font-size: 14px;
}
.trade-social-bar .trade-like {
	transition: color .15s ease;
}
.trade-social-bar .trade-like:hover {
	color: #C70000;
}
.trade-likers a {
	color: var(--color-lightgold, #F2D79C);
}

/* Cada comentário é um .container.post do fórum; aqui só o espaçamento entre eles. */
.trade-comments .container.post {
	border-top: solid 1px #2c2d31;
	padding-top: .5rem;
}
.trade-comments .container.post:first-child {
	border-top: 0;
}
.trade-comments .user_div .avatar .avatar_img {
	max-width: 90px;
}

/* Barra de curtir do card, acima da descrição do anúncio. */
.trade-social-badge {
	font-size: 14px;
	white-space: nowrap;
	line-height: 1.6;
	margin-bottom: .15rem;
}
.trade-social-badge .mdi {
	vertical-align: middle;
	font-size: 18px;
}
/* Mesmo vermelho do coração do fórum. A cor é redeclarada aqui porque a listagem não
   carrega o forum-post.css (que é onde .up_color_bottom nasce); lá ele é 22px, que no
   card estoura a linha. */
.trade-social-badge .up_color_bottom {
	color: #C70000;
	font-size: 18px !important;
}
.trade-card-like.is-off .up_color_bottom,
.trade-card-like:hover .up_color_bottom {
	color: #C70000;
}
.trade-card-like,
.trade-card-comments {
	color: var(--color-gray, #afafaf);
	cursor: pointer;
	user-select: none;
	transition: color .15s ease;
}
.trade-card-like .trade-like-count,
.trade-card-comments {
	margin-left: .2rem;
}
.trade-card-like:hover,
.trade-card-comments:hover {
	color: #C70000;
	text-decoration: none;
}
.trade-card-comments:hover {
	color: var(--color-lightgold, #F2D79C);
}
/* Vendedor no próprio anúncio, ou anúncio já encerrado: mostra o número, não convida a clicar. */
.trade-card-like.is-off {
	cursor: default;
	opacity: .65;
}
.trade-card-like.is-off:hover {
	color: var(--color-gray, #afafaf);
}
.trade-card-like.is-busy {
	opacity: .4;
	pointer-events: none;
}

/* Modal de curtidas */
.likers-list .likers-row {
	border-bottom: solid 1px #2c2d31;
	color: inherit;
}
.likers-list .likers-row:last-child {
	border-bottom: 0;
}
.likers-list .likers-row:hover {
	background-color: rgba(255, 255, 255, .04);
}
.likers-avatar {
	width: 38px;
	height: 38px;
	object-fit: cover;
	border-radius: 4px;
	flex: 0 0 38px;
}
.likers-avatar-empty {
	display: inline-block;
	background-color: #2c2d31;
}
#likersModalBody {
	max-height: 60vh;
	overflow-y: auto;
}