<commit_before>@import 'common';

.theme-oo-ui-widget () {}

.theme-oo-ui-outlineControlsWidget () {
	height: 3em;
	background-color: @background-color-default;

	&-items,
	&-movers {
		height: 2em;
		margin: 0.5em 0.5em 0.5em 0;
		padding: 0;
	}

	> .oo-ui-iconElement-icon {
		width: 1.5em;
		height: 2em;
		margin: 0.5em 0 0.5em 0.5em;
		opacity: 0.2;
	}
}

.theme-oo-ui-toggleWidget () {}

.theme-oo-ui-buttonGroupWidget () {
	display: inline-block;
	white-space: nowrap;
	border-radius: @border-radius-default;

	.oo-ui-inline-spacing( 0.5em );
	.oo-ui-buttonElement {
		.oo-ui-inline-spacing( 0 );
	}

	.oo-ui-buttonElement-framed {
		.oo-ui-buttonElement-button {
			border-radius: 0;
			margin-left: -1px;
		}

		&:first-child .oo-ui-buttonElement-button {
			border-bottom-left-radius: @border-radius-default;
			border-top-left-radius: @border-radius-default;
			margin-left: 0;
		}

		&:last-child .oo-ui-buttonElement-button {
			border-bottom-right-radius: @border-radius-default;
			border-top-right-radius: @border-radius-default;
		}
	}
}

.theme-oo-ui-buttonWidget () {
	.oo-ui-inline-spacing( 0.5em );
}

.theme-oo-ui-actionWidget () {}

.theme-oo-ui-popupButtonWidget () {
	&.oo-ui-buttonElement-frameless > .oo-ui-popupWidget {
		// Compensate for icon being inset
		/* @noflip */
		left: 1em;
	}

	&.oo-ui-buttonElement-framed > .oo-ui-popupWidget {
		// Compensate for icon being inset
		/* @noflip */
		left: 1.75em;
	}
}

.theme-oo-ui-toggleButtonWidget () {
	.oo-ui-inline-spacing( 0.5em );
}

.theme-oo-ui-iconWidget () {
	line-height: 2.5em;
	width: @size-icon;
	height: @size-icon;

	&.oo-ui-widget-disabled {
		opacity: @opacity-disabled;
	}
}

.theme-oo-ui-indicatorWidget () {
	line-height: 2.5em;
	width: @size-indicator;
	height: @size-indicator;
	margin: @size-indicator / 2;

	&.oo-ui-widget-disabled {
		opacity: @opacity-disabled;
	}
}

.theme-oo-ui-dropdownWidget () {
	width: 100%;
	max-width: 50em;
	background-color: @background-color-default;

	.oo-ui-inline-spacing( 0.5em );

	&-handle {
		padding: 0.5em 0;
		height: 2.275em;
		line-height: 1.275;
		border: @border-default;
		border-radius: @border-radius-default;

		.oo-ui-indicatorElement-indicator {
			right: 0;
		}

		.oo-ui-iconElement-icon {
			left: 0.25em;
		}

		.oo-ui-labelElement-label {
			margin: 0 1em;
		}

		.oo-ui-indicatorElement-indicator {
			top: 0;
			width: @size-indicator;
			height: @size-indicator;
			margin: 0.775em;
		}

		.oo-ui-iconElement-icon {
			top: 0;
			width: @size-icon;
			height: @size-icon;
			margin: 0.3em;
		}
	}

	&:hover .oo-ui-dropdownWidget-handle {
		border-color: #aaa;
	}

	&.oo-ui-widget-disabled {
		.oo-ui-dropdownWidget-handle {
			color: @color-disabled;
			text-shadow: @text-shadow-disabled;
			border-color: @border-color-disabled;
			background-color: @background-color-disabled;

			&:focus {
				outline: 0;
			}
		}
		.oo-ui-indicatorElement-indicator {
			opacity: @opacity-disabled;
		}
	}

	&.oo-ui-iconElement .oo-ui-dropdownWidget-handle .oo-ui-labelElement-label {
		margin-left: 3em;
	}

	&.oo-ui-indicatorElement .oo-ui-dropdownWidget-handle .oo-ui-labelElement-label {
		margin-right: 2em;
	}
}

.theme-oo-ui-selectFileWidget () {
	width: 100%;
	max-width: 50em;

	.oo-ui-inline-spacing( 0.5em );

	&-selectButton {
		> .oo-ui-buttonElement-button {
			margin-left: 0.5em;
		}
	}

	&-info {
		height: 2.4em;
		background-color: @background-color-default;
		border: @border-default;
		border-radius: @border-radius-default;

		> .oo-ui-indicatorElement-indicator {
			right: 0;
		}

		> .oo-ui-iconElement-icon {
			left: 0;
		}

		> .oo-ui-selectFileWidget-label {
			line-height: 2.3em;
			margin: 0;
			overflow: hidden;
			white-space: nowrap;
			.oo-ui-box-sizing( border-box );
			text-overflow: ellipsis;
			left: 0.5em;
			right: 0.5em;

			> .oo-ui-selectFileWidget-fileType {
				color: #888;
			}
		}

		> .oo-ui-selectFileWidget-clearButton {
			top: 0;
			width: @size-icon;
			margin-right: 0;
			.oo-ui-buttonElement-button > .oo-ui-iconElement-icon {
				height: 2.3em;
			}
		}

		> .oo-ui-indicatorElement-indicator {
			top: 0;
			width: @size-indicator;
			height: 2.3em;
			margin-right: 0.775em;
		}

		> .oo-ui-iconElement-icon {
			top: 0;
			width: @size-icon;
			height: 2.3em;
			margin-left: 0.5em;
		}
	}

	&.oo-ui-widget-disabled {
		.oo-ui-selectFileWidget-info {
			color: @color-disabled;
			text-shadow: @text-shadow-disabled;
			border-color: @border-color-disabled;
			background-color: @background-color-disabled;

			> .oo-ui-iconElement-icon,
			> .oo-ui-indicatorElement-indicator {
				opacity: @opacity-disabled;
			}
		}
	}

	&-empty {
		.oo-ui-selectFileWidget-label {
			color: @color-disabled;
		}
	}

	&.oo-ui-iconElement .oo-ui-selectFileWidget-info {
		.oo-ui-selectFileWidget-label {
			left: @size-icon + 1em;
		}
	}

	// With close, no indicator:
	& .oo-ui-selectFileWidget-info {
		.oo-ui-selectFileWidget-label {
			right: @size-icon + 0.5em;
		}

		.oo-ui-selectFileWidget-clearButton {
			right: 0;
		}
	}

	// With close, with indicator:
	&.oo-ui-indicatorElement .oo-ui-selectFileWidget-info {
		.oo-ui-selectFileWidget-label {
			right: @size-indicator + 1.55em - 0.4em + @size-icon + 0.5em;
		}

		.oo-ui-selectFileWidget-clearButton {
			right: @size-indicator + 1.55em - 0.4em;
		}
	}

	// No close, no indicator:
	&-empty, &-notsupported {
		.oo-ui-selectFileWidget-info {
			.oo-ui-selectFileWidget-label {
				right: 0.5em;
			}
		}
	}

	// No close, with indicator:
	&-empty.oo-ui-indicatorElement,
	&-notsupported.oo-ui-indicatorElement {
		.oo-ui-selectFileWidget-info {
			.oo-ui-selectFileWidget-label {
				right: 2em;
			}
		}
	}

	&-supported.oo-ui-widget-enabled {
		&.oo-ui-selectFileWidget-canDrop .oo-ui-selectFileWidget-dropTarget {
			background-color: @color-progressive-fade;
		}
	}

	&-empty.oo-ui-widget-disabled,
	&-notsupported {
		.oo-ui-selectFileWidget-dropTarget {
			border-color: @border-color-disabled;
			background-color: @background-color-disabled;

			.oo-ui-selectFileWidget-info,
			.oo-ui-selectFileWidget-dropLabel {
				color: @color-disabled;
				text-shadow: @text-shadow-disabled;
			}
		}
	}

	&-dropTarget {
		background-color: @background-color-default;
		border: 1px solid #ccc;
		margin-bottom: 0.5em;
		vertical-align: middle;
		overflow: hidden;
		border-radius: @border-radius-default;
	}

	&-empty .oo-ui-selectFileWidget-dropTarget {
		background-color: #eee;
		border-style: dashed;
	}
}

.theme-oo-ui-inputWidget () {
	.oo-ui-inline-spacing( 0.5em );
}

.theme-oo-ui-buttonInputWidget () {}

.theme-oo-ui-checkboxInputWidget () {
	position: relative;
	line-height: @size-input-binary;
	// Prevent the fake span from jumping to the next line of text
	white-space: nowrap;

	* {
		font: inherit;
		vertical-align: middle;
	}

	// This input element is visually replaced by the the span that follows
	input[type="checkbox"] {
		// Use opacity so that VoiceOver software can still identify it
		opacity: 0;
		// Render "on top of" the span, so that it's still clickable
		z-index: 1;
		position: relative;
		cursor: pointer;

		// Having margin would offset the input from where the span is absolutely positioned,
		// making only the overlap region receive events
		margin: 0;

		// Ensure the invisible input takes up the required width
		width: @size-input-binary;
		height: @size-input-binary;

		// Needed for Firefox mobile (See bug 71750 to workaround default Firefox stylesheet)
		max-width: none;

		& + span {
			.oo-ui-transition( background-size @transition-ease-out-back-medium );
			.oo-ui-box-sizing( border-box );
			position: absolute;
			left: 0;
			border-radius: @border-radius-default;
			width: @size-input-binary;
			height: @size-input-binary;
			background-color: white;
			border: @border-input-binary;
			.oo-ui-background-image-svg( '@{oo-ui-default-image-path}/icons/check-constructive-deprecated' );
			.oo-ui-background-image-safari( '@{oo-ui-default-image-path}/icons/check-constructive-deprecated' );
			background-repeat: no-repeat;
			background-position: center center;
			background-origin: border-box;
			background-size: 0 0;
		}

		&:checked + span  {
			background-size: 100% 100%;
		}

		&:active + span {
			background-color: @background-color-input-binary-active;
			border-color: @border-color-input-binary-active;
		}

		&:focus + span {
			border-width: @border-width-input-binary-focus;
		}

		&:focus:hover + span,
		&:hover + span {
			border-bottom-width: @border-bottom-width-input-binary-hover;
		}

		&:disabled {
			cursor: default;
		}

		&:disabled + span {
			background-color: @background-color-filled-disabled;
			border-color: @border-color-disabled;
		}

		&:disabled:checked + span {
			.oo-ui-background-image-svg( '@{oo-ui-default-image-path}/icons/check-invert' );
			.oo-ui-background-image-safari( '@{oo-ui-default-image-path}/icons/check-invert' );
		}
	}
}

.theme-oo-ui-dropdownInputWidget () {
	width: 100%;
	max-width: 50em;

	select {
		background-color: @background-color-default;
		height: 2.275em;
		font-size: inherit;
		font-family: inherit;
		.oo-ui-box-sizing( border-box );
		border: @border-default;
		border-radius: @border-radius-default;
		padding-left: 1em;
		vertical-align: middle;
	}

	option {
		font-size: inherit;
		font-family: inherit;
		height: 1.5em;
		padding: 0.5em 1em;
	}

	&.oo-ui-widget-enabled {
		select:hover,
		select:focus {
			border-color: #aaa;
			outline: none;
		}
	}

	&.oo-ui-widget-disabled {
		select {
			color: @color-disabled;
			border-color: @border-color-disabled;
			background-color: @background-color-disabled;
		}
	}
}

.theme-oo-ui-radioInputWidget () {
	position: relative;
	line-height: @size-input-binary;
	// Prevent the fake span from jumping to the next line of text
	white-space: nowrap;

	* {
		font: inherit;
		vertical-align: middle;
	}

	// This input element is visually replaced by the the span that follows
	input[type="radio"] {
		// Use opacity so that VoiceOver software can still identify it
		opacity: 0;
		// Render "on top of" the span, so that it's still clickable
		z-index: 1;
		position: relative;
		cursor: pointer;

		// Having margin would offset the input from where the span is absolutely positioned,
		// making only the overlap region receive events
		margin: 0;

		// Ensure the invisible input takes up the required width
		width: @size-input-binary;
		height: @size-input-binary;

		// Needed for Firefox mobile (See bug 71750 to workaround default Firefox stylesheet)
		max-width: none;

		& + span {
			.oo-ui-transition( background-size @transition-ease-out-back-medium );
			.oo-ui-box-sizing( border-box );
			position: absolute;
			left: 0;
			border-radius: 100%;
			width: @size-input-binary;
			height: @size-input-binary;
			background: white;
			border: @border-input-binary;
			.oo-ui-background-image-svg( '@{oo-ui-default-image-path}/icons/circle-constructive-deprecated' );
			.oo-ui-background-image-safari( '@{oo-ui-default-image-path}/icons/circle-constructive-deprecated' );
			background-repeat: no-repeat;
			background-position: center center;
			background-origin: border-box;
			background-size: 0 0;
		}

		&:checked + span  {
			background-size: 100% 100%;
		}

		&:active + span {
			background-color: @background-color-input-binary-active;
			border-color: @border-color-input-binary-active;
		}

		&:focus + span {
			border-width: @border-width-input-binary-focus;
		}

		&:focus:hover + span,
		&:hover + span {
			border-bottom-width: @border-bottom-width-input-binary-hover;
		}

		&:disabled {
			cursor: default;
		}

		&:disabled + span {
			background-color: @background-color-filled-disabled;
			border-color: @border-color-disabled;
		}

		&:disabled:checked + span {
			.oo-ui-background-image-svg( '@{oo-ui-default-image-path}/icons/circle-invert' );<commit_msg>MediaWiki theme: Replace fixed CSS property values with variables<commit_after>@import 'common';

.theme-oo-ui-widget () {}

.theme-oo-ui-outlineControlsWidget () {
	height: 3em;
	background-color: @background-color-default;

	&-items,
	&-movers {
		height: 2em;
		margin: 0.5em 0.5em 0.5em 0;
		padding: 0;
	}

	> .oo-ui-iconElement-icon {
		width: 1.5em;
		height: 2em;
		margin: 0.5em 0 0.5em 0.5em;
		opacity: 0.2;
	}
}

.theme-oo-ui-toggleWidget () {}

.theme-oo-ui-buttonGroupWidget () {
	display: inline-block;
	white-space: nowrap;
	border-radius: @border-radius-default;

	.oo-ui-inline-spacing( 0.5em );
	.oo-ui-buttonElement {
		.oo-ui-inline-spacing( 0 );
	}

	.oo-ui-buttonElement-framed {
		.oo-ui-buttonElement-button {
			border-radius: 0;
			margin-left: -1px;
		}

		&:first-child .oo-ui-buttonElement-button {
			border-bottom-left-radius: @border-radius-default;
			border-top-left-radius: @border-radius-default;
			margin-left: 0;
		}

		&:last-child .oo-ui-buttonElement-button {
			border-bottom-right-radius: @border-radius-default;
			border-top-right-radius: @border-radius-default;
		}
	}
}

.theme-oo-ui-buttonWidget () {
	.oo-ui-inline-spacing( 0.5em );
}

.theme-oo-ui-actionWidget () {}

.theme-oo-ui-popupButtonWidget () {
	&.oo-ui-buttonElement-frameless > .oo-ui-popupWidget {
		// Compensate for icon being inset
		/* @noflip */
		left: 1em;
	}

	&.oo-ui-buttonElement-framed > .oo-ui-popupWidget {
		// Compensate for icon being inset
		/* @noflip */
		left: 1.75em;
	}
}

.theme-oo-ui-toggleButtonWidget () {
	.oo-ui-inline-spacing( 0.5em );
}

.theme-oo-ui-iconWidget () {
	line-height: 2.5em;
	width: @size-icon;
	height: @size-icon;

	&.oo-ui-widget-disabled {
		opacity: @opacity-disabled;
	}
}

.theme-oo-ui-indicatorWidget () {
	line-height: 2.5em;
	width: @size-indicator;
	height: @size-indicator;
	margin: @size-indicator / 2;

	&.oo-ui-widget-disabled {
		opacity: @opacity-disabled;
	}
}

.theme-oo-ui-dropdownWidget () {
	width: 100%;
	max-width: 50em;
	background-color: @background-color-default;

	.oo-ui-inline-spacing( 0.5em );

	&-handle {
		padding: 0.5em 0;
		height: 2.275em;
		line-height: 1.275;
		border: @border-default;
		border-radius: @border-radius-default;

		.oo-ui-indicatorElement-indicator {
			right: 0;
		}

		.oo-ui-iconElement-icon {
			left: 0.25em;
		}

		.oo-ui-labelElement-label {
			margin: 0 1em;
		}

		.oo-ui-indicatorElement-indicator {
			top: 0;
			width: @size-indicator;
			height: @size-indicator;
			margin: 0.775em;
		}

		.oo-ui-iconElement-icon {
			top: 0;
			width: @size-icon;
			height: @size-icon;
			margin: 0.3em;
		}
	}

	&:hover .oo-ui-dropdownWidget-handle {
		border-color: #aaa;
	}

	&.oo-ui-widget-disabled {
		.oo-ui-dropdownWidget-handle {
			color: @color-disabled;
			text-shadow: @text-shadow-disabled;
			border-color: @border-color-disabled;
			background-color: @background-color-disabled;

			&:focus {
				outline: 0;
			}
		}
		.oo-ui-indicatorElement-indicator {
			opacity: @opacity-disabled;
		}
	}

	&.oo-ui-iconElement .oo-ui-dropdownWidget-handle .oo-ui-labelElement-label {
		margin-left: 3em;
	}

	&.oo-ui-indicatorElement .oo-ui-dropdownWidget-handle .oo-ui-labelElement-label {
		margin-right: 2em;
	}
}

.theme-oo-ui-selectFileWidget () {
	width: 100%;
	max-width: 50em;

	.oo-ui-inline-spacing( 0.5em );

	&-selectButton {
		> .oo-ui-buttonElement-button {
			margin-left: 0.5em;
		}
	}

	&-info {
		height: 2.4em;
		background-color: @background-color-default;
		border: @border-default;
		border-radius: @border-radius-default;

		> .oo-ui-indicatorElement-indicator {
			right: 0;
		}

		> .oo-ui-iconElement-icon {
			left: 0;
		}

		> .oo-ui-selectFileWidget-label {
			line-height: 2.3em;
			margin: 0;
			overflow: hidden;
			white-space: nowrap;
			.oo-ui-box-sizing( border-box );
			text-overflow: ellipsis;
			left: 0.5em;
			right: 0.5em;

			> .oo-ui-selectFileWidget-fileType {
				color: #888;
			}
		}

		> .oo-ui-selectFileWidget-clearButton {
			top: 0;
			width: @size-icon;
			margin-right: 0;
			.oo-ui-buttonElement-button > .oo-ui-iconElement-icon {
				height: 2.3em;
			}
		}

		> .oo-ui-indicatorElement-indicator {
			top: 0;
			width: @size-indicator;
			height: 2.3em;
			margin-right: 0.775em;
		}

		> .oo-ui-iconElement-icon {
			top: 0;
			width: @size-icon;
			height: 2.3em;
			margin-left: 0.5em;
		}
	}

	&.oo-ui-widget-disabled {
		.oo-ui-selectFileWidget-info {
			color: @color-disabled;
			text-shadow: @text-shadow-disabled;
			border-color: @border-color-disabled;
			background-color: @background-color-disabled;

			> .oo-ui-iconElement-icon,
			> .oo-ui-indicatorElement-indicator {
				opacity: @opacity-disabled;
			}
		}
	}

	&-empty {
		.oo-ui-selectFileWidget-label {
			color: @color-disabled;
		}
	}

	&.oo-ui-iconElement .oo-ui-selectFileWidget-info {
		.oo-ui-selectFileWidget-label {
			left: @size-icon + 1em;
		}
	}

	// With close, no indicator:
	& .oo-ui-selectFileWidget-info {
		.oo-ui-selectFileWidget-label {
			right: @size-icon + 0.5em;
		}

		.oo-ui-selectFileWidget-clearButton {
			right: 0;
		}
	}

	// With close, with indicator:
	&.oo-ui-indicatorElement .oo-ui-selectFileWidget-info {
		.oo-ui-selectFileWidget-label {
			right: @size-indicator + 1.55em - 0.4em + @size-icon + 0.5em;
		}

		.oo-ui-selectFileWidget-clearButton {
			right: @size-indicator + 1.55em - 0.4em;
		}
	}

	// No close, no indicator:
	&-empty, &-notsupported {
		.oo-ui-selectFileWidget-info {
			.oo-ui-selectFileWidget-label {
				right: 0.5em;
			}
		}
	}

	// No close, with indicator:
	&-empty.oo-ui-indicatorElement,
	&-notsupported.oo-ui-indicatorElement {
		.oo-ui-selectFileWidget-info {
			.oo-ui-selectFileWidget-label {
				right: 2em;
			}
		}
	}

	&-supported.oo-ui-widget-enabled {
		&.oo-ui-selectFileWidget-canDrop .oo-ui-selectFileWidget-dropTarget {
			background-color: @color-progressive-fade;
		}
	}

	&-empty.oo-ui-widget-disabled,
	&-notsupported {
		.oo-ui-selectFileWidget-dropTarget {
			border-color: @border-color-disabled;
			background-color: @background-color-disabled;

			.oo-ui-selectFileWidget-info,
			.oo-ui-selectFileWidget-dropLabel {
				color: @color-disabled;
				text-shadow: @text-shadow-disabled;
			}
		}
	}

	&-dropTarget {
		background-color: @background-color-default;
		border: 1px solid #ccc;
		margin-bottom: 0.5em;
		vertical-align: middle;
		overflow: hidden;
		border-radius: @border-radius-default;
	}

	&-empty .oo-ui-selectFileWidget-dropTarget {
		background-color: #eee;
		border-style: dashed;
	}
}

.theme-oo-ui-inputWidget () {
	.oo-ui-inline-spacing( 0.5em );
}

.theme-oo-ui-buttonInputWidget () {}

.theme-oo-ui-checkboxInputWidget () {
	position: relative;
	line-height: @size-input-binary;
	// Prevent the fake span from jumping to the next line of text
	white-space: nowrap;

	* {
		font: inherit;
		vertical-align: middle;
	}

	// This input element is visually replaced by the the span that follows
	input[type="checkbox"] {
		// Use opacity so that VoiceOver software can still identify it
		opacity: 0;
		// Render "on top of" the span, so that it's still clickable
		z-index: 1;
		position: relative;
		cursor: pointer;

		// Having margin would offset the input from where the span is absolutely positioned,
		// making only the overlap region receive events
		margin: 0;

		// Ensure the invisible input takes up the required width
		width: @size-input-binary;
		height: @size-input-binary;

		// Needed for Firefox mobile (See bug 71750 to workaround default Firefox stylesheet)
		max-width: none;

		& + span {
			.oo-ui-transition( background-size @transition-ease-out-back-medium );
			.oo-ui-box-sizing( border-box );
			position: absolute;
			left: 0;
			width: @size-input-binary;
			height: @size-input-binary;
			background-color: @background-color-default;
			.oo-ui-background-image-svg( '@{oo-ui-default-image-path}/icons/check-constructive-deprecated' );
			.oo-ui-background-image-safari( '@{oo-ui-default-image-path}/icons/check-constructive-deprecated' );
			background-repeat: no-repeat;
			background-position: center center;
			background-origin: border-box;
			background-size: 0 0;
			border: @border-input-binary;
			border-radius: @border-radius-default;
		}

		&:checked + span  {
			background-size: 100% 100%;
		}

		&:active + span {
			background-color: @background-color-input-binary-active;
			border-color: @border-color-input-binary-active;
		}

		&:focus + span {
			border-width: @border-width-input-binary-focus;
		}

		&:focus:hover + span,
		&:hover + span {
			border-bottom-width: @border-bottom-width-input-binary-hover;
		}

		&:disabled {
			cursor: default;
		}

		&:disabled + span {
			background-color: @background-color-filled-disabled;
			border-color: @border-color-disabled;
		}

		&:disabled:checked + span {
			.oo-ui-background-image-svg( '@{oo-ui-default-image-path}/icons/check-invert' );
			.oo-ui-background-image-safari( '@{oo-ui-default-image-path}/icons/check-invert' );
		}
	}
}

.theme-oo-ui-dropdownInputWidget () {
	width: 100%;
	max-width: 50em;

	select {
		background-color: @background-color-default;
		height: 2.275em;
		font-size: inherit;
		font-family: inherit;
		.oo-ui-box-sizing( border-box );
		border: @border-default;
		border-radius: @border-radius-default;
		padding-left: 1em;
		vertical-align: middle;
	}

	option {
		font-size: inherit;
		font-family: inherit;
		height: 1.5em;
		padding: 0.5em 1em;
	}

	&.oo-ui-widget-enabled {
		select:hover,
		select:focus {
			border-color: #aaa;
			outline: none;
		}
	}

	&.oo-ui-widget-disabled {
		select {
			color: @color-disabled;
			border-color: @border-color-disabled;
			background-color: @background-color-disabled;
		}
	}
}

.theme-oo-ui-radioInputWidget () {
	position: relative;
	line-height: @size-input-binary;
	// Prevent the fake span from jumping to the next line of text
	white-space: nowrap;

	* {
		font: inherit;
		vertical-align: middle;
	}

	// This input element is visually replaced by the the span that follows
	input[type="radio"] {
		// Use opacity so that VoiceOver software can still identify it
		opacity: 0;
		// Render "on top of" the span, so that it's still clickable
		z-index: 1;
		position: relative;
		cursor: pointer;

		// Having margin would offset the input from where the span is absolutely positioned,
		// making only the overlap region receive events
		margin: 0;

		// Ensure the invisible input takes up the required width
		width: @size-input-binary;
		height: @size-input-binary;

		// Needed for Firefox mobile (See bug 71750 to workaround default Firefox stylesheet)
		max-width: none;

		& + span {
			.oo-ui-transition( background-size @transition-ease-out-back-medium );
			.oo-ui-box-sizing( border-box );
			position: absolute;
			left: 0;
			width: @size-input-binary;
			height: @size-input-binary;
			background-color: @background-color-default;
			.oo-ui-background-image-svg( '@{oo-ui-default-image-path}/icons/circle-constructive-deprecated' );
			.oo-ui-background-image-safari( '@{oo-ui-default-image-path}/icons/circle-constructive-deprecated' );
			background-repeat: no-repeat;
			background-position: center center;
			background-origin: border-box;
			background-size: 0 0;
			border: @border-input-binary;
			border-radius: 100%;
		}

		&:checked + span  {
			background-size: 100% 100%;
		}

		&:active + span {
			background-color: @background-color-input-binary-active;
			border-color: @border-color-input-binary-active;
		}

		&:focus + span {
			border-width: @border-width-input-binary-focus;
		}

		&:focus:hover + span,
		&:hover + span {
			border-bottom-width: @border-bottom-width-input-binary-hover;
		}

		&:disabled {
			cursor: default;
		}

		&:disabled + span {
			background-color: @background-color-filled-disabled;
			border-color: @border-color-disabled;
		}

		&:disabled:checked + span {
			.oo-ui-background-image-svg( '@{oo-ui-default-image-path}/icons/circle-invert' );
{'fraction_non_alphanumeric': 0.15529411764705883, 'fraction_numerical': 0.016050420168067226, 'mean_word_length': 3.049166383123511, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 31, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4312478', 'n_tokens_mistral': 10225, 'n_tokens_neox': 8815, 'n_words': 1610}