.icon {
  position: relative;
}
.icon svg {
  display: block;
  width: 100%;
  height: auto;
}
.icon svg path,
.icon svg circle,
.icon svg rect {
  transition: var(--transition);
}
.icon svg path[fill],
.icon svg circle[fill],
.icon svg rect[fill] {
  fill: var(--color-content-neutral-primary);
}
.icon svg path[stroke],
.icon svg circle[stroke],
.icon svg rect[stroke] {
  stroke: var(--color-content-neutral-primary);
}
.icon_variant_plus {
  width: 24px;
  height: 24px;
}
.icon_variant_plus .icon__strip {
  content: "";
  display: inline-block;
  height: 2px;
  width: 16px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background-color: var(--color-content-neutral-primary, #1E1E1E);
  transition: var(--transition);
}
.icon_variant_plus .icon__strip:nth-child(2) {
  transform: translate(-50%, -50%) rotate(90deg);
}
.icon_position_before {
  order: -1;
}
.icon_position_after {
  order: 1;
}
.icon_active.icon_variant_plus .icon__strip:nth-child(2) {
  transform: translate(-50%, -50%) rotate(0deg);
}
.icon_size_sm {
  width: var(--size-icon-sm);
  height: var(--size-icon-sm);
}
.icon_size_md {
  width: var(--size-icon-md);
  height: var(--size-icon-md);
}
.icon_size_lg {
  width: var(--size-icon-lg);
  height: var(--size-icon-lg);
}
.icon_size_xl {
  width: var(--size-icon-lg);
  height: var(--size-icon-lg);
}/*# sourceMappingURL=icon.css.map */