.pm-tool-rating {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 14px;
	align-items: center;
	justify-content: space-between;
	border-top: 1px solid #e4ebf0;
	background: #ffffff;
	color: #34495e;
	padding: 12px 20px;
	font-size: .9rem;
	line-height: 1.35;
}

.pm-tool-rating__summary {
	color: #52616f;
	font-weight: 750;
}

.pm-tool-rating__vote {
	display: inline-flex;
	flex-wrap: wrap;
	gap: 8px;
	align-items: center;
	justify-content: flex-end;
}

.pm-tool-rating__label {
	color: #52616f;
	font-size: .86rem;
	font-weight: 750;
}

.pm-tool-rating__stars {
	display: inline-flex;
	gap: 2px;
	align-items: center;
}

.pm-tool-rating__stars button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border: 0;
	border-radius: 999px;
	background: transparent;
	color: #a7b1bd;
	padding: 0;
	font: inherit;
	font-size: 1.25rem;
	line-height: 1;
	cursor: pointer;
	transition: color .15s ease, background-color .15s ease, transform .15s ease;
}

.pm-tool-rating__stars button:hover,
.pm-tool-rating__stars button:focus,
.pm-tool-rating__stars button.is-active {
	background: #fff6dd;
	color: #b7791f;
	outline: 0;
}

.pm-tool-rating__stars button:hover,
.pm-tool-rating__stars button:focus {
	transform: translateY(-1px);
}

.pm-tool-rating__stars:has([data-pm-rating-star="1"]:hover) [data-pm-rating-star="1"],
.pm-tool-rating__stars:has([data-pm-rating-star="1"]:focus) [data-pm-rating-star="1"],
.pm-tool-rating__stars:has([data-pm-rating-star="2"]:hover) [data-pm-rating-star="1"],
.pm-tool-rating__stars:has([data-pm-rating-star="2"]:hover) [data-pm-rating-star="2"],
.pm-tool-rating__stars:has([data-pm-rating-star="2"]:focus) [data-pm-rating-star="1"],
.pm-tool-rating__stars:has([data-pm-rating-star="2"]:focus) [data-pm-rating-star="2"],
.pm-tool-rating__stars:has([data-pm-rating-star="3"]:hover) [data-pm-rating-star="1"],
.pm-tool-rating__stars:has([data-pm-rating-star="3"]:hover) [data-pm-rating-star="2"],
.pm-tool-rating__stars:has([data-pm-rating-star="3"]:hover) [data-pm-rating-star="3"],
.pm-tool-rating__stars:has([data-pm-rating-star="3"]:focus) [data-pm-rating-star="1"],
.pm-tool-rating__stars:has([data-pm-rating-star="3"]:focus) [data-pm-rating-star="2"],
.pm-tool-rating__stars:has([data-pm-rating-star="3"]:focus) [data-pm-rating-star="3"],
.pm-tool-rating__stars:has([data-pm-rating-star="4"]:hover) [data-pm-rating-star="1"],
.pm-tool-rating__stars:has([data-pm-rating-star="4"]:hover) [data-pm-rating-star="2"],
.pm-tool-rating__stars:has([data-pm-rating-star="4"]:hover) [data-pm-rating-star="3"],
.pm-tool-rating__stars:has([data-pm-rating-star="4"]:hover) [data-pm-rating-star="4"],
.pm-tool-rating__stars:has([data-pm-rating-star="4"]:focus) [data-pm-rating-star="1"],
.pm-tool-rating__stars:has([data-pm-rating-star="4"]:focus) [data-pm-rating-star="2"],
.pm-tool-rating__stars:has([data-pm-rating-star="4"]:focus) [data-pm-rating-star="3"],
.pm-tool-rating__stars:has([data-pm-rating-star="4"]:focus) [data-pm-rating-star="4"],
.pm-tool-rating__stars:has([data-pm-rating-star="5"]:hover) [data-pm-rating-star],
.pm-tool-rating__stars:has([data-pm-rating-star="5"]:focus) [data-pm-rating-star] {
	background: #fff6dd;
	color: #b7791f;
}

.pm-tool-rating__stars button:disabled {
	cursor: wait;
	opacity: .55;
	transform: none;
}

.pm-tool-rating.has-voted .pm-tool-rating__vote,
.pm-tool-rating__vote[hidden],
.pm-tool-rating__message[hidden] {
	display: none;
}

.pm-tool-rating__message {
	flex-basis: 100%;
	margin: 0;
	color: #176b45;
	font-size: .84rem;
	font-weight: 750;
}

.pm-tool-rating__message.is-error {
	color: #b42318;
}

@media (max-width: 520px) {
	.pm-tool-rating {
		align-items: flex-start;
		padding: 12px 14px;
	}

	.pm-tool-rating__vote {
		justify-content: flex-start;
	}
}

@media (prefers-color-scheme: dark) {
	.pm-tool-rating {
		background: #101b2a;
		border-color: rgba(148, 163, 184, 0.22);
		color: #d8e4f2;
	}

	.pm-tool-rating__summary,
	.pm-tool-rating__label {
		color: #b8c6d8;
	}

	.pm-tool-rating__stars button {
		background: transparent;
		color: #607087;
	}

	.pm-tool-rating__stars button:hover,
	.pm-tool-rating__stars button:focus,
	.pm-tool-rating__stars button.is-active,
	.pm-tool-rating__stars:has([data-pm-rating-star="1"]:hover) [data-pm-rating-star="1"],
	.pm-tool-rating__stars:has([data-pm-rating-star="1"]:focus) [data-pm-rating-star="1"],
	.pm-tool-rating__stars:has([data-pm-rating-star="2"]:hover) [data-pm-rating-star="1"],
	.pm-tool-rating__stars:has([data-pm-rating-star="2"]:hover) [data-pm-rating-star="2"],
	.pm-tool-rating__stars:has([data-pm-rating-star="2"]:focus) [data-pm-rating-star="1"],
	.pm-tool-rating__stars:has([data-pm-rating-star="2"]:focus) [data-pm-rating-star="2"],
	.pm-tool-rating__stars:has([data-pm-rating-star="3"]:hover) [data-pm-rating-star="1"],
	.pm-tool-rating__stars:has([data-pm-rating-star="3"]:hover) [data-pm-rating-star="2"],
	.pm-tool-rating__stars:has([data-pm-rating-star="3"]:hover) [data-pm-rating-star="3"],
	.pm-tool-rating__stars:has([data-pm-rating-star="3"]:focus) [data-pm-rating-star="1"],
	.pm-tool-rating__stars:has([data-pm-rating-star="3"]:focus) [data-pm-rating-star="2"],
	.pm-tool-rating__stars:has([data-pm-rating-star="3"]:focus) [data-pm-rating-star="3"],
	.pm-tool-rating__stars:has([data-pm-rating-star="4"]:hover) [data-pm-rating-star="1"],
	.pm-tool-rating__stars:has([data-pm-rating-star="4"]:hover) [data-pm-rating-star="2"],
	.pm-tool-rating__stars:has([data-pm-rating-star="4"]:hover) [data-pm-rating-star="3"],
	.pm-tool-rating__stars:has([data-pm-rating-star="4"]:hover) [data-pm-rating-star="4"],
	.pm-tool-rating__stars:has([data-pm-rating-star="4"]:focus) [data-pm-rating-star="1"],
	.pm-tool-rating__stars:has([data-pm-rating-star="4"]:focus) [data-pm-rating-star="2"],
	.pm-tool-rating__stars:has([data-pm-rating-star="4"]:focus) [data-pm-rating-star="3"],
	.pm-tool-rating__stars:has([data-pm-rating-star="4"]:focus) [data-pm-rating-star="4"],
	.pm-tool-rating__stars:has([data-pm-rating-star="5"]:hover) [data-pm-rating-star],
	.pm-tool-rating__stars:has([data-pm-rating-star="5"]:focus) [data-pm-rating-star] {
		background: rgba(251, 191, 36, 0.12);
		color: #fbbf24;
	}

	.pm-tool-rating__message {
		color: #9af0b8;
	}

	.pm-tool-rating__message.is-error {
		color: #ffcaca;
	}
}
