Docs - how to customize global and component styles

[mcoker]

Goal is to create documentation around how to customize patternfly styles. This would like cover something like:

Components

• Vars are the API for styling components. They're protected from breaking changes.
• Try to write all overrides like the following

.pf-v6-c-component {
  --pf-v6-c-component--BackgroundColor: var(--pf-t--global--[semantic color var]);
  --pf-v6-c-component__element--Gap: var(--pf-t-global--[semantic spacer var]);
  ...
}

• Be mindful of specificity/loading order
• Avoid writing out nested property styles with regular property declarations. If users need to do this, they should bring their override back to PF and we can consider adding vars to support it. If we don't add vars, suggest not making that kind of override.
• ...

Global/tokens

:where(:root) {
  --pf-t--global--[token]: var(--pf-t--global--[other token);
}

:where(.pf-v6-m-theme-dark) {
  // same as above but for dark theme
}

...
+ any other stuff that seems appropriate