.team-member-x {
  background-color: rgba(34, 97, 169, 0.78);
  padding: 1.5em;
  margin: 1em 0;
  border-radius: 10px;
  box-shadow: 0 0 5px rgba(4, 14, 84, 0.84);
  gap: 40px;
  margin-top: 40px;
  height: auto;
  position: relative;
}

.search-container {
  position: relative;
  width: 80%;
  max-width: 400px;
  pointer-events: all;
}

#searchInput::placeholder {
  color: #b0c4de; /* Farbe des Platzhaltertexts */
  opacity: 1; /* wichtig bei Safari/Firefox, damit es nicht ausgegraut wirkt */
}

#searchInput {
  width: 100%;
  padding: 10px;
  font-size: 16px;
  border-radius: 10px;
  border: 2px solid #05336a; /* fester Rahmen */
  background-color: rgb(28, 79, 136);
  color: white; /* Textfarbe */
  outline: none; /* entfernt den Standard-Glow */
  box-shadow: none;
  caret-color: white; /* Farbe vom blinkenden Cursor */
}

/* wenn das Feld fokussiert wird */
#searchInput:focus {
  background-color: rgb(28, 79, 136); /* bleibt blau */
  border: 2px solid #05336a; /* fester Rand */
  outline: none;
  box-shadow: 0 0 5px #05336a; /* optional: blauer Glow */
}

#results {
  list-style: none;
  padding: 0;
  margin: 0;
  position: absolute;
  width: 100%;
  background: #05336a;
  border: 5px solid #042e62;
  border-radius: 5px;
  max-height: 200px;
  overflow-y: auto;
}

#results li {
  padding: 10px;
  cursor: pointer;
}

#results li:hover {
  background-color: #064188;
}

#searchInput::-webkit-search-decoration,
#searchInput::-webkit-search-cancel-button,
#searchInput::-webkit-search-results-button,
#searchInput::-webkit-search-results-decoration {
  display: none;
}