$ibo-extension-details--information--metadata--padding: $ibo-spacing-200 !default;
$ibo-extension-details--information--metadata--delimiter: "-" !default;
$ibo-extension-details--information--metadata--color: $ibo-color-grey-700 !default;
$ibo-extension-details--actions--button--padding-y: 3px !default;
$ibo-extension-details--actions--button--padding-x: $ibo-button--padding-x !default;

.ibo-extension-details {
	display: inline-flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	width: 100%;
}

.ibo-extension-details--information {
	flex-grow: 1;
	display: flex;
	flex-direction: column;
}

.ibo-extension-details--actions {
	display: flex;
}

.ibo-extension-details--information--label {
	@extend %ibo-font-ral-med-150;
}

.ibo-extension-details--information--metadata {
	@extend %ibo-font-ral-med-100;
	color: $ibo-extension-details--information--metadata--color;
}

.ibo-extension-details--information--description {
	@extend %ibo-font-ral-med-100;
}

.ibo-extension-details--information--metadata span + span:before {
	content: $ibo-extension-details--information--metadata--delimiter;
	padding-left: $ibo-extension-details--information--metadata--padding;
	padding-right: $ibo-extension-details--information--metadata--padding;
}

//ibo-extension-details can have other ibo-extension-details inside its ibo-extension-details--information--description in the setup. We need to only affect direct children
.ibo-extension-details:has(>.ibo-extension-details--actions  input:is([type="checkbox"], [type="radio"]):checked){
	&>.ibo-extension-details--information>.ibo-extension-details--information--label .ibo-badge.unchecked {
		display: none;
	}
}
//Merging the two lines below with :is([type="checkbox"], [type="radio"]) will generate a warning in scss compiler
.ibo-extension-details:has(>.ibo-extension-details--actions input[type="checkbox"]:not(:checked)),
.ibo-extension-details:has(>.ibo-extension-details--actions input[type="radio"]:not(:checked)) {
	&>.ibo-extension-details--information>.ibo-extension-details--information--label .ibo-badge.checked {
		display: none;
	}
}


.ibo-extension-details--actions > button {
	padding: $ibo-extension-details--actions--button--padding-y $ibo-extension-details--actions--button--padding-x;
}

.ibo-extension-details--actions:has(.toggler-install:not(:disabled)) .ibo-popover-menu--section a[data-resource-id="force_uninstall"] {
	display: none;
}