/* Mulke 1.7.2 — visible post-level Thanks/star control.
   Empty star = add thanks to this post.
   Filled star = current user has already thanked; clicking removes it when enabled. */

.post .post-buttons .mulke-thanks-star-item {
	display: inline-block !important;
	vertical-align: middle !important;
}

.post .post-buttons a.mulke-thanks-star-button {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 22px !important;
	height: 22px !important;
	min-width: 22px !important;
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	text-decoration: none !important;
	cursor: pointer !important;
	position: relative !important;
	z-index: 30 !important;
	overflow: visible !important;
}

/* Hide the internal FontAwesome thumbs glyph. It is still kept in the DOM because
   Thanks for Posts AJAX uses its classes to switch add/remove state. */
.post .post-buttons a.mulke-thanks-star-button > i,
.post .post-buttons a.mulke-thanks-star-button > span {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	overflow: hidden !important;
	clip: rect(0 0 0 0) !important;
	clip-path: inset(50%) !important;
	white-space: nowrap !important;
}

.post .post-buttons a.mulke-thanks-star-button::before {
	content: "☆";
	display: block;
	font-family: Arial, sans-serif;
	font-size: 22px;
	font-weight: 700;
	line-height: 22px;
	color: #d49a00;
	text-shadow: 0 1px 0 #fff;
}

.post .post-buttons a.mulke-thanks-star-button:hover::before,
.post .post-buttons a.mulke-thanks-star-button:focus::before {
	content: "★";
	color: #e2a400;
}

/* Thanks for Posts toggles the hidden icon from thumbs-up to thumbs-down after AJAX. */
.post .post-buttons a.mulke-thanks-star-button:has(.fa-thumbs-o-down)::before {
	content: "★";
	color: #e2a400;
}

@media (max-width: 700px) {
	.post .post-buttons a.mulke-thanks-star-button {
		width: 26px !important;
		height: 26px !important;
		min-width: 26px !important;
	}
	.post .post-buttons a.mulke-thanks-star-button::before {
		font-size: 24px;
		line-height: 26px;
	}
}