style-configurator {
	display: block;
	width: 100%;
	
	.style-configurator {
		display: flex;
		flex-direction: column;
		gap: var(--style-configurator-gap, 24px);
	}

	.style-list-container {
		display: flex;
		flex-direction: column;
		gap: 8px;
	}
	
	style-selector {
		display: block;
	}
	
	richlistbox {
		padding: var(--style-configurator-richlistbox-padding, 4px 8px);
		max-height: var(--style-configurator-richlistitem-max-height, 260px);
		overflow: var(--style-configurator-richlistitem-overflow, hidden auto);
		margin: var(--style-configurator-richlistbox-margin, 0);
		
		richlistitem {
			line-height: var(--style-configurator-richlistitem-line-height, 1.66666666em);
			overflow: hidden;
			text-overflow: ellipsis;
			padding: var(--style-configurator-richlistitem-padding, 0px 8px 0px 4px);
			border-radius: var(--style-configurator-richlistitem-border-radius, 5px);
		}
		
		@media (-moz-platform: macos) {
			&:not(:focus) richlistitem[selected="true"] {
				background-color: -moz-mac-secondaryhighlight;
			}
		}
	}
	
	.style-selector-wrapper {
		margin: var(--style-configurator-style-field-margin, 0);
	}
	
	.locale-selector-wrapper {
		display: flex;
		align-items: center;
		gap: var(--style-configurator-locale-gap, 8px);
	}
	
	.display-as-wrapper {
		display: flex;
		flex-direction: row;
		gap: var(--style-configurator-display-as-wrapper-gap, 8px);

		radiogroup {
			margin: 0;
			display: flex;
			flex-direction: row;
			gap: var(--style-configurator-display-as-wrapper-gap, 8px);
		}
		
		radio {
			margin: 0;
			gap: 6px;
		}
	}

	&:not([show-manage-styles]) {
		#manage-styles {
			display: none;
		}
	}
}

locale-selector {
	menulist {
		min-width: 200px;
		margin: 0;
	}
}