:host {
  display: block;
}

:host([aria-disabled=true]) .pds-combobox__input-icon {
  color: var(--pine-color-text-disabled);
  pointer-events: none;
}

.pds-combobox {
  position: relative;
}

.pds-combobox__label {
  color: var(--pine-color-text-label);
  display: block;
  font: var(--pine-typography-body-medium);
  letter-spacing: var(--pine-letter-spacing);
  margin-block-end: var(--pine-dimension-2xs);
}

.pds-combobox__input-wrapper {
  align-items: center;
  display: flex;
  position: relative;
  width: 100%;
}

.pds-combobox__input {
  background: var(--pine-color-background-container);
  border: var(--pine-border);
  border-radius: var(--pine-dimension-125);
  box-sizing: border-box;
  color: var(--pine-color-text-strong);
  flex: 1;
  font: var(--pine-typography-body-medium);
  padding: var(--pine-dimension-xs) var(--pine-dimension-450) var(--pine-dimension-xs) var(--pine-dimension-150);
  transition: border-color var(--pine-motion-duration-base) ease;
  width: 100%;
}
.pds-combobox__input:hover:not(:disabled) {
  border-color: var(--pine-color-border-hover);
}
.pds-combobox__input:disabled {
  background: var(--pine-color-background-container-disabled);
  border-color: var(--pine-color-border-disabled);
  color: var(--pine-color-text-disabled);
  cursor: not-allowed;
}
.pds-combobox__input:disabled::placeholder {
  color: var(--pine-color-text-placeholder-disabled);
}
.pds-combobox__input:focus-visible {
  border-color: var(--pine-color-border-active);
  outline: var(--pine-outline-focus);
  outline-offset: var(--pine-border-width);
}
.pds-combobox__input::placeholder {
  color: var(--pine-color-text-placeholder);
}

.pds-combobox__input-icon {
  color: var(--pine-color-text-secondary);
  inset-inline-end: var(--pine-dimension-150);
  pointer-events: none;
  position: absolute;
  z-index: var(--pine-z-index-raised);
}

.pds-combobox__listbox {
  background: var(--pine-color-background-overlay);
  border: 0;
  border-radius: var(--pine-dimension-125);
  box-shadow: var(--pine-box-shadow);
  list-style: none;
  margin: 0;
  min-width: 220px;
  overflow-y: auto;
  padding: var(--pine-dimension-xs);
  position: absolute;
  z-index: var(--pine-z-index-raised);
}

.pds-combobox__option {
  align-items: center;
  background: transparent;
  border-radius: var(--pine-dimension-125);
  color: var(--pine-color-text-secondary);
  cursor: pointer;
  display: flex;
  font: var(--pine-typography-body-medium);
  justify-content: space-between;
  padding: var(--pine-dimension-xs) var(--pine-dimension-sm);
  position: relative;
  transition: background 0.15s;
}
.pds-combobox__option[aria-selected=true] {
  background: var(--pine-color-background-muted);
}
.pds-combobox__option:focus-visible {
  outline: 0;
}

.pds-combobox__option.pds-combobox__option--layout .pds-combobox__option-layout-wrapper {
  align-items: center;
  display: flex;
  width: 100%;
}

.pds-combobox__option.pds-combobox__option--chip .pds-combobox__option-chip {
  align-items: center;
  display: flex;
  width: 100%;
}

.pds-combobox__option:last-child {
  margin-block-end: 0;
}

.pds-combobox__option--highlighted,
.pds-combobox__option[selected],
.pds-combobox__option--selected {
  background: var(--pine-color-background-muted);
}

.pds-combobox__option-check {
  color: currentColor;
  font-size: var(--pine-dimension-150);
  margin-inline-start: var(--pine-dimension-150);
}

.pds-combobox__group-label {
  color: var(--pine-color-text-tertiary);
  cursor: default;
  font: var(--pine-typography-heading-caption);
  margin-block-end: var(--pine-dimension-2xs);
  margin-block-start: var(--pine-dimension-150);
  padding: var(--pine-dimension-2xs) var(--pine-dimension-sm);
  text-transform: uppercase;
}
.pds-combobox__group-label:first-child {
  margin-block-start: 0;
}

.pds-combobox__loading {
  align-items: center;
  display: flex;
  justify-content: center;
  padding: var(--pine-dimension-150);
}

.pds-combobox__empty {
  color: var(--pine-color-text-tertiary);
  padding: var(--pine-dimension-150) var(--pine-dimension-sm);
  text-align: center;
}

.pds-combobox__load-more {
  align-items: center;
  display: flex;
  justify-content: center;
  padding: var(--pine-dimension-150);
}

.pds-combobox__button-trigger {
  align-items: center;
  background: var(--color-background-default, var(--pine-color-secondary));
  border: var(--pine-border);
  border-radius: var(--pine-border-radius-full);
  color: var(--color-text-default, var(--pine-color-text-inverse-emphasis));
  cursor: pointer;
  display: flex;
  font: var(--pine-typography-body-medium);
  justify-content: space-between;
  min-height: var(--pine-dimension-450);
  outline: none;
  padding: 0 var(--pine-dimension-sm);
  transition: border-color 0.15s, box-shadow 0.15s, background 0.15s;
  width: fit-content;
}
.pds-combobox__button-trigger .pds-combobox__button-trigger-layout-wrapper {
  align-items: center;
  display: flex;
  flex: 1;
}
.pds-combobox__button-trigger .trigger-content {
  align-items: center;
  display: flex;
  width: 100%;
}

.pds-combobox__button-trigger:focus-visible {
  border-color: var(--color-border-focus, var(--pine-color-border));
  box-shadow: 0 0 0 2px var(--color-outline, var(--pine-color-focus-ring));
}

.pds-combobox__button-trigger:hover {
  background: var(--color-background-hover, var(--pine-color-secondary-hover));
  border-color: var(--color-border-hover, var(--pine-color-border-hover));
}

.pds-combobox__button-trigger[aria-disabled=true],
.pds-combobox__button-trigger:disabled {
  background: var(--color-background-disabled, var(--pine-color-secondary-disabled));
  border-color: var(--color-border-disabled, var(--pine-color-border-disabled));
  color: var(--color-text-disabled, var(--pine-color-text-secondary-disabled));
  cursor: not-allowed;
  opacity: 0.6;
}

.pds-combobox__button-trigger-label {
  color: inherit;
  flex: 1 1 auto;
  text-align: start;
}

.pds-combobox__button-trigger--input-shape {
  border-radius: var(--pine-dimension-125);
  min-height: var(--pine-dimension-500);
}

.pds-combobox__button-trigger-chevron {
  color: currentColor;
  margin-inline-start: var(--pine-dimension-150);
}

.pds-combobox__button-trigger--primary {
  --color-background-default: var(--pine-color-primary);
  --color-background-hover: var(--pine-color-primary-hover);
  --color-background-disabled: var(--pine-color-primary-disabled);
  --color-border-default: var(--pine-color-primary);
  --color-border-hover: var(--pine-color-primary-hover);
  --color-border-disabled: var(--pine-color-primary-disabled);
  --color-border-focus: var(--pine-color-primary);
  --color-text-default: var(--pine-color-text-primary);
  --color-text-disabled: var(--pine-color-text-primary-disabled);
  --color-outline: var(--pine-color-focus-ring);
}

.pds-combobox__button-trigger--accent {
  --color-background-default: var(--pine-color-accent);
  --color-background-hover: var(--pine-color-accent-hover);
  --color-background-disabled: var(--pine-color-accent-disabled);
  --color-border-default: var(--pine-color-accent);
  --color-border-hover: var(--pine-color-accent-hover);
  --color-border-disabled: var(--pine-color-accent-disabled);
  --color-border-focus: var(--pine-color-accent);
  /* stylelint-disable-next-line pine-design-system/prefer-semantic-tokens */
  --color-text-default: var(--pine-color-white);
  --color-text-disabled: var(--pine-color-text-accent-disabled);
  --color-outline: var(--pine-color-focus-ring);
}

.pds-combobox__button-trigger--secondary {
  --color-background-default: var(--pine-color-secondary);
  --color-background-hover: var(--pine-color-secondary-hover);
  --color-background-disabled: var(--pine-color-secondary-disabled);
  --color-border-default: var(--pine-color-border);
  --color-border-hover: var(--pine-color-border-hover);
  --color-border-disabled: var(--pine-color-border-disabled);
  --color-border-focus: var(--pine-color-border);
  --color-text-default: var(--pine-color-text-secondary);
  --color-text-disabled: var(--pine-color-text-secondary-disabled);
  --color-outline: var(--pine-color-focus-ring);
}

.pds-combobox__button-trigger--destructive {
  --color-background-default: var(--pine-color-danger);
  --color-background-hover: var(--pine-color-danger-hover);
  --color-background-disabled: var(--pine-color-danger-disabled);
  --color-border-default: var(--pine-color-danger);
  --color-border-hover: var(--pine-color-danger-hover);
  --color-border-disabled: var(--pine-color-danger-disabled);
  --color-border-focus: var(--pine-color-danger);
  /* stylelint-disable-next-line pine-design-system/prefer-semantic-tokens */
  --color-text-default: var(--pine-color-white);
  --color-text-disabled: var(--pine-color-text-danger-disabled);
  --color-outline: var(--pine-color-focus-ring-danger);
}

.visually-hidden {
  border: 0;
  clip: rect(0 0 0 0);
  clip-path: polygon(0 0, 0 0, 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

[data-layout] {
  border-radius: var(--pine-dimension-125);
  padding-block: var(--pine-dimension-xs);
}

.pds-combobox__chip-trigger {
  align-items: center;
  border-radius: var(--pine-dimension-sm);
  cursor: pointer;
  display: inline-flex;
  font: var(--pine-typography-body-medium);
  justify-content: space-between;
  outline: none;
  padding-block: var(--pine-dimension-025);
  padding-inline: var(--pine-dimension-150);
  transition: all 0.15s ease;
  width: fit-content;
}
.pds-combobox__chip-trigger .pds-combobox__chip-trigger-layout-wrapper {
  align-items: center;
  display: flex;
  flex: 1;
}
.pds-combobox__chip-trigger .trigger-content {
  align-items: center;
  display: flex;
  width: 100%;
}
.pds-combobox__chip-trigger:focus-visible {
  outline: var(--pine-outline-focus);
  outline-offset: var(--pine-border-width);
}
.pds-combobox__chip-trigger[aria-disabled=true] {
  cursor: not-allowed;
  opacity: 0.6;
}

.pds-combobox__chip-trigger-label {
  color: inherit;
  flex: 1 1 auto;
  text-align: start;
}

.pds-combobox__chip-trigger-chevron {
  color: currentColor;
  margin-inline-start: var(--pine-dimension-150);
}

.pds-combobox__chip-trigger-icon {
  margin-inline-end: var(--pine-dimension-2xs);
}

.pds-combobox__chip-trigger--neutral,
.pds-combobox__chip-trigger--accent,
.pds-combobox__chip-trigger--success,
.pds-combobox__chip-trigger--warning,
.pds-combobox__chip-trigger--danger,
.pds-combobox__chip-trigger--info {
  background: var(--chip-bg);
  border: var(--pine-border-width) solid var(--chip-border);
  color: var(--chip-text);
}
.pds-combobox__chip-trigger--neutral:hover:not([aria-disabled=true]),
.pds-combobox__chip-trigger--accent:hover:not([aria-disabled=true]),
.pds-combobox__chip-trigger--success:hover:not([aria-disabled=true]),
.pds-combobox__chip-trigger--warning:hover:not([aria-disabled=true]),
.pds-combobox__chip-trigger--danger:hover:not([aria-disabled=true]),
.pds-combobox__chip-trigger--info:hover:not([aria-disabled=true]) {
  background: var(--chip-bg-hover);
}
.pds-combobox__chip-trigger--neutral:focus-visible,
.pds-combobox__chip-trigger--accent:focus-visible,
.pds-combobox__chip-trigger--success:focus-visible,
.pds-combobox__chip-trigger--warning:focus-visible,
.pds-combobox__chip-trigger--danger:focus-visible,
.pds-combobox__chip-trigger--info:focus-visible {
  border-color: var(--chip-border);
}

.pds-combobox__chip-trigger--neutral {
  --chip-bg: var(--pine-chip-color-neutral);
  --chip-bg-hover: var(--pine-chip-color-neutral-hover);
  --chip-border: var(--pine-chip-color-neutral-hover);
  --chip-text: var(--pine-color-text-neutral);
}

.pds-combobox__chip-trigger--accent {
  --chip-bg: var(--pine-chip-color-accent);
  --chip-bg-hover: var(--pine-chip-color-accent-hover);
  --chip-border: var(--pine-chip-color-accent-hover);
  --chip-text: var(--pine-color-text-accent);
}

.pds-combobox__chip-trigger--success {
  --chip-bg: var(--pine-chip-color-success);
  --chip-bg-hover: var(--pine-chip-color-success-hover);
  --chip-border: var(--pine-chip-color-success-hover);
  --chip-text: var(--pine-color-text-success);
}

.pds-combobox__chip-trigger--warning {
  --chip-bg: var(--pine-chip-color-warning);
  --chip-bg-hover: var(--pine-chip-color-warning-hover);
  --chip-border: var(--pine-chip-color-warning-hover);
  --chip-text: var(--pine-color-text-warning);
}

.pds-combobox__chip-trigger--danger {
  --chip-bg: var(--pine-chip-color-danger);
  --chip-bg-hover: var(--pine-chip-color-danger-hover);
  --chip-border: var(--pine-chip-color-danger-hover);
  --chip-text: var(--pine-color-text-danger);
}

.pds-combobox__chip-trigger--info {
  --chip-bg: var(--pine-chip-color-info);
  --chip-bg-hover: var(--pine-chip-color-info-hover);
  --chip-border: var(--pine-chip-color-info-hover);
  --chip-text: var(--pine-color-text-info);
}

.pds-combobox__chip-trigger--brand {
  /* stylelint-disable-next-line pine-design-system/no-hardcoded-colors */
  background: linear-gradient(90deg, #FF3E14 0%, #6B62F2 100%);
  border: 0;
  color: var(--pine-color-text-neutral);
  padding: 1px;
  position: relative;
}
.pds-combobox__chip-trigger--brand .pds-combobox__chip-trigger-label {
  /* stylelint-disable-next-line pine-design-system/no-hardcoded-colors */
  background: rgba(255, 255, 255, 0.9);
  border-radius: calc(var(--pine-dimension-sm) - 1px);
  color: var(--pine-color-text-neutral);
  font-weight: var(--pine-font-weight-medium);
  padding: var(--pine-dimension-025) var(--pine-dimension-150);
  position: relative;
  z-index: 1;
}
.pds-combobox__chip-trigger--brand .pds-combobox__chip-trigger-chevron {
  position: relative;
  z-index: 1;
}
.pds-combobox__chip-trigger--brand:hover:not([aria-disabled=true]) .pds-combobox__chip-trigger-label {
  /* stylelint-disable-next-line pine-design-system/no-hardcoded-colors */
  background: rgba(255, 255, 255, 0.8);
}

.pds-combobox__chip-trigger--dropdown:not(.pds-combobox__chip-trigger--brand) {
  padding: var(--pine-dimension-none);
}
.pds-combobox__chip-trigger--dropdown:not(.pds-combobox__chip-trigger--brand) .pds-combobox__chip-trigger-label {
  padding: var(--pine-dimension-025) var(--pine-dimension-150);
}

.pds-combobox__chip-trigger--large .pds-combobox__chip-trigger-label {
  font-family: var(--pine-font-family-heading);
  font-size: var(--pine-font-size-heading-6);
  font-weight: var(--pine-font-weight-medium);
  letter-spacing: var(--pine-letter-spacing-heading-6);
}

.pds-combobox__chip-trigger--dot .pds-combobox__chip-trigger-label::before {
  border: var(--pine-border-width) solid transparent;
  border-radius: var(--pine-border-radius-full);
  content: "";
  display: inline-block;
  height: var(--pine-dimension-2xs);
  margin-inline-end: var(--pine-dimension-2xs);
  width: var(--pine-dimension-2xs);
}