#suggestions {
        width: 55% !important;
        max-height: 250px;
        overflow-y: auto;
        border: 1px solid #ddd;
        border-top: none;
        background: white;
        box-shadow: 0 4px 8px rgba(0,0,0,0.1);
        border-radius: 0 0 0.375rem 0.375rem;
    }
    #suggestions li {
        cursor: pointer;
        padding: 0.5rem 1rem;
        transition: background-color 0.2s ease;
    }
    #suggestions li:hover {
        background-color: #0d6efd;
        color: white;
    }
    #suggestions li small {
        display: block;
        font-size: 0.8rem;
        color: #6c757d;
    }
    @media (max-width: 768px) {
        #suggestions {
            width: 94% !important;
            max-width: 94% !important;
            display: block;
            box-sizing: border-box;
        }
        input::placeholder,
        textarea::placeholder {
            font-size: 11px; /* smaller font for mobile */
            font-weight: 900;
            color: black;
        }
    }
    .small,small {
        font-size: .575em!important;
    }