[TB] Questions around multiple Color Themes in new UI

[aaronreed708]

Problem/Concern

After discussing #820 wireframes and UX with @omesh-omg we had a few questions.

1. When the user gets to "Step 3, Light and Dark Mode" and starts to assign values to the Primary, Secondary and Tertiary colors, what do the other expandable fields look like? For example, do the Button or Hotlinks "colorized" dropdowns have a default color assigned as soon as a primary color is selected? According to the text for those sections, they appear to get a default value. But if that is true and I go to modify the default colorized value, for example, would the "Suggested Changes" modal dialog appear even though I've never set the value before? I might want to play with a lot of the values initially and dealing with the popup every time might be annoying.
2. Do the Light and Dark swatches in both the Button and Hotlinks sections do anything? They don't seem to be dropdowns. Are they actionable? What should their default values be?
3. How should we refer to they styles generated by the named Color Themes that we add to the design system? If I add a color theme called "HR" and end up saving that design system and using it in my application, would the relevant style be var(--hr-button) but the default Color Theme would use var(--button)?

Note: I assume that we'll need to do name collision validation, @omesh-omg, to make sure no one duplicates a name. In addition, we'll probably need to make sure that only characters that can be used in CSS selectors can be entered in the color theme name.