@import 'mediawiki.skin.variables.less';
@import 'mw.rcfilters.mixins.less';

.mw-rcfilters-ui-changesListWrapperWidget {
	ul {
		list-style: none;

		li {
			list-style: none;
		}
	}
}

// Make more specific for the overrides
div.mw-rcfilters-ui-highlights {
	body.mw-rcfilters-ui-initialized & {
		display: inline-block;
	}

	&-color {
		&-none {
			display: inline-block;
			.mw-rcfilters-circle( @size-circle-result, @size-circle-result, 0 );

			.mw-changeslist-watchedseen & {
				.mw-rcfilters-ui-changesListWrapperWidget.mw-rcfilters-ui-changesListWrapperWidget-highlighted & {
					.mw-rcfilters-circle-color( @highlight-none, true, @highlight-grey, true );
				}

				.mw-rcfilters-ui-changesListWrapperWidget:not( .mw-rcfilters-ui-changesListWrapperWidget-highlighted ) & {
					.mw-rcfilters-circle-color( @highlight-none, true, @highlight-bluedot, true );
				}
			}

			.mw-changeslist-watchedunseen & {
				.mw-rcfilters-ui-changesListWrapperWidget.mw-rcfilters-ui-changesListWrapperWidget-highlighted & {
					.mw-rcfilters-circle-color( @highlight-grey, true, @highlight-grey );
				}

				.mw-rcfilters-ui-changesListWrapperWidget:not( .mw-rcfilters-ui-changesListWrapperWidget-highlighted ) & {
					.mw-rcfilters-circle-color( @highlight-bluedot, true, @highlight-bluedot );
				}
			}
		}

		// Watchlist unseen highlighted fixes
		// Seen (empty circle)
		// There's no need to correct 'unseen' because that would be
		// a filled colorful circle, which is the regular rendering
		.mw-changeslist-watchedseen &-c1 {
			.mw-rcfilters-circle-color( @highlight-c1, true, @highlight-c1, true );
		}

		.mw-changeslist-watchedseen &-c2 {
			.mw-rcfilters-circle-color( @highlight-c2, true, @highlight-c2, true );
		}

		.mw-changeslist-watchedseen &-c3 {
			.mw-rcfilters-circle-color( @highlight-c3, true, @highlight-c3, true );
		}

		.mw-changeslist-watchedseen &-c4 {
			.mw-rcfilters-circle-color( @highlight-c4, true, @highlight-c4, true );
		}

		.mw-changeslist-watchedseen &-c5 {
			.mw-rcfilters-circle-color( @highlight-c5, true, @highlight-c5, true );
		}
	}
}