:host {
  display: block;
}

:host(:focus-visible) {
  outline: none;
}
:host(:focus-visible) .gux-node {
  outline: var(--gse-semantic-focusOutline-md-borderWidth) solid var(--gse-semantic-border-focus);
  outline-offset: var(--gse-semantic-focusOutline-offset);
}
:host(:focus-visible) .gux-tree-item {
  background-color: var(--gse-ui-treeView-background-hover);
}

.gux-wrapper {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  place-content: stretch flex-start;
  align-items: stretch;
}
.gux-wrapper .gux-node {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: var(--gse-semantic-interactive-sm-gap);
  place-content: stretch flex-start;
  align-items: stretch;
}
.gux-wrapper .gux-node .gux-selected-bookmark {
  flex: 0 1 auto;
  align-self: auto;
  inline-size: 6px;
  background: transparent;
  border-radius: var(--gse-semantic-interactive-sm-borderRadius);
}
.gux-wrapper .gux-node .gux-tree-item {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  align-self: auto;
  padding: var(--gse-ui-treeView-item-comfy-leftAligned-padding);
  border-radius: var(--gse-semantic-interactive-sm-borderRadius);
}
.gux-wrapper .gux-node .gux-tree-item:has(:focus-visible), .gux-wrapper .gux-node .gux-tree-item:hover {
  background-color: var(--gse-ui-treeView-background-hover);
}
.gux-wrapper .gux-node .gux-tree-item .gux-selection-target {
  display: flex;
  flex: 1 1 auto;
  gap: var(--gse-semantic-interactive-lg-gap);
  align-items: center;
  align-self: auto;
}
.gux-wrapper .gux-node .gux-tree-item .gux-selection-target .gux-icon {
  display: flex;
  align-items: center;
}
.gux-wrapper.gux-compact .gux-tree-item {
  padding: var(--gse-ui-treeView-item-compact-leftAligned-padding);
}
.gux-wrapper.gux-compact.gux-end .gux-tree-item {
  padding: var(--gse-ui-treeView-item-compact-rightAligned-padding);
}
.gux-wrapper.gux-end .gux-tree-item {
  padding: var(--gse-ui-treeView-item-comfy-rightAligned-padding);
}
.gux-wrapper.gux-selected .gux-selected-bookmark {
  background: var(--gse-semantic-background-interactive-primary-default);
}
.gux-wrapper.gux-selected .gux-tree-item {
  background-color: var(--gse-ui-treeView-background-selected);
}
.gux-wrapper.gux-disabled {
  opacity: var(--gse-ui-treeView-disableOpacity);
  pointer-events: none;
  cursor: default;
}

::slotted(gux-icon[slot=icon]) {
  display: flex;
  align-items: center;
  inline-size: 16px;
  block-size: 16px;
}