/**
 * rolfkocht.de overrides for WP-PostRatings 2.x
 *
 * Mirrors the appearance of the site's former modified 1.91.1 installation
 * without changing files inside wp-postratings itself.
 */

.wp-postratings {
	width: 100%;
	box-sizing: border-box;
	margin-top: 20px;
	gap: 15px;

	/* Dominant colours from the former custom PNG set. */
	--wp-postratings-color-on: #ffc200 !important;
	--wp-postratings-color-off: #dbdbdb !important;
	--wp-postratings-color-hover: #67ff00 !important;
	--wp-postratings-gap: 15px;
}

/*
 * WP-PostRatings 2.x may place per-rating colour custom properties inline on
 * the strip/control. These declarations deliberately keep the established
 * rolfkocht palette authoritative without touching the vendor plugin.
 */
.wp-postratings .wp-postratings-strip,
.wp-postratings .wp-postratings-vote,
.wp-postratings .wp-postratings-vote label,
.wp-postratings .wp-postratings-vote button {
	--wp-postratings-color-on: #ffc200 !important;
	--wp-postratings-color-off: #dbdbdb !important;
	--wp-postratings-color-hover: #67ff00 !important;
}

/*
 * Previous rolfkocht stars were displayed at 40 x 36 px. The new plugin uses
 * SVG masks, so stretch the registered silhouette to the same visual box.
 */
.wp-postratings .wp-postratings-item {
	inline-size: 40px;
	block-size: 36px;
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
}

/*
 * Keep the old bright-green hover, but do not use it as the keyboard focus
 * outline: #67ff00 has too little contrast on white for a reliable focus cue.
 */
.wp-postratings-scale input:focus-visible + label,
.wp-postratings-updown button:focus-visible {
	outline-color: #1a1a1a;
}