feat(accordion): add title min-width (#1163)

## PR Checklist

Please check if your PR fulfills the following requirements:

- [ ] Tests for the changes have been added (for bug fixes / features)
- [ ] Docs have been added / updated (for bug fixes / features)
- [ ] If applicable, have a visual design approval

## PR Type

What kind of change does this PR introduce?

<!-- Please check the one that applies to this PR using "x". -->

- [ ] Bugfix
- [x] Feature
- [ ] Code style update (formatting, local variables)
- [ ] Refactoring (no functional changes, no api changes)
- [ ] Build related changes
- [ ] CI related changes
- [ ] Documentation content changes
- [ ] Other... Please describe:

## What is the current behavior?

<!-- Please describe the current behavior that you are modifying, or
link to a relevant issue. -->

Issue Number: CDE-1601

## What is the new behavior?

Since v17 alpha (this commit:
b9d6436
) we used to have accordion / stepper descriptions not aligned
vertically due to different width of the preceding element (the title):


![image](https://github.com/vmware-clarity/ng-clarity/assets/132376042/365696a2-1522-44e1-9a27-3e04aee241a0)


![image](https://github.com/vmware-clarity/ng-clarity/assets/132376042/05733400-4f0a-4222-85c0-a11dd3d46dcb)

This PR is introducing a min-width property to the element before the
descriptions which aligns them vertically:


![image](https://github.com/vmware-clarity/ng-clarity/assets/132376042/4bf122c1-8418-4065-a7a9-60e8b299b622)


![image](https://github.com/vmware-clarity/ng-clarity/assets/132376042/d1df8e07-c18e-46e0-86b1-87305d3d8e09)



As stepper component is inheriting accordion one, this change is
observed in both components

## Does this PR introduce a breaking change?

- [x] Yes
- [ ] No

<!-- If this PR contains a breaking change, please describe the impact
and migration path for existing applications below. -->

## Other information

BREAKING CHANGE: accordion title now have a `min-width` and exposed a
token for it. This resolves to a difference in the layout.

---------

Co-authored-by: GitHub <[email protected]>

projects/angular/src/accordion/_accordion.clarity.scss

@@ -112,6 +112,7 @@
 
   .clr-accordion-header-has-description {
     .clr-accordion-title {
+      min-width: accordion-variables.$clr-accordion-step-title-min-width;
       max-width: mixins.baselinePx(264);
       @media (min-width: accordion-variables.$clr-accordion-responsive-breakpoint) {
         margin-left: tokens.$cds-global-space-7;

projects/angular/src/accordion/_properties.accordion.scss

@@ -39,6 +39,6 @@
     --clr-accordion-header-left-indicator: inset #{tokens.$cds-global-space-5} 0 0 #{tokens.$cds-alias-status-neutral-tint};
     --clr-accordion-header-left-current-indicator: inset #{tokens.$cds-global-space-5} 0 0 #{tokens.$cds-alias-object-interaction-background-highlight};
 
-    --clr-accordion-step-title-min-width: 0;
+    --clr-accordion-step-title-min-width: #{tokens.$cds-global-space-13};
   }
 }

projects/angular/src/accordion/_variables.accordion.scss

@@ -36,3 +36,5 @@ $clr-accordion-border-color: var(--clr-accordion-border-color) !default;
 $clr-accordion-border-radius: var(--clr-accordion-border-radius) !default;
 $clr-accordion-border-left-color-complete: var(--clr-accordion-border-left-color-complete) !default;
 $clr-accordion-border-left-color-error: var(--clr-accordion-border-left-color-error) !default;
+
+$clr-accordion-step-title-min-width: var(--clr-accordion-step-title-min-width) !default;