/**
 * Search Module CSS
 * Common styling for destination search functionality
 */

/* Destination suggestions dropdown */
#destination_suggestions {
    max-height: 250px;
    overflow-y: auto;
    z-index: 1050;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    border: 1px solid #dee2e6;
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;
    background: white;
    border-radius: 0.375rem;
    margin-top: 2px;
}

#destination_suggestions li {
    cursor: pointer;
    transition: all 0.2s ease;
    border: 2px solid transparent;
}

#destination_suggestions li:hover {
    background-color: #f8f9fa;
    border-color: #dee2e6;
}

#destination_suggestions li.active {
    background-color: var(--primary-color-hover, #ffc107) !important;
    color: white !important;
    border-color: var(--primary-color-hover, #ffc107) !important;
}

#destination_suggestions li.active:hover {
    background-color: #0b5ed7 !important;
}

/* Ensure proper positioning */
.position-relative {
    position: relative !important;
}

/* Make sure dropdown appears above other elements */
#destination_suggestions {
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;
    background: white;
    border-radius: 0.375rem;
    margin-top: 2px;
}

/* Section headers in suggestions */
#destination_suggestions li.fw-bold {
    pointer-events: none;
    background-color: #f8f9fa !important;
    font-weight: bold !important;
    color: #6c757d !important;
}

/* No results message */
#destination_suggestions li.text-muted {
    font-style: italic;
    color: #6c757d !important;
}

/* Error message */
#destination_suggestions li.text-danger {
    color: #dc3545 !important;
}

/* Mobile responsiveness */
@media (max-width: 768px) {
    #destination_suggestions {
        max-height: 200px;
        font-size: 14px;
    }
    
    #destination_suggestions li {
        padding: 8px 12px;
    }
}