:host([hidden]) {
  display: none;
}
:host {
  display: flex;
}

:host {
  -webkit-tap-highlight-color: transparent;
  cursor: pointer;
  gap: var(--spacingVerticalL);
}

:host([orientation='vertical']) {
  flex-direction: column;
  justify-content: flex-start;
}

:host([orientation='horizontal']) {
  flex-direction: row;
}

::slotted(*) {
  color: var(--colorNeutralForeground3);
}

::slotted(:hover) {
  color: var(--colorNeutralForeground2);
}

::slotted(:active) {
  color: var(--colorNeutralForeground1);
}

::slotted(:state(disabled)) {
  color: var(--colorNeutralForegroundDisabled);
}

::slotted(:state(checked)) {
  color: var(--colorNeutralForeground1);
}

:host([slot='input']) {
  margin: var(--spacingVerticalS) var(--spacingHorizontalS);
}