.form-select {
  position: relative;
  transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.form-select input {
  color: var(--color-light-1);
  border: 2px solid var(--color-border);
  border-radius: 4px;
  min-height: 70px;
  transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
  text-align: start;
  padding-left: 50px;
}

.form-select::before {
  content: '+';
  position: absolute;
  width: 30px;
  height: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  top: 0;
  top: 21px;
  left: 12px;
  color: var(--color-light-1);
  pointer-events: none;
  border-radius: 100%;
  border: 1px solid var(--color-border);
  transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
  font-size: 1.2rem;
}

.form-select:has(input:focus)::before {
  content: '-';
}


.form-select input:focus {
  border: 2px solid #051036 !important;
}

.form-select .select-dropdown {
  width: 100%;
  height: 0;
  overflow: hidden;
}

.form-select:has(input:focus) .select-dropdown {
  height: max-content;
}

.form-select ul {
  list-style: none;
  border: 1px solid var(--color-border);
}

.form-select a {
  padding: 20px 25px;
  display: block;
}

.form-select a:hover {
  color: inherit;
  background-color: color-mix(in srgb, var(--color-border) 95%, #1e1e1e 5%);
}