:host {
  display: inline-block;
  width: 1em;
  height: 1em;
  transition: color 0.2s ease-out;
  color: var(--lu-icon__color, inherit);
  font-size: var(--lu-icon__size, inherit);
  contain: strict;
  /* stylelint-disable-next-line declaration-no-important */
  box-sizing: content-box !important;
}

:host(.lu-color) {
  color: var(--lu-color-base);
}

.icon-inner,
svg {
  display: block;
  width: 100%;
  height: 100%;
  fill: currentColor;
  stroke: currentColor;
}

/* Icon RTL
 * -----------------------------------------------------------
 */
:host(.flip-rtl) .icon-inner {
  transform: scaleX(-1);
}

/* Icon Sizes
 * -----------------------------------------------------------
 */
:host(.icon-small) {
  /* stylelint-disable-next-line declaration-no-important */
  font-size: 18px !important;
}

:host(.icon-large) {
  /* stylelint-disable-next-line declaration-no-important */
  font-size: 32px !important;
}