.hw-icon {
  display: inline-block;
  width: 1.25rem;
  height: 1.25rem;
  flex: 0 0 auto;
  vertical-align: middle;
  color: currentColor;
  fill: currentColor;
  stroke: none;
}

.hw-icon--xs {
  width: 0.875rem;
  height: 0.875rem;
}

.hw-icon--sm {
  width: 1rem;
  height: 1rem;
}

.hw-icon--md {
  width: 1.25rem;
  height: 1.25rem;
}

.hw-icon--lg {
  width: 1.5rem;
  height: 1.5rem;
}

.hw-icon--xl {
  width: 1.875rem;
  height: 1.875rem;
}

.hw-icon path,
.hw-icon circle,
.hw-icon rect,
.hw-icon line,
.hw-icon polyline,
.hw-icon polygon {
  vector-effect: non-scaling-stroke;
}

.hw-icon--stroke {
  fill: none;
}

.hw-icon--stroke [stroke],
.hw-icon--mixed [stroke] {
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.hw-icon--solid [fill="currentColor"],
.hw-icon--mixed [fill="currentColor"] {
  fill: currentColor;
}

.hw-icon-inline {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
}