@uh-design-system/component-library 0.3.1 → 0.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (55) hide show
  1. package/dist/cjs/component-library.cjs.js +1 -1
  2. package/dist/cjs/ds-accordion_3.cjs.entry.js +11 -10
  3. package/dist/cjs/ds-link-with-arrow.cjs.entry.js +3 -3
  4. package/dist/cjs/ds-link.cjs.entry.js +3 -3
  5. package/dist/cjs/ds-text-input.cjs.entry.js +3 -3
  6. package/dist/cjs/ds-visually-hidden.cjs.entry.js +1 -1
  7. package/dist/cjs/loader.cjs.js +1 -1
  8. package/dist/collection/components/00-foundations/typography/stories/typography.stories.js +110 -0
  9. package/dist/collection/components/01-base-components/ds-accordion/ds-accordion.css +11 -3
  10. package/dist/collection/components/01-base-components/ds-accordion/ds-accordion.js +6 -6
  11. package/dist/collection/components/01-base-components/ds-button/ds-button.css +127 -63
  12. package/dist/collection/components/01-base-components/ds-button/ds-button.js +22 -1
  13. package/dist/collection/components/01-base-components/ds-button/stories/ds-button.examples.stories.js +6 -0
  14. package/dist/collection/components/01-base-components/ds-button/stories/ds-button.features.stories.js +10 -0
  15. package/dist/collection/components/01-base-components/ds-icon/ds-icon.js +2 -2
  16. package/dist/collection/components/01-base-components/ds-link/ds-link.css +91 -25
  17. package/dist/collection/components/01-base-components/ds-link/ds-link.js +3 -3
  18. package/dist/collection/components/01-base-components/ds-link/stories/ds-link.stories.js +1 -1
  19. package/dist/collection/components/01-base-components/ds-link-with-arrow/ds-link-with-arrow.css +86 -20
  20. package/dist/collection/components/01-base-components/ds-link-with-arrow/ds-link-with-arrow.js +3 -3
  21. package/dist/collection/components/01-base-components/ds-link-with-arrow/stories/ds-arrow-link.stories.js +1 -1
  22. package/dist/collection/components/01-base-components/ds-text-input/ds-text-input.css +30 -11
  23. package/dist/collection/components/01-base-components/ds-text-input/ds-text-input.js +3 -3
  24. package/dist/collection/components/01-base-components/ds-visually-hidden/ds-visually-hidden.js +1 -1
  25. package/dist/collection/utils/typography/typographyUtils.js +21 -0
  26. package/dist/component-library/component-library.css +1 -1
  27. package/dist/component-library/component-library.esm.js +1 -1
  28. package/dist/component-library/ds-accordion_3.entry.js +1 -1
  29. package/dist/component-library/ds-link-with-arrow.entry.js +1 -1
  30. package/dist/component-library/ds-link.entry.js +1 -1
  31. package/dist/component-library/ds-text-input.entry.js +1 -1
  32. package/dist/component-library/ds-visually-hidden.entry.js +1 -1
  33. package/dist/components/ds-accordion.js +7 -7
  34. package/dist/components/ds-button2.js +4 -2
  35. package/dist/components/ds-icon2.js +2 -2
  36. package/dist/components/ds-link-with-arrow.js +4 -4
  37. package/dist/components/ds-link.js +4 -4
  38. package/dist/components/ds-text-input.js +4 -4
  39. package/dist/components/ds-visually-hidden2.js +1 -1
  40. package/dist/esm/component-library.js +1 -1
  41. package/dist/esm/ds-accordion_3.entry.js +11 -10
  42. package/dist/esm/ds-link-with-arrow.entry.js +3 -3
  43. package/dist/esm/ds-link.entry.js +3 -3
  44. package/dist/esm/ds-text-input.entry.js +3 -3
  45. package/dist/esm/ds-visually-hidden.entry.js +1 -1
  46. package/dist/esm/loader.js +1 -1
  47. package/dist/types/components/00-foundations/typography/stories/typography.stories.d.ts +9 -0
  48. package/dist/types/components/01-base-components/ds-button/ds-button.d.ts +1 -0
  49. package/dist/types/components/01-base-components/ds-button/stories/ds-button.examples.stories.d.ts +1 -0
  50. package/dist/types/components/01-base-components/ds-button/stories/ds-button.features.stories.d.ts +3 -0
  51. package/dist/types/components/01-base-components/ds-link/ds-link.d.ts +1 -1
  52. package/dist/types/components/01-base-components/ds-link-with-arrow/ds-link-with-arrow.d.ts +1 -1
  53. package/dist/types/components.d.ts +6 -4
  54. package/dist/types/utils/typography/typographyUtils.d.ts +1 -0
  55. package/package.json +2 -4
@@ -15,6 +15,14 @@
15
15
  --ds-borderRadius-none: 0px;
16
16
  }
17
17
 
18
+ :root {
19
+ --ds-breakpoint-xSmall: 20rem;
20
+ --ds-breakpoint-small: 30rem;
21
+ --ds-breakpoint-medium: 60rem;
22
+ --ds-breakpoint-large: 75rem;
23
+ --ds-breakpoint-xLarge: 90rem;
24
+ }
25
+
18
26
  :root {
19
27
  --ds-fontFamily-heading: "Open Sans", sans-serif;
20
28
  --ds-fontFamily-body: "Open Sans", sans-serif;
@@ -57,26 +65,83 @@
57
65
  --ds-fontFamily-body: "Open Sans Variable", sans-serif;
58
66
  }
59
67
  }
60
- .bodyText {
61
- line-height: 1.5;
68
+ :root {
69
+ --ds-breakpoint-xSmall: 20rem;
70
+ --ds-breakpoint-small: 30rem;
71
+ --ds-breakpoint-medium: 60rem;
72
+ --ds-breakpoint-large: 75rem;
73
+ --ds-breakpoint-xLarge: 90rem;
74
+ }
75
+
76
+ /* Body text styles */
77
+ .ds-bodyText--2xLarge {
78
+ color: var(--ds-textColor-default);
79
+ font-family: var(--ds-fontFamily-body);
80
+ font-size: var(--ds-fontSize-20);
81
+ font-weight: var(--ds-fontWeight-regular);
82
+ letter-spacing: var(--ds-letterSpacing-wide);
83
+ line-height: var(--ds-lineHeight-large);
84
+ }
85
+ @media (min-width: 30rem) {
86
+ .ds-bodyText--2xLarge {
87
+ font-size: var(--ds-fontSize-22);
88
+ }
89
+ }
90
+
91
+ .ds-bodyText--xLarge {
92
+ color: var(--ds-textColor-default);
93
+ font-family: var(--ds-fontFamily-body);
94
+ font-size: var(--ds-fontSize-18);
95
+ font-weight: var(--ds-fontWeight-regular);
96
+ letter-spacing: var(--ds-letterSpacing-wide);
97
+ line-height: var(--ds-lineHeight-large);
98
+ }
99
+ @media (min-width: 30rem) {
100
+ .ds-bodyText--xLarge {
101
+ font-size: var(--ds-fontSize-20);
102
+ }
62
103
  }
63
- .bodyText--2xLarge {
64
- font-size: 1.375rem;
104
+
105
+ .ds-bodyText--large {
106
+ color: var(--ds-textColor-default);
107
+ font-family: var(--ds-fontFamily-body);
108
+ font-size: var(--ds-fontSize-16);
109
+ font-weight: var(--ds-fontWeight-regular);
110
+ letter-spacing: var(--ds-letterSpacing-wide);
111
+ line-height: var(--ds-lineHeight-large);
65
112
  }
66
- .bodyText--xLarge {
67
- font-size: 1.25rem;
113
+ @media (min-width: 30rem) {
114
+ .ds-bodyText--large {
115
+ font-size: var(--ds-fontSize-18);
116
+ }
68
117
  }
69
- .bodyText--large {
70
- font-size: 1.125rem;
118
+
119
+ .ds-bodyText--medium {
120
+ color: var(--ds-textColor-default);
121
+ font-family: var(--ds-fontFamily-body);
122
+ font-size: var(--ds-fontSize-14);
123
+ font-weight: var(--ds-fontWeight-regular);
124
+ letter-spacing: var(--ds-letterSpacing-wide);
125
+ line-height: var(--ds-lineHeight-large);
71
126
  }
72
- .bodyText--medium {
73
- font-size: 1rem;
127
+ @media (min-width: 30rem) {
128
+ .ds-bodyText--medium {
129
+ font-size: var(--ds-fontSize-16);
130
+ }
74
131
  }
75
- .bodyText--small {
76
- font-size: 0.875rem;
132
+
133
+ .ds-bodyText--small {
134
+ color: var(--ds-textColor-default);
135
+ font-family: var(--ds-fontFamily-body);
136
+ font-size: var(--ds-fontSize-12);
137
+ font-weight: var(--ds-fontWeight-regular);
138
+ letter-spacing: var(--ds-letterSpacing-wide);
139
+ line-height: var(--ds-lineHeight-large);
77
140
  }
78
- .bodyText--xSmall {
79
- font-size: 0.75rem;
141
+ @media (min-width: 30rem) {
142
+ .ds-bodyText--small {
143
+ font-size: var(--ds-fontSize-14);
144
+ }
80
145
  }
81
146
 
82
147
  :host {
@@ -92,6 +157,13 @@
92
157
  font-size: var(--ds-fontSize-16);
93
158
  text-decoration-line: none;
94
159
  }
160
+ .ds-link-with-arrow:focus-visible, .ds-link-with-arrow:focus-within {
161
+ box-shadow: 0 0 0 var(--ds-borderWidth-thin) var(--ds-borderColor-white);
162
+ outline-color: var(--ds-borderColor-black);
163
+ outline-offset: var(--ds-borderWidth-thin);
164
+ outline-style: solid;
165
+ outline-width: var(--ds-borderWidth-thin);
166
+ }
95
167
  @media (min-width: 30rem) {
96
168
  .ds-link-with-arrow {
97
169
  font-size: var(--ds-fontSize-18);
@@ -133,10 +205,4 @@
133
205
  }
134
206
  .ds-link-with-arrow:active, .ds-link-with-arrow:focus-visible {
135
207
  color: var(--ds-textColor-link-active);
136
- }
137
- .ds-link-with-arrow:focus-visible {
138
- outline-style: solid;
139
- outline-width: var(--ds-borderWidth-thin);
140
- outline-offset: var(--ds-borderWidth-thin);
141
- outline-color: var(--ds-palette-black);
142
208
  }
@@ -14,7 +14,7 @@ export class DsLinkWithArrow {
14
14
  iconPosition = 'start';
15
15
  href;
16
16
  target;
17
- lang;
17
+ language;
18
18
  componentWillLoad() {
19
19
  this.inheritedAttributes = inheritAriaAttributes(this.el);
20
20
  if (opensInNewTab(this.target)) {
@@ -28,7 +28,7 @@ export class DsLinkWithArrow {
28
28
  'ds-link-with-arrow__icon--start': this.iconPosition === 'start',
29
29
  'ds-link-with-arrow__icon--end': this.iconPosition === 'end',
30
30
  });
31
- return (h("a", { key: '57aac1b83578c9067b7b49404dd098940d1617bf', href: this.href, class: classes, rel: this.rel, target: this.target, ...this.inheritedAttributes }, h("slot", { key: '8e7ef7f70709c62337ea15df531dc10dcd51dacc', name: "iconStart" }, this.iconPosition === 'start' && h("ds-icon", { key: '3ba6529c60900085941555c5eea469c6f91b4d2f', name: this.icon, class: iconClasses, size: "1.4em" })), this.text, h("slot", { key: '69b8b9149b4cdf0dc541e67dd853fd024c9ee79b', name: "iconStart" }, this.iconPosition === 'end' && h("ds-icon", { key: 'ba872300195a151cd308dc56263fa7a7915c5782', name: this.icon, class: iconClasses, size: "1.4em" })), opensInNewTab(this.target) && (h("ds-visually-hidden", { key: 'dcbe006abbf064856849132b291e1372a743582e', id: this.visuallyHiddenAssistiveTextId }, visuallyHiddenAssistiveText(this.lang ?? document.documentElement.lang)))));
31
+ return (h("a", { key: 'aa1a1272c0323f286e590f1a366f2101410a58c3', href: this.href, class: classes, rel: this.rel, target: this.target, ...this.inheritedAttributes }, h("slot", { key: 'e348b24c8c5418cf0f33e18c5337066b6eb579a2', name: "iconStart" }, this.iconPosition === 'start' && h("ds-icon", { key: 'e523092b3dc32f936139c53e74195b927a219c0f', name: this.icon, class: iconClasses, size: "1.4em" })), this.text, h("slot", { key: '0ec9d65ee348aa75108f9d87474551b6b3c4a0bb', name: "iconStart" }, this.iconPosition === 'end' && h("ds-icon", { key: '55b5ef6cc061bea9f68d784e4e9fb0ebdac0002c', name: this.icon, class: iconClasses, size: "1.4em" })), opensInNewTab(this.target) && (h("ds-visually-hidden", { key: '8c92b801ac0a1d52e12fead3c89703d41f90fa6a', id: this.visuallyHiddenAssistiveTextId }, visuallyHiddenAssistiveText(this.language ?? document.documentElement.lang)))));
32
32
  }
33
33
  static get is() { return "ds-link-with-arrow"; }
34
34
  static get encapsulation() { return "shadow"; }
@@ -131,7 +131,7 @@ export class DsLinkWithArrow {
131
131
  "attribute": "target",
132
132
  "reflect": false
133
133
  },
134
- "lang": {
134
+ "language": {
135
135
  "type": "string",
136
136
  "mutable": false,
137
137
  "complexType": {
@@ -31,7 +31,7 @@ export const Playground = {
31
31
  control: 'select',
32
32
  options: ['start', 'end'],
33
33
  },
34
- lang: {
34
+ language: {
35
35
  control: 'text',
36
36
  description: 'ISO 639 language code. Known languages are: "en", "fi", "sv". When undefined will use browser\'s language.',
37
37
  },
@@ -58,14 +58,37 @@
58
58
  border-color: var(--ds-borderColor-default);
59
59
  padding-inline: var(--ds-spacing-xSmall);
60
60
  }
61
+ .ds-input--container:focus-visible, .ds-input--container:focus-within {
62
+ box-shadow: 0 0 0 var(--ds-borderWidth-thin) var(--ds-borderColor-white);
63
+ outline-color: var(--ds-borderColor-black);
64
+ outline-offset: var(--ds-borderWidth-thin);
65
+ outline-style: solid;
66
+ outline-width: var(--ds-borderWidth-thin);
67
+ }
61
68
  .ds-input--container.invalid {
62
69
  background-color: var(--ds-bgColor-danger);
63
70
  border-color: var(--ds-borderColor-danger);
64
71
  }
72
+ .ds-input--container.invalid:hover:not(.ds-input--container.invalid:focus-within) {
73
+ background-color: var(--ds-bgColor-danger-hover);
74
+ border-color: var(--ds-borderColor-danger);
75
+ }
76
+ .ds-input--container.invalid.active {
77
+ background-color: var(--ds-bgColor-danger-active);
78
+ border-color: var(--ds-borderColor-danger);
79
+ }
65
80
  .ds-input--container.valid {
66
81
  background-color: var(--ds-bgColor-success);
67
82
  border-color: var(--ds-borderColor-success);
68
83
  }
84
+ .ds-input--container.valid:hover:not(.ds-input--container.valid:focus-within) {
85
+ background-color: var(--ds-bgColor-success-hover);
86
+ border-color: var(--ds-borderColor-success);
87
+ }
88
+ .ds-input--container.valid.active {
89
+ background-color: var(--ds-bgColor-success-active);
90
+ border-color: var(--ds-borderColor-success);
91
+ }
69
92
  .ds-input--container.readonly, .ds-input--container.disabled {
70
93
  background-color: var(--ds-bgColor-disabled-onLight);
71
94
  border-color: var(--ds-borderColor-disabled-onLight);
@@ -74,19 +97,15 @@
74
97
  outline: none;
75
98
  }
76
99
  .ds-input--container:has(input:active):not:has(input:disabled, input:readonly) {
77
- border-color: var(--ds-borderColor-primary);
78
- }
79
- .ds-input--container.active:not(.ds-input--container.disabled, .ds-input--container.readonly) {
80
- border-color: var(--ds-borderColor-primary);
100
+ border-color: var(--ds-borderColor-default);
81
101
  }
82
- .ds-input--container:hover:not(.ds-input--container.disabled, .ds-input--container.readonly, .ds-input--container.active) {
83
- border-color: var(--ds-borderColor-black);
102
+ .ds-input--container.active:not(.ds-input--container.disabled, .ds-input--container.readonly, .ds-input--container.invalid, .ds-input--container.valid) {
103
+ border-color: var(--ds-borderColor-default);
104
+ background-color: var(--ds-bgColor-white-active);
84
105
  }
85
- .ds-input--container:focus-within {
86
- outline-width: var(--ds-borderWidth-thin);
87
- outline-offset: 1px;
88
- outline-style: solid;
89
- outline-color: var(--ds-palette-black);
106
+ .ds-input--container:hover:not(.ds-input--container.disabled, .ds-input--container.readonly, .ds-input--container.active, .ds-input--container.invalid, .ds-input--container.valid, .ds-input--container:focus-within) {
107
+ border-color: var(--ds-borderColor-default);
108
+ background-color: var(--ds-bgColor-white-hover);
90
109
  }
91
110
  .ds-input--container:focus-within:not(.ds-input--container:focus-within.invalid, .ds-input--container:focus-within.valid, .ds-input--container:focus-within.readonly) {
92
111
  border-color: var(--ds-borderColor-primary);
@@ -104,14 +104,14 @@ export class DsTextInput {
104
104
  }
105
105
  render() {
106
106
  const inputType = this.type === 'password' && this.passwordInputVisible ? 'text' : this.type;
107
- return (h(Fragment, { key: '00e994d6cea8c86b5db105a0517188a57c00824a' }, h("div", { key: '049295f8c31fd506da9f3ac220804f83a489f217', class: "ds-input--label-container" }, h("slot", { key: '85abe7dc0c7ac507d78a4d2452cd058adf8f8c21', name: "label" }, h("label", { key: '97735b0b2612eb1175778f768ee84f55297e49ef', "data-optional-text": this.optionalText, class: classNames({ required: this.required, optional: this.optional }), htmlFor: this.dsId }, this.label)), h("slot", { key: '5f829e2c6bb8dc91e053c895d41c9085dddcdbdd', name: "help-text" }, h("small", { key: 'b47f0facb8ab404081751e7864dd0ed371fcecf4', id: this.assistiveTextId }, this.assistiveText), h("ds-visually-hidden", { key: 'b35c016803af7cd109f9d4ab8065dd7e8cd35edb', id: this.visuallyHiddenAssistiveTextId }, this.hiddenAssistiveText))), h("div", { key: '762b6606dc44f2eb6d8c1ea678fdb1c32480215f', onMouseDown: () => (this.inputActive = true), onMouseUp: () => (this.inputActive = false), onClick: e => this.handleInputContainerClick(e), class: classNames('ds-input--container', {
107
+ return (h(Fragment, { key: 'fe9d038685d4912e0b760bed83e21a6ae8582535' }, h("div", { key: '4c4a662fcbcbf2c9a04986ad44b018736c8ba0d7', class: "ds-input--label-container" }, h("slot", { key: '8fea3c6a05e3f5314eae43c2f2eeedc47735278a', name: "label" }, h("label", { key: '33aa9fa1ab0eba6c36b0e882d8a71000a2a2ff40', "data-optional-text": this.optionalText, class: classNames({ required: this.required, optional: this.optional }), htmlFor: this.dsId }, this.label)), h("slot", { key: '13f7adf5a85a2f2d8d5f3e7b829ff86707f75a3d', name: "help-text" }, h("small", { key: '3595ee7deb43919aeabb938a2f0cc0ce78ca181d', id: this.assistiveTextId }, this.assistiveText), h("ds-visually-hidden", { key: '001fd7a38ef2034f7e650e86d00d5a30ee217c17', id: this.visuallyHiddenAssistiveTextId }, this.hiddenAssistiveText))), h("div", { key: 'ec9f2c0d6ff40bd6c8a4618ec238e966a0756c19', onMouseDown: () => (this.inputActive = true), onMouseUp: () => (this.inputActive = false), onClick: e => this.handleInputContainerClick(e), class: classNames('ds-input--container', {
108
108
  disabled: this.disabled,
109
109
  readonly: this.readonly,
110
110
  valid: !!this.successText,
111
111
  invalid: !!this.errorText,
112
112
  focus: this.hasFocus,
113
113
  active: !!this.inputActive,
114
- }) }, this.renderPrefixContent(), h("input", { key: 'ee1f248fc29a5c93c5d1461d93a7366a773d089b', ref: e => (this.inputElement = e), id: this.dsId, name: this.name, "aria-label": this.ariaLabel, "aria-labelledby": this.ariaLabelledBy, "aria-describedby": this.ariaDescribedby ||
114
+ }) }, this.renderPrefixContent(), h("input", { key: '1cd22b415c330cb50c4c9663f6dec3a1e99e256b', ref: e => (this.inputElement = e), id: this.dsId, name: this.name, "aria-label": this.ariaLabel, "aria-labelledby": this.ariaLabelledBy, "aria-describedby": this.ariaDescribedby ||
115
115
  classNames(this.assistiveTextId, this.visuallyHiddenAssistiveTextId, {
116
116
  [this.successTextId]: this.successText,
117
117
  [this.errorTextId]: this.errorText,
@@ -185,7 +185,7 @@ export class DsTextInput {
185
185
  },
186
186
  "getter": false,
187
187
  "setter": false,
188
- "attribute": "ds-id",
188
+ "attribute": "id",
189
189
  "reflect": false,
190
190
  "defaultValue": "'input'"
191
191
  },
@@ -1,7 +1,7 @@
1
1
  import { h } from "@stencil/core";
2
2
  export class DsVisuallyHidden {
3
3
  render() {
4
- return (h("slot", { key: '800641a495e52f32ea16cd81a42804f5e6151fe8' }));
4
+ return (h("slot", { key: '3a7edab043d1612c06a4eb6fedacec27216f3be3' }));
5
5
  }
6
6
  static get is() { return "ds-visually-hidden"; }
7
7
  static get encapsulation() { return "shadow"; }
@@ -83,3 +83,24 @@ export const createCategorySection = (category, fonts, renderedCategories) => {
83
83
  section.appendChild(gridContainer);
84
84
  return section;
85
85
  };
86
+ export const getCSSClasses = (prefix) => {
87
+ const stylesheets = Array.from(document.styleSheets);
88
+ let classNames = [];
89
+ for (let sheet of stylesheets) {
90
+ try {
91
+ const rules = Array.from(sheet.cssRules);
92
+ for (let rule of rules) {
93
+ if (rule.selectorText) {
94
+ const selector = rule.selectorText;
95
+ if (selector.startsWith(`.${prefix}`)) {
96
+ classNames.push(selector.substring(1));
97
+ }
98
+ }
99
+ }
100
+ }
101
+ catch (e) {
102
+ console.warn("Could not access stylesheet:", e);
103
+ }
104
+ }
105
+ return classNames;
106
+ };
@@ -1 +1 @@
1
- html{box-sizing:border-box}html *,html *::before,html *::after{box-sizing:inherit}:root{--ds-borderWidth-none:0px;--ds-borderWidth-hairline:1px;--ds-borderWidth-thin:2px;--ds-borderWidth-thick:4px;--ds-borderWidth-xThick:8px;--ds-borderRadius-none:0px}:root{--ds-breakpoint-xSmall:20rem;--ds-breakpoint-small:30rem;--ds-breakpoint-medium:60rem;--ds-breakpoint-large:75rem;--ds-breakpoint-xLarge:90rem}:root{--ds-overlay-black-00:rgb(0 0 0 / 0);--ds-overlay-black-05:rgb(0 0 0 / 0.05);--ds-overlay-black-10:rgb(0 0 0 / 0.1);--ds-overlay-black-15:rgb(0 0 0 / 0.15);--ds-overlay-black-30:rgb(0 0 0 / 0.3);--ds-overlay-black-40:rgb(0 0 0 / 0.4);--ds-overlay-black-50:rgb(0 0 0 / 0.5);--ds-overlay-black-70:rgb(0 0 0 / 0.7);--ds-overlay-black-80:rgb(0 0 0 / 0.8);--ds-overlay-white-00:rgb(255 255 255 / 0);--ds-overlay-white-05:rgb(255 255 255 / 0.05);--ds-overlay-white-10:rgb(255 255 255 / 0.1);--ds-overlay-white-15:rgb(255 255 255 / 0.15);--ds-overlay-white-30:rgb(255 255 255 / 0.3);--ds-overlay-white-40:rgb(255 255 255 / 0.4);--ds-overlay-white-50:rgb(255 255 255 / 0.5);--ds-overlay-white-70:rgb(255 255 255 / 0.7);--ds-overlay-white-80:rgb(255 255 255 / 0.8);--ds-palette-black:#000000;--ds-palette-white:#ffffff;--ds-palette-black-03:#f7f7f7;--ds-palette-black-05:#f2f2f2;--ds-palette-black-10:#e6e6e6;--ds-palette-black-20:#cccccc;--ds-palette-black-30:#b3b3b3;--ds-palette-black-40:#999999;--ds-palette-black-50:#808080;--ds-palette-black-60:#666666;--ds-palette-black-70:#4d4d4d;--ds-palette-black-80:#333333;--ds-palette-black-90:#1a1a1a;--ds-palette-black-95:#0c0c0c;--ds-palette-blue-05:#e5f8ff;--ds-palette-blue-10:#c2eeff;--ds-palette-blue-20:#8adeff;--ds-palette-blue-30:#5cd1ff;--ds-palette-blue-40:#1abeff;--ds-palette-blue-50:#009ad6;--ds-palette-blue-60:#0084b8;--ds-palette-blue-70:#005b80;--ds-palette-blue-80:#053c52;--ds-palette-blue-90:#032330;--ds-palette-green-05:#dffbe1;--ds-palette-green-10:#bef4c1;--ds-palette-green-20:#85e08a;--ds-palette-green-30:#66cc6b;--ds-palette-green-40:#43b149;--ds-palette-green-50:#279b2d;--ds-palette-green-60:#257e29;--ds-palette-green-70:#216325;--ds-palette-green-80:#183f19;--ds-palette-green-90:#0f2410;--ds-palette-mainBlue-05:#e5f5ff;--ds-palette-mainBlue-10:#cdebff;--ds-palette-mainBlue-20:#99d7ff;--ds-palette-mainBlue-30:#70c7ff;--ds-palette-mainBlue-40:#3db3ff;--ds-palette-mainBlue-50:#009bff;--ds-palette-mainBlue-60:#007fd1;--ds-palette-mainBlue-70:#005a94;--ds-palette-mainBlue-80:#003152;--ds-palette-mainBlue-90:#001929;--ds-palette-red-05:#ffeceb;--ds-palette-red-10:#ffd8d6;--ds-palette-red-20:#fdb7b4;--ds-palette-red-30:#f87c77;--ds-palette-red-40:#f0514c;--ds-palette-red-50:#d71f19;--ds-palette-red-60:#bd2828;--ds-palette-red-70:#8b2623;--ds-palette-red-80:#602220;--ds-palette-red-90:#321c1b;--ds-palette-yellow-05:#fff1db;--ds-palette-yellow-10:#ffe7c2;--ds-palette-yellow-20:#ffd799;--ds-palette-yellow-30:#fbc05f;--ds-palette-yellow-40:#eea22b;--ds-palette-yellow-50:#ce8103;--ds-palette-yellow-60:#b26d00;--ds-palette-yellow-70:#7a4b00;--ds-palette-yellow-80:#4e3104;--ds-palette-yellow-90:#282115}:root{--ds-textColor-default:var(--ds-palette-black-95);--ds-textColor-primary:var(--ds-palette-mainBlue-70);--ds-textColor-secondary:var(--ds-palette-black-70);--ds-textColor-white:var(--ds-palette-white);--ds-textColor-danger:var(--ds-palette-red-80);--ds-textColor-success:var(--ds-palette-green-80);--ds-textColor-disabled-onLight:var(--ds-palette-black-40);--ds-textColor-disabled-onDark:var(--ds-overlay-white-40);--ds-textColor-link:var(--ds-palette-mainBlue-70);--ds-textColor-link-hover:var(--ds-palette-mainBlue-80);--ds-textColor-link-active:var(--ds-palette-mainBlue-90);--ds-textColor-link-visited:#551a8b;--ds-textColor-link--standalone:var(--ds-palette-black-70);--ds-textColor-link--standalone-hover:var(--ds-palette-black-80);--ds-textColor-link--standalone-active:var(--ds-palette-black-95);--ds-textColor-link--standalone-focus:var(--ds-palette-black-70);--ds-bgColor-primary:var(--ds-palette-mainBlue-70);--ds-bgColor-primary-hover:var(--ds-palette-mainBlue-80);--ds-bgColor-primary-active:var(--ds-palette-mainBlue-90);--ds-bgColor-secondary:var(--ds-palette-white);--ds-bgColor-secondary-hover:var(--ds-palette-mainBlue-05);--ds-bgColor-secondary-active:var(--ds-palette-mainBlue-10);--ds-bgColor-white:var(--ds-palette-white);--ds-bgColor-white-hover:var(--ds-palette-black-10);--ds-bgColor-white-active:var(--ds-overlay-black-20);--ds-bgColor-black:var(--ds-palette-black-95);--ds-bgColor-black-hover:var(--ds-palette-black-80);--ds-bgColor-black-active:var(--ds-palette-white-70);--ds-bgColor-danger:var(--ds-palette-red-05);--ds-bgColor-danger-hover:var(--ds-palette-red-10);--ds-bgColor-danger-active:var(--ds-palette-red-20);--ds-bgColor-success:var(--ds-palette-green-05);--ds-bgColor-success-hover:var(--ds-palette-green-10);--ds-bgColor-success-active:var(--ds-palette-green-20);--ds-bgColor-transparent-onLight:var(--ds-overlay-black-00);--ds-bgColor-transparent-onLight-hover:var(--ds-overlay-black-10);--ds-bgColor-transparent-onLight-active:var(--ds-overlay-black-15);--ds-bgColor-transparent-onDark:var(--ds-overlay-white-00);--ds-bgColor-transparent-onDark-hover:var(--ds-overlay-white-30);--ds-bgColor-transparent-onDark-active:var(--ds-overlay-white-40);--ds-bgColor-disabled-onLight:var(--ds-overlay-black-10);--ds-bgColor-disabled-onDark:var(--ds-overlay-white-10);--ds-borderColor-default:var(--ds-palette-black-50);--ds-borderColor-primary:var(--ds-palette-mainBlue-70);--ds-borderColor-black:var(--ds-palette-black-95);--ds-borderColor-white:var(--ds-palette-white);--ds-borderColor-danger:var(--ds-palette-red-50);--ds-borderColor-success:var(--ds-palette-green-50);--ds-borderColor-transparent:var(--ds-overlay-black-00);--ds-borderColor-disabled-onLight:var(--ds-overlay-black-15);--ds-borderColor-disabled-onDark:var(--ds-overlay-white-15);--ds-borderColor-light:var(--ds-palette-black-20)}:root{--ds-spacing-4xSmall:0.125rem;--ds-spacing-3xSmall:0.25rem;--ds-spacing-2xSmall:0.5rem;--ds-spacing-xSmall:0.75rem;--ds-spacing-small:1rem;--ds-spacing-medium:1.5rem;--ds-spacing-large:2rem;--ds-spacing-xLarge:2.5rem;--ds-spacing-2xLarge:3rem;--ds-spacing-3xLarge:3.5rem;--ds-spacing-4xLarge:4rem;--ds-spacing-5xLarge:4.5rem;--ds-spacing-layout-2xSmall:1rem;--ds-spacing-layout-xSmall:1.5rem;--ds-spacing-layout-small:2rem;--ds-spacing-layout-medium:3rem;--ds-spacing-layout-large:4rem;--ds-spacing-layout-xLarge:6rem;--ds-spacing-layout-2xLarge:8rem}html{font-size:100%}body{font-size:1rem}.heading--2xLarge,h1,.h1{font-size:2.25rem;line-height:1.166667;font-weight:700;font-variation-settings:"wdth" 90;letter-spacing:-1.2px;text-transform:uppercase}@media (min-width: 30rem){.heading--2xLarge,h1,.h1{font-size:3.5rem;line-height:1.142857;font-weight:700;font-variation-settings:"wdth" 90;letter-spacing:-1.4px;text-transform:uppercase}}.heading--xLarge,h2,.h2{font-size:1.875rem;line-height:1.2;font-weight:700;font-variation-settings:"wdth" 90;letter-spacing:-1.4px;text-transform:normal}@media (min-width: 30rem){.heading--xLarge,h2,.h2{font-size:3rem;line-height:1.083333;font-weight:700;font-variation-settings:"wdth" 90;letter-spacing:-1.4px;text-transform:normal}}.heading--large,h3,.h3{font-size:1.5rem;line-height:1.166667;font-weight:650;font-variation-settings:"wdth" 100;letter-spacing:-0.4px;text-transform:normal}@media (min-width: 30rem){.heading--large,h3,.h3{font-size:2rem;line-height:1.125;font-weight:650;font-variation-settings:"wdth" 100;letter-spacing:-1.4px;text-transform:normal}}.heading--medium,h4,.h4{font-size:1.25rem;line-height:1.333333;font-weight:650;font-variation-settings:"wdth" 100;letter-spacing:-0.4px;text-transform:normal}@media (min-width: 30rem){.heading--medium,h4,.h4{font-size:1.5rem;line-height:1.166667;font-weight:650;font-variation-settings:"wdth" 100;letter-spacing:-0.4px;text-transform:normal}}.heading--small,h5,.h5{font-size:1.125rem;line-height:1.2;font-weight:600;font-variation-settings:"wdth" 100;letter-spacing:-0.4px;text-transform:normal}@media (min-width: 30rem){.heading--small,h5,.h5{font-size:1.25rem;line-height:1.2;font-weight:600;font-variation-settings:"wdth" 100;letter-spacing:-0.4px;text-transform:normal}}.heading--xSmall,h6,.h6{font-size:1rem;line-height:1.125;font-weight:700;font-variation-settings:"wdth" 100;letter-spacing:-0.4px;text-transform:uppercase}@media (min-width: 30rem){.heading--xSmall,h6,.h6{font-size:1.125rem;line-height:1.2;font-weight:700;font-variation-settings:"wdth" 100;letter-spacing:-0.4px;text-transform:uppercase}}.bodyText{line-height:1.5}.bodyText--2xLarge{font-size:1.375rem}.bodyText--xLarge{font-size:1.25rem}.bodyText--large{font-size:1.125rem}.bodyText--medium{font-size:1rem}.bodyText--small{font-size:0.875rem}.bodyText--xSmall{font-size:0.75rem}:root{--ds-fontFamily-heading:"Open Sans", sans-serif;--ds-fontFamily-body:"Open Sans", sans-serif;--ds-fontSize-12:12px;--ds-fontSize-14:14px;--ds-fontSize-16:16px;--ds-fontSize-18:18px;--ds-fontSize-20:20px;--ds-fontSize-22:22px;--ds-fontSize-24:24px;--ds-fontSize-26:26px;--ds-fontSize-30:30px;--ds-fontSize-32:32px;--ds-fontSize-36:36px;--ds-fontSize-40:40px;--ds-fontSize-48:48px;--ds-fontSize-56:56px;--ds-fontSize-64:64px;--ds-fontWeight-regular:400;--ds-fontWeight-semibold:600;--ds-fontWeight-semiboldPlus:650;--ds-fontWeight-bold:700;--ds-letterSpacing-xTight:-2;--ds-letterSpacing-tight:-1.4;--ds-letterSpacing-normal:-0.4;--ds-letterSpacing-wide:0;--ds-letterSpacing-xWide:0.4;--ds-lineHeight-small:1;--ds-lineHeight-medium:1.2;--ds-lineHeight-large:1.5;--ds-lineHeight-xLarge:1.75;--ds-fontWidth-normal:100;--ds-fontWidth-condense:90;--ds-number-style:proportional-figures;}@supports (font-variation-settings: normal){:root{--ds-fontFamily-heading:"Open Sans Variable", sans-serif;--ds-fontFamily-body:"Open Sans Variable", sans-serif}}.button-group{display:flex;flex-wrap:wrap;gap:var(--ds-spacing-xSmall)}
1
+ html{box-sizing:border-box}html *,html *::before,html *::after{box-sizing:inherit}:root{--ds-borderWidth-none:0px;--ds-borderWidth-hairline:1px;--ds-borderWidth-thin:2px;--ds-borderWidth-thick:4px;--ds-borderWidth-xThick:8px;--ds-borderRadius-none:0px}:root{--ds-breakpoint-xSmall:20rem;--ds-breakpoint-small:30rem;--ds-breakpoint-medium:60rem;--ds-breakpoint-large:75rem;--ds-breakpoint-xLarge:90rem}:root{--ds-overlay-black-00:rgb(0 0 0 / 0);--ds-overlay-black-05:rgb(0 0 0 / 0.05);--ds-overlay-black-10:rgb(0 0 0 / 0.1);--ds-overlay-black-15:rgb(0 0 0 / 0.15);--ds-overlay-black-30:rgb(0 0 0 / 0.3);--ds-overlay-black-40:rgb(0 0 0 / 0.4);--ds-overlay-black-50:rgb(0 0 0 / 0.5);--ds-overlay-black-70:rgb(0 0 0 / 0.7);--ds-overlay-black-80:rgb(0 0 0 / 0.8);--ds-overlay-white-00:rgb(255 255 255 / 0);--ds-overlay-white-05:rgb(255 255 255 / 0.05);--ds-overlay-white-10:rgb(255 255 255 / 0.1);--ds-overlay-white-15:rgb(255 255 255 / 0.15);--ds-overlay-white-30:rgb(255 255 255 / 0.3);--ds-overlay-white-40:rgb(255 255 255 / 0.4);--ds-overlay-white-50:rgb(255 255 255 / 0.5);--ds-overlay-white-70:rgb(255 255 255 / 0.7);--ds-overlay-white-80:rgb(255 255 255 / 0.8);--ds-palette-black:#000000;--ds-palette-white:#ffffff;--ds-palette-black-03:#f7f7f7;--ds-palette-black-05:#f2f2f2;--ds-palette-black-10:#e6e6e6;--ds-palette-black-20:#cccccc;--ds-palette-black-30:#b3b3b3;--ds-palette-black-40:#999999;--ds-palette-black-50:#808080;--ds-palette-black-60:#666666;--ds-palette-black-70:#4d4d4d;--ds-palette-black-80:#333333;--ds-palette-black-90:#1a1a1a;--ds-palette-black-95:#0c0c0c;--ds-palette-blue-05:#e5f8ff;--ds-palette-blue-10:#c2eeff;--ds-palette-blue-20:#8adeff;--ds-palette-blue-30:#5cd1ff;--ds-palette-blue-40:#1abeff;--ds-palette-blue-50:#009ad6;--ds-palette-blue-60:#0084b8;--ds-palette-blue-70:#005b80;--ds-palette-blue-80:#053c52;--ds-palette-blue-90:#032330;--ds-palette-green-05:#dffbe1;--ds-palette-green-10:#bef4c1;--ds-palette-green-20:#85e08a;--ds-palette-green-30:#66cc6b;--ds-palette-green-40:#43b149;--ds-palette-green-50:#279b2d;--ds-palette-green-60:#257e29;--ds-palette-green-70:#216325;--ds-palette-green-80:#183f19;--ds-palette-green-90:#0f2410;--ds-palette-mainBlue-05:#e5f5ff;--ds-palette-mainBlue-10:#cdebff;--ds-palette-mainBlue-20:#99d7ff;--ds-palette-mainBlue-30:#70c7ff;--ds-palette-mainBlue-40:#3db3ff;--ds-palette-mainBlue-50:#009bff;--ds-palette-mainBlue-60:#007fd1;--ds-palette-mainBlue-70:#005a94;--ds-palette-mainBlue-80:#003152;--ds-palette-mainBlue-90:#001929;--ds-palette-red-05:#ffeceb;--ds-palette-red-10:#ffd8d6;--ds-palette-red-20:#fdb7b4;--ds-palette-red-30:#f87c77;--ds-palette-red-40:#f0514c;--ds-palette-red-50:#d71f19;--ds-palette-red-60:#bd2828;--ds-palette-red-70:#8b2623;--ds-palette-red-80:#602220;--ds-palette-red-90:#321c1b;--ds-palette-yellow-05:#fff1db;--ds-palette-yellow-10:#ffe7c2;--ds-palette-yellow-20:#ffd799;--ds-palette-yellow-30:#fbc05f;--ds-palette-yellow-40:#eea22b;--ds-palette-yellow-50:#ce8103;--ds-palette-yellow-60:#b26d00;--ds-palette-yellow-70:#7a4b00;--ds-palette-yellow-80:#4e3104;--ds-palette-yellow-90:#282115}:root{--ds-textColor-default:var(--ds-palette-black-95);--ds-textColor-primary:var(--ds-palette-mainBlue-70);--ds-textColor-secondary:var(--ds-palette-black-70);--ds-textColor-white:var(--ds-palette-white);--ds-textColor-danger:var(--ds-palette-red-80);--ds-textColor-success:var(--ds-palette-green-80);--ds-textColor-disabled-onLight:var(--ds-palette-black-40);--ds-textColor-disabled-onDark:var(--ds-overlay-white-40);--ds-textColor-link:var(--ds-palette-mainBlue-70);--ds-textColor-link-hover:var(--ds-palette-mainBlue-80);--ds-textColor-link-active:var(--ds-palette-mainBlue-90);--ds-textColor-link-visited:#551a8b;--ds-textColor-link--standalone:var(--ds-palette-black-70);--ds-textColor-link--standalone-hover:var(--ds-palette-black-80);--ds-textColor-link--standalone-active:var(--ds-palette-black-95);--ds-textColor-link--standalone-focus:var(--ds-palette-black-70);--ds-bgColor-primary:var(--ds-palette-mainBlue-70);--ds-bgColor-primary-hover:var(--ds-palette-mainBlue-80);--ds-bgColor-primary-active:var(--ds-palette-mainBlue-90);--ds-bgColor-secondary:var(--ds-palette-white);--ds-bgColor-secondary-hover:var(--ds-palette-mainBlue-05);--ds-bgColor-secondary-active:var(--ds-palette-mainBlue-10);--ds-bgColor-white:var(--ds-palette-white);--ds-bgColor-white-hover:var(--ds-palette-black-10);--ds-bgColor-white-active:var(--ds-overlay-black-20);--ds-bgColor-black:var(--ds-palette-black-95);--ds-bgColor-black-hover:var(--ds-palette-black-80);--ds-bgColor-black-active:var(--ds-palette-white-70);--ds-bgColor-danger:var(--ds-palette-red-05);--ds-bgColor-danger-hover:var(--ds-palette-red-10);--ds-bgColor-danger-active:var(--ds-palette-red-20);--ds-bgColor-success:var(--ds-palette-green-05);--ds-bgColor-success-hover:var(--ds-palette-green-10);--ds-bgColor-success-active:var(--ds-palette-green-20);--ds-bgColor-transparent-onLight:var(--ds-overlay-black-00);--ds-bgColor-transparent-onLight-hover:var(--ds-overlay-black-10);--ds-bgColor-transparent-onLight-active:var(--ds-overlay-black-15);--ds-bgColor-transparent-onDark:var(--ds-overlay-white-00);--ds-bgColor-transparent-onDark-hover:var(--ds-overlay-white-30);--ds-bgColor-transparent-onDark-active:var(--ds-overlay-white-40);--ds-bgColor-disabled-onLight:var(--ds-overlay-black-10);--ds-bgColor-disabled-onDark:var(--ds-overlay-white-10);--ds-borderColor-default:var(--ds-palette-black-50);--ds-borderColor-primary:var(--ds-palette-mainBlue-70);--ds-borderColor-black:var(--ds-palette-black-95);--ds-borderColor-white:var(--ds-palette-white);--ds-borderColor-danger:var(--ds-palette-red-50);--ds-borderColor-success:var(--ds-palette-green-50);--ds-borderColor-transparent:var(--ds-overlay-black-00);--ds-borderColor-disabled-onLight:var(--ds-overlay-black-15);--ds-borderColor-disabled-onDark:var(--ds-overlay-white-15);--ds-borderColor-light:var(--ds-palette-black-20)}:root{--ds-spacing-4xSmall:0.125rem;--ds-spacing-3xSmall:0.25rem;--ds-spacing-2xSmall:0.5rem;--ds-spacing-xSmall:0.75rem;--ds-spacing-small:1rem;--ds-spacing-medium:1.5rem;--ds-spacing-large:2rem;--ds-spacing-xLarge:2.5rem;--ds-spacing-2xLarge:3rem;--ds-spacing-3xLarge:3.5rem;--ds-spacing-4xLarge:4rem;--ds-spacing-5xLarge:4.5rem;--ds-spacing-layout-2xSmall:1rem;--ds-spacing-layout-xSmall:1.5rem;--ds-spacing-layout-small:2rem;--ds-spacing-layout-medium:3rem;--ds-spacing-layout-large:4rem;--ds-spacing-layout-xLarge:6rem;--ds-spacing-layout-2xLarge:8rem}html{font-size:100%}body{font-size:1rem}.ds-font--heading{font-family:var(--ds-fontFamily-heading)}.ds-font--body{font-family:var(--ds-fontFamily-body)}.ds-font--regular{font-weight:var(--ds-fontWeight-regular)}.ds-font--semibold{font-weight:var(--ds-fontWeight-semibold)}.ds-font--semibold-plus{font-weight:var(--ds-fontWeight-semiboldPlus)}.ds-font--bold{font-weight:var(--ds-fontWeight-bold)}.ds-tracking--xtight{letter-spacing:var(--ds-letterSpacing-xTight)}.ds-tracking--tight{letter-spacing:var(--ds-letterSpacing-tight)}.ds-tracking--normal{letter-spacing:var(--ds-letterSpacing-normal)}.ds-tracking--wide{letter-spacing:var(--ds-letterSpacing-wide)}.ds-tracking--xwide{letter-spacing:var(--ds-letterSpacing-xWide)}.ds-leading--small{line-height:var(--ds-lineHeight-small)}.ds-leading--medium{line-height:var(--ds-lineHeight-medium)}.ds-leading--large{line-height:var(--ds-lineHeight-large)}.ds-leading--xlarge{line-height:var(--ds-lineHeight-xLarge)}.ds-width--normal{font-stretch:var(--ds-fontWidth-normal)}.ds-width--condense{font-stretch:var(--ds-fontWidth-condense)}.ds-number--proportional{font-variant-numeric:var(--ds-number-style)}.ds-paragraph--16{margin-bottom:var(--ds-fontSize-16)}.ds-paragraph--20{margin-bottom:var(--ds-fontSize-20)}.ds-list--spacing{gap:4px}.ds-text-color--default{color:var(--ds-textColor-default)}.ds-text--2xl-regular{font-size:var(--ds-fontSize-22);font-weight:var(--ds-fontWeight-regular)}.ds-text--xl-regular{font-size:var(--ds-fontSize-20);font-weight:var(--ds-fontWeight-regular)}.ds-text--lg-regular{font-size:var(--ds-fontSize-18);font-weight:var(--ds-fontWeight-regular)}.ds-text--md-regular{font-size:var(--ds-fontSize-16);font-weight:var(--ds-fontWeight-regular)}.ds-text--sm-regular{font-size:var(--ds-fontSize-14);font-weight:var(--ds-fontWeight-regular)}.ds-text--xs-regular{font-size:var(--ds-fontSize-12);font-weight:var(--ds-fontWeight-regular)}.ds-text--2xl-semibold{font-size:var(--ds-fontSize-22);font-weight:var(--ds-fontWeight-semibold)}.ds-text--xl-semibold{font-size:var(--ds-fontSize-20);font-weight:var(--ds-fontWeight-semibold)}.ds-text--lg-semibold{font-size:var(--ds-fontSize-18);font-weight:var(--ds-fontWeight-semibold)}.ds-text--md-semibold{font-size:var(--ds-fontSize-16);font-weight:var(--ds-fontWeight-semibold)}.ds-text--sm-semibold{font-size:var(--ds-fontSize-14);font-weight:var(--ds-fontWeight-semibold)}.ds-text--xs-semibold{font-size:var(--ds-fontSize-12);font-weight:var(--ds-fontWeight-semibold)}.ds-text--2xl-bold{font-size:var(--ds-fontSize-22);font-weight:var(--ds-fontWeight-bold)}.ds-text--xl-bold{font-size:var(--ds-fontSize-20);font-weight:var(--ds-fontWeight-bold)}.ds-text--lg-bold{font-size:var(--ds-fontSize-18);font-weight:var(--ds-fontWeight-bold)}.ds-text--md-bold{font-size:var(--ds-fontSize-16);font-weight:var(--ds-fontWeight-bold)}.ds-text--sm-bold{font-size:var(--ds-fontSize-14);font-weight:var(--ds-fontWeight-bold)}.ds-text--xs-bold{font-size:var(--ds-fontSize-12);font-weight:var(--ds-fontWeight-bold)}.ds-heading--2xLarge{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-heading);font-size:var(--ds-fontSize-40);font-weight:var(--ds-fontWeight-bold);letter-spacing:-1.2px;font-stretch:var(--ds-fontWidth-normal);line-height:48px;text-transform:uppercase}@media (min-width: 30rem){.ds-heading--2xLarge{font-size:var(--ds-fontSize-56);letter-spacing:var(--ds-letterSpacing-tight);line-height:64px;font-stretch:var(--ds-fontWidth-condense)}}.ds-heading--xLarge{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-heading);font-size:var(--ds-fontSize-32);font-weight:var(--ds-fontWeight-bold);letter-spacing:var(--ds-letterSpacing-tight);line-height:36px;font-stretch:var(--ds-fontWidth-normal)}@media (min-width: 30rem){.ds-heading--xLarge{font-size:var(--ds-fontSize-48);line-height:52px;font-stretch:var(--ds-fontWidth-condense)}}.ds-heading--large{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-heading);font-size:var(--ds-fontSize-24);font-weight:var(--ds-fontWeight-bold);letter-spacing:var(--ds-letterSpacing-normal);line-height:28px}@media (min-width: 30rem){.ds-heading--large{font-size:var(--ds-fontSize-32);font-weight:var(--ds-fontWeight-semiboldPlus);letter-spacing:var(--ds-letterSpacing-tight);line-height:36px}}.ds-heading--medium{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-heading);font-size:var(--ds-fontSize-20);font-weight:var(--ds-fontWeight-semiboldPlus);letter-spacing:var(--ds-letterSpacing-normal);line-height:28px}@media (min-width: 30rem){.ds-heading--medium{font-size:var(--ds-fontSize-24);line-height:24px}}.ds-heading--small{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-heading);font-size:var(--ds-fontSize-18);font-weight:var(--ds-fontWeight-semibold);letter-spacing:var(--ds-letterSpacing-normal);line-height:20px}@media (min-width: 30rem){.ds-heading--small{font-size:var(--ds-fontSize-20);line-height:24px}}.ds-heading--xSmall{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-heading);font-size:var(--ds-fontSize-16);font-weight:var(--ds-fontWeight-bold);letter-spacing:var(--ds-letterSpacing-normal);line-height:18px;text-transform:uppercase}@media (min-width: 30rem){.ds-heading--xSmall{font-size:var(--ds-fontSize-18);line-height:20px}}.ds-bodyText--2xLarge{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-20);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large)}@media (min-width: 30rem){.ds-bodyText--2xLarge{font-size:var(--ds-fontSize-22)}}.ds-bodyText--xLarge{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-18);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large)}@media (min-width: 30rem){.ds-bodyText--xLarge{font-size:var(--ds-fontSize-20)}}.ds-bodyText--large{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large)}@media (min-width: 30rem){.ds-bodyText--large{font-size:var(--ds-fontSize-18)}}.ds-bodyText--medium{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-14);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large)}@media (min-width: 30rem){.ds-bodyText--medium{font-size:var(--ds-fontSize-16)}}.ds-bodyText--small{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-12);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large)}@media (min-width: 30rem){.ds-bodyText--small{font-size:var(--ds-fontSize-14)}}:root{--ds-fontFamily-heading:"Open Sans", sans-serif;--ds-fontFamily-body:"Open Sans", sans-serif;--ds-fontSize-12:12px;--ds-fontSize-14:14px;--ds-fontSize-16:16px;--ds-fontSize-18:18px;--ds-fontSize-20:20px;--ds-fontSize-22:22px;--ds-fontSize-24:24px;--ds-fontSize-26:26px;--ds-fontSize-30:30px;--ds-fontSize-32:32px;--ds-fontSize-36:36px;--ds-fontSize-40:40px;--ds-fontSize-48:48px;--ds-fontSize-56:56px;--ds-fontSize-64:64px;--ds-fontWeight-regular:400;--ds-fontWeight-semibold:600;--ds-fontWeight-semiboldPlus:650;--ds-fontWeight-bold:700;--ds-letterSpacing-xTight:-2;--ds-letterSpacing-tight:-1.4;--ds-letterSpacing-normal:-0.4;--ds-letterSpacing-wide:0;--ds-letterSpacing-xWide:0.4;--ds-lineHeight-small:1;--ds-lineHeight-medium:1.2;--ds-lineHeight-large:1.5;--ds-lineHeight-xLarge:1.75;--ds-fontWidth-normal:100;--ds-fontWidth-condense:90;--ds-number-style:proportional-figures;}@supports (font-variation-settings: normal){:root{--ds-fontFamily-heading:"Open Sans Variable", sans-serif;--ds-fontFamily-body:"Open Sans Variable", sans-serif}}.button-group{display:flex;flex-wrap:wrap;gap:var(--ds-spacing-xSmall)}
@@ -1 +1 @@
1
- import{p as e,b as i}from"./index-42701395.js";export{s as setNonce}from"./index-42701395.js";import{g as t}from"./app-globals-0f993ce5.js";(()=>{const i=import.meta.url,t={};return""!==i&&(t.resourcesUrl=new URL(".",i).href),e(t)})().then((async e=>(await t(),i([["ds-visually-hidden",[[1,"ds-visually-hidden"]]],["ds-accordion_3",[[1,"ds-accordion",{variant:[1],borderAligned:[4,"border-aligned"],openByDefault:[4,"open-by-default"],accordionId:[1,"accordion-id"],headingLevel:[2,"heading-level"],useCloseButton:[4,"use-close-button"],closeButtonLabel:[1,"close-button-label"],hideTopBorder:[4,"hide-top-border"],isExpanded:[32]},null,{isExpanded:["watchHandler"]}],[6,"ds-button",{value:[1],variant:[1],colour:[1],size:[1],fontWeight:[1,"font-weight"],icon:[1],iconPosition:[1,"icon-position"],type:[1],disabled:[4],ariaDisabled:[1,"aria-disabled"]}],[1,"ds-icon",{name:[1],colour:[1],size:[1],dsTitle:[1,"ds-title"],role:[1],hidden:[4],message:[32]}]]],["ds-text-input",[[6,"ds-text-input",{label:[1],placeholder:[1],dsId:[1,"ds-id"],name:[1],disabled:[4],optional:[4],required:[4],readonly:[4],value:[1],min:[2],max:[2],maxlength:[2],pattern:[1],autocomplete:[1],optionalText:[1,"optional-text"],errorText:[1,"error-text"],successText:[1,"success-text"],assistiveText:[1,"assistive-text"],actionButtonAriaLabel:[1,"action-button-aria-label"],hiddenAssistiveText:[1,"hidden-assistive-text"],prefixText:[1,"prefix-text"],suffixText:[1,"suffix-text"],icon:[1],type:[1],ariaLabel:[1,"aria-label"],ariaLabelledBy:[1,"aria-labelledby"],ariaDescribedby:[1,"aria-describedby"],hasFocus:[32],clearButtonVisible:[32],passwordInputVisible:[32],inputActive:[32],togglePasswordVisibility:[64],clearInput:[64]}]]],["ds-link",[[1,"ds-link",{text:[1],size:[1],variant:[1],weight:[1],icon:[1025],iconPosition:[1025,"icon-position"],href:[1],target:[1],download:[4],lang:[1]}]]],["ds-link-with-arrow",[[1,"ds-link-with-arrow",{text:[1],iconPosition:[1,"icon-position"],href:[1],target:[1],lang:[1]}]]]],e))));
1
+ import{p as e,b as i}from"./index-42701395.js";export{s as setNonce}from"./index-42701395.js";import{g as t}from"./app-globals-0f993ce5.js";(()=>{const i=import.meta.url,t={};return""!==i&&(t.resourcesUrl=new URL(".",i).href),e(t)})().then((async e=>(await t(),i([["ds-visually-hidden",[[1,"ds-visually-hidden"]]],["ds-accordion_3",[[1,"ds-accordion",{variant:[1],borderAligned:[4,"border-aligned"],openByDefault:[4,"open-by-default"],accordionId:[1,"accordion-id"],headingLevel:[2,"heading-level"],useCloseButton:[4,"use-close-button"],closeButtonLabel:[1,"close-button-label"],hideTopBorder:[4,"hide-top-border"],isExpanded:[32]},null,{isExpanded:["watchHandler"]}],[6,"ds-button",{value:[1],variant:[1],colour:[1],size:[1],fontWeight:[1,"font-weight"],icon:[1],iconPosition:[1,"icon-position"],type:[1],disabled:[4],fullWidth:[4,"full-width"],ariaDisabled:[1,"aria-disabled"]}],[1,"ds-icon",{name:[1],colour:[1],size:[1],dsTitle:[1,"title"],role:[1],hidden:[4],message:[32]}]]],["ds-text-input",[[6,"ds-text-input",{label:[1],placeholder:[1],dsId:[1,"id"],name:[1],disabled:[4],optional:[4],required:[4],readonly:[4],value:[1],min:[2],max:[2],maxlength:[2],pattern:[1],autocomplete:[1],optionalText:[1,"optional-text"],errorText:[1,"error-text"],successText:[1,"success-text"],assistiveText:[1,"assistive-text"],actionButtonAriaLabel:[1,"action-button-aria-label"],hiddenAssistiveText:[1,"hidden-assistive-text"],prefixText:[1,"prefix-text"],suffixText:[1,"suffix-text"],icon:[1],type:[1],ariaLabel:[1,"aria-label"],ariaLabelledBy:[1,"aria-labelledby"],ariaDescribedby:[1,"aria-describedby"],hasFocus:[32],clearButtonVisible:[32],passwordInputVisible:[32],inputActive:[32],togglePasswordVisibility:[64],clearInput:[64]}]]],["ds-link",[[1,"ds-link",{text:[1],size:[1],variant:[1],weight:[1],icon:[1025],iconPosition:[1025,"icon-position"],href:[1],target:[1],download:[4],language:[1,"lang"]}]]],["ds-link-with-arrow",[[1,"ds-link-with-arrow",{text:[1],iconPosition:[1,"icon-position"],href:[1],target:[1],language:[1,"lang"]}]]]],e))));