/* Widget de notation par étoiles (front) — styles autonomes, sans dépendance au thème. */
.tvss-rater {
	--tvss-star: #fab703;
	--tvss-star-empty: #cbd0d6;
	--tvss-star-hover: #f59e0b;
	max-width: 320px;
	margin: 2em auto;
	padding: 1em 1.25em;
	text-align: center;
	border: 1px solid var(--tvss-star-empty);
	border-radius: 8px;
}

.tvss-rater-title {
	margin: 0 0 .35em;
	font-weight: 600;
}

.tvss-stars {
	display: inline-flex;
	flex-direction: row;
	gap: 2px;
	line-height: 1;
}

.tvss-star {
	background: none;
	border: 0;
	padding: 0 2px;
	margin: 0;
	font-size: 30px;
	line-height: 1;
	cursor: pointer;
	color: var(--tvss-star-empty) !important;
	text-decoration: none;
	transition: color .12s ease-in-out;
	-webkit-appearance: none;
	appearance: none;
}

/* Le contenu de l'article (.post-content) cible souvent les <button> :
   on s'aligne sur 30px en battant la spécificité du thème, sans toucher
   aux autres boutons du contenu. */
.post-content button.tvss-star {
	font-size: 30px;
}

.tvss-star.is-active {
	color: var(--tvss-star) !important;
}

/* Survol : on neutralise un éventuel soulignement hérité du thème. */
.tvss-star:hover,
.tvss-star:focus {
	text-decoration: none !important;
}

/* Aperçu au survol : on remplit jusqu'à l'étoile survolée. */
.tvss-stars:hover .tvss-star {
	color: var(--tvss-star-hover) !important;
}

.tvss-stars .tvss-star:hover ~ .tvss-star {
	color: var(--tvss-star-empty) !important;
}

.tvss-stars.is-voted .tvss-star {
	cursor: default;
}

.tvss-vote-info {
	margin: .6em 0 0;
	font-size: .95rem;
	color: #50575e;
}

.tvss-vote-info strong {
	color: #1d2327;
}
