@import 'mw.rcfilters.mixins';
@import 'mw.rcfilters.variables';

.mw-rcfilters-ui-filterItemHighlightButton {
	.oo-ui-buttonWidget.oo-ui-popupButtonWidget .oo-ui-buttonElement-button > &-circle {
		background-image: none;
		display: inline-block;
		vertical-align: middle;
		// Override OOUI rule on frameless icons
		opacity: 1;
		.mw-rcfilters-circle( @min-size-circle, @size-circle, @margin-circle 0 );

		&-color {
			&-c1 {
				.mw-rcfilters-circle-color( @highlight-c1 );
			}

			&-c2 {
				.mw-rcfilters-circle-color( @highlight-c2 );
			}

			&-c3 {
				.mw-rcfilters-circle-color( @highlight-c3 );
			}

			&-c4 {
				.mw-rcfilters-circle-color( @highlight-c4 );
			}

			&-c5 {
				.mw-rcfilters-circle-color( @highlight-c5 );
			}
		}
	}
}