/* Styles for the htmx autocomplete component (see static/js/autocomplete.js).
   Container needs `position: relative` so the absolutely-positioned dropdown
   anchors to the input below it. */

.autocomplete-container {
    position: relative;
}

.suggestions-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 1050;
    max-height: 320px;
    overflow-y: auto;
    display: none;
}

.suggestions-dropdown.show {
    display: block;
}

.suggestion-item:hover {
    background-color: #f8f9fa;
    cursor: pointer;
}