.ss-main,
.ss-content {
  --ss-main-height: 54px;
  --ss-border-radius: 6px;
  --ss-border-color: var(--neutral-semi-dark);
  --ss-font-color: var(--neutral);
  font-size: var(--text-m);
}
.ss-main:hover,
.ss-main.ss-open-below,
.ss-content.ss-open-below {
  --ss-border-color: var(--neutral-dark);
}
.ss-main {
  --ss-bg-color: rgba(255, 255, 255, 0.14);
}
.ss-content {
  --ss-bg-color: rgba(255, 255, 255, 1);
}
.ss-main.ss-main {
  padding: 5px 12px;
  transition: border-color var(--transition-duration) var(--transition-timing);
}
.ss-main.ss-main .ss-values .ss-single {
  margin: auto 0;
}
.ss-main.ss-main .ss-values .ss-placeholder {
  opacity: 0.5;
}
.ss-main.ss-main .ss-values .ss-single,
.ss-main.ss-main .ss-values .ss-placeholder {
  padding: 0;
  color: inherit;
}
.ss-main.ss-main .ss-arrow {
  flex-shrink: 0;
  margin: auto 0 auto 8px;
  width: 17px;
  height: 17px;
  background-image: url("data:image/svg+xml,%3Csvg width='17' height='17' viewBox='0 0 17 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.50048 9.08125L11.8005 5.78125L12.7431 6.72392L8.50048 10.9666L4.25781 6.72392L5.20048 5.78125L8.50048 9.08125Z' fill='%231E1E1E'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-position: center center;
}
.ss-main.ss-main.ss-open-below .ss-arrow {
  transform: rotate(180deg);
}
.ss-main.ss-main .ss-arrow *,
.ss-main.ss-main .ss-deselect {
  display: none;
}
.ss-content.ss-content .ss-list {
  padding: 0;
}
.ss-content.ss-content .ss-list .ss-option {
  padding: 8px 12px;
  transition: all var(--transition-duration) var(--transition-timing);
}
.ss-content.ss-content .ss-list .ss-option:hover {
  background-color: var(--neutral-semi-light);
  color: var(--ss-font-color);
}
.ss-content.ss-content .ss-list .ss-option.ss-highlighted,
.ss-content.ss-content .ss-list .ss-option:not(.ss-disabled).ss-selected {
  background-color: var(--primary);
  color: var(--white);
}


.ss-main.ss-main.ss-invalid:not(.ss-open-below) {
  border: 1px solid var(--primary);
}