- Changes the wrapping label to a div so we can style the label instead of another element while also supporting form validation.
- Fixes form validation styles for custom file input (closes #24831).
- Updates docs with validation styles (also adding example feedback text while I was there) and new how it works section.

Fixes #25016 which noticed a .thead-light and border-color of the .table-border are the same color.

Matches browser default inputs and swaps some max-width properties for a regular width

* Restyle code element, clean up variables

- Removes the padding and background-color
- Changes the color to a brand color ()
- Add new variables to kbd element styles to account for removing the code ones
- Remove overrides that were needed previously

* only break between words, and override it in the pre

* make file inputs 100% wide

* scope custom file changes in input group for sizing

* shorter button labels for responsive

* narrower cards

* button was too wide

* downsize

* fewer links in pagination

* redo cell text

* improve overflow docs

* match layout behaviors

* ditch the indicator as separate element for psuedo-elements on the label

* move disabled to attribute only on input

* redo default inline check to support new markup

* redo inline forms

* clean up vars

* update validation mixin to new structure

* update checks in docs

* linting for for/id attributes

* Add support for size attribute on custom selects

* Add large custom select, document it and the small variant

* fix custom select focus state

* fix custom file input focus styles

* remove empty line

Nav Tabs use single variable to style `$nav-tabs-link-hover-border-color` and `$nav-tabs-link-active-border-color` (#24639)

* converts px valures to rem on tooltip variables

* keep as px to match popover changes

* use `background-color` instead of the shorthand
* use `outline: 0` consistently
* fix transform order
* remove quotes from `SFMono-Regular`

The option is set to `always-single-line` in stylelint-config-standard which we extend.

We don't change anything so the transition is basically unused.

* Update the form focus mixin to use a manual `$enable-shadows` check so we can always ensure a focus state for accessibility and consistency

* - Add new `$input-btn-focus-width` and `$input-btn-focus-color` variables.

- Replace separate `$btn-focus-box-shadow` and `$input-focus-box-shadow`
variables with unified `$input-btn-focus-box-shadow` to match our
combined variables approach elsewhere.

* Put new focus width var to use in buttons mixins

* use new button input-box shadow var

* Add a new mixin for quickly adding linear gradient to components when $enable-gradients is set to true

* use correct var

* fix focus shadows in button mixins

* Add opt-in gradients to alerts, buttons, carousel, custom radios and checkboxes, custom file input, and dropdown items

* Generate .bg-gradient- utilities

* add headings to colors page and document bg-gradient utils

* update the button color for active status, check with yiq as it's done for basic state and hover state

This way, descenders are not cropped when truncating. Fixes #23956.

* font-sizes relative to font-size-base

* ditch $heading-font-size-base, simplify

* apply same to .lead var

* also update progress bar font-size var

Using `rgba($white,1)` results in `white` instead of the hex.

Now it's more consistent.

Also switch to numeric values for font-weight.