@use '../variables' as *;

.#{$prefix}icon {
	width: 1em;
	height: 1em;
	font-size: var(--#{$prefix}icon-font-size, var(--#{$prefix}icon-font-size-default)) !important;
	color: var(--#{$prefix}icon-color);
	display: flex;
	justify-content: center;
	align-items: center;
}

.#{$prefix}opacity-0 {
	opacity: 0;
}

.#{$prefix}opacity-60 {
	opacity: 0.6;
}

.#{$prefix}opacity-100 {
	opacity: 1;
}

.#{$prefix}pointer {
	cursor: pointer;
}

.#{$prefix}hover-opacity-60 {
	&:hover {
		opacity: 0.6;
	}
}

.#{$prefix}hover-opacity-100 {
	&:hover {
		opacity: 1;
	}
}