:host {
  display: inline-block;
  border-radius: var(--gse-ui-tag-borderRadius);
}

.gux-tag {
  position: relative;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: var(--gse-ui-tag-removable-gap);
  place-content: stretch flex-start;
  align-items: center;
  block-size: var(--gse-ui-tag-small-height);
  padding: var(--gse-ui-tag-padding);
  font-family: var(--gse-ui-tag-textSmall-fontFamily);
  font-size: var(--gse-ui-tag-textSmall-fontSize);
  font-weight: var(--gse-ui-tag-textSmall-fontWeight);
  line-height: var(--gse-ui-tag-textSmall-lineHeight);
  color: var(--gse-ui-tag-default-bold-foregroundColor);
  background-color: var(--gse-ui-tag-default-bold-backgroundColor);
  border-radius: var(--gse-ui-tag-borderRadius);
}
.gux-tag.gux-size-large {
  block-size: var(--gse-ui-tag-large-height);
  font-family: var(--gse-ui-tag-textLarge-fontFamily);
  font-size: var(--gse-ui-tag-textLarge-fontSize);
  font-weight: var(--gse-ui-tag-textLarge-fontWeight);
  line-height: var(--gse-ui-tag-textLarge-lineHeight);
}
.gux-tag.gux-size-large .gux-tag-remove-button:focus-within .gux-tag-remove-icon {
  outline-offset: 10px;
}
.gux-tag.gux-disabled {
  position: relative;
  user-select: none;
  opacity: var(--gse-ui-tag-disabled-opacity);
}
.gux-tag gux-tooltip-title {
  white-space: nowrap;
  cursor: default;
}
.gux-tag gux-tooltip-title ::slotted(gux-icon) {
  font-size: var(--gse-ui-tag-button-size);
}
.gux-tag .gux-tag-remove-button {
  all: unset;
  display: flex;
  place-content: center center;
  align-items: center;
}
.gux-tag .gux-tag-remove-button:not(:disabled):hover {
  cursor: pointer;
}
.gux-tag .gux-tag-remove-button .gux-tag-remove-icon {
  inline-size: var(--gse-ui-tag-button-size);
  block-size: var(--gse-ui-tag-button-size);
  margin-inline-end: -4px;
}
.gux-tag .gux-tag-remove-button:focus-within .gux-tag-remove-icon {
  outline: var(--gse-semantic-focusOutline-md-borderWidth) solid var(--gse-ui-color-focus);
  outline-offset: 5px;
  border-radius: var(--gse-semantic-focusOutline-sm-borderRadius);
}
.gux-tag.gux-accent-default {
  color: var(--gse-ui-tag-default-bold-foregroundColor);
  background-color: var(--gse-ui-tag-default-bold-backgroundColor);
}
.gux-tag.gux-accent-default.gux-emphasis-subtle {
  color: var(--gse-ui-tag-default-subtle-foregroundColor);
  background-color: var(--gse-ui-tag-default-subtle-backgroundColor);
}
.gux-tag.gux-accent-1 {
  color: var(--gse-ui-tag-accent1-bold-foregroundColor);
  background-color: var(--gse-ui-tag-accent1-bold-backgroundColor);
}
.gux-tag.gux-accent-1.gux-emphasis-subtle {
  color: var(--gse-ui-tag-accent1-subtle-foregroundColor);
  background-color: var(--gse-ui-tag-accent1-subtle-backgroundColor);
}
.gux-tag.gux-accent-2 {
  color: var(--gse-ui-tag-accent2-bold-foregroundColor);
  background-color: var(--gse-ui-tag-accent2-bold-backgroundColor);
}
.gux-tag.gux-accent-2.gux-emphasis-subtle {
  color: var(--gse-ui-tag-accent2-subtle-foregroundColor);
  background-color: var(--gse-ui-tag-accent2-subtle-backgroundColor);
}
.gux-tag.gux-accent-3 {
  color: var(--gse-ui-tag-accent3-bold-foregroundColor);
  background-color: var(--gse-ui-tag-accent3-bold-backgroundColor);
}
.gux-tag.gux-accent-3.gux-emphasis-subtle {
  color: var(--gse-ui-tag-accent3-subtle-foregroundColor);
  background-color: var(--gse-ui-tag-accent3-subtle-backgroundColor);
}
.gux-tag.gux-accent-4 {
  color: var(--gse-ui-tag-accent4-bold-foregroundColor);
  background-color: var(--gse-ui-tag-accent4-bold-backgroundColor);
}
.gux-tag.gux-accent-4.gux-emphasis-subtle {
  color: var(--gse-ui-tag-accent4-subtle-foregroundColor);
  background-color: var(--gse-ui-tag-accent4-subtle-backgroundColor);
}
.gux-tag.gux-accent-5 {
  color: var(--gse-ui-tag-accent5-bold-foregroundColor);
  background-color: var(--gse-ui-tag-accent5-bold-backgroundColor);
}
.gux-tag.gux-accent-5.gux-emphasis-subtle {
  color: var(--gse-ui-tag-accent5-subtle-foregroundColor);
  background-color: var(--gse-ui-tag-accent5-subtle-backgroundColor);
}
.gux-tag.gux-accent-6 {
  color: var(--gse-ui-tag-accent6-bold-foregroundColor);
  background-color: var(--gse-ui-tag-accent6-bold-backgroundColor);
}
.gux-tag.gux-accent-6.gux-emphasis-subtle {
  color: var(--gse-ui-tag-accent6-subtle-foregroundColor);
  background-color: var(--gse-ui-tag-accent6-subtle-backgroundColor);
}
.gux-tag.gux-accent-7 {
  color: var(--gse-ui-tag-accent7-bold-foregroundColor);
  background-color: var(--gse-ui-tag-accent7-bold-backgroundColor);
}
.gux-tag.gux-accent-7.gux-emphasis-subtle {
  color: var(--gse-ui-tag-accent7-subtle-foregroundColor);
  background-color: var(--gse-ui-tag-accent7-subtle-backgroundColor);
}
.gux-tag.gux-accent-8 {
  color: var(--gse-ui-tag-accent8-bold-foregroundColor);
  background-color: var(--gse-ui-tag-accent8-bold-backgroundColor);
}
.gux-tag.gux-accent-8.gux-emphasis-subtle {
  color: var(--gse-ui-tag-accent8-subtle-foregroundColor);
  background-color: var(--gse-ui-tag-accent8-subtle-backgroundColor);
}
.gux-tag.gux-accent-9 {
  color: var(--gse-ui-tag-accent9-bold-foregroundColor);
  background-color: var(--gse-ui-tag-accent9-bold-backgroundColor);
}
.gux-tag.gux-accent-9.gux-emphasis-subtle {
  color: var(--gse-ui-tag-accent9-subtle-foregroundColor);
  background-color: var(--gse-ui-tag-accent9-subtle-backgroundColor);
}
.gux-tag.gux-accent-10 {
  color: var(--gse-ui-tag-accent10-bold-foregroundColor);
  background-color: var(--gse-ui-tag-accent10-bold-backgroundColor);
}
.gux-tag.gux-accent-10.gux-emphasis-subtle {
  color: var(--gse-ui-tag-accent10-subtle-foregroundColor);
  background-color: var(--gse-ui-tag-accent10-subtle-backgroundColor);
}
.gux-tag.gux-accent-inherit {
  color: inherit;
  background-color: inherit;
}