.icon {
  background-color: var(--icon-color, currentColor);
  block-size: var(--icon-size, 1rem);
  display: inline-block;
  flex-shrink: 0;
  inline-size: var(--icon-size, 1rem);
  mask-image: var(--svg);
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: var(--icon-size, 1rem);
  pointer-events: none;
  user-select: none;
}

/* img.icon { */
/*   background: none; */
/* } */

.icon--loading {
  --svg: url("/assets/components/loader-circle-a576f696.svg");
  animation: var(--animate-spin);
  animation-duration: 1s;
}