.custom-select select {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

.custom-select,
.custom-date {
  position: relative;
}

.custom-select.has-border:after,
.custom-date:after {
  content: '';
  width: 1px;
  height: 64px;
  position: absolute;
  top: calc(50% - 45px);
  right: -72px;
  display: block;
  background: white;
}

.custom-select-wrap {
  position: relative;
  display: inline-block;
}

.custom-select-wrap.is-locked .custom-select-current {
  cursor: default;
  pointer-events: none;
}

.custom-select-wrap.is-locked .custom-select-current:after {
  display: none;
}

.custom-select-current {
  cursor: pointer;
  user-select: none;
  height: 27px;
  padding-bottom: 10px;
  width: 206px;
  color: white;
  font-family: var(--font-manrope);
  font-size: 18px;
  line-height: 27px;
}

.custom-select-current:after {
  content: '';
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0;
  width: 20px;
  height: 20px;
  background: url('/wp-content/themes/thehands/assets/img/select.svg') no-repeat center;
  transition: transform var(--transition);
}

.custom-select-wrap.colored .custom-select-current:after {
  background: url('/wp-content/themes/thehands/assets/img/select-colored.svg') no-repeat center;
}

.custom-select-wrap.open .custom-select-current:after {
  transform: translateY(-50%) rotate(180deg);
}

.custom-select-dropdown {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 30px);
  padding: 7px 0;
  max-height: 300px;
  overflow-y: auto;
  background: var(--color-dark);
  border: 1px solid var(--color-dark);
  z-index: -1;
  opacity: 0;
  pointer-events: none;
  border-radius: 16px;
  transition: transform var(--transition);
}

.custom-select-wrap.open .custom-select-dropdown {
  z-index: 100;
  opacity: 1;
  pointer-events: all;
  transform: translateY(-20px);
}

.custom-select-dropdown-item {
  padding: 9px 10px 9px 16px;
  cursor: pointer;
  font-family: var(--font-manrope);
  font-size: 18px;
  line-height: 150%;
  color: white;
  border-bottom: 0.5px solid rgba(255, 255, 255, 0.5);
  transition: color var(--transition);
}

.order-wrap .custom-select-dropdown-item[data-id="0"],
.order-wrap .custom-select-dropdown-item[data-id=""] {
  display: none;
}

.custom-select-dropdown > .custom-select-dropdown-item:last-child {
  border-bottom: none;
}

.custom-select-dropdown-item:hover,
.custom-select-dropdown-item.selected {
  color: var(--color-orange);
}
