:host {
  display: block;
  width: 100%;
}

  :host * {
    box-sizing: border-box;
  }

.select {
  position: relative;
  display: flex;
  width: 100%;
}

.select ::part(popover__content) {
    margin-top: var(--s-space-16);
  }

@media (min-width: 768px) {

.select ::part(popover__scroll-container) {
      padding-top: 0
  }
    }

.select--placement-top-start ::part(popover__content) {
    margin-top: -2.25rem;
  }

.select--multi .select__input {
    position: absolute;
    width: 100%;
    height: 100%;
    pointer-events: none;
    opacity: 0;
  }

.select--multi .select__multi-select-values {
    display: flex;
  }

.select--disabled .select__input {
    color: var(--s-text-disabled);
  }

.select--disabled .select__indicator {
    color: var(--s-icon-disabled);
  }

.select--inline .select__indicator {
    transform: translateY(-50%);
  }

.select--standalone {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

.select--standalone .select__indicator {
    position: relative;
    top: auto;
    right: auto;
    cursor: pointer;
    transform: none;
  }

.select--standalone .select__input {
    padding-right: var(--s-space-8);
    font-weight: var(--s-font-weight-medium);
    cursor: pointer;
  }

.select--standalone .select__value-container {
    width: -webkit-min-content;
    width: -moz-min-content;
    width: min-content;
  }

.select--search-loading .select__search-input {
    padding-right: calc(var(--s-space-12) + 1.5rem + var(--s-space-8));
  }

.select__resize-helper {
  display: block;
  width: auto;
  height: 0;
  margin: 0;
  padding: 0;
  padding-right: calc(1.5rem + var(--s-space-8));
  padding-right: var(--s-space-8);
  font: inherit;
  font-weight: var(--s-font-weight-medium);
  line-height: var(--s-line-height-base);
  text-align: left;
  white-space: pre;
  white-space: pre;
  vertical-align: top;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  pointer-events: none;
  opacity: 0;
}

@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px) {

.select__resize-helper {
    font-size: var(--s-font-size-sm);
    line-height: var(--s-line-height-sm)
}
  }

.select__input {
  display: block;
  overflow: hidden;
  width: 100%;
  height: 1.25rem;
  margin: 0;
  padding: 0;
  padding-right: calc(1.5rem + var(--s-space-8));
  border: none;
  background-color: transparent;
  font: inherit;
  line-height: var(--s-line-height-base);
  text-align: left;
  white-space: nowrap;
  text-overflow: ellipsis;
  cursor: default;
}

.select__input:focus {
    outline: none;
  }

@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px) {

.select__input {
    font-size: var(--s-font-size-sm);
    line-height: var(--s-line-height-sm)
}
  }

.select__multi-select-values {
  display: none;
  overflow: hidden;
  width: 100%;
  min-height: 1.25rem;
  padding-right: calc(1.5rem + var(--s-space-8));
  flex-wrap: wrap;
  flex-shrink: 0;
  gap: var(--s-space-8);
}

.select__multi-select-values ::part(tag) {
    height: 1.25rem;
    padding: 0 var(--s-space-4);
  }

.select__indicator {
  position: absolute;
  top: 50%;
  right: 0;
  display: inline-flex;
  color: var(--s-icon-default);
  transform: translateY(calc(-50% - var(--s-space-8)));
}

.select__search {
  position: relative;
  display: flex;
  width: 100%;
  padding: 0.0625rem var(--s-space-8);
  border-bottom: 0.0625rem solid var(--s-border-default);
}

@media (min-width: 768px) {

.select__search {
    position: sticky;
    z-index: 1;
    top: 0;
    padding-top: var(--s-space-8);
    padding-right: 0.0625rem;
    padding-left: 0.0625rem
}
  }

.select__search-icon {
  position: absolute;
  top: 50%;
  left: calc(var(--s-space-8) * 2);
  display: inline-flex;
  color: var(--s-icon-default);
  transform: translateY(-50%);
}

@media (min-width: 768px) {

.select__search-icon {
    left: var(--s-space-12);
    margin-top: var(--s-space-4);
    padding: 0.0625rem
}
  }

.select__search-input {
  width: 100%;
  height: 2.5rem;
  padding-right: var(--s-space-12);
  padding-left: calc(var(--s-space-12) + 1.25rem + var(--s-space-8));
  align-items: center;
  border: none;
  color: var(--s-text-default);
  background-color: transparent;
  font: inherit;
  line-height: var(--s-line-height-base);
  caret-color: var(--s-border-highlight);
}

.select__search-input:focus:not(:focus-visible) {
    outline: none;
  }

.select__search-input:focus-visible {
    outline-color: var(--s-focus-default);
  }

.select__search-input::-moz-placeholder {
    color: var(--s-text-subdued);
  }

.select__search-input::placeholder {
    color: var(--s-text-subdued);
  }

.select__search-input::-webkit-search-decoration,
  .select__search-input::-webkit-search-cancel-button,
  .select__search-input::-webkit-search-results-button,
  .select__search-input::-webkit-search-results-decoration {
    -webkit-appearance: none;
            appearance: none;
  }

@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px) {

.select__search-input {
    font-size: var(--s-font-size-sm);
    line-height: var(--s-line-height-sm)
}
  }

.select__popover::part(popover__scroll-container) {
    padding: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
  }

.select__popover .select__search {
    flex-shrink: 0;
  }

.select__popover .select__option-list {
    padding: var(--s-space-4);
        overflow: auto;
    min-height: 0;
  }

.select__search-spinner {
  position: absolute;
  top: 50%;
  right: var(--s-space-12);
  display: inline-flex;
  transform: translateY(-50%);
}

@media (min-width: 768px) {

.select__search-spinner {
    margin-top: var(--s-space-4)
}
  }

.select__empty-list-label {
  padding: var(--s-space-12) var(--s-space-12) 0;
}

.select__empty-list-label:not(:only-child) {
    display: none;
  }

@media (min-width: 768px) {

.select__empty-list-label {
    padding: var(--s-space-12) var(--s-space-12) var(--s-space-8)
}
  }