:root {
  --ss-main-height: 38px;
  --ss-font-placeholder-color: #9ca3af;
  --ss-primary-color: #059669;
}

.slim-select-title {
  & .ss-single {
    width: 100%;
    padding-right: 8px;
    font-size: 17px !important;
    line-height: 34px !important;
  }
}

.ss-option {
  padding: 7px 10px !important;
}

.ss-main svg path {
  stroke-width: 12 !important;
}

.ss-value-delete {
  width: 10px !important;
  border: 0 !important;
}

.ss-value-text {
  font-size: 14px !important;
}

.ss-values {
  & .ss-value {
    background-color: #fff !important;
    border: 1px #cbd5e1 solid !important;

    & .ss-value-text {
      color: #374151 !important;
      line-height: inherit !important;
    }

    & .ss-value-delete svg path {
      stroke: #374151 !important;
    }
  }
}

.ss-arrow {
  margin-right: 10px !important;
}

.ss-single {
  margin-left: 9px !important;
}

.ss-placeholder {
  margin-left: 4px !important;
}

.ss-search input {
  box-shadow: none !important;
  padding: 5px 6px !important;
}

.ss-content.ss-open-above {
  border-bottom-right-radius: 0px !important;
  border-bottom-left-radius: 0px !important;
}

.ss-content.ss-open-below {
  border-top-right-radius: 0px !important;
  border-top-left-radius: 0px !important;
}

.ss-main:focus {
  border-color: rgb(16 185 129/1) !important;
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0
    var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0
    calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow:
    var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}

.ss-option.ss-selected {
  background-color: rgb(249 250 251) !important;
  color: inherit !important;
}

.ss-option:hover {
  background-color: rgb(249 250 251) !important;
  color: inherit !important;
}

.ss-highlighted {
  background-color: rgb(249 250 251) !important;
  color: inherit !important;
}

.ss-value {
  animation-duration: 0s !important;
}