Fix Gin custom CSS not working in version 3.x due to outdated variable notation

Problem/Motivation

The current autocomplete_deluxe.gin.css uses old gin variable notation - before #3309113: Change CSS3 variables from camelCase to kebab-case landed, which was on September 20, 2022 at 15:59:22 GMT+2.
It further uses mask-image: icon('close'); which makes it seem like this was manually converted from a scss source?
Oddly enough there's no /assets/scss/autocomplete_deluxe.gin.scss to be found in the source code either.

Proposed resolution

Update css variable naming and fix usage of icon().

Remaining tasks

• ✅ File an issue
• ✅ Addition/Change/Update/Fix
• ✅ Testing to ensure no regression
• ➖ Automated unit testing coverage
• ➖ Automated functional testing coverage
• ➖ UX/UI designer responsibilities
• ✅ Readability
• ✅ Accessibility
• ➖ Performance
• ➖ Security
• ➖ Documentation
• ✅ Code review by maintainers
• ✅ Full testing and approval
• ✅ Credit contributors
• ✅ Review with the product owner
• ✅ Release notes snippet
• ❌ Release autocomplete_deluxe-2.0.8, autocomplete_deluxe-2.1.1

API changes

• N/A

Data model changes

• N/A

Release notes snippet

• Issue #3511651 by das-peter: Fixed Gin custom CSS not working in version 3.x due to outdated variable notation