/**
 * Auto-generated file. Do not edit directly.
 */
/* stylelint-disable value-keyword-case */
/* stylelint-enable value-keyword-case */
:host {
  /**
   * @prop --cat-icon-ratio: The aspect ratio of the avatar.
   */
  display: inline-flex;
  vertical-align: middle;
  /* stylelint-disable property-no-vendor-prefix */
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  /* stylelint-enable property-no-vendor-prefix */
}

:host([hidden]) {
  display: none;
}

span {
  display: inline-flex;
}

svg {
  fill: currentColor;
  stroke: none;
  transform-origin: center center;
  height: 1em;
  width: calc(var(--cat-icon-ratio, 1) * 1em);
}

.icon-xs svg {
  font-size: 0.75rem;
}

.icon-s svg {
  font-size: 1rem;
}

.icon-m svg {
  font-size: 1.25rem;
}

.icon-l svg {
  font-size: 1.5rem;
}

.icon-xl svg {
  font-size: 1.75rem;
}