.icon, button:has(> svg) {
	width: 22px;
	min-width: 22px;
	height: auto;
	background-color: transparent;
	border: none;
	padding: 0;
	display: inline-block;
	margin: auto 0;

	&:hover {
		cursor: pointer;
	}
}

.icon-xs {
	width: 12px;
	min-width: 12px;
}

.icon-md {
  width: 16px;
  min-width: 16px;
}

.icon-xl { width: 40px; }

.rounded-icon-xs {
	border-radius: 4px
}

.danger {
	color: red;
}

.mobile-editable {
	display: inline-block;
	font-size: 12px;
	font-weight: 400;
	text-decoration: underline;
	color: var(--color-dark);
	margin-left: 0.25rem;

	@media only screen and (min-width: 480px) {
		display: none;
	}
}