.bbd-sorting__select {
  position: relative;
  display: flex;
  align-items: center;
  gap: var(--gap-sm);
  line-height: 1;
  color: var(--color-foreground);
  white-space: nowrap;
  word-break: keep-all;
  transition: all 0.15s ease-in-out;
  padding-inline-end: 0;

  @media (width > 750px) {
    padding-inline-end: var(--padding--sm);
  }

  .svg-wrapper,
  .svg-wrapper > svg {
    width: var(--icon-size-md);
    height: var(--icon-size-md);
  }

  .facets__summary:hover &,
  .facets__summary:focus-visible & {
    color: var(--color-primary-hover);
  }

  .facets__status {
    display: inline-block;
    font-size: var(--font-size--sm);
    font-weight: var(--font-weight--regular);
    color: currentColor;
  }
}

.bbd-sorting__panel {
  padding-inline: 0;
}

/* Popover */
.sorting-filter__option {
  align-items: center;
  gap: var(--gap-xs);

  .svg-wrapper,
  .svg-wrapper svg {
    width: var(--icon-size-sm);
    height: var(--icon-size-sm);
  }
}

/* Select version */
.sorting-filter__container {
  margin: 0;
  padding: 0;
}

.sorting-filter__select-wrapper {
  width: 100%;
  border-radius: 0;

  .sorting-filter__select {
    background: transparent;
    text-align: left;
    text-align-last: left;
    font-size: var(--font-size--sm);
  }

  .svg-wrapper,
  .svg-wrapper > svg {
    width: var(--icon-size-sm);
    height: var(--icon-size-sm);
  }

  &:has(:focus-visible) {
    outline: 2px solid var(--color-focus);
    outline-offset: 0;
  }

  @media screen and (max-width: 750px) {
    .svg-wrapper {
      position: absolute;
      right: 0;
    }
  }
}