/*wrapper*/
.wrapper {
  display: grid;
  grid-template-columns: 1fr max-content max-content;
  gap: var(--spacing-gap-m);
  border-radius: var(--control-border-radius);
  border: var(--control-border-width) solid var(--control-border-color);
  padding-block: var(--control-padding-block);
  padding-inline: var(--control-padding-inline);
}
.wrapper:hover {
  border-color: var(--control-border-color-hover);
}

/*input*/
.input {
  --control-border-width: 0;
  --control-padding-block: 0;
  --control-padding-inline: 0;
  --focus-outline-width: 0;
  --focus-outline: none;
  outline: none !important;
}

:host(:focus-within) .wrapper {
  --focus-outline-width: 2px;
  outline: var(--focus-outline-width) solid var(--color-border-primary-focused);
  outline-offset: calc(2px * -1);
}

:host(.entity-selector--button-has-focus) .wrapper {
  outline: none;
}

:host([disabled]) {
  pointer-events: none;
}
:host([disabled]) .wrapper {
  background-color: var(--color-accent-neutral-disabled);
  border-color: var(--color-border-neutral-disabled);
}