.autocomplete-container {
    position: relative;
    width: 230px;
  }
  
  input {
    width: 100%;
    font-size: 17px;
    height:  fit-content;
    padding: 8px;
    outline: none;
    padding-left: 20px;
    border: none;
    border-radius: 4px;
    font-family: "Albert Sans", sans-serif;
  }
  
  ul {
    position: absolute;
    width: 130%;
    border: 1px solid #ccc;
    border-radius: 4px;
    background: white;
    list-style: none;
    padding: 0;
    margin: 0;
    max-height: 200px;
    overflow-y: auto;
    z-index: 1;
  }
  
  li {
    padding: 8px;
    cursor: pointer;
  }
  
  li:hover {
    background: #f0f0f0;
  }
  
  .no-results {
    padding: 8px;
    color: gray;
    cursor: default;
    background: #f8f8f8;
    text-align: center;
  }
  .no-results:hover {
    background: #f8f8f8; /* Mantener el mismo fondo */
  }
  