/* wc.ui.label.scss */
// styles for WLabel and the label emulators
@import 'label_vars';

.hint {// .hint is additional text for labels that describe other information for the related form element
	@include label-hint;
}

// use inline-block on a label-dummy to prevent a required marker flying off the end
//scss-lint:disable QualifyingElement
span.wc-label {
	display: inline-block;
}

// space between a checkable and its label
[type='radio'] + label,
[type='checkbox'] + label,
.wc_ro + .wc-label {
	margin-left: $hgap-small;
}

// required markers
.wc_req {
	[type='radio'] + &:before,
	[type='checkbox'] + &:before {
		margin-right: $hgap-small;
	}

	[type='radio'] + &:after,
	[type='checkbox'] + &:after {
		display: none;
	}
}

label.wc_req:after,
.label.wc_req:after,
input[type='radio'] +.wc_req:before,
input[type='checkbox'] + .wc_req:before {
	@include mandatory-indicator;
}

.wc-label {
	&.wc_req {
		@include border-box;
		padding-right: 1em;
		position: relative;

		&:after {
			position: absolute;
			right: $hgap-small;
			top: 0;
		}
	}
}
