.pt-icon {
  display: inline-block;
  inline-size: 1em;
  block-size: 1em;
  flex: 0 0 auto;
  object-fit: contain;
  vertical-align: -0.125em;
  user-select: none;
  pointer-events: none;
  filter: var(--pt-icon-filter, none);
}

.pt-icon--sm {
  inline-size: 0.875rem;
  block-size: 0.875rem;
}

.pt-icon--md {
  inline-size: 1.25rem;
  block-size: 1.25rem;
}

.pt-icon--lg {
  inline-size: 1.5rem;
  block-size: 1.5rem;
}

.pt-icon--xl {
  inline-size: 2rem;
  block-size: 2rem;
}

[data-theme="dark"] .pt-icon--theme,
.theme-dark .pt-icon--theme,
.pt-icon--inverse {
  --pt-icon-filter: brightness(0) invert(1);
}

@media (forced-colors: active) {
  .pt-icon {
    --pt-icon-filter: none;
  }
}