Adds the following CSS properties to item:
```
--highlight-color-focused
--highlight-color-valid
--highlight-color-invalid
--highlight-height
```
This also fixes an issue where we were showing the highlight on items
with no lines, and shows inset vs full properly. Adds documentation and tests for input focus.
fixes#14036fixes#9639fixes#14952closes#15690
- updates components to use shadow DOM or scoped if they require css variables
- moves global styles to an external stylesheet that needs to be imported
- adds support for additional colors and removes the Sass loops to generate colors for each component
- several property renames, bug fixes, and test updates
Co-authored-by: Manu Mtz.-Almeida <manu.mtza@gmail.com>
Co-authored-by: Adam Bradley <adambradley25@gmail.com>
Co-authored-by: Cam Wiegert <cam@camwiegert.com>