/* ----------------------------------------- */
/* Devbridge Autocomplete - Bootstrap 4 Estilos */
/* ----------------------------------------- */

/* Contenedor principal de las sugerencias */
.autocomplete-suggestions {
    border: 1px solid rgba(0, 0, 0, 0.15); /* Borde similar a dropdown */
    border-radius: 0.25rem; /* Borde redondeado estándar de BS4 */
    background-color: #fff; /* Fondo blanco */
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.175); /* Sombra similar a dropdown */
    overflow: auto; /* Añade scroll si hay muchas sugerencias */
    max-height: 250px; /* Limita la altura máxima (ajusta según necesites) */
    z-index: 1050; /* Asegura que esté por encima de otros elementos (similar a modales/dropdowns de BS4) */

    /* Quitar padding/margin por defecto de la librería si lo tiene */
    padding: 0;
    margin: 0;
    margin-top: 2px; /* Pequeño espacio respecto al input */
}

/* Cada sugerencia individual */
.autocomplete-suggestion {
    padding: 0.5rem 1rem; /* Padding similar a .dropdown-item */
    font-size: 1rem; /* Tamaño de fuente estándar BS4 (o el que uses) */
    font-weight: 400;
    line-height: 1.5;
    color: #212529; /* Color de texto estándar BS4 */
    cursor: pointer;
    white-space: nowrap; /* Evita que el texto se divida en varias líneas */
    overflow: hidden; /* Oculta el texto que desborda */
    text-overflow: ellipsis; /* Añade '...' al texto que desborda */

    /* Asegurar fondo transparente por defecto y sin borde */
    background-color: transparent;
    border: none;
    border-bottom: 1px solid #eee; /* Separador opcional entre items */
}

/* Última sugerencia sin borde inferior */
.autocomplete-suggestion:last-child {
    border-bottom: none;
}

/* Estilo al pasar el ratón por encima o seleccionar con teclado */
.autocomplete-suggestion.autocomplete-selected,
.autocomplete-suggestion:hover {
    color: #16181b; /* Color de texto hover/active de BS4 dropdown */
    background-color: #f8f9fa; /* Color de fondo hover/active de BS4 dropdown (gris claro) */
    text-decoration: none; /* Quitar subrayado si lo hubiera */
}

/* Resaltar la parte del texto que coincide (si la librería añade <strong>) */
.autocomplete-suggestion strong {
    font-weight: 600; /* O 'bold' */
    color: #007bff; /* Color primario de BS4 (o el que uses) */
}

/* Opcional: Estilo para el mensaje "No se encontraron resultados"
   (La librería podría añadirlo con una clase específica, inspecciona si aparece) */
.autocomplete-no-suggestion { /* Ajusta esta clase si la librería usa otra */
    padding: 0.5rem 1rem;
    color: #6c757d; /* Color muted de BS4 */
    font-style: italic;
}

/* Ajustes para el ancho (opcional)
   La librería normalmente intenta ajustar el ancho al del input,
   pero si no lo hace bien, puedes forzarlo. */
/*
.autocomplete-suggestions {
    width: auto !important; // O un ancho específico si es necesario
}
*/