:host {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	position: relative;
}
smoothly-input-radio:not([disabled]):not([readonly]) :host>* {
	cursor: pointer;
}
smoothly-input-radio[disabled] :host>* {
	cursor: not-allowed;
}

:host>input:focus-visible+smoothly-icon {
	outline: 2px solid rgb(var(--smoothly-primary-color));
	border-radius: 1px;
}
:host>smoothly-icon {
	--smoothly-color-contrast: var(--smoothly-input-foreground);
}
smoothly-input-radio:not([disabled]):not([readonly]) :host>smoothly-icon[name=checkmark-circle] {
	--smoothly-color-contrast: var(--smoothly-success-color);
}

:host>input {
	opacity: 0;
	z-index: 1;
	width: 1.5em;
	height: 1.5em;
	position: absolute;
	transform: translateX(50%);
}
:host>label {
	padding: 0 .3em;
	white-space: nowrap;
}

:host[selected] ::slotted([slot="detail"]) { 
	display: block; 
	width: 100%; 
} 
:host ::slotted([slot="detail"]) { 
	display: none; 
}