@alfalab/core-components-tabs 10.0.8 → 10.0.9-alfasans

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 (47) hide show
  1. package/components/primary-tablist/index.css +180 -167
  2. package/components/primary-tablist/index.module.css.js +1 -1
  3. package/components/primary-tablist/mobile.css +317 -291
  4. package/components/primary-tablist/mobile.module.css.js +1 -1
  5. package/components/scroll-controls/index.css +11 -11
  6. package/components/scroll-controls/index.module.css.js +1 -1
  7. package/components/scrollable-container/index.css +5 -5
  8. package/components/scrollable-container/index.module.css.js +1 -1
  9. package/components/secondary-tablist/index.css +18 -18
  10. package/components/secondary-tablist/index.module.css.js +1 -1
  11. package/components/secondary-tablist/mobile.css +22 -22
  12. package/components/secondary-tablist/mobile.module.css.js +1 -1
  13. package/components/tab/index.css +2 -2
  14. package/components/tab/index.module.css.js +1 -1
  15. package/cssm/components/primary-tablist/index.module.css +48 -35
  16. package/cssm/components/primary-tablist/mobile.module.css +48 -35
  17. package/esm/components/primary-tablist/index.css +180 -167
  18. package/esm/components/primary-tablist/index.module.css.js +1 -1
  19. package/esm/components/primary-tablist/mobile.css +317 -291
  20. package/esm/components/primary-tablist/mobile.module.css.js +1 -1
  21. package/esm/components/scroll-controls/index.css +11 -11
  22. package/esm/components/scroll-controls/index.module.css.js +1 -1
  23. package/esm/components/scrollable-container/index.css +5 -5
  24. package/esm/components/scrollable-container/index.module.css.js +1 -1
  25. package/esm/components/secondary-tablist/index.css +18 -18
  26. package/esm/components/secondary-tablist/index.module.css.js +1 -1
  27. package/esm/components/secondary-tablist/mobile.css +22 -22
  28. package/esm/components/secondary-tablist/mobile.module.css.js +1 -1
  29. package/esm/components/tab/index.css +2 -2
  30. package/esm/components/tab/index.module.css.js +1 -1
  31. package/modern/components/primary-tablist/index.css +180 -167
  32. package/modern/components/primary-tablist/index.module.css.js +1 -1
  33. package/modern/components/primary-tablist/mobile.css +317 -291
  34. package/modern/components/primary-tablist/mobile.module.css.js +1 -1
  35. package/modern/components/scroll-controls/index.css +11 -11
  36. package/modern/components/scroll-controls/index.module.css.js +1 -1
  37. package/modern/components/scrollable-container/index.css +5 -5
  38. package/modern/components/scrollable-container/index.module.css.js +1 -1
  39. package/modern/components/secondary-tablist/index.css +18 -18
  40. package/modern/components/secondary-tablist/index.module.css.js +1 -1
  41. package/modern/components/secondary-tablist/mobile.css +22 -22
  42. package/modern/components/secondary-tablist/mobile.module.css.js +1 -1
  43. package/modern/components/tab/index.css +2 -2
  44. package/modern/components/tab/index.module.css.js +1 -1
  45. package/moderncssm/components/primary-tablist/index.module.css +45 -30
  46. package/moderncssm/components/primary-tablist/mobile.module.css +45 -30
  47. package/package.json +12 -12
package/components/primary-tablist/index.css CHANGED
@@ -28,11 +28,9 @@
28
28
  --gap-4-neg: var(--gap-2xs-neg);
29
29
  }
30
30
  :root {
31
- --font-family-system:
32
- system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Helvetica, sans-serif;
33
- --font-family-styrene:
34
- 'Styrene UI', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Helvetica,
35
- sans-serif;
31
+ --font-family-alfasans:
32
+ 'Alfa Interface Sans', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue',
33
+ Helvetica, sans-serif;
36
34
  }
37
35
  :root {
38
36
  --focus-color: var(--color-light-status-info);
@@ -54,12 +52,12 @@
54
52
  --primary-tablist-xl-gaps: var(--gap-32);
55
53
  --primary-tablist-xl-padding: var(--gap-4) var(--gap-0) var(--gap-24);
56
54
  }
57
- .tabs__component_1nnvm {
55
+ .tabs__component_xb6x7 {
58
56
  position: relative;
59
57
  display: inline-flex;
60
58
  min-width: 100%;
61
59
  }
62
- .tabs__component_1nnvm:before {
60
+ .tabs__component_xb6x7:before {
63
61
  content: '';
64
62
  display: block;
65
63
  position: absolute;
@@ -68,361 +66,375 @@
68
66
  width: 100%;
69
67
  background-color: var(--primary-tablist-bottom-border-color);
70
68
  }
71
- .tabs__desktop_1nnvm.tabs__paragraph-primary-large_1nnvm .tabs__title_1nnvm {
69
+ .tabs__desktop_xb6x7.tabs__paragraph-primary-large_xb6x7 .tabs__title_xb6x7 {
72
70
  font-size: 18px;
73
71
  line-height: 24px;
74
72
  font-weight: 400;
75
- font-family: var(--font-family-system);
73
+ letter-spacing: -0.36px;
74
+ font-family: var(--font-family-alfasans);
76
75
  }
77
- .tabs__desktop_1nnvm.tabs__paragraph-primary-medium_1nnvm .tabs__title_1nnvm {
76
+ .tabs__desktop_xb6x7.tabs__paragraph-primary-medium_xb6x7 .tabs__title_xb6x7 {
78
77
  font-size: 16px;
79
78
  line-height: 24px;
80
79
  font-weight: 400;
81
- font-family: var(--font-family-system);
80
+ letter-spacing: -0.24px;
81
+ font-family: var(--font-family-alfasans);
82
82
  }
83
- .tabs__desktop_1nnvm.tabs__paragraph-primary-small_1nnvm .tabs__title_1nnvm {
83
+ .tabs__desktop_xb6x7.tabs__paragraph-primary-small_xb6x7 .tabs__title_xb6x7 {
84
84
  font-size: 14px;
85
85
  line-height: 20px;
86
86
  font-weight: 400;
87
- font-family: var(--font-family-system);
87
+ letter-spacing: -0.08px;
88
+ font-family: var(--font-family-alfasans);
88
89
  }
89
- .tabs__desktop_1nnvm.tabs__action-primary-large_1nnvm .tabs__title_1nnvm {
90
+ .tabs__desktop_xb6x7.tabs__action-primary-large_xb6x7 .tabs__title_xb6x7 {
90
91
  font-size: 18px;
91
92
  line-height: 24px;
92
93
  font-weight: 500;
93
- font-family: var(--font-family-system);
94
+ letter-spacing: -0.17px;
95
+ font-family: var(--font-family-alfasans);
94
96
  }
95
- .tabs__desktop_1nnvm.tabs__action-primary-medium_1nnvm .tabs__title_1nnvm {
97
+ .tabs__desktop_xb6x7.tabs__action-primary-medium_xb6x7 .tabs__title_xb6x7 {
96
98
  font-size: 16px;
97
99
  line-height: 24px;
98
100
  font-weight: 500;
99
- font-family: var(--font-family-system);
101
+ letter-spacing: -0.05px;
102
+ font-family: var(--font-family-alfasans);
100
103
  }
101
- .tabs__desktop_1nnvm.tabs__action-primary-small_1nnvm .tabs__title_1nnvm {
104
+ .tabs__desktop_xb6x7.tabs__action-primary-small_xb6x7 .tabs__title_xb6x7 {
102
105
  font-size: 14px;
103
106
  line-height: 20px;
104
107
  font-weight: 500;
105
- font-family: var(--font-family-system);
108
+ letter-spacing: 0.07px;
109
+ font-family: var(--font-family-alfasans);
106
110
  }
107
- .tabs__desktop_1nnvm.tabs__accent-primary-large_1nnvm .tabs__title_1nnvm {
111
+ .tabs__desktop_xb6x7.tabs__accent-primary-large_xb6x7 .tabs__title_xb6x7 {
108
112
  font-size: 18px;
109
113
  line-height: 24px;
110
114
  font-weight: 700;
111
- font-family: var(--font-family-system);
115
+ letter-spacing: 0.38px;
116
+ font-family: var(--font-family-alfasans);
112
117
  }
113
- .tabs__desktop_1nnvm.tabs__accent-primary-medium_1nnvm .tabs__title_1nnvm {
118
+ .tabs__desktop_xb6x7.tabs__accent-primary-medium_xb6x7 .tabs__title_xb6x7 {
114
119
  font-size: 16px;
115
120
  line-height: 24px;
116
121
  font-weight: 700;
117
- font-family: var(--font-family-system);
122
+ letter-spacing: 0.43px;
123
+ font-family: var(--font-family-alfasans);
118
124
  }
119
- .tabs__desktop_1nnvm.tabs__accent-primary-small_1nnvm .tabs__title_1nnvm {
125
+ .tabs__desktop_xb6x7.tabs__accent-primary-small_xb6x7 .tabs__title_xb6x7 {
120
126
  font-size: 14px;
121
127
  line-height: 20px;
122
128
  font-weight: 700;
123
- font-family: var(--font-family-system);
129
+ letter-spacing: 0.47px;
130
+ font-family: var(--font-family-alfasans);
124
131
  }
125
- .tabs__desktop_1nnvm.tabs__paragraph-primary-large_1nnvm .tabs__title_1nnvm, .tabs__desktop_1nnvm.tabs__paragraph-primary-medium_1nnvm .tabs__title_1nnvm, .tabs__desktop_1nnvm.tabs__accent-primary-large_1nnvm .tabs__title_1nnvm, .tabs__desktop_1nnvm.tabs__accent-primary-medium_1nnvm .tabs__title_1nnvm, .tabs__desktop_1nnvm.tabs__action-primary-large_1nnvm .tabs__title_1nnvm, .tabs__desktop_1nnvm.tabs__action-primary-medium_1nnvm .tabs__title_1nnvm {
132
+ .tabs__desktop_xb6x7.tabs__paragraph-primary-large_xb6x7 .tabs__title_xb6x7, .tabs__desktop_xb6x7.tabs__paragraph-primary-medium_xb6x7 .tabs__title_xb6x7, .tabs__desktop_xb6x7.tabs__accent-primary-large_xb6x7 .tabs__title_xb6x7, .tabs__desktop_xb6x7.tabs__accent-primary-medium_xb6x7 .tabs__title_xb6x7, .tabs__desktop_xb6x7.tabs__action-primary-large_xb6x7 .tabs__title_xb6x7, .tabs__desktop_xb6x7.tabs__action-primary-medium_xb6x7 .tabs__title_xb6x7 {
126
133
  padding-bottom: calc(24px / 2);
127
134
  }
128
- .tabs__desktop_1nnvm.tabs__paragraph-primary-large_1nnvm .tabs__title_1nnvm + .tabs__title_1nnvm,
129
- .tabs__desktop_1nnvm.tabs__paragraph-primary-medium_1nnvm .tabs__title_1nnvm + .tabs__title_1nnvm,
130
- .tabs__desktop_1nnvm.tabs__accent-primary-large_1nnvm .tabs__title_1nnvm + .tabs__title_1nnvm,
131
- .tabs__desktop_1nnvm.tabs__accent-primary-medium_1nnvm .tabs__title_1nnvm + .tabs__title_1nnvm,
132
- .tabs__desktop_1nnvm.tabs__action-primary-large_1nnvm .tabs__title_1nnvm + .tabs__title_1nnvm,
133
- .tabs__desktop_1nnvm.tabs__action-primary-medium_1nnvm .tabs__title_1nnvm + .tabs__title_1nnvm,
134
- .tabs__desktop_1nnvm.tabs__paragraph-primary-large_1nnvm .tabs__pickerWrapper_1nnvm,
135
- .tabs__desktop_1nnvm.tabs__paragraph-primary-medium_1nnvm .tabs__pickerWrapper_1nnvm,
136
- .tabs__desktop_1nnvm.tabs__accent-primary-large_1nnvm .tabs__pickerWrapper_1nnvm,
137
- .tabs__desktop_1nnvm.tabs__accent-primary-medium_1nnvm .tabs__pickerWrapper_1nnvm,
138
- .tabs__desktop_1nnvm.tabs__action-primary-large_1nnvm .tabs__pickerWrapper_1nnvm,
139
- .tabs__desktop_1nnvm.tabs__action-primary-medium_1nnvm .tabs__pickerWrapper_1nnvm {
135
+ .tabs__desktop_xb6x7.tabs__paragraph-primary-large_xb6x7 .tabs__title_xb6x7 + .tabs__title_xb6x7,
136
+ .tabs__desktop_xb6x7.tabs__paragraph-primary-medium_xb6x7 .tabs__title_xb6x7 + .tabs__title_xb6x7,
137
+ .tabs__desktop_xb6x7.tabs__accent-primary-large_xb6x7 .tabs__title_xb6x7 + .tabs__title_xb6x7,
138
+ .tabs__desktop_xb6x7.tabs__accent-primary-medium_xb6x7 .tabs__title_xb6x7 + .tabs__title_xb6x7,
139
+ .tabs__desktop_xb6x7.tabs__action-primary-large_xb6x7 .tabs__title_xb6x7 + .tabs__title_xb6x7,
140
+ .tabs__desktop_xb6x7.tabs__action-primary-medium_xb6x7 .tabs__title_xb6x7 + .tabs__title_xb6x7,
141
+ .tabs__desktop_xb6x7.tabs__paragraph-primary-large_xb6x7 .tabs__pickerWrapper_xb6x7,
142
+ .tabs__desktop_xb6x7.tabs__paragraph-primary-medium_xb6x7 .tabs__pickerWrapper_xb6x7,
143
+ .tabs__desktop_xb6x7.tabs__accent-primary-large_xb6x7 .tabs__pickerWrapper_xb6x7,
144
+ .tabs__desktop_xb6x7.tabs__accent-primary-medium_xb6x7 .tabs__pickerWrapper_xb6x7,
145
+ .tabs__desktop_xb6x7.tabs__action-primary-large_xb6x7 .tabs__pickerWrapper_xb6x7,
146
+ .tabs__desktop_xb6x7.tabs__action-primary-medium_xb6x7 .tabs__pickerWrapper_xb6x7 {
140
147
  margin-left: 24px;
141
148
  }
142
- .tabs__desktop_1nnvm.tabs__paragraph-primary-large_1nnvm .tabs__option_1nnvm, .tabs__desktop_1nnvm.tabs__paragraph-primary-medium_1nnvm .tabs__option_1nnvm, .tabs__desktop_1nnvm.tabs__accent-primary-large_1nnvm .tabs__option_1nnvm, .tabs__desktop_1nnvm.tabs__accent-primary-medium_1nnvm .tabs__option_1nnvm, .tabs__desktop_1nnvm.tabs__action-primary-large_1nnvm .tabs__option_1nnvm, .tabs__desktop_1nnvm.tabs__action-primary-medium_1nnvm .tabs__option_1nnvm {
149
+ .tabs__desktop_xb6x7.tabs__paragraph-primary-large_xb6x7 .tabs__option_xb6x7, .tabs__desktop_xb6x7.tabs__paragraph-primary-medium_xb6x7 .tabs__option_xb6x7, .tabs__desktop_xb6x7.tabs__accent-primary-large_xb6x7 .tabs__option_xb6x7, .tabs__desktop_xb6x7.tabs__accent-primary-medium_xb6x7 .tabs__option_xb6x7, .tabs__desktop_xb6x7.tabs__action-primary-large_xb6x7 .tabs__option_xb6x7, .tabs__desktop_xb6x7.tabs__action-primary-medium_xb6x7 .tabs__option_xb6x7 {
143
150
  padding: var(--gap-0);
144
151
  }
145
- .tabs__desktop_1nnvm.tabs__paragraph-primary-large_1nnvm .tabs__scrollControls_1nnvm > button, .tabs__desktop_1nnvm.tabs__paragraph-primary-medium_1nnvm .tabs__scrollControls_1nnvm > button, .tabs__desktop_1nnvm.tabs__accent-primary-large_1nnvm .tabs__scrollControls_1nnvm > button, .tabs__desktop_1nnvm.tabs__accent-primary-medium_1nnvm .tabs__scrollControls_1nnvm > button, .tabs__desktop_1nnvm.tabs__action-primary-large_1nnvm .tabs__scrollControls_1nnvm > button, .tabs__desktop_1nnvm.tabs__action-primary-medium_1nnvm .tabs__scrollControls_1nnvm > button {
152
+ .tabs__desktop_xb6x7.tabs__paragraph-primary-large_xb6x7 .tabs__scrollControls_xb6x7 > button, .tabs__desktop_xb6x7.tabs__paragraph-primary-medium_xb6x7 .tabs__scrollControls_xb6x7 > button, .tabs__desktop_xb6x7.tabs__accent-primary-large_xb6x7 .tabs__scrollControls_xb6x7 > button, .tabs__desktop_xb6x7.tabs__accent-primary-medium_xb6x7 .tabs__scrollControls_xb6x7 > button, .tabs__desktop_xb6x7.tabs__action-primary-large_xb6x7 .tabs__scrollControls_xb6x7 > button, .tabs__desktop_xb6x7.tabs__action-primary-medium_xb6x7 .tabs__scrollControls_xb6x7 > button {
146
153
  box-sizing: content-box;
147
154
  width: 24px;
148
155
  height: 24px;
149
156
  padding: var(--gap-0);
150
157
  }
151
- .tabs__desktop_1nnvm.tabs__paragraph-primary-large_1nnvm .tabs__scrollControls_1nnvm button:first-child, .tabs__desktop_1nnvm.tabs__paragraph-primary-medium_1nnvm .tabs__scrollControls_1nnvm button:first-child, .tabs__desktop_1nnvm.tabs__accent-primary-large_1nnvm .tabs__scrollControls_1nnvm button:first-child, .tabs__desktop_1nnvm.tabs__accent-primary-medium_1nnvm .tabs__scrollControls_1nnvm button:first-child, .tabs__desktop_1nnvm.tabs__action-primary-large_1nnvm .tabs__scrollControls_1nnvm button:first-child, .tabs__desktop_1nnvm.tabs__action-primary-medium_1nnvm .tabs__scrollControls_1nnvm button:first-child {
158
+ .tabs__desktop_xb6x7.tabs__paragraph-primary-large_xb6x7 .tabs__scrollControls_xb6x7 button:first-child, .tabs__desktop_xb6x7.tabs__paragraph-primary-medium_xb6x7 .tabs__scrollControls_xb6x7 button:first-child, .tabs__desktop_xb6x7.tabs__accent-primary-large_xb6x7 .tabs__scrollControls_xb6x7 button:first-child, .tabs__desktop_xb6x7.tabs__accent-primary-medium_xb6x7 .tabs__scrollControls_xb6x7 button:first-child, .tabs__desktop_xb6x7.tabs__action-primary-large_xb6x7 .tabs__scrollControls_xb6x7 button:first-child, .tabs__desktop_xb6x7.tabs__action-primary-medium_xb6x7 .tabs__scrollControls_xb6x7 button:first-child {
152
159
  margin: var(--gap-0) var(--gap-0) var(--gap-0) calc(24px / 2);
153
160
  }
154
- .tabs__desktop_1nnvm.tabs__paragraph-primary-small_1nnvm .tabs__title_1nnvm, .tabs__desktop_1nnvm.tabs__accent-primary-small_1nnvm .tabs__title_1nnvm, .tabs__desktop_1nnvm.tabs__action-primary-small_1nnvm .tabs__title_1nnvm {
161
+ .tabs__desktop_xb6x7.tabs__paragraph-primary-small_xb6x7 .tabs__title_xb6x7, .tabs__desktop_xb6x7.tabs__accent-primary-small_xb6x7 .tabs__title_xb6x7, .tabs__desktop_xb6x7.tabs__action-primary-small_xb6x7 .tabs__title_xb6x7 {
155
162
  padding-bottom: calc(20px / 2);
156
163
  }
157
- .tabs__desktop_1nnvm.tabs__paragraph-primary-small_1nnvm .tabs__title_1nnvm + .tabs__title_1nnvm,
158
- .tabs__desktop_1nnvm.tabs__accent-primary-small_1nnvm .tabs__title_1nnvm + .tabs__title_1nnvm,
159
- .tabs__desktop_1nnvm.tabs__action-primary-small_1nnvm .tabs__title_1nnvm + .tabs__title_1nnvm,
160
- .tabs__desktop_1nnvm.tabs__paragraph-primary-small_1nnvm .tabs__pickerWrapper_1nnvm,
161
- .tabs__desktop_1nnvm.tabs__accent-primary-small_1nnvm .tabs__pickerWrapper_1nnvm,
162
- .tabs__desktop_1nnvm.tabs__action-primary-small_1nnvm .tabs__pickerWrapper_1nnvm {
164
+ .tabs__desktop_xb6x7.tabs__paragraph-primary-small_xb6x7 .tabs__title_xb6x7 + .tabs__title_xb6x7,
165
+ .tabs__desktop_xb6x7.tabs__accent-primary-small_xb6x7 .tabs__title_xb6x7 + .tabs__title_xb6x7,
166
+ .tabs__desktop_xb6x7.tabs__action-primary-small_xb6x7 .tabs__title_xb6x7 + .tabs__title_xb6x7,
167
+ .tabs__desktop_xb6x7.tabs__paragraph-primary-small_xb6x7 .tabs__pickerWrapper_xb6x7,
168
+ .tabs__desktop_xb6x7.tabs__accent-primary-small_xb6x7 .tabs__pickerWrapper_xb6x7,
169
+ .tabs__desktop_xb6x7.tabs__action-primary-small_xb6x7 .tabs__pickerWrapper_xb6x7 {
163
170
  margin-left: 20px;
164
171
  }
165
- .tabs__desktop_1nnvm.tabs__paragraph-primary-small_1nnvm .tabs__option_1nnvm, .tabs__desktop_1nnvm.tabs__accent-primary-small_1nnvm .tabs__option_1nnvm, .tabs__desktop_1nnvm.tabs__action-primary-small_1nnvm .tabs__option_1nnvm {
172
+ .tabs__desktop_xb6x7.tabs__paragraph-primary-small_xb6x7 .tabs__option_xb6x7, .tabs__desktop_xb6x7.tabs__accent-primary-small_xb6x7 .tabs__option_xb6x7, .tabs__desktop_xb6x7.tabs__action-primary-small_xb6x7 .tabs__option_xb6x7 {
166
173
  padding: var(--gap-0);
167
174
  }
168
- .tabs__desktop_1nnvm.tabs__paragraph-primary-small_1nnvm .tabs__scrollControls_1nnvm > button, .tabs__desktop_1nnvm.tabs__accent-primary-small_1nnvm .tabs__scrollControls_1nnvm > button, .tabs__desktop_1nnvm.tabs__action-primary-small_1nnvm .tabs__scrollControls_1nnvm > button {
175
+ .tabs__desktop_xb6x7.tabs__paragraph-primary-small_xb6x7 .tabs__scrollControls_xb6x7 > button, .tabs__desktop_xb6x7.tabs__accent-primary-small_xb6x7 .tabs__scrollControls_xb6x7 > button, .tabs__desktop_xb6x7.tabs__action-primary-small_xb6x7 .tabs__scrollControls_xb6x7 > button {
169
176
  box-sizing: content-box;
170
177
  width: 20px;
171
178
  height: 20px;
172
179
  padding: var(--gap-0);
173
180
  }
174
- .tabs__desktop_1nnvm.tabs__paragraph-primary-small_1nnvm .tabs__scrollControls_1nnvm button:first-child, .tabs__desktop_1nnvm.tabs__accent-primary-small_1nnvm .tabs__scrollControls_1nnvm button:first-child, .tabs__desktop_1nnvm.tabs__action-primary-small_1nnvm .tabs__scrollControls_1nnvm button:first-child {
181
+ .tabs__desktop_xb6x7.tabs__paragraph-primary-small_xb6x7 .tabs__scrollControls_xb6x7 button:first-child, .tabs__desktop_xb6x7.tabs__accent-primary-small_xb6x7 .tabs__scrollControls_xb6x7 button:first-child, .tabs__desktop_xb6x7.tabs__action-primary-small_xb6x7 .tabs__scrollControls_xb6x7 button:first-child {
175
182
  margin: var(--gap-0) var(--gap-0) var(--gap-0) calc(20px / 2);
176
183
  }
177
- .tabs__desktop_1nnvm.tabs__headline-system-xlarge_1nnvm .tabs__title_1nnvm {
184
+ .tabs__desktop_xb6x7.tabs__headline-system-xlarge_xb6x7 .tabs__title_xb6x7 {
178
185
  font-size: 48px;
179
186
  line-height: 52px;
180
187
  font-weight: 700;
181
- font-family: var(--font-family-system);
188
+ letter-spacing: 0.1px;
189
+ font-family: var(--font-family-alfasans);
182
190
  }
183
- .tabs__desktop_1nnvm.tabs__headline-system-large_1nnvm .tabs__title_1nnvm {
191
+ .tabs__desktop_xb6x7.tabs__headline-system-large_xb6x7 .tabs__title_xb6x7 {
184
192
  font-size: 40px;
185
193
  line-height: 48px;
186
194
  font-weight: 700;
187
- font-family: var(--font-family-system);
195
+ letter-spacing: 0.1px;
196
+ font-family: var(--font-family-alfasans);
188
197
  }
189
- .tabs__desktop_1nnvm.tabs__headline-system-medium_1nnvm .tabs__title_1nnvm {
198
+ .tabs__desktop_xb6x7.tabs__headline-system-medium_xb6x7 .tabs__title_xb6x7 {
190
199
  font-size: 30px;
191
200
  line-height: 36px;
192
201
  font-weight: 700;
193
- font-family: var(--font-family-system);
202
+ letter-spacing: 0.1px;
203
+ font-family: var(--font-family-alfasans);
194
204
  }
195
- .tabs__desktop_1nnvm.tabs__headline-system-small_1nnvm .tabs__title_1nnvm {
205
+ .tabs__desktop_xb6x7.tabs__headline-system-small_xb6x7 .tabs__title_xb6x7 {
196
206
  font-size: 22px;
197
207
  line-height: 26px;
198
208
  font-weight: 700;
199
- font-family: var(--font-family-system);
209
+ letter-spacing: 0.2px;
210
+ font-family: var(--font-family-alfasans);
200
211
  }
201
- .tabs__desktop_1nnvm.tabs__headline-system-xsmall_1nnvm .tabs__title_1nnvm {
212
+ .tabs__desktop_xb6x7.tabs__headline-system-xsmall_xb6x7 .tabs__title_xb6x7 {
202
213
  font-size: 18px;
203
214
  line-height: 22px;
204
215
  font-weight: 700;
205
- font-family: var(--font-family-system);
216
+ letter-spacing: 0.38px;
217
+ font-family: var(--font-family-alfasans);
206
218
  }
207
- .tabs__desktop_1nnvm.tabs__headline-xlarge_1nnvm .tabs__title_1nnvm {
219
+ .tabs__desktop_xb6x7.tabs__headline-xlarge_xb6x7 .tabs__title_xb6x7 {
208
220
  font-size: 48px;
209
221
  line-height: 64px;
210
- font-weight: 500;
211
- font-feature-settings: 'ss01';
212
- font-family: var(--font-family-styrene);
222
+ font-weight: 700;
223
+ letter-spacing: 0.1px;
224
+ font-family: var(--font-family-alfasans);
213
225
  }
214
- .tabs__desktop_1nnvm.tabs__headline-large_1nnvm .tabs__title_1nnvm {
226
+ .tabs__desktop_xb6x7.tabs__headline-large_xb6x7 .tabs__title_xb6x7 {
215
227
  font-size: 40px;
216
228
  line-height: 48px;
217
- font-weight: 500;
218
- font-feature-settings: 'ss01';
219
- font-family: var(--font-family-styrene);
229
+ font-weight: 700;
230
+ letter-spacing: 0.1px;
231
+ font-family: var(--font-family-alfasans);
220
232
  }
221
- .tabs__desktop_1nnvm.tabs__headline-medium_1nnvm .tabs__title_1nnvm {
233
+ .tabs__desktop_xb6x7.tabs__headline-medium_xb6x7 .tabs__title_xb6x7 {
222
234
  font-size: 32px;
223
235
  line-height: 40px;
224
- font-weight: 500;
225
- font-feature-settings: 'ss01';
226
- font-family: var(--font-family-styrene);
236
+ font-weight: 700;
237
+ letter-spacing: 0.3px;
238
+ font-family: var(--font-family-alfasans);
227
239
  }
228
- .tabs__desktop_1nnvm.tabs__headline-small_1nnvm .tabs__title_1nnvm {
240
+ .tabs__desktop_xb6x7.tabs__headline-small_xb6x7 .tabs__title_xb6x7 {
229
241
  font-size: 24px;
230
242
  line-height: 32px;
231
- font-weight: 500;
232
- font-feature-settings: 'ss01';
233
- font-family: var(--font-family-styrene);
243
+ font-weight: 700;
244
+ letter-spacing: 0.39px;
245
+ font-family: var(--font-family-alfasans);
234
246
  }
235
- .tabs__desktop_1nnvm.tabs__headline-xsmall_1nnvm .tabs__title_1nnvm {
247
+ .tabs__desktop_xb6x7.tabs__headline-xsmall_xb6x7 .tabs__title_xb6x7 {
236
248
  font-size: 20px;
237
249
  line-height: 24px;
238
- font-weight: 500;
239
- font-feature-settings: 'ss01';
240
- font-family: var(--font-family-styrene);
250
+ font-weight: 700;
251
+ letter-spacing: 0.33px;
252
+ font-family: var(--font-family-alfasans);
241
253
  }
242
- .tabs__desktop_1nnvm.tabs__headline-system-xlarge_1nnvm .tabs__title_1nnvm {
254
+ .tabs__desktop_xb6x7.tabs__headline-system-xlarge_xb6x7 .tabs__title_xb6x7 {
243
255
  padding-bottom: calc(52px / 2);
244
256
  }
245
- .tabs__desktop_1nnvm.tabs__headline-system-xlarge_1nnvm .tabs__title_1nnvm + .tabs__title_1nnvm,
246
- .tabs__desktop_1nnvm.tabs__headline-system-xlarge_1nnvm .tabs__pickerWrapper_1nnvm {
257
+ .tabs__desktop_xb6x7.tabs__headline-system-xlarge_xb6x7 .tabs__title_xb6x7 + .tabs__title_xb6x7,
258
+ .tabs__desktop_xb6x7.tabs__headline-system-xlarge_xb6x7 .tabs__pickerWrapper_xb6x7 {
247
259
  margin-left: 52px;
248
260
  }
249
- .tabs__desktop_1nnvm.tabs__headline-system-xlarge_1nnvm .tabs__option_1nnvm {
261
+ .tabs__desktop_xb6x7.tabs__headline-system-xlarge_xb6x7 .tabs__option_xb6x7 {
250
262
  padding: var(--gap-0);
251
263
  }
252
- .tabs__desktop_1nnvm.tabs__headline-system-xlarge_1nnvm .tabs__scrollControls_1nnvm > button {
264
+ .tabs__desktop_xb6x7.tabs__headline-system-xlarge_xb6x7 .tabs__scrollControls_xb6x7 > button {
253
265
  box-sizing: content-box;
254
266
  width: 52px;
255
267
  height: 52px;
256
268
  padding: var(--gap-0);
257
269
  }
258
- .tabs__desktop_1nnvm.tabs__headline-system-xlarge_1nnvm .tabs__scrollControls_1nnvm button:first-child {
270
+ .tabs__desktop_xb6x7.tabs__headline-system-xlarge_xb6x7 .tabs__scrollControls_xb6x7 button:first-child {
259
271
  margin: var(--gap-0) var(--gap-0) var(--gap-0) calc(52px / 2);
260
272
  }
261
- .tabs__desktop_1nnvm.tabs__headline-system-large_1nnvm .tabs__title_1nnvm, .tabs__desktop_1nnvm.tabs__headline-large_1nnvm .tabs__title_1nnvm {
273
+ .tabs__desktop_xb6x7.tabs__headline-system-large_xb6x7 .tabs__title_xb6x7, .tabs__desktop_xb6x7.tabs__headline-large_xb6x7 .tabs__title_xb6x7 {
262
274
  padding-bottom: calc(48px / 2);
263
275
  }
264
- .tabs__desktop_1nnvm.tabs__headline-system-large_1nnvm .tabs__title_1nnvm + .tabs__title_1nnvm,
265
- .tabs__desktop_1nnvm.tabs__headline-large_1nnvm .tabs__title_1nnvm + .tabs__title_1nnvm,
266
- .tabs__desktop_1nnvm.tabs__headline-system-large_1nnvm .tabs__pickerWrapper_1nnvm,
267
- .tabs__desktop_1nnvm.tabs__headline-large_1nnvm .tabs__pickerWrapper_1nnvm {
276
+ .tabs__desktop_xb6x7.tabs__headline-system-large_xb6x7 .tabs__title_xb6x7 + .tabs__title_xb6x7,
277
+ .tabs__desktop_xb6x7.tabs__headline-large_xb6x7 .tabs__title_xb6x7 + .tabs__title_xb6x7,
278
+ .tabs__desktop_xb6x7.tabs__headline-system-large_xb6x7 .tabs__pickerWrapper_xb6x7,
279
+ .tabs__desktop_xb6x7.tabs__headline-large_xb6x7 .tabs__pickerWrapper_xb6x7 {
268
280
  margin-left: 48px;
269
281
  }
270
- .tabs__desktop_1nnvm.tabs__headline-system-large_1nnvm .tabs__option_1nnvm, .tabs__desktop_1nnvm.tabs__headline-large_1nnvm .tabs__option_1nnvm {
282
+ .tabs__desktop_xb6x7.tabs__headline-system-large_xb6x7 .tabs__option_xb6x7, .tabs__desktop_xb6x7.tabs__headline-large_xb6x7 .tabs__option_xb6x7 {
271
283
  padding: var(--gap-0);
272
284
  }
273
- .tabs__desktop_1nnvm.tabs__headline-system-large_1nnvm .tabs__scrollControls_1nnvm > button, .tabs__desktop_1nnvm.tabs__headline-large_1nnvm .tabs__scrollControls_1nnvm > button {
285
+ .tabs__desktop_xb6x7.tabs__headline-system-large_xb6x7 .tabs__scrollControls_xb6x7 > button, .tabs__desktop_xb6x7.tabs__headline-large_xb6x7 .tabs__scrollControls_xb6x7 > button {
274
286
  box-sizing: content-box;
275
287
  width: 48px;
276
288
  height: 48px;
277
289
  padding: var(--gap-0);
278
290
  }
279
- .tabs__desktop_1nnvm.tabs__headline-system-large_1nnvm .tabs__scrollControls_1nnvm button:first-child, .tabs__desktop_1nnvm.tabs__headline-large_1nnvm .tabs__scrollControls_1nnvm button:first-child {
291
+ .tabs__desktop_xb6x7.tabs__headline-system-large_xb6x7 .tabs__scrollControls_xb6x7 button:first-child, .tabs__desktop_xb6x7.tabs__headline-large_xb6x7 .tabs__scrollControls_xb6x7 button:first-child {
280
292
  margin: var(--gap-0) var(--gap-0) var(--gap-0) calc(48px / 2);
281
293
  }
282
- .tabs__desktop_1nnvm.tabs__headline-system-medium_1nnvm .tabs__title_1nnvm {
294
+ .tabs__desktop_xb6x7.tabs__headline-system-medium_xb6x7 .tabs__title_xb6x7 {
283
295
  padding-bottom: calc(36px / 2);
284
296
  }
285
- .tabs__desktop_1nnvm.tabs__headline-system-medium_1nnvm .tabs__title_1nnvm + .tabs__title_1nnvm,
286
- .tabs__desktop_1nnvm.tabs__headline-system-medium_1nnvm .tabs__pickerWrapper_1nnvm {
297
+ .tabs__desktop_xb6x7.tabs__headline-system-medium_xb6x7 .tabs__title_xb6x7 + .tabs__title_xb6x7,
298
+ .tabs__desktop_xb6x7.tabs__headline-system-medium_xb6x7 .tabs__pickerWrapper_xb6x7 {
287
299
  margin-left: 36px;
288
300
  }
289
- .tabs__desktop_1nnvm.tabs__headline-system-medium_1nnvm .tabs__option_1nnvm {
301
+ .tabs__desktop_xb6x7.tabs__headline-system-medium_xb6x7 .tabs__option_xb6x7 {
290
302
  padding: var(--gap-0);
291
303
  }
292
- .tabs__desktop_1nnvm.tabs__headline-system-medium_1nnvm .tabs__scrollControls_1nnvm > button {
304
+ .tabs__desktop_xb6x7.tabs__headline-system-medium_xb6x7 .tabs__scrollControls_xb6x7 > button {
293
305
  box-sizing: content-box;
294
306
  width: 36px;
295
307
  height: 36px;
296
308
  padding: var(--gap-0);
297
309
  }
298
- .tabs__desktop_1nnvm.tabs__headline-system-medium_1nnvm .tabs__scrollControls_1nnvm button:first-child {
310
+ .tabs__desktop_xb6x7.tabs__headline-system-medium_xb6x7 .tabs__scrollControls_xb6x7 button:first-child {
299
311
  margin: var(--gap-0) var(--gap-0) var(--gap-0) calc(36px / 2);
300
312
  }
301
- .tabs__desktop_1nnvm.tabs__headline-system-small_1nnvm .tabs__title_1nnvm {
313
+ .tabs__desktop_xb6x7.tabs__headline-system-small_xb6x7 .tabs__title_xb6x7 {
302
314
  padding-bottom: calc(26px / 2);
303
315
  }
304
- .tabs__desktop_1nnvm.tabs__headline-system-small_1nnvm .tabs__title_1nnvm + .tabs__title_1nnvm,
305
- .tabs__desktop_1nnvm.tabs__headline-system-small_1nnvm .tabs__pickerWrapper_1nnvm {
316
+ .tabs__desktop_xb6x7.tabs__headline-system-small_xb6x7 .tabs__title_xb6x7 + .tabs__title_xb6x7,
317
+ .tabs__desktop_xb6x7.tabs__headline-system-small_xb6x7 .tabs__pickerWrapper_xb6x7 {
306
318
  margin-left: 26px;
307
319
  }
308
- .tabs__desktop_1nnvm.tabs__headline-system-small_1nnvm .tabs__option_1nnvm {
320
+ .tabs__desktop_xb6x7.tabs__headline-system-small_xb6x7 .tabs__option_xb6x7 {
309
321
  padding: var(--gap-0);
310
322
  }
311
- .tabs__desktop_1nnvm.tabs__headline-system-small_1nnvm .tabs__scrollControls_1nnvm > button {
323
+ .tabs__desktop_xb6x7.tabs__headline-system-small_xb6x7 .tabs__scrollControls_xb6x7 > button {
312
324
  box-sizing: content-box;
313
325
  width: 26px;
314
326
  height: 26px;
315
327
  padding: var(--gap-0);
316
328
  }
317
- .tabs__desktop_1nnvm.tabs__headline-system-small_1nnvm .tabs__scrollControls_1nnvm button:first-child {
329
+ .tabs__desktop_xb6x7.tabs__headline-system-small_xb6x7 .tabs__scrollControls_xb6x7 button:first-child {
318
330
  margin: var(--gap-0) var(--gap-0) var(--gap-0) calc(26px / 2);
319
331
  }
320
- .tabs__desktop_1nnvm.tabs__headline-system-xsmall_1nnvm .tabs__title_1nnvm {
332
+ .tabs__desktop_xb6x7.tabs__headline-system-xsmall_xb6x7 .tabs__title_xb6x7 {
321
333
  padding-bottom: calc(22px / 2);
322
334
  }
323
- .tabs__desktop_1nnvm.tabs__headline-system-xsmall_1nnvm .tabs__title_1nnvm + .tabs__title_1nnvm,
324
- .tabs__desktop_1nnvm.tabs__headline-system-xsmall_1nnvm .tabs__pickerWrapper_1nnvm {
335
+ .tabs__desktop_xb6x7.tabs__headline-system-xsmall_xb6x7 .tabs__title_xb6x7 + .tabs__title_xb6x7,
336
+ .tabs__desktop_xb6x7.tabs__headline-system-xsmall_xb6x7 .tabs__pickerWrapper_xb6x7 {
325
337
  margin-left: 22px;
326
338
  }
327
- .tabs__desktop_1nnvm.tabs__headline-system-xsmall_1nnvm .tabs__option_1nnvm {
339
+ .tabs__desktop_xb6x7.tabs__headline-system-xsmall_xb6x7 .tabs__option_xb6x7 {
328
340
  padding: var(--gap-0);
329
341
  }
330
- .tabs__desktop_1nnvm.tabs__headline-system-xsmall_1nnvm .tabs__scrollControls_1nnvm > button {
342
+ .tabs__desktop_xb6x7.tabs__headline-system-xsmall_xb6x7 .tabs__scrollControls_xb6x7 > button {
331
343
  box-sizing: content-box;
332
344
  width: 22px;
333
345
  height: 22px;
334
346
  padding: var(--gap-0);
335
347
  }
336
- .tabs__desktop_1nnvm.tabs__headline-system-xsmall_1nnvm .tabs__scrollControls_1nnvm button:first-child {
348
+ .tabs__desktop_xb6x7.tabs__headline-system-xsmall_xb6x7 .tabs__scrollControls_xb6x7 button:first-child {
337
349
  margin: var(--gap-0) var(--gap-0) var(--gap-0) calc(22px / 2);
338
350
  }
339
- .tabs__desktop_1nnvm.tabs__headline-xlarge_1nnvm .tabs__title_1nnvm {
351
+ .tabs__desktop_xb6x7.tabs__headline-xlarge_xb6x7 .tabs__title_xb6x7 {
340
352
  padding-bottom: calc(64px / 2);
341
353
  }
342
- .tabs__desktop_1nnvm.tabs__headline-xlarge_1nnvm .tabs__title_1nnvm + .tabs__title_1nnvm,
343
- .tabs__desktop_1nnvm.tabs__headline-xlarge_1nnvm .tabs__pickerWrapper_1nnvm {
354
+ .tabs__desktop_xb6x7.tabs__headline-xlarge_xb6x7 .tabs__title_xb6x7 + .tabs__title_xb6x7,
355
+ .tabs__desktop_xb6x7.tabs__headline-xlarge_xb6x7 .tabs__pickerWrapper_xb6x7 {
344
356
  margin-left: 64px;
345
357
  }
346
- .tabs__desktop_1nnvm.tabs__headline-xlarge_1nnvm .tabs__option_1nnvm {
358
+ .tabs__desktop_xb6x7.tabs__headline-xlarge_xb6x7 .tabs__option_xb6x7 {
347
359
  padding: var(--gap-0);
348
360
  }
349
- .tabs__desktop_1nnvm.tabs__headline-xlarge_1nnvm .tabs__scrollControls_1nnvm > button {
361
+ .tabs__desktop_xb6x7.tabs__headline-xlarge_xb6x7 .tabs__scrollControls_xb6x7 > button {
350
362
  box-sizing: content-box;
351
363
  width: 64px;
352
364
  height: 64px;
353
365
  padding: var(--gap-0);
354
366
  }
355
- .tabs__desktop_1nnvm.tabs__headline-xlarge_1nnvm .tabs__scrollControls_1nnvm button:first-child {
367
+ .tabs__desktop_xb6x7.tabs__headline-xlarge_xb6x7 .tabs__scrollControls_xb6x7 button:first-child {
356
368
  margin: var(--gap-0) var(--gap-0) var(--gap-0) calc(64px / 2);
357
369
  }
358
- .tabs__desktop_1nnvm.tabs__headline-medium_1nnvm .tabs__title_1nnvm {
370
+ .tabs__desktop_xb6x7.tabs__headline-medium_xb6x7 .tabs__title_xb6x7 {
359
371
  padding-bottom: calc(40px / 2);
360
372
  }
361
- .tabs__desktop_1nnvm.tabs__headline-medium_1nnvm .tabs__title_1nnvm + .tabs__title_1nnvm,
362
- .tabs__desktop_1nnvm.tabs__headline-medium_1nnvm .tabs__pickerWrapper_1nnvm {
373
+ .tabs__desktop_xb6x7.tabs__headline-medium_xb6x7 .tabs__title_xb6x7 + .tabs__title_xb6x7,
374
+ .tabs__desktop_xb6x7.tabs__headline-medium_xb6x7 .tabs__pickerWrapper_xb6x7 {
363
375
  margin-left: 40px;
364
376
  }
365
- .tabs__desktop_1nnvm.tabs__headline-medium_1nnvm .tabs__option_1nnvm {
377
+ .tabs__desktop_xb6x7.tabs__headline-medium_xb6x7 .tabs__option_xb6x7 {
366
378
  padding: var(--gap-0);
367
379
  }
368
- .tabs__desktop_1nnvm.tabs__headline-medium_1nnvm .tabs__scrollControls_1nnvm > button {
380
+ .tabs__desktop_xb6x7.tabs__headline-medium_xb6x7 .tabs__scrollControls_xb6x7 > button {
369
381
  box-sizing: content-box;
370
382
  width: 40px;
371
383
  height: 40px;
372
384
  padding: var(--gap-0);
373
385
  }
374
- .tabs__desktop_1nnvm.tabs__headline-medium_1nnvm .tabs__scrollControls_1nnvm button:first-child {
386
+ .tabs__desktop_xb6x7.tabs__headline-medium_xb6x7 .tabs__scrollControls_xb6x7 button:first-child {
375
387
  margin: var(--gap-0) var(--gap-0) var(--gap-0) calc(40px / 2);
376
388
  }
377
- .tabs__desktop_1nnvm.tabs__headline-small_1nnvm .tabs__title_1nnvm {
389
+ .tabs__desktop_xb6x7.tabs__headline-small_xb6x7 .tabs__title_xb6x7 {
378
390
  padding-bottom: calc(32px / 2);
379
391
  }
380
- .tabs__desktop_1nnvm.tabs__headline-small_1nnvm .tabs__title_1nnvm + .tabs__title_1nnvm,
381
- .tabs__desktop_1nnvm.tabs__headline-small_1nnvm .tabs__pickerWrapper_1nnvm {
392
+ .tabs__desktop_xb6x7.tabs__headline-small_xb6x7 .tabs__title_xb6x7 + .tabs__title_xb6x7,
393
+ .tabs__desktop_xb6x7.tabs__headline-small_xb6x7 .tabs__pickerWrapper_xb6x7 {
382
394
  margin-left: 32px;
383
395
  }
384
- .tabs__desktop_1nnvm.tabs__headline-small_1nnvm .tabs__option_1nnvm {
396
+ .tabs__desktop_xb6x7.tabs__headline-small_xb6x7 .tabs__option_xb6x7 {
385
397
  padding: var(--gap-0);
386
398
  }
387
- .tabs__desktop_1nnvm.tabs__headline-small_1nnvm .tabs__scrollControls_1nnvm > button {
399
+ .tabs__desktop_xb6x7.tabs__headline-small_xb6x7 .tabs__scrollControls_xb6x7 > button {
388
400
  box-sizing: content-box;
389
401
  width: 32px;
390
402
  height: 32px;
391
403
  padding: var(--gap-0);
392
404
  }
393
- .tabs__desktop_1nnvm.tabs__headline-small_1nnvm .tabs__scrollControls_1nnvm button:first-child {
405
+ .tabs__desktop_xb6x7.tabs__headline-small_xb6x7 .tabs__scrollControls_xb6x7 button:first-child {
394
406
  margin: var(--gap-0) var(--gap-0) var(--gap-0) calc(32px / 2);
395
407
  }
396
- .tabs__desktop_1nnvm.tabs__headline-xsmall_1nnvm .tabs__title_1nnvm {
408
+ .tabs__desktop_xb6x7.tabs__headline-xsmall_xb6x7 .tabs__title_xb6x7 {
397
409
  padding-bottom: calc(24px / 2);
398
410
  }
399
- .tabs__desktop_1nnvm.tabs__headline-xsmall_1nnvm .tabs__title_1nnvm + .tabs__title_1nnvm,
400
- .tabs__desktop_1nnvm.tabs__headline-xsmall_1nnvm .tabs__pickerWrapper_1nnvm {
411
+ .tabs__desktop_xb6x7.tabs__headline-xsmall_xb6x7 .tabs__title_xb6x7 + .tabs__title_xb6x7,
412
+ .tabs__desktop_xb6x7.tabs__headline-xsmall_xb6x7 .tabs__pickerWrapper_xb6x7 {
401
413
  margin-left: 24px;
402
414
  }
403
- .tabs__desktop_1nnvm.tabs__headline-xsmall_1nnvm .tabs__option_1nnvm {
415
+ .tabs__desktop_xb6x7.tabs__headline-xsmall_xb6x7 .tabs__option_xb6x7 {
404
416
  padding: var(--gap-0);
405
417
  }
406
- .tabs__desktop_1nnvm.tabs__headline-xsmall_1nnvm .tabs__scrollControls_1nnvm > button {
418
+ .tabs__desktop_xb6x7.tabs__headline-xsmall_xb6x7 .tabs__scrollControls_xb6x7 > button {
407
419
  box-sizing: content-box;
408
420
  width: 24px;
409
421
  height: 24px;
410
422
  padding: var(--gap-0);
411
423
  }
412
- .tabs__desktop_1nnvm.tabs__headline-xsmall_1nnvm .tabs__scrollControls_1nnvm button:first-child {
424
+ .tabs__desktop_xb6x7.tabs__headline-xsmall_xb6x7 .tabs__scrollControls_xb6x7 button:first-child {
413
425
  margin: var(--gap-0) var(--gap-0) var(--gap-0) calc(24px / 2);
414
426
  }
415
- .tabs__fullWidthScroll_1nnvm {
427
+ .tabs__fullWidthScroll_xb6x7 {
416
428
  min-width: calc(100% - 2 * var(--gap-16));
417
429
  margin: var(--gap-0) var(--gap-16);
418
430
  }
419
- .tabs__container_1nnvm {
431
+ .tabs__container_xb6x7 {
420
432
  position: relative;
421
433
  overflow: hidden;
422
434
  margin: var(--gap-4-neg) var(--gap-0) var(--gap-4-neg) var(--gap-4-neg);
423
435
  padding: var(--gap-4) var(--gap-0) var(--gap-4) var(--gap-4);
424
436
  }
425
- .tabs__title_1nnvm {
437
+ .tabs__title_xb6x7 {
426
438
  display: flex;
427
439
  align-items: center;
428
440
  height: 100%;
@@ -439,26 +451,26 @@
439
451
  user-select: none;
440
452
  outline: none;
441
453
  }
442
- .tabs__title_1nnvm:not(:disabled):hover {
454
+ .tabs__title_xb6x7:not(:disabled):hover {
443
455
  color: var(--primary-tablist-hover-color);
444
456
  }
445
- .tabs__focused_1nnvm {
457
+ .tabs__focused_xb6x7 {
446
458
  outline: 2px solid var(--focus-color);
447
459
  outline-offset: 2px;
448
460
  }
449
- .tabs__collapsed_1nnvm {
461
+ .tabs__collapsed_xb6x7 {
450
462
  order: 99;
451
463
  visibility: collapse;
452
464
  }
453
- .tabs__selected_1nnvm {
465
+ .tabs__selected_xb6x7 {
454
466
  cursor: default;
455
467
  color: var(--primary-tablist-selected-color);
456
468
  }
457
- .tabs__disabled_1nnvm {
469
+ .tabs__disabled_xb6x7 {
458
470
  cursor: var(--disabled-cursor);
459
471
  color: var(--primary-tablist-disabled-color);
460
472
  }
461
- .tabs__line_1nnvm {
473
+ .tabs__line_xb6x7 {
462
474
  position: absolute;
463
475
  height: 3px;
464
476
  bottom: calc(var(--gap-2) / 2);
@@ -468,69 +480,70 @@
468
480
  transform 0.2s ease,
469
481
  width 0.2s ease;
470
482
  }
471
- .tabs__option_1nnvm {
483
+ .tabs__option_xb6x7 {
472
484
  color: var(--color-light-text-primary);
473
485
  }
474
- .tabs__s_1nnvm .tabs__title_1nnvm, .tabs__xs_1nnvm .tabs__title_1nnvm, .tabs__xxs_1nnvm .tabs__title_1nnvm {
486
+ .tabs__s_xb6x7 .tabs__title_xb6x7, .tabs__xs_xb6x7 .tabs__title_xb6x7, .tabs__xxs_xb6x7 .tabs__title_xb6x7 {
475
487
  padding: var(--primary-tablist-s-padding);
476
488
  }
477
- .tabs__s_1nnvm .tabs__title_1nnvm + .tabs__title_1nnvm, .tabs__xs_1nnvm .tabs__title_1nnvm + .tabs__title_1nnvm, .tabs__xxs_1nnvm .tabs__title_1nnvm + .tabs__title_1nnvm {
489
+ .tabs__s_xb6x7 .tabs__title_xb6x7 + .tabs__title_xb6x7, .tabs__xs_xb6x7 .tabs__title_xb6x7 + .tabs__title_xb6x7, .tabs__xxs_xb6x7 .tabs__title_xb6x7 + .tabs__title_xb6x7 {
478
490
  margin-left: var(--primary-tablist-s-gaps);
479
491
  }
480
- .tabs__s_1nnvm .tabs__pickerWrapper_1nnvm, .tabs__xs_1nnvm .tabs__pickerWrapper_1nnvm, .tabs__xxs_1nnvm .tabs__pickerWrapper_1nnvm {
492
+ .tabs__s_xb6x7 .tabs__pickerWrapper_xb6x7, .tabs__xs_xb6x7 .tabs__pickerWrapper_xb6x7, .tabs__xxs_xb6x7 .tabs__pickerWrapper_xb6x7 {
481
493
  margin-left: var(--primary-tablist-s-gaps);
482
494
  }
483
- .tabs__s_1nnvm .tabs__option_1nnvm, .tabs__xs_1nnvm .tabs__option_1nnvm, .tabs__xxs_1nnvm .tabs__option_1nnvm {
495
+ .tabs__s_xb6x7 .tabs__option_xb6x7, .tabs__xs_xb6x7 .tabs__option_xb6x7, .tabs__xxs_xb6x7 .tabs__option_xb6x7 {
484
496
  padding: var(--gap-0);
485
497
  }
486
- .tabs__m_1nnvm .tabs__title_1nnvm {
498
+ .tabs__m_xb6x7 .tabs__title_xb6x7 {
487
499
  padding: var(--primary-tablist-m-padding);
488
500
  }
489
- .tabs__m_1nnvm .tabs__title_1nnvm + .tabs__title_1nnvm {
501
+ .tabs__m_xb6x7 .tabs__title_xb6x7 + .tabs__title_xb6x7 {
490
502
  margin-left: var(--primary-tablist-m-gaps);
491
503
  }
492
- .tabs__m_1nnvm .tabs__pickerWrapper_1nnvm {
504
+ .tabs__m_xb6x7 .tabs__pickerWrapper_xb6x7 {
493
505
  margin-left: var(--primary-tablist-m-gaps);
494
506
  }
495
- .tabs__m_1nnvm .tabs__option_1nnvm {
507
+ .tabs__m_xb6x7 .tabs__option_xb6x7 {
496
508
  padding: var(--gap-0);
497
509
  }
498
- .tabs__l_1nnvm .tabs__title_1nnvm {
510
+ .tabs__l_xb6x7 .tabs__title_xb6x7 {
499
511
  padding: var(--primary-tablist-l-padding);
500
512
  }
501
- .tabs__l_1nnvm .tabs__title_1nnvm + .tabs__title_1nnvm {
513
+ .tabs__l_xb6x7 .tabs__title_xb6x7 + .tabs__title_xb6x7 {
502
514
  margin-left: var(--primary-tablist-l-gaps);
503
515
  }
504
- .tabs__l_1nnvm .tabs__pickerWrapper_1nnvm {
516
+ .tabs__l_xb6x7 .tabs__pickerWrapper_xb6x7 {
505
517
  margin-left: var(--primary-tablist-l-gaps);
506
518
  }
507
- .tabs__l_1nnvm .tabs__option_1nnvm {
519
+ .tabs__l_xb6x7 .tabs__option_xb6x7 {
508
520
  padding: var(--gap-0);
509
521
  }
510
- .tabs__xl_1nnvm .tabs__title_1nnvm {
522
+ .tabs__xl_xb6x7 .tabs__title_xb6x7 {
511
523
  padding: var(--primary-tablist-xl-padding);
512
524
  }
513
- .tabs__xl_1nnvm .tabs__title_1nnvm + .tabs__title_1nnvm {
525
+ .tabs__xl_xb6x7 .tabs__title_xb6x7 + .tabs__title_xb6x7 {
514
526
  margin-left: var(--primary-tablist-xl-gaps);
515
527
  }
516
- .tabs__xl_1nnvm .tabs__pickerWrapper_1nnvm {
528
+ .tabs__xl_xb6x7 .tabs__pickerWrapper_xb6x7 {
517
529
  margin-left: var(--primary-tablist-xl-gaps);
518
530
  }
519
- .tabs__xl_1nnvm .tabs__option_1nnvm {
531
+ .tabs__xl_xb6x7 .tabs__option_xb6x7 {
520
532
  padding: var(--gap-0);
521
533
  }
522
- .tabs__rightAddons_1nnvm {
534
+ .tabs__rightAddons_xb6x7 {
523
535
  display: flex;
524
536
  justify-content: center;
525
537
  align-items: center;
526
538
  margin-left: var(--gap-8);
527
539
  }
528
- .tabs__rightAddonsMarginZero_1nnvm {
540
+ .tabs__rightAddonsMarginZero_xb6x7 {
529
541
  margin-left: var(--gap-0);
530
542
  }
531
- .tabs__title_1nnvm.tabs__noTextStyle_1nnvm {
543
+ .tabs__title_xb6x7.tabs__noTextStyle_xb6x7 {
532
544
  font-size: 18px;
533
545
  line-height: 24px;
534
546
  font-weight: 400;
535
- font-family: var(--font-family-system);
547
+ letter-spacing: -0.36px;
548
+ font-family: var(--font-family-alfasans);
536
549
  }