/* These indicators never target plugin badges, filters or review controls. */
.ov-tag,
.ov-selection-tag,
.ov-rating {
	box-sizing: border-box;
	min-width: 0;
	max-width: 100%;
	margin: 0;
	color: var(--color-text-primary);
	font-family: var(--font-ui);
	font-size: var(--font-size-body);
	font-weight: var(--font-weight-regular);
	line-height: var(--line-height-body);
	letter-spacing: 0;
}
.ov-tag {
	display: inline-flex;
	align-items: center;
	min-height: calc(var(--line-height-small) + var(--spacing-16));
	padding: var(--spacing-8) var(--spacing-12);
	border-radius: var(--radius-full);
	background: var(--color-bg-subtle);
	font-size: var(--font-size-small);
	line-height: var(--line-height-small);
	overflow-wrap: anywhere;
}
.ov-tag--highlight { background: var(--color-bg-accent); }
.ov-tag--success { background: var(--color-feedback-success-bg); color: var(--color-feedback-success-ink); }
.ov-tag--warning { background: var(--color-feedback-warning-bg); color: var(--color-feedback-warning-ink); }
.ov-tag--error { background: var(--color-feedback-error-bg); color: var(--color-feedback-error-ink); }
.ov-tag--info { background: var(--color-feedback-info-bg); color: var(--color-feedback-info-ink); }

.ov-selection-tag { position: relative; display: inline-flex; cursor: pointer; }
.ov-selection-tag .ov-selection-tag__input,
.ov-rating .ov-rating__input {
	position: absolute;
	inset: 0;
	z-index: 1;
	width: 100%;
	height: 100%;
	margin: 0;
	opacity: 0;
	cursor: inherit;
}
.ov-selection-tag__face {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--spacing-8);
	box-sizing: border-box;
	width: 100%;
	min-width: 0;
	min-height: var(--spacing-48);
	padding: calc(var(--spacing-12) - var(--focus-width)) var(--spacing-12);
	border: var(--focus-width) solid transparent;
	border-radius: var(--radius-16);
	background: var(--color-bg-subtle);
	transition: background-color var(--transition-interactive), border-color var(--transition-interactive);
}
.ov-selection-tag__label { min-width: 0; overflow-wrap: anywhere; }
.ov-selection-tag__add,
.ov-selection-tag__remove { display: flex; flex: none; }
.ov-selection-tag__face .ov-icon { width: var(--spacing-24); height: var(--spacing-24); }
.ov-selection-tag__remove { display: none; }
.ov-selection-tag__input:checked + .ov-selection-tag__face {
	border-color: var(--color-border-focus);
	background: var(--color-bg-page);
}
.ov-selection-tag__input:checked + .ov-selection-tag__face .ov-selection-tag__add { display: none; }
.ov-selection-tag__input:checked + .ov-selection-tag__face .ov-selection-tag__remove { display: flex; }
.ov-selection-tag:has(:disabled) { opacity: 0.5; cursor: not-allowed; }
.ov-selection-tag__input:active:not(:disabled) + .ov-selection-tag__face {
	border-color: var(--color-bg-accent);
	background: var(--color-bg-accent);
}
@media (hover: hover) {
	.ov-selection-tag__input:hover:not(:disabled) + .ov-selection-tag__face {
		border-color: var(--color-bg-accent);
		background: var(--color-bg-accent);
	}
}
.ov-selection-tag__input:focus-visible + .ov-selection-tag__face {
	border-color: var(--color-border-focus);
	background: var(--color-bg-page);
	outline: var(--focus-width) solid var(--color-border-focus);
	outline-offset: calc(-1 * var(--focus-width));
}
.ov-selection-tag[hidden] { display: none; }

.ov-rating { padding: 0; border: 0; background: transparent; }
.ov-rating__stars,
.ov-rating__choices { display: flex; gap: var(--spacing-4); width: fit-content; max-width: 100%; }
.ov-rating .ov-icon { display: block; width: var(--spacing-24); height: var(--spacing-24); }
.ov-rating__star { position: relative; display: block; flex: none; width: var(--spacing-24); height: var(--spacing-24); }
.ov-rating__fill {
	--ov-star-fill: currentColor;
	position: absolute;
	inset-inline-start: 0;
	top: 0;
	width: var(--ov-star-progress);
	height: 100%;
	overflow: hidden;
}
.ov-rating:dir(rtl) .ov-rating__fill .ov-icon { position: absolute; right: 0; }
.ov-rating[data-empty] .ov-rating__stars { color: var(--color-text-muted); }
.ov-rating__summary,
.ov-rating__prompt { margin: var(--spacing-8) 0 0; overflow-wrap: anywhere; }
.ov-rating__option { position: relative; display: block; flex: none; margin: 0; cursor: pointer; }
.ov-rating__face {
	display: grid;
	place-items: center;
	box-sizing: border-box;
	width: var(--action-target-min);
	height: var(--action-target-min);
	border-radius: var(--radius-8);
}
.ov-rating__option:has(:checked) .ov-rating__face,
.ov-rating__option:has(~ .ov-rating__option :checked) .ov-rating__face { --ov-star-fill: currentColor; }
.ov-rating__option:has(:focus-visible) .ov-rating__face,
.ov-rating__option:has(~ .ov-rating__option :focus-visible) .ov-rating__face {
	--ov-star-fill: none;
	color: var(--color-border-focus);
}
.ov-rating__input:focus-visible + .ov-rating__face {
	outline: var(--focus-width) solid var(--color-border-focus);
	outline-offset: var(--focus-offset);
}
.ov-rating:disabled { opacity: 0.5; }
.ov-rating__option:has(:disabled) { cursor: not-allowed; }
@media (prefers-reduced-motion: reduce) {
	.ov-selection-tag__face { transition: none; }
}
@media (forced-colors: active) {
	.ov-tag { border: 1px solid CanvasText; }
	.ov-selection-tag__face { border-color: ButtonText; }
	.ov-selection-tag__input:checked + .ov-selection-tag__face { border-color: Highlight; }
	.ov-selection-tag__input:focus-visible + .ov-selection-tag__face,
	.ov-rating__input:focus-visible + .ov-rating__face { outline-color: Highlight; }
	.ov-selection-tag:has(:disabled), .ov-rating:disabled { opacity: 1; color: GrayText; }
}