chore: adds headless sass vars in includes for component usage. (#7700)

**Related Issue:** None

## Summary

- Gives a component SCSS access to headless token vars.
- This is required to access breakpoint vars (`$breakpoint-width-xs`)

Example:

```scss
@container pagination (max-width: #{$breakpoint-width-xs}) {
  // some styling here
}
```

packages/calcite-components/src/assets/styles/includes.scss

@@ -1,5 +1,6 @@
 @import "../../node_modules/@esri/calcite-colors/dist/colors";
 @import "../../node_modules/@esri/calcite-base/dist/_index";
+@import "../../node_modules/@esri/calcite-design-tokens/dist/scss/calcite-headless";
 
 /* mixins & extensions */
 @import "animation";