@spectrum-web-components/styles 0.0.0-20241209155954

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 (194) hide show
  1. package/README.md +124 -0
  2. package/all-large-dark.css +16 -0
  3. package/all-large-darkest.css +16 -0
  4. package/all-large-light.css +16 -0
  5. package/all-large-lightest.css +16 -0
  6. package/all-medium-dark.css +16 -0
  7. package/all-medium-darkest.css +16 -0
  8. package/all-medium-light.css +16 -0
  9. package/all-medium-lightest.css +16 -0
  10. package/body.d.ts +2 -0
  11. package/body.dev.js +17 -0
  12. package/body.dev.js.map +7 -0
  13. package/body.js +8 -0
  14. package/body.js.map +7 -0
  15. package/code.d.ts +2 -0
  16. package/code.dev.js +17 -0
  17. package/code.dev.js.map +7 -0
  18. package/code.js +8 -0
  19. package/code.js.map +7 -0
  20. package/core-global.css +17 -0
  21. package/detail.d.ts +2 -0
  22. package/detail.dev.js +17 -0
  23. package/detail.dev.js.map +7 -0
  24. package/detail.js +8 -0
  25. package/detail.js.map +7 -0
  26. package/express/core-global.css +17 -0
  27. package/express/scale-large.css +19 -0
  28. package/express/scale-medium.css +19 -0
  29. package/express/spectrum-core-global.css +3245 -0
  30. package/express/spectrum-scale-large.css +280 -0
  31. package/express/spectrum-scale-medium.css +282 -0
  32. package/express/spectrum-theme-dark.css +300 -0
  33. package/express/spectrum-theme-light.css +300 -0
  34. package/express/theme-dark.css +18 -0
  35. package/express/theme-light.css +18 -0
  36. package/fonts.css +1418 -0
  37. package/heading.d.ts +2 -0
  38. package/heading.dev.js +17 -0
  39. package/heading.dev.js.map +7 -0
  40. package/heading.js +8 -0
  41. package/heading.js.map +7 -0
  42. package/package.json +138 -0
  43. package/scale-large.css +19 -0
  44. package/scale-medium.css +19 -0
  45. package/spectrum-core-global.css +3241 -0
  46. package/spectrum-scale-large.css +291 -0
  47. package/spectrum-scale-medium.css +287 -0
  48. package/spectrum-theme-dark.css +293 -0
  49. package/spectrum-theme-darkest.css +293 -0
  50. package/spectrum-theme-light.css +293 -0
  51. package/spectrum-theme-lightest.css +293 -0
  52. package/spectrum-two/core-global.css +17 -0
  53. package/spectrum-two/scale-large.css +19 -0
  54. package/spectrum-two/scale-medium.css +19 -0
  55. package/spectrum-two/spectrum-core-global.css +3241 -0
  56. package/spectrum-two/spectrum-scale-large.css +291 -0
  57. package/spectrum-two/spectrum-scale-medium.css +287 -0
  58. package/spectrum-two/spectrum-theme-dark.css +293 -0
  59. package/spectrum-two/spectrum-theme-light.css +293 -0
  60. package/spectrum-two/theme-dark.css +18 -0
  61. package/spectrum-two/theme-light.css +18 -0
  62. package/spectrum-two/themes.dev.js +6 -0
  63. package/spectrum-two/themes.dev.js.map +7 -0
  64. package/spectrum-two/themes.js +2 -0
  65. package/spectrum-two/themes.js.map +7 -0
  66. package/src/body-overrides.css +51 -0
  67. package/src/body-overrides.css.d.ts +2 -0
  68. package/src/body-overrides.css.dev.js +7 -0
  69. package/src/body-overrides.css.dev.js.map +7 -0
  70. package/src/body-overrides.css.js +4 -0
  71. package/src/body-overrides.css.js.map +7 -0
  72. package/src/code-overrides.css +39 -0
  73. package/src/code-overrides.css.d.ts +2 -0
  74. package/src/code-overrides.css.dev.js +7 -0
  75. package/src/code-overrides.css.dev.js.map +7 -0
  76. package/src/code-overrides.css.js +4 -0
  77. package/src/code-overrides.css.js.map +7 -0
  78. package/src/detail-overrides.css +38 -0
  79. package/src/detail-overrides.css.d.ts +2 -0
  80. package/src/detail-overrides.css.dev.js +7 -0
  81. package/src/detail-overrides.css.dev.js.map +7 -0
  82. package/src/detail-overrides.css.js +4 -0
  83. package/src/detail-overrides.css.js.map +7 -0
  84. package/src/heading-overrides.css +84 -0
  85. package/src/heading-overrides.css.d.ts +2 -0
  86. package/src/heading-overrides.css.dev.js +7 -0
  87. package/src/heading-overrides.css.dev.js.map +7 -0
  88. package/src/heading-overrides.css.js +4 -0
  89. package/src/heading-overrides.css.js.map +7 -0
  90. package/src/lang-overrides.css +13 -0
  91. package/src/lang-overrides.css.d.ts +2 -0
  92. package/src/lang-overrides.css.dev.js +7 -0
  93. package/src/lang-overrides.css.dev.js.map +7 -0
  94. package/src/lang-overrides.css.js +4 -0
  95. package/src/lang-overrides.css.js.map +7 -0
  96. package/src/spectrum-base.css +26 -0
  97. package/src/spectrum-base.css.d.ts +2 -0
  98. package/src/spectrum-base.css.dev.js +7 -0
  99. package/src/spectrum-base.css.dev.js.map +7 -0
  100. package/src/spectrum-base.css.js +4 -0
  101. package/src/spectrum-base.css.js.map +7 -0
  102. package/src/spectrum-body.css +242 -0
  103. package/src/spectrum-body.css.d.ts +2 -0
  104. package/src/spectrum-body.css.dev.js +7 -0
  105. package/src/spectrum-body.css.dev.js.map +7 -0
  106. package/src/spectrum-body.css.js +4 -0
  107. package/src/spectrum-body.css.js.map +7 -0
  108. package/src/spectrum-code.css +151 -0
  109. package/src/spectrum-code.css.d.ts +2 -0
  110. package/src/spectrum-code.css.dev.js +7 -0
  111. package/src/spectrum-code.css.dev.js.map +7 -0
  112. package/src/spectrum-code.css.js +4 -0
  113. package/src/spectrum-code.css.js.map +7 -0
  114. package/src/spectrum-config.js +59 -0
  115. package/src/spectrum-detail.css +385 -0
  116. package/src/spectrum-detail.css.d.ts +2 -0
  117. package/src/spectrum-detail.css.dev.js +7 -0
  118. package/src/spectrum-detail.css.dev.js.map +7 -0
  119. package/src/spectrum-detail.css.js +4 -0
  120. package/src/spectrum-detail.css.js.map +7 -0
  121. package/src/spectrum-heading.css +558 -0
  122. package/src/spectrum-heading.css.d.ts +2 -0
  123. package/src/spectrum-heading.css.dev.js +7 -0
  124. package/src/spectrum-heading.css.dev.js.map +7 -0
  125. package/src/spectrum-heading.css.js +4 -0
  126. package/src/spectrum-heading.css.js.map +7 -0
  127. package/src/spectrum-lang.css +519 -0
  128. package/src/spectrum-lang.css.d.ts +2 -0
  129. package/src/spectrum-lang.css.dev.js +7 -0
  130. package/src/spectrum-lang.css.dev.js.map +7 -0
  131. package/src/spectrum-lang.css.js +4 -0
  132. package/src/spectrum-lang.css.js.map +7 -0
  133. package/src/spectrum-typography.css +55 -0
  134. package/src/spectrum-typography.css.d.ts +2 -0
  135. package/src/spectrum-typography.css.dev.js +7 -0
  136. package/src/spectrum-typography.css.dev.js.map +7 -0
  137. package/src/spectrum-typography.css.js +4 -0
  138. package/src/spectrum-typography.css.js.map +7 -0
  139. package/theme-dark.css +18 -0
  140. package/theme-darkest.css +18 -0
  141. package/theme-light.css +18 -0
  142. package/theme-lightest.css +18 -0
  143. package/tokens/dark-vars.css +499 -0
  144. package/tokens/darkest-vars.css +499 -0
  145. package/tokens/express/custom-dark-vars.css +13 -0
  146. package/tokens/express/custom-darkest-vars.css +13 -0
  147. package/tokens/express/custom-large-vars.css +11 -0
  148. package/tokens/express/custom-light-vars.css +15 -0
  149. package/tokens/express/custom-medium-vars.css +11 -0
  150. package/tokens/express/custom-vars.css +4 -0
  151. package/tokens/express/dark-vars.css +14 -0
  152. package/tokens/express/darkest-vars.css +14 -0
  153. package/tokens/express/global-vars.css +7288 -0
  154. package/tokens/express/index.css +225 -0
  155. package/tokens/express/large-vars.css +69 -0
  156. package/tokens/express/light-vars.css +16 -0
  157. package/tokens/express/medium-vars.css +69 -0
  158. package/tokens/global-vars.css +972 -0
  159. package/tokens/index.css +4439 -0
  160. package/tokens/large-vars.css +494 -0
  161. package/tokens/light-vars.css +499 -0
  162. package/tokens/medium-vars.css +494 -0
  163. package/tokens/spectrum/custom-dark-vars.css +92 -0
  164. package/tokens/spectrum/custom-darkest-vars.css +93 -0
  165. package/tokens/spectrum/custom-large-vars.css +111 -0
  166. package/tokens/spectrum/custom-light-vars.css +92 -0
  167. package/tokens/spectrum/custom-medium-vars.css +112 -0
  168. package/tokens/spectrum/custom-vars.css +47 -0
  169. package/tokens/spectrum/dark-vars.css +102 -0
  170. package/tokens/spectrum/darkest-vars.css +103 -0
  171. package/tokens/spectrum/global-vars.css +7344 -0
  172. package/tokens/spectrum/index.css +803 -0
  173. package/tokens/spectrum/large-vars.css +159 -0
  174. package/tokens/spectrum/light-vars.css +102 -0
  175. package/tokens/spectrum/medium-vars.css +160 -0
  176. package/tokens-v2/dark-vars.css +1031 -0
  177. package/tokens-v2/global-vars.css +1080 -0
  178. package/tokens-v2/index.css +4440 -0
  179. package/tokens-v2/large-vars.css +646 -0
  180. package/tokens-v2/light-vars.css +1031 -0
  181. package/tokens-v2/medium-vars.css +648 -0
  182. package/tokens-v2/spectrum/custom-dark-vars.css +108 -0
  183. package/tokens-v2/spectrum/custom-darkest-vars.css +109 -0
  184. package/tokens-v2/spectrum/custom-large-vars.css +120 -0
  185. package/tokens-v2/spectrum/custom-light-vars.css +108 -0
  186. package/tokens-v2/spectrum/custom-medium-vars.css +121 -0
  187. package/tokens-v2/spectrum/custom-vars.css +52 -0
  188. package/tokens-v2/spectrum/global-vars.css +7232 -0
  189. package/typography.css +1418 -0
  190. package/typography.d.ts +2 -0
  191. package/typography.dev.js +4 -0
  192. package/typography.dev.js.map +7 -0
  193. package/typography.js +2 -0
  194. package/typography.js.map +7 -0
package/fonts.css ADDED
@@ -0,0 +1,1418 @@
1
+ .spectrum-Typography {
2
+ font-family: var(--spectrum-font-family);
3
+ font-style: var(--spectrum-font-style);
4
+ font-size: var(--spectrum-font-size);
5
+ }
6
+
7
+ .spectrum-Typography:lang(ar) {
8
+ font-family: var(--spectrum-font-family-ar);
9
+ }
10
+
11
+ .spectrum-Typography:lang(he) {
12
+ font-family: var(--spectrum-font-family-he);
13
+ }
14
+
15
+ .spectrum-Typography .spectrum-Heading {
16
+ --spectrum-heading-margin-start: calc(
17
+ var(--mod-heading-font-size, var(--spectrum-heading-font-size)) *
18
+ var(--spectrum-heading-margin-top-multiplier)
19
+ );
20
+ --spectrum-heading-margin-end: calc(
21
+ var(--mod-heading-font-size, var(--spectrum-heading-font-size)) *
22
+ var(--spectrum-heading-margin-bottom-multiplier)
23
+ );
24
+ }
25
+
26
+ .spectrum-Typography .spectrum-Body {
27
+ --spectrum-body-margin-end: calc(
28
+ var(--mod-body-font-size, var(--spectrum-body-font-size)) *
29
+ var(--spectrum-body-margin-multiplier)
30
+ );
31
+ }
32
+
33
+ .spectrum-Typography .spectrum-Detail {
34
+ --spectrum-detail-margin-start: calc(
35
+ var(--mod-detail-font-size, var(--spectrum-detail-font-size)) *
36
+ var(--spectrum-detail-margin-top-multiplier)
37
+ );
38
+ --spectrum-detail-margin-end: calc(
39
+ var(--mod-detail-font-size, var(--spectrum-detail-font-size)) *
40
+ var(--spectrum-detail-margin-bottom-multiplier)
41
+ );
42
+ }
43
+
44
+ .spectrum-Heading {
45
+ font-family: var(
46
+ --mod-heading-sans-serif-font-family,
47
+ var(--spectrum-heading-sans-serif-font-family)
48
+ );
49
+ font-style: var(
50
+ --mod-heading-sans-serif-font-style,
51
+ var(--spectrum-heading-sans-serif-font-style)
52
+ );
53
+ font-weight: var(
54
+ --mod-heading-sans-serif-font-weight,
55
+ var(--spectrum-heading-sans-serif-font-weight)
56
+ );
57
+ font-size: var(--mod-heading-font-size, var(--spectrum-heading-font-size));
58
+ color: var(
59
+ --highcontrast-heading-font-color,
60
+ var(--mod-heading-font-color, var(--spectrum-heading-font-color))
61
+ );
62
+ line-height: var(
63
+ --mod-heading-line-height,
64
+ var(--spectrum-heading-line-height)
65
+ );
66
+ margin-block-start: var(
67
+ --mod-heading-margin-start,
68
+ var(--spectrum-heading-margin-start, 0)
69
+ );
70
+ margin-block-end: var(
71
+ --mod-heading-margin-end,
72
+ var(--spectrum-heading-margin-end, 0)
73
+ );
74
+ }
75
+
76
+ .spectrum-Heading .spectrum-Heading-strong,
77
+ .spectrum-Heading strong {
78
+ font-style: var(
79
+ --mod-heading-sans-serif-strong-font-style,
80
+ var(--spectrum-heading-sans-serif-strong-font-style)
81
+ );
82
+ font-weight: var(
83
+ --mod-heading-sans-serif-strong-font-weight,
84
+ var(--spectrum-heading-sans-serif-strong-font-weight)
85
+ );
86
+ }
87
+
88
+ .spectrum-Heading .spectrum-Heading-emphasized,
89
+ .spectrum-Heading em {
90
+ font-style: var(
91
+ --mod-heading-sans-serif-emphasized-font-style,
92
+ var(--spectrum-heading-sans-serif-emphasized-font-style)
93
+ );
94
+ font-weight: var(
95
+ --mod-heading-sans-serif-emphasized-font-weight,
96
+ var(--spectrum-heading-sans-serif-emphasized-font-weight)
97
+ );
98
+ }
99
+
100
+ .spectrum-Heading .spectrum-Heading-strong.spectrum-Heading-emphasized,
101
+ .spectrum-Heading em strong,
102
+ .spectrum-Heading strong em {
103
+ font-style: var(
104
+ --mod-heading-sans-serif-strong-emphasized-font-style,
105
+ var(--spectrum-heading-sans-serif-strong-emphasized-font-style)
106
+ );
107
+ font-weight: var(
108
+ --mod-heading-sans-serif-strong-emphasized-font-weight,
109
+ var(--spectrum-heading-sans-serif-strong-emphasized-font-weight)
110
+ );
111
+ }
112
+
113
+ .spectrum-Heading:lang(ja),
114
+ .spectrum-Heading:lang(ko),
115
+ .spectrum-Heading:lang(zh) {
116
+ font-family: var(
117
+ --mod-heading-cjk-font-family,
118
+ var(--spectrum-heading-cjk-font-family)
119
+ );
120
+ font-style: var(
121
+ --mod-heading-cjk-font-style,
122
+ var(--spectrum-heading-cjk-font-style)
123
+ );
124
+ font-weight: var(
125
+ --mod-heading-cjk-font-weight,
126
+ var(--spectrum-heading-cjk-font-weight)
127
+ );
128
+ font-size: var(
129
+ --mod-heading-cjk-font-size,
130
+ var(--spectrum-heading-cjk-font-size)
131
+ );
132
+ line-height: var(
133
+ --mod-heading-cjk-line-height,
134
+ var(--spectrum-heading-cjk-line-height)
135
+ );
136
+ letter-spacing: var(
137
+ --mod-heading-cjk-letter-spacing,
138
+ var(--spectrum-heading-cjk-letter-spacing)
139
+ );
140
+ }
141
+
142
+ .spectrum-Heading:lang(ja) .spectrum-Heading-emphasized,
143
+ .spectrum-Heading:lang(ja) em,
144
+ .spectrum-Heading:lang(ko) .spectrum-Heading-emphasized,
145
+ .spectrum-Heading:lang(ko) em,
146
+ .spectrum-Heading:lang(zh) .spectrum-Heading-emphasized,
147
+ .spectrum-Heading:lang(zh) em {
148
+ font-style: var(
149
+ --mod-heading-cjk-emphasized-font-style,
150
+ var(--spectrum-heading-cjk-emphasized-font-style)
151
+ );
152
+ font-weight: var(
153
+ --mod-heading-cjk-emphasized-font-weight,
154
+ var(--spectrum-heading-cjk-emphasized-font-weight)
155
+ );
156
+ }
157
+
158
+ .spectrum-Heading:lang(ja) .spectrum-Heading-strong,
159
+ .spectrum-Heading:lang(ja) strong,
160
+ .spectrum-Heading:lang(ko) .spectrum-Heading-strong,
161
+ .spectrum-Heading:lang(ko) strong,
162
+ .spectrum-Heading:lang(zh) .spectrum-Heading-strong,
163
+ .spectrum-Heading:lang(zh) strong {
164
+ font-style: var(
165
+ --mod-heading-cjk-strong-font-style,
166
+ var(--spectrum-heading-cjk-strong-font-style)
167
+ );
168
+ font-weight: var(
169
+ --mod-heading-cjk-strong-font-weight,
170
+ var(--spectrum-heading-cjk-strong-font-weight)
171
+ );
172
+ }
173
+
174
+ .spectrum-Heading:lang(ja) .spectrum-Heading-strong.spectrum-Heading-emphasized,
175
+ .spectrum-Heading:lang(ja) em strong,
176
+ .spectrum-Heading:lang(ja) strong em,
177
+ .spectrum-Heading:lang(ko) .spectrum-Heading-strong.spectrum-Heading-emphasized,
178
+ .spectrum-Heading:lang(ko) em strong,
179
+ .spectrum-Heading:lang(ko) strong em,
180
+ .spectrum-Heading:lang(zh) .spectrum-Heading-strong.spectrum-Heading-emphasized,
181
+ .spectrum-Heading:lang(zh) em strong,
182
+ .spectrum-Heading:lang(zh) strong em {
183
+ font-style: var(
184
+ --mod-heading-cjk-strong-emphasized-font-style,
185
+ var(--spectrum-heading-cjk-strong-emphasized-font-style)
186
+ );
187
+ font-weight: var(
188
+ --mod-heading-cjk-strong-emphasized-font-weight,
189
+ var(--spectrum-heading-cjk-strong-emphasized-font-weight)
190
+ );
191
+ }
192
+
193
+ .spectrum-Heading--heavy {
194
+ font-style: var(
195
+ --mod-heading-sans-serif-heavy-font-style,
196
+ var(--spectrum-heading-sans-serif-heavy-font-style)
197
+ );
198
+ font-weight: var(
199
+ --mod-heading-sans-serif-heavy-font-weight,
200
+ var(--spectrum-heading-sans-serif-heavy-font-weight)
201
+ );
202
+ }
203
+
204
+ .spectrum-Heading--heavy .spectrum-Heading-strong,
205
+ .spectrum-Heading--heavy strong {
206
+ font-style: var(
207
+ --mod-heading-sans-serif-heavy-strong-font-style,
208
+ var(--spectrum-heading-sans-serif-heavy-strong-font-style)
209
+ );
210
+ font-weight: var(
211
+ --mod-heading-sans-serif-heavy-strong-font-weight,
212
+ var(--spectrum-heading-sans-serif-heavy-strong-font-weight)
213
+ );
214
+ }
215
+
216
+ .spectrum-Heading--heavy .spectrum-Heading-emphasized,
217
+ .spectrum-Heading--heavy em {
218
+ font-style: var(
219
+ --mod-heading-sans-serif-heavy-emphasized-font-style,
220
+ var(--spectrum-heading-sans-serif-heavy-emphasized-font-style)
221
+ );
222
+ font-weight: var(
223
+ --mod-heading-sans-serif-heavy-emphasized-font-weight,
224
+ var(--spectrum-heading-sans-serif-heavy-emphasized-font-weight)
225
+ );
226
+ }
227
+
228
+ .spectrum-Heading--heavy .spectrum-Heading-strong.spectrum-Heading-emphasized,
229
+ .spectrum-Heading--heavy em strong,
230
+ .spectrum-Heading--heavy strong em {
231
+ font-style: var(
232
+ --mod-heading-sans-serif-heavy-strong-emphasized-font-style,
233
+ var(--spectrum-heading-sans-serif-heavy-strong-emphasized-font-style)
234
+ );
235
+ font-weight: var(
236
+ --mod-heading-sans-serif-heavy-strong-emphasized-font-weight,
237
+ var(--spectrum-heading-sans-serif-heavy-strong-emphasized-font-weight)
238
+ );
239
+ }
240
+
241
+ .spectrum-Heading--heavy:lang(ja),
242
+ .spectrum-Heading--heavy:lang(ko),
243
+ .spectrum-Heading--heavy:lang(zh) {
244
+ font-style: var(
245
+ --mod-heading-cjk-heavy-font-style,
246
+ var(--spectrum-heading-cjk-heavy-font-style)
247
+ );
248
+ font-weight: var(
249
+ --mod-heading-cjk-heavy-font-weight,
250
+ var(--spectrum-heading-cjk-heavy-font-weight)
251
+ );
252
+ }
253
+
254
+ .spectrum-Heading--heavy:lang(ja) .spectrum-Heading-emphasized,
255
+ .spectrum-Heading--heavy:lang(ja) em,
256
+ .spectrum-Heading--heavy:lang(ko) .spectrum-Heading-emphasized,
257
+ .spectrum-Heading--heavy:lang(ko) em,
258
+ .spectrum-Heading--heavy:lang(zh) .spectrum-Heading-emphasized,
259
+ .spectrum-Heading--heavy:lang(zh) em {
260
+ font-style: var(
261
+ --mod-heading-cjk-heavy-emphasized-font-style,
262
+ var(--spectrum-heading-cjk-heavy-emphasized-font-style)
263
+ );
264
+ font-weight: var(
265
+ --mod-heading-cjk-heavy-emphasized-font-weight,
266
+ var(--spectrum-heading-cjk-heavy-emphasized-font-weight)
267
+ );
268
+ }
269
+
270
+ .spectrum-Heading--heavy:lang(ja) .spectrum-Heading-strong,
271
+ .spectrum-Heading--heavy:lang(ja) strong,
272
+ .spectrum-Heading--heavy:lang(ko) .spectrum-Heading-strong,
273
+ .spectrum-Heading--heavy:lang(ko) strong,
274
+ .spectrum-Heading--heavy:lang(zh) .spectrum-Heading-strong,
275
+ .spectrum-Heading--heavy:lang(zh) strong {
276
+ font-style: var(
277
+ --mod-heading-cjk-heavy-strong-font-style,
278
+ var(--spectrum-heading-cjk-heavy-strong-font-style)
279
+ );
280
+ font-weight: var(
281
+ --mod-heading-cjk-heavy-strong-font-weight,
282
+ var(--spectrum-heading-cjk-heavy-strong-font-weight)
283
+ );
284
+ }
285
+
286
+ .spectrum-Heading--heavy:lang(ja)
287
+ .spectrum-Heading-strong.spectrum-Heading-emphasized,
288
+ .spectrum-Heading--heavy:lang(ja) em strong,
289
+ .spectrum-Heading--heavy:lang(ja) strong em,
290
+ .spectrum-Heading--heavy:lang(ko)
291
+ .spectrum-Heading-strong.spectrum-Heading-emphasized,
292
+ .spectrum-Heading--heavy:lang(ko) em strong,
293
+ .spectrum-Heading--heavy:lang(ko) strong em,
294
+ .spectrum-Heading--heavy:lang(zh)
295
+ .spectrum-Heading-strong.spectrum-Heading-emphasized,
296
+ .spectrum-Heading--heavy:lang(zh) em strong,
297
+ .spectrum-Heading--heavy:lang(zh) strong em {
298
+ font-style: var(
299
+ --mod-heading-cjk-heavy-strong-emphasized-font-style,
300
+ var(--spectrum-heading-cjk-heavy-strong-emphasized-font-style)
301
+ );
302
+ font-weight: var(
303
+ --mod-heading-cjk-heavy-strong-emphasized-font-weight,
304
+ var(--spectrum-heading-cjk-heavy-strong-emphasized-font-weight)
305
+ );
306
+ }
307
+
308
+ .spectrum-Heading--light {
309
+ font-style: var(
310
+ --mod-heading-sans-serif-light-font-style,
311
+ var(--spectrum-heading-sans-serif-light-font-style)
312
+ );
313
+ font-weight: var(
314
+ --mod-heading-sans-serif-light-font-weight,
315
+ var(--spectrum-heading-sans-serif-light-font-weight)
316
+ );
317
+ }
318
+
319
+ .spectrum-Heading--light .spectrum-Heading-emphasized,
320
+ .spectrum-Heading--light em {
321
+ font-style: var(
322
+ --mod-heading-sans-serif-light-emphasized-font-style,
323
+ var(--spectrum-heading-sans-serif-light-emphasized-font-style)
324
+ );
325
+ font-weight: var(
326
+ --mod-heading-sans-serif-light-emphasized-font-weight,
327
+ var(--spectrum-heading-sans-serif-light-emphasized-font-weight)
328
+ );
329
+ }
330
+
331
+ .spectrum-Heading--light .spectrum-Heading-strong,
332
+ .spectrum-Heading--light strong {
333
+ font-style: var(
334
+ --mod-heading-sans-serif-light-strong-font-style,
335
+ var(--spectrum-heading-sans-serif-light-strong-font-style)
336
+ );
337
+ font-weight: var(
338
+ --mod-heading-sans-serif-light-strong-font-weight,
339
+ var(--spectrum-heading-sans-serif-light-strong-font-weight)
340
+ );
341
+ }
342
+
343
+ .spectrum-Heading--light .spectrum-Heading-strong.spectrum-Heading-emphasized,
344
+ .spectrum-Heading--light em strong,
345
+ .spectrum-Heading--light strong em {
346
+ font-style: var(
347
+ --mod-heading-sans-serif-light-strong-emphasized-font-style,
348
+ var(--spectrum-heading-sans-serif-light-strong-emphasized-font-style)
349
+ );
350
+ font-weight: var(
351
+ --mod-heading-sans-serif-light-strong-emphasized-font-weight,
352
+ var(--spectrum-heading-sans-serif-light-strong-emphasized-font-weight)
353
+ );
354
+ }
355
+
356
+ .spectrum-Heading--light:lang(ja),
357
+ .spectrum-Heading--light:lang(ko),
358
+ .spectrum-Heading--light:lang(zh) {
359
+ font-style: var(
360
+ --mod-heading-cjk-light-font-style,
361
+ var(--spectrum-heading-cjk-light-font-style)
362
+ );
363
+ font-weight: var(
364
+ --mod-heading-cjk-light-font-weight,
365
+ var(--spectrum-heading-cjk-light-font-weight)
366
+ );
367
+ }
368
+
369
+ .spectrum-Heading--light:lang(ja) .spectrum-Heading-strong,
370
+ .spectrum-Heading--light:lang(ja) strong,
371
+ .spectrum-Heading--light:lang(ko) .spectrum-Heading-strong,
372
+ .spectrum-Heading--light:lang(ko) strong,
373
+ .spectrum-Heading--light:lang(zh) .spectrum-Heading-strong,
374
+ .spectrum-Heading--light:lang(zh) strong {
375
+ font-style: var(
376
+ --mod-heading-cjk-light-strong-font-style,
377
+ var(--spectrum-heading-cjk-light-strong-font-style)
378
+ );
379
+ font-weight: var(
380
+ --mod-heading-cjk-light-strong-font-weight,
381
+ var(--spectrum-heading-cjk-light-strong-font-weight)
382
+ );
383
+ }
384
+
385
+ .spectrum-Heading--light:lang(ja) .spectrum-Heading-emphasized,
386
+ .spectrum-Heading--light:lang(ja) em,
387
+ .spectrum-Heading--light:lang(ko) .spectrum-Heading-emphasized,
388
+ .spectrum-Heading--light:lang(ko) em,
389
+ .spectrum-Heading--light:lang(zh) .spectrum-Heading-emphasized,
390
+ .spectrum-Heading--light:lang(zh) em {
391
+ font-style: var(
392
+ --mod-heading-cjk-light-emphasized-font-style,
393
+ var(--spectrum-heading-cjk-light-emphasized-font-style)
394
+ );
395
+ font-weight: var(
396
+ --mod-heading-cjk-light-emphasized-font-weight,
397
+ var(--spectrum-heading-cjk-light-emphasized-font-weight)
398
+ );
399
+ }
400
+
401
+ .spectrum-Heading--light:lang(ja)
402
+ .spectrum-Heading-strong.spectrum-Heading-emphasized,
403
+ .spectrum-Heading--light:lang(ja) em strong,
404
+ .spectrum-Heading--light:lang(ja) strong em,
405
+ .spectrum-Heading--light:lang(ko)
406
+ .spectrum-Heading-strong.spectrum-Heading-emphasized,
407
+ .spectrum-Heading--light:lang(ko) em strong,
408
+ .spectrum-Heading--light:lang(ko) strong em,
409
+ .spectrum-Heading--light:lang(zh)
410
+ .spectrum-Heading-strong.spectrum-Heading-emphasized,
411
+ .spectrum-Heading--light:lang(zh) em strong,
412
+ .spectrum-Heading--light:lang(zh) strong em {
413
+ font-style: var(
414
+ --mod-heading-cjk-light-strong-emphasized-font-style,
415
+ var(--spectrum-heading-cjk-light-strong-emphasized-font-style)
416
+ );
417
+ font-weight: var(
418
+ --mod-heading-cjk-light-strong-emphasized-font-weight,
419
+ var(--spectrum-heading-cjk-light-strong-emphasized-font-weight)
420
+ );
421
+ }
422
+
423
+ .spectrum-Heading--serif {
424
+ font-family: var(
425
+ --mod-heading-serif-font-family,
426
+ var(--spectrum-heading-serif-font-family)
427
+ );
428
+ font-style: var(
429
+ --mod-heading-serif-font-style,
430
+ var(--spectrum-heading-serif-font-style)
431
+ );
432
+ font-weight: var(
433
+ --mod-heading-serif-font-weight,
434
+ var(--spectrum-heading-serif-font-weight)
435
+ );
436
+ }
437
+
438
+ .spectrum-Heading--serif .spectrum-Heading-emphasized,
439
+ .spectrum-Heading--serif em {
440
+ font-style: var(
441
+ --mod-heading-serif-emphasized-font-style,
442
+ var(--spectrum-heading-serif-emphasized-font-style)
443
+ );
444
+ font-weight: var(
445
+ --mod-heading-serif-emphasized-font-weight,
446
+ var(--spectrum-heading-serif-emphasized-font-weight)
447
+ );
448
+ }
449
+
450
+ .spectrum-Heading--serif .spectrum-Heading-strong,
451
+ .spectrum-Heading--serif strong {
452
+ font-style: var(
453
+ --mod-heading-serif-strong-font-style,
454
+ var(--spectrum-heading-serif-strong-font-style)
455
+ );
456
+ font-weight: var(
457
+ --mod-heading-serif-strong-font-weight,
458
+ var(--spectrum-heading-serif-strong-font-weight)
459
+ );
460
+ }
461
+
462
+ .spectrum-Heading--serif .spectrum-Heading-strong.spectrum-Heading-emphasized,
463
+ .spectrum-Heading--serif em strong,
464
+ .spectrum-Heading--serif strong em {
465
+ font-style: var(
466
+ --mod-heading-serif-strong-emphasized-font-style,
467
+ var(--spectrum-heading-serif-strong-emphasized-font-style)
468
+ );
469
+ font-weight: var(
470
+ --mod-heading-serif-strong-emphasized-font-weight,
471
+ var(--spectrum-heading-serif-strong-emphasized-font-weight)
472
+ );
473
+ }
474
+
475
+ .spectrum-Heading--serif.spectrum-Heading--heavy {
476
+ font-style: var(
477
+ --mod-heading-serif-heavy-font-style,
478
+ var(--spectrum-heading-serif-heavy-font-style)
479
+ );
480
+ font-weight: var(
481
+ --mod-heading-serif-heavy-font-weight,
482
+ var(--spectrum-heading-serif-heavy-font-weight)
483
+ );
484
+ }
485
+
486
+ .spectrum-Heading--serif.spectrum-Heading--heavy .spectrum-Heading-strong,
487
+ .spectrum-Heading--serif.spectrum-Heading--heavy strong {
488
+ font-style: var(
489
+ --mod-heading-serif-heavy-strong-font-style,
490
+ var(--spectrum-heading-serif-heavy-strong-font-style)
491
+ );
492
+ font-weight: var(
493
+ --mod-heading-serif-heavy-strong-font-weight,
494
+ var(--spectrum-heading-serif-heavy-strong-font-weight)
495
+ );
496
+ }
497
+
498
+ .spectrum-Heading--serif.spectrum-Heading--heavy .spectrum-Heading-emphasized,
499
+ .spectrum-Heading--serif.spectrum-Heading--heavy em {
500
+ font-style: var(
501
+ --mod-heading-serif-heavy-emphasized-font-style,
502
+ var(--spectrum-heading-serif-heavy-emphasized-font-style)
503
+ );
504
+ font-weight: var(
505
+ --mod-heading-serif-heavy-emphasized-font-weight,
506
+ var(--spectrum-heading-serif-heavy-emphasized-font-weight)
507
+ );
508
+ }
509
+
510
+ .spectrum-Heading--serif.spectrum-Heading--heavy
511
+ .spectrum-Heading-strong.spectrum-Heading-emphasized,
512
+ .spectrum-Heading--serif.spectrum-Heading--heavy em strong,
513
+ .spectrum-Heading--serif.spectrum-Heading--heavy strong em {
514
+ font-style: var(
515
+ --mod-heading-serif-heavy-strong-emphasized-font-style,
516
+ var(--spectrum-heading-serif-heavy-strong-emphasized-font-style)
517
+ );
518
+ font-weight: var(
519
+ --mod-heading-serif-heavy-strong-emphasized-font-weight,
520
+ var(--spectrum-heading-serif-heavy-strong-emphasized-font-weight)
521
+ );
522
+ }
523
+
524
+ .spectrum-Heading--serif.spectrum-Heading--light {
525
+ font-style: var(
526
+ --mod-heading-serif-light-font-style,
527
+ var(--spectrum-heading-serif-light-font-style)
528
+ );
529
+ font-weight: var(
530
+ --mod-heading-serif-light-font-weight,
531
+ var(--spectrum-heading-serif-light-font-weight)
532
+ );
533
+ }
534
+
535
+ .spectrum-Heading--serif.spectrum-Heading--light .spectrum-Heading-emphasized,
536
+ .spectrum-Heading--serif.spectrum-Heading--light em {
537
+ font-style: var(
538
+ --mod-heading-serif-light-emphasized-font-style,
539
+ var(--spectrum-heading-serif-light-emphasized-font-style)
540
+ );
541
+ font-weight: var(
542
+ --mod-heading-serif-light-emphasized-font-weight,
543
+ var(--spectrum-heading-serif-light-emphasized-font-weight)
544
+ );
545
+ }
546
+
547
+ .spectrum-Heading--serif.spectrum-Heading--light .spectrum-Heading-strong,
548
+ .spectrum-Heading--serif.spectrum-Heading--light strong {
549
+ font-style: var(
550
+ --mod-heading-serif-light-strong-font-style,
551
+ var(--spectrum-heading-serif-light-strong-font-style)
552
+ );
553
+ font-weight: var(
554
+ --mod-heading-serif-light-strong-font-weight,
555
+ var(--spectrum-heading-serif-light-strong-font-weight)
556
+ );
557
+ }
558
+
559
+ .spectrum-Heading--serif.spectrum-Heading--light
560
+ .spectrum-Heading-strong.spectrum-Heading-emphasized,
561
+ .spectrum-Heading--serif.spectrum-Heading--light em strong,
562
+ .spectrum-Heading--serif.spectrum-Heading--light strong em {
563
+ font-style: var(
564
+ --mod-heading-serif-light-strong-emphasized-font-style,
565
+ var(--spectrum-heading-serif-light-strong-emphasized-font-style)
566
+ );
567
+ font-weight: var(
568
+ --mod-heading-serif-light-strong-emphasized-font-weight,
569
+ var(--spectrum-heading-serif-light-strong-emphasized-font-weight)
570
+ );
571
+ }
572
+
573
+ .spectrum-Body {
574
+ font-family: var(
575
+ --mod-body-sans-serif-font-family,
576
+ var(--spectrum-body-sans-serif-font-family)
577
+ );
578
+ font-style: var(
579
+ --mod-body-sans-serif-font-style,
580
+ var(--spectrum-body-sans-serif-font-style)
581
+ );
582
+ font-weight: var(
583
+ --mod-body-sans-serif-font-weight,
584
+ var(--spectrum-body-sans-serif-font-weight)
585
+ );
586
+ font-size: var(--mod-body-font-size, var(--spectrum-body-font-size));
587
+ color: var(
588
+ --highcontrast-body-font-color,
589
+ var(--mod-body-font-color, var(--spectrum-body-font-color))
590
+ );
591
+ line-height: var(--mod-body-line-height, var(--spectrum-body-line-height));
592
+ margin-block-start: var(
593
+ --mod-body-margin-start,
594
+ var(--mod-body-margin, var(--spectrum-body-margin-start, 0))
595
+ );
596
+ margin-block-end: var(
597
+ --mod-body-margin-end,
598
+ var(--mod-body-margin, var(--spectrum-body-margin-end, 0))
599
+ );
600
+ }
601
+
602
+ .spectrum-Body .spectrum-Body-strong,
603
+ .spectrum-Body strong {
604
+ font-style: var(
605
+ --mod-body-sans-serif-strong-font-style,
606
+ var(--spectrum-body-sans-serif-strong-font-style)
607
+ );
608
+ font-weight: var(
609
+ --mod-body-sans-serif-strong-font-weight,
610
+ var(--spectrum-body-sans-serif-strong-font-weight)
611
+ );
612
+ }
613
+
614
+ .spectrum-Body .spectrum-Body-emphasized,
615
+ .spectrum-Body em {
616
+ font-style: var(
617
+ --mod-body-sans-serif-emphasized-font-style,
618
+ var(--spectrum-body-sans-serif-emphasized-font-style)
619
+ );
620
+ font-weight: var(
621
+ --mod-body-sans-serif-emphasized-font-weight,
622
+ var(--spectrum-body-sans-serif-emphasized-font-weight)
623
+ );
624
+ }
625
+
626
+ .spectrum-Body .spectrum-Body-strong.spectrum-Body-emphasized,
627
+ .spectrum-Body em strong,
628
+ .spectrum-Body strong em {
629
+ font-style: var(
630
+ --mod-body-sans-serif-strong-emphasized-font-style,
631
+ var(--spectrum-body-sans-serif-strong-emphasized-font-style)
632
+ );
633
+ font-weight: var(
634
+ --mod-body-sans-serif-strong-emphasized-font-weight,
635
+ var(--spectrum-body-sans-serif-strong-emphasized-font-weight)
636
+ );
637
+ }
638
+
639
+ .spectrum-Body:lang(ja),
640
+ .spectrum-Body:lang(ko),
641
+ .spectrum-Body:lang(zh) {
642
+ font-family: var(
643
+ --mod-body-cjk-font-family,
644
+ var(--spectrum-body-cjk-font-family)
645
+ );
646
+ font-style: var(
647
+ --mod-body-cjk-font-style,
648
+ var(--spectrum-body-cjk-font-style)
649
+ );
650
+ font-weight: var(
651
+ --mod-body-cjk-font-weight,
652
+ var(--spectrum-body-cjk-font-weight)
653
+ );
654
+ line-height: var(
655
+ --mod-body-cjk-line-height,
656
+ var(--spectrum-body-cjk-line-height)
657
+ );
658
+ letter-spacing: var(
659
+ --mod-body-cjk-letter-spacing,
660
+ var(--spectrum-body-cjk-letter-spacing)
661
+ );
662
+ }
663
+
664
+ .spectrum-Body:lang(ja) .spectrum-Body-strong,
665
+ .spectrum-Body:lang(ja) strong,
666
+ .spectrum-Body:lang(ko) .spectrum-Body-strong,
667
+ .spectrum-Body:lang(ko) strong,
668
+ .spectrum-Body:lang(zh) .spectrum-Body-strong,
669
+ .spectrum-Body:lang(zh) strong {
670
+ font-style: var(
671
+ --mod-body-cjk-strong-font-style,
672
+ var(--spectrum-body-cjk-strong-font-style)
673
+ );
674
+ font-weight: var(
675
+ --mod-body-cjk-strong-font-weight,
676
+ var(--spectrum-body-cjk-strong-font-weight)
677
+ );
678
+ }
679
+
680
+ .spectrum-Body:lang(ja) .spectrum-Body-emphasized,
681
+ .spectrum-Body:lang(ja) em,
682
+ .spectrum-Body:lang(ko) .spectrum-Body-emphasized,
683
+ .spectrum-Body:lang(ko) em,
684
+ .spectrum-Body:lang(zh) .spectrum-Body-emphasized,
685
+ .spectrum-Body:lang(zh) em {
686
+ font-style: var(
687
+ --mod-body-cjk-emphasized-font-style,
688
+ var(--spectrum-body-cjk-emphasized-font-style)
689
+ );
690
+ font-weight: var(
691
+ --mod-body-cjk-emphasized-font-weight,
692
+ var(--spectrum-body-cjk-emphasized-font-weight)
693
+ );
694
+ }
695
+
696
+ .spectrum-Body:lang(ja) .spectrum-Body-strong.spectrum-Body-emphasized,
697
+ .spectrum-Body:lang(ja) em strong,
698
+ .spectrum-Body:lang(ja) strong em,
699
+ .spectrum-Body:lang(ko) .spectrum-Body-strong.spectrum-Body-emphasized,
700
+ .spectrum-Body:lang(ko) em strong,
701
+ .spectrum-Body:lang(ko) strong em,
702
+ .spectrum-Body:lang(zh) .spectrum-Body-strong.spectrum-Body-emphasized,
703
+ .spectrum-Body:lang(zh) em strong,
704
+ .spectrum-Body:lang(zh) strong em {
705
+ font-style: var(
706
+ --mod-body-cjk-strong-emphasized-font-style,
707
+ var(--spectrum-body-cjk-strong-emphasized-font-style)
708
+ );
709
+ font-weight: var(
710
+ --mod-body-cjk-strong-emphasized-font-weight,
711
+ var(--spectrum-body-cjk-strong-emphasized-font-weight)
712
+ );
713
+ }
714
+
715
+ .spectrum-Body--serif {
716
+ font-family: var(
717
+ --mod-body-serif-font-family,
718
+ var(--spectrum-body-serif-font-family)
719
+ );
720
+ font-weight: var(
721
+ --mod-body-serif-font-weight,
722
+ var(--spectrum-body-serif-font-weight)
723
+ );
724
+ font-style: var(
725
+ --mod-body-serif-font-style,
726
+ var(--spectrum-body-serif-font-style)
727
+ );
728
+ }
729
+
730
+ .spectrum-Body--serif .spectrum-Body-strong,
731
+ .spectrum-Body--serif strong {
732
+ font-style: var(
733
+ --mod-body-serif-strong-font-style,
734
+ var(--spectrum-body-serif-strong-font-style)
735
+ );
736
+ font-weight: var(
737
+ --mod-body-serif-strong-font-weight,
738
+ var(--spectrum-body-serif-strong-font-weight)
739
+ );
740
+ }
741
+
742
+ .spectrum-Body--serif .spectrum-Body-emphasized,
743
+ .spectrum-Body--serif em {
744
+ font-style: var(
745
+ --mod-body-serif-emphasized-font-style,
746
+ var(--spectrum-body-serif-emphasized-font-style)
747
+ );
748
+ font-weight: var(
749
+ --mod-body-serif-emphasized-font-weight,
750
+ var(--spectrum-body-serif-emphasized-font-weight)
751
+ );
752
+ }
753
+
754
+ .spectrum-Body--serif .spectrum-Body-strong.spectrum-Body-emphasized,
755
+ .spectrum-Body--serif em strong,
756
+ .spectrum-Body--serif strong em {
757
+ font-style: var(
758
+ --mod-body-serif-strong-emphasized-font-style,
759
+ var(--spectrum-body-serif-strong-emphasized-font-style)
760
+ );
761
+ font-weight: var(
762
+ --mod-body-serif-strong-emphasized-font-weight,
763
+ var(--spectrum-body-serif-strong-emphasized-font-weight)
764
+ );
765
+ }
766
+
767
+ .spectrum-Detail {
768
+ font-family: var(
769
+ --mod-detail-sans-serif-font-family,
770
+ var(--spectrum-detail-sans-serif-font-family)
771
+ );
772
+ font-style: var(
773
+ --mod-detail-sans-serif-font-style,
774
+ var(--spectrum-detail-sans-serif-font-style)
775
+ );
776
+ font-weight: var(
777
+ --mod-detail-sans-serif-font-weight,
778
+ var(--spectrum-detail-sans-serif-font-weight)
779
+ );
780
+ font-size: var(--mod-detail-font-size, var(--spectrum-detail-font-size));
781
+ color: var(
782
+ --highcontrast-detail-font-color,
783
+ var(--mod-detail-font-color, var(--spectrum-detail-font-color))
784
+ );
785
+ line-height: var(
786
+ --mod-detail-line-height,
787
+ var(--spectrum-detail-line-height)
788
+ );
789
+ letter-spacing: var(
790
+ --mod-detail-letter-spacing,
791
+ var(--spectrum-detail-letter-spacing)
792
+ );
793
+ text-transform: uppercase;
794
+ margin-block-start: var(
795
+ --mod-detail-margin-start,
796
+ var(--spectrum-detail-margin-start, 0)
797
+ );
798
+ margin-block-end: var(
799
+ --mod-detail-margin-end,
800
+ var(--spectrum-detail-margin-end, 0)
801
+ );
802
+ }
803
+
804
+ .spectrum-Detail .spectrum-Detail-strong,
805
+ .spectrum-Detail strong {
806
+ font-style: var(
807
+ --mod-detail-sans-serif-strong-font-style,
808
+ var(--spectrum-detail-sans-serif-strong-font-style)
809
+ );
810
+ font-weight: var(
811
+ --mod-detail-sans-serif-strong-font-weight,
812
+ var(--spectrum-detail-sans-serif-strong-font-weight)
813
+ );
814
+ }
815
+
816
+ .spectrum-Detail .spectrum-Detail-emphasized,
817
+ .spectrum-Detail em {
818
+ font-style: var(
819
+ --mod-detail-sans-serif-emphasized-font-style,
820
+ var(--spectrum-detail-sans-serif-emphasized-font-style)
821
+ );
822
+ font-weight: var(
823
+ --mod-detail-sans-serif-emphasized-font-weight,
824
+ var(--spectrum-detail-sans-serif-emphasized-font-weight)
825
+ );
826
+ }
827
+
828
+ .spectrum-Detail .spectrum-Detail-strong.spectrum-Detail-emphasized,
829
+ .spectrum-Detail em strong,
830
+ .spectrum-Detail strong em {
831
+ font-style: var(
832
+ --mod-detail-sans-serif-strong-emphasized-font-style,
833
+ var(--spectrum-detail-sans-serif-strong-emphasized-font-style)
834
+ );
835
+ font-weight: var(
836
+ --mod-detail-sans-serif-strong-emphasized-font-weight,
837
+ var(--spectrum-detail-sans-serif-strong-emphasized-font-weight)
838
+ );
839
+ }
840
+
841
+ .spectrum-Detail:lang(ja),
842
+ .spectrum-Detail:lang(ko),
843
+ .spectrum-Detail:lang(zh) {
844
+ font-family: var(
845
+ --mod-detail-cjk-font-family,
846
+ var(--spectrum-detail-cjk-font-family)
847
+ );
848
+ font-style: var(
849
+ --mod-detail-cjk-font-style,
850
+ var(--spectrum-detail-cjk-font-style)
851
+ );
852
+ font-weight: var(
853
+ --mod-detail-cjk-font-weight,
854
+ var(--spectrum-detail-cjk-font-weight)
855
+ );
856
+ line-height: var(
857
+ --mod-detail-cjk-line-height,
858
+ var(--spectrum-detail-cjk-line-height)
859
+ );
860
+ }
861
+
862
+ .spectrum-Detail:lang(ja) .spectrum-Detail-strong,
863
+ .spectrum-Detail:lang(ja) strong,
864
+ .spectrum-Detail:lang(ko) .spectrum-Detail-strong,
865
+ .spectrum-Detail:lang(ko) strong,
866
+ .spectrum-Detail:lang(zh) .spectrum-Detail-strong,
867
+ .spectrum-Detail:lang(zh) strong {
868
+ font-style: var(
869
+ --mod-detail-cjk-strong-font-style,
870
+ var(--spectrum-detail-cjk-strong-font-style)
871
+ );
872
+ font-weight: var(
873
+ --mod-detail-cjk-strong-font-weight,
874
+ var(--spectrum-detail-cjk-strong-font-weight)
875
+ );
876
+ }
877
+
878
+ .spectrum-Detail:lang(ja) .spectrum-Detail-emphasized,
879
+ .spectrum-Detail:lang(ja) em,
880
+ .spectrum-Detail:lang(ko) .spectrum-Detail-emphasized,
881
+ .spectrum-Detail:lang(ko) em,
882
+ .spectrum-Detail:lang(zh) .spectrum-Detail-emphasized,
883
+ .spectrum-Detail:lang(zh) em {
884
+ font-style: var(
885
+ --mod-detail-cjk-emphasized-font-style,
886
+ var(--spectrum-detail-cjk-emphasized-font-style)
887
+ );
888
+ font-weight: var(
889
+ --mod-detail-cjk-emphasized-font-weight,
890
+ var(--spectrum-detail-cjk-emphasized-font-weight)
891
+ );
892
+ }
893
+
894
+ .spectrum-Detail:lang(ja) .spectrum-Detail-strong.spectrum-Detail-emphasized,
895
+ .spectrum-Detail:lang(ja) em strong,
896
+ .spectrum-Detail:lang(ja) strong em,
897
+ .spectrum-Detail:lang(ko) .spectrum-Detail-strong.spectrum-Detail-emphasized,
898
+ .spectrum-Detail:lang(ko) em strong,
899
+ .spectrum-Detail:lang(ko) strong em,
900
+ .spectrum-Detail:lang(zh) .spectrum-Detail-strong.spectrum-Detail-emphasized,
901
+ .spectrum-Detail:lang(zh) em strong,
902
+ .spectrum-Detail:lang(zh) strong em {
903
+ font-style: var(
904
+ --mod-detail-cjk-strong-emphasized-font-style,
905
+ var(--spectrum-detail-cjk-strong-emphasized-font-style)
906
+ );
907
+ font-weight: var(
908
+ --mod-detail-cjk-strong-emphasized-font-weight,
909
+ var(--spectrum-detail-cjk-strong-emphasized-font-weight)
910
+ );
911
+ }
912
+
913
+ .spectrum-Detail--serif {
914
+ font-family: var(
915
+ --mod-detail-serif-font-family,
916
+ var(--spectrum-detail-serif-font-family)
917
+ );
918
+ font-style: var(
919
+ --mod-detail-serif-font-style,
920
+ var(--spectrum-detail-serif-font-style)
921
+ );
922
+ font-weight: var(
923
+ --mod-detail-serif-font-weight,
924
+ var(--spectrum-detail-serif-font-weight)
925
+ );
926
+ }
927
+
928
+ .spectrum-Detail--serif .spectrum-Detail-strong,
929
+ .spectrum-Detail--serif strong {
930
+ font-style: var(
931
+ --mod-detail-serif-strong-font-style,
932
+ var(--spectrum-detail-serif-strong-font-style)
933
+ );
934
+ font-weight: var(
935
+ --mod-detail-serif-strong-font-weight,
936
+ var(--spectrum-detail-serif-strong-font-weight)
937
+ );
938
+ }
939
+
940
+ .spectrum-Detail--serif .spectrum-Detail-emphasized,
941
+ .spectrum-Detail--serif em {
942
+ font-style: var(
943
+ --mod-detail-serif-emphasized-font-style,
944
+ var(--spectrum-detail-serif-emphasized-font-style)
945
+ );
946
+ font-weight: var(
947
+ --mod-detail-serif-emphasized-font-weight,
948
+ var(--spectrum-detail-serif-emphasized-font-weight)
949
+ );
950
+ }
951
+
952
+ .spectrum-Detail--serif .spectrum-Detail-strong.spectrum-Detail-emphasized,
953
+ .spectrum-Detail--serif em strong,
954
+ .spectrum-Detail--serif strong em {
955
+ font-style: var(
956
+ --mod-detail-serif-strong-emphasized-font-style,
957
+ var(--spectrum-detail-serif-strong-emphasized-font-style)
958
+ );
959
+ font-weight: var(
960
+ --mod-detail-serif-strong-emphasized-font-weight,
961
+ var(--spectrum-detail-serif-strong-emphasized-font-weight)
962
+ );
963
+ }
964
+
965
+ .spectrum-Detail--light {
966
+ font-style: var(
967
+ --mod-detail-sans-serif-light-font-style,
968
+ var(--spectrum-detail-sans-serif-light-font-style)
969
+ );
970
+ font-weight: var(
971
+ --spectrum-detail-sans-serif-light-font-weight,
972
+ var(--spectrum-detail-sans-serif-light-font-weight)
973
+ );
974
+ }
975
+
976
+ .spectrum-Detail--light .spectrum-Detail-strong,
977
+ .spectrum-Detail--light strong {
978
+ font-style: var(
979
+ --mod-detail-sans-serif-light-strong-font-style,
980
+ var(--spectrum-detail-sans-serif-light-strong-font-style)
981
+ );
982
+ font-weight: var(
983
+ --mod-detail-sans-serif-light-strong-font-weight,
984
+ var(--spectrum-detail-sans-serif-light-strong-font-weight)
985
+ );
986
+ }
987
+
988
+ .spectrum-Detail--light .spectrum-Detail-emphasized,
989
+ .spectrum-Detail--light em {
990
+ font-style: var(
991
+ --mod-detail-sans-serif-light-emphasized-font-style,
992
+ var(--spectrum-detail-sans-serif-light-emphasized-font-style)
993
+ );
994
+ font-weight: var(
995
+ --mod-detail-sans-serif-light-emphasized-font-weight,
996
+ var(--spectrum-detail-sans-serif-light-emphasized-font-weight)
997
+ );
998
+ }
999
+
1000
+ .spectrum-Detail--light .spectrum-Detail-strong.spectrum-Body-emphasized,
1001
+ .spectrum-Detail--light em strong,
1002
+ .spectrum-Detail--light strong em {
1003
+ font-style: var(
1004
+ --mod-detail-sans-serif-light-strong-emphasized-font-style,
1005
+ var(--spectrum-detail-sans-serif-light-strong-emphasized-font-style)
1006
+ );
1007
+ font-weight: var(
1008
+ --mod-detail-sans-serif-light-strong-emphasized-font-weight,
1009
+ var(--spectrum-detail-sans-serif-light-strong-emphasized-font-weight)
1010
+ );
1011
+ }
1012
+
1013
+ .spectrum-Detail--light:lang(ja),
1014
+ .spectrum-Detail--light:lang(ko),
1015
+ .spectrum-Detail--light:lang(zh) {
1016
+ font-style: var(
1017
+ --mod-detail-cjk-light-font-style,
1018
+ var(--spectrum-detail-cjk-light-font-style)
1019
+ );
1020
+ font-weight: var(
1021
+ --mod-detail-cjk-light-font-weight,
1022
+ var(--spectrum-detail-cjk-light-font-weight)
1023
+ );
1024
+ }
1025
+
1026
+ .spectrum-Detail--light:lang(ja) .spectrum-Detail-strong,
1027
+ .spectrum-Detail--light:lang(ja) strong,
1028
+ .spectrum-Detail--light:lang(ko) .spectrum-Detail-strong,
1029
+ .spectrum-Detail--light:lang(ko) strong,
1030
+ .spectrum-Detail--light:lang(zh) .spectrum-Detail-strong,
1031
+ .spectrum-Detail--light:lang(zh) strong {
1032
+ font-style: var(
1033
+ --mod-detail-cjk-light-strong-font-style,
1034
+ var(--spectrum-detail-cjk-light-strong-font-style)
1035
+ );
1036
+ font-weight: var(
1037
+ --mod-detail-cjk-light-strong-font-weight,
1038
+ var(--spectrum-detail-cjk-light-strong-font-weight)
1039
+ );
1040
+ }
1041
+
1042
+ .spectrum-Detail--light:lang(ja) .spectrum-Detail-emphasized,
1043
+ .spectrum-Detail--light:lang(ja) em,
1044
+ .spectrum-Detail--light:lang(ko) .spectrum-Detail-emphasized,
1045
+ .spectrum-Detail--light:lang(ko) em,
1046
+ .spectrum-Detail--light:lang(zh) .spectrum-Detail-emphasized,
1047
+ .spectrum-Detail--light:lang(zh) em {
1048
+ font-style: var(
1049
+ --mod-detail-cjk-light-emphasized-font-style,
1050
+ var(--spectrum-detail-cjk-light-emphasized-font-style)
1051
+ );
1052
+ font-weight: var(
1053
+ --mod-detail-cjk-light-emphasized-font-weight,
1054
+ var(--spectrum-detail-cjk-light-emphasized-font-weight)
1055
+ );
1056
+ }
1057
+
1058
+ .spectrum-Detail--light:lang(ja)
1059
+ .spectrum-Detail-strong.spectrum-Detail-emphasized,
1060
+ .spectrum-Detail--light:lang(ko)
1061
+ .spectrum-Detail-strong.spectrum-Detail-emphasized,
1062
+ .spectrum-Detail--light:lang(zh)
1063
+ .spectrum-Detail-strong.spectrum-Detail-emphasized {
1064
+ font-style: var(
1065
+ --mod-detail-cjk-light-strong-emphasized-font-style,
1066
+ var(--spectrum-detail-cjk-light-strong-emphasized-font-style)
1067
+ );
1068
+ font-weight: var(
1069
+ --mod-detail-cjk-light-strong-emphasized-font-weight,
1070
+ var(--spectrum-detail-cjk-light-strong-emphasized-font-weight)
1071
+ );
1072
+ }
1073
+
1074
+ .spectrum-Detail--serif.spectrum-Detail--light {
1075
+ font-style: var(
1076
+ --mod-detail-serif-light-font-style,
1077
+ var(--spectrum-detail-serif-light-font-style)
1078
+ );
1079
+ font-weight: var(
1080
+ --mod-detail-serif-light-font-weight,
1081
+ var(--spectrum-detail-serif-light-font-weight)
1082
+ );
1083
+ }
1084
+
1085
+ .spectrum-Detail--serif.spectrum-Detail--light .spectrum-Detail-strong,
1086
+ .spectrum-Detail--serif.spectrum-Detail--light strong {
1087
+ font-style: var(
1088
+ --mod-detail-serif-light-strong-font-style,
1089
+ var(--spectrum-detail-serif-light-strong-font-style)
1090
+ );
1091
+ font-weight: var(
1092
+ --mod-detail-serif-light-strong-font-weight,
1093
+ var(--spectrum-detail-serif-light-strong-font-weight)
1094
+ );
1095
+ }
1096
+
1097
+ .spectrum-Detail--serif.spectrum-Detail--light .spectrum-Detail-emphasized,
1098
+ .spectrum-Detail--serif.spectrum-Detail--light em {
1099
+ font-style: var(
1100
+ --mod-detail-serif-light-emphasized-font-style,
1101
+ var(--spectrum-detail-serif-light-emphasized-font-style)
1102
+ );
1103
+ font-weight: var(
1104
+ --mod-detail-serif-light-emphasized-font-weight,
1105
+ var(--spectrum-detail-serif-light-emphasized-font-weight)
1106
+ );
1107
+ }
1108
+
1109
+ .spectrum-Detail--serif.spectrum-Detail--light
1110
+ .spectrum-Detail-strong.spectrum-Body-emphasized,
1111
+ .spectrum-Detail--serif.spectrum-Detail--light em strong,
1112
+ .spectrum-Detail--serif.spectrum-Detail--light strong em {
1113
+ font-style: var(
1114
+ --mod-detail-serif-light-strong-emphasized-font-style,
1115
+ var(--spectrum-detail-serif-light-strong-emphasized-font-style)
1116
+ );
1117
+ font-weight: var(
1118
+ --mod-detail-serif-light-strong-emphasized-font-weight,
1119
+ var(--spectrum-detail-serif-light-strong-emphasized-font-weight)
1120
+ );
1121
+ }
1122
+
1123
+ .spectrum-Code {
1124
+ font-family: var(--mod-code-font-family, var(--spectrum-code-font-family));
1125
+ font-style: var(--mod-code-font-style, var(--spectrum-code-font-style));
1126
+ font-weight: var(--mod-code-font-weight, var(--spectrum-code-font-weight));
1127
+ font-size: var(--mod-code-font-size, var(--spectrum-code-font-size));
1128
+ line-height: var(--mod-code-line-height, var(--spectrum-code-line-height));
1129
+ color: var(
1130
+ --highcontrast-code-font-color,
1131
+ var(--mod-code-font-color, var(--spectrum-code-font-color))
1132
+ );
1133
+ margin-block-start: var(
1134
+ --mod-code-margin-start,
1135
+ var(--spectrum-code-margin-end, 0)
1136
+ );
1137
+ margin-block-end: var(
1138
+ --mod-code-margin-end,
1139
+ var(--spectrum-code-margin-end, 0)
1140
+ );
1141
+ }
1142
+
1143
+ .spectrum-Code .spectrum-Code-strong,
1144
+ .spectrum-Code strong {
1145
+ font-style: var(
1146
+ --mod-code-strong-font-style,
1147
+ var(--spectrum-code-strong-font-style)
1148
+ );
1149
+ font-weight: var(
1150
+ --mod-code-strong-font-weight,
1151
+ var(--spectrum-code-strong-font-weight)
1152
+ );
1153
+ }
1154
+
1155
+ .spectrum-Code .spectrum-Code-emphasized,
1156
+ .spectrum-Code em {
1157
+ font-style: var(
1158
+ --mod-code-emphasized-font-style,
1159
+ var(--spectrum-code-emphasized-font-style)
1160
+ );
1161
+ font-weight: var(
1162
+ --mod-code-emphasized-font-weight,
1163
+ var(--spectrum-code-emphasized-font-weight)
1164
+ );
1165
+ }
1166
+
1167
+ .spectrum-Code .spectrum-Code-strong.spectrum-Code-emphasized,
1168
+ .spectrum-Code em strong,
1169
+ .spectrum-Code strong em {
1170
+ font-style: var(
1171
+ --mod-code-strong-emphasized-font-style,
1172
+ var(--spectrum-code-strong-emphasized-font-style)
1173
+ );
1174
+ font-weight: var(
1175
+ --mod-code-strong-emphasized-font-weight,
1176
+ var(--spectrum-code-strong-emphasized-font-weight)
1177
+ );
1178
+ }
1179
+
1180
+ .spectrum-Code:lang(ja),
1181
+ .spectrum-Code:lang(ko),
1182
+ .spectrum-Code:lang(zh) {
1183
+ font-family: var(
1184
+ --mod-code-cjk-font-family,
1185
+ var(--spectrum-code-cjk-font-family)
1186
+ );
1187
+ font-style: var(
1188
+ --mod-code-cjk-font-style,
1189
+ var(--spectrum-code-cjk-font-style)
1190
+ );
1191
+ font-weight: var(
1192
+ --mod-code-cjk-font-weight,
1193
+ var(--spectrum-code-cjk-font-weight)
1194
+ );
1195
+ line-height: var(
1196
+ --mod-code-cjk-line-height,
1197
+ var(--spectrum-code-cjk-line-height)
1198
+ );
1199
+ letter-spacing: var(
1200
+ --mod-code-cjk-letter-spacing,
1201
+ var(--spectrum-code-cjk-letter-spacing)
1202
+ );
1203
+ }
1204
+
1205
+ .spectrum-Code:lang(ja) .spectrum-Code-strong,
1206
+ .spectrum-Code:lang(ja) strong,
1207
+ .spectrum-Code:lang(ko) .spectrum-Code-strong,
1208
+ .spectrum-Code:lang(ko) strong,
1209
+ .spectrum-Code:lang(zh) .spectrum-Code-strong,
1210
+ .spectrum-Code:lang(zh) strong {
1211
+ font-style: var(
1212
+ --mod-code-cjk-strong-font-style,
1213
+ var(--spectrum-code-cjk-strong-font-style)
1214
+ );
1215
+ font-weight: var(
1216
+ --mod-code-cjk-strong-font-weight,
1217
+ var(--spectrum-code-cjk-strong-font-weight)
1218
+ );
1219
+ }
1220
+
1221
+ .spectrum-Code:lang(ja) .spectrum-Code-emphasized,
1222
+ .spectrum-Code:lang(ja) em,
1223
+ .spectrum-Code:lang(ko) .spectrum-Code-emphasized,
1224
+ .spectrum-Code:lang(ko) em,
1225
+ .spectrum-Code:lang(zh) .spectrum-Code-emphasized,
1226
+ .spectrum-Code:lang(zh) em {
1227
+ font-style: var(
1228
+ --mod-code-cjk-emphasized-font-style,
1229
+ var(--spectrum-code-cjk-emphasized-font-style)
1230
+ );
1231
+ font-weight: var(
1232
+ --mod-code-cjk-emphasized-font-weight,
1233
+ var(--spectrum-code-cjk-emphasized-font-weight)
1234
+ );
1235
+ }
1236
+
1237
+ .spectrum-Code:lang(ja) .spectrum-Code-strong.spectrum-Code-emphasized,
1238
+ .spectrum-Code:lang(ja) em strong,
1239
+ .spectrum-Code:lang(ja) strong em,
1240
+ .spectrum-Code:lang(ko) .spectrum-Code-strong.spectrum-Code-emphasized,
1241
+ .spectrum-Code:lang(ko) em strong,
1242
+ .spectrum-Code:lang(ko) strong em,
1243
+ .spectrum-Code:lang(zh) .spectrum-Code-strong.spectrum-Code-emphasized,
1244
+ .spectrum-Code:lang(zh) em strong,
1245
+ .spectrum-Code:lang(zh) strong em {
1246
+ font-style: var(
1247
+ --mod-code-cjk-strong-emphasized-font-style,
1248
+ var(--spectrum-code-cjk-strong-emphasized-font-style)
1249
+ );
1250
+ font-weight: var(
1251
+ --mod-code-cjk-strong-emphasized-font-weight,
1252
+ var(--spectrum-code-cjk-strong-emphasized-font-weight)
1253
+ );
1254
+ }
1255
+
1256
+ .spectrum-Heading {
1257
+ --spectrum-heading-sans-serif-font-family: var(
1258
+ --system-heading-sans-serif-font-family
1259
+ );
1260
+ --spectrum-heading-serif-font-family: var(
1261
+ --system-heading-serif-font-family
1262
+ );
1263
+ --spectrum-heading-cjk-font-family: var(--system-heading-cjk-font-family);
1264
+ --spectrum-heading-cjk-letter-spacing: var(
1265
+ --system-heading-cjk-letter-spacing
1266
+ );
1267
+ --spectrum-heading-font-color: var(--system-heading-font-color);
1268
+ --spectrum-heading-font-size: var(--system-heading-font-size);
1269
+ --spectrum-heading-cjk-font-size: var(--system-heading-cjk-font-size);
1270
+ }
1271
+
1272
+ .spectrum-Heading--sizeXXS {
1273
+ --spectrum-heading-font-size: var(--system-heading-size-xxs-font-size);
1274
+ --spectrum-heading-cjk-font-size: var(
1275
+ --system-heading-size-xxs-cjk-font-size
1276
+ );
1277
+ }
1278
+
1279
+ .spectrum-Heading--sizeXS {
1280
+ --spectrum-heading-font-size: var(--system-heading-size-xs-font-size);
1281
+ --spectrum-heading-cjk-font-size: var(
1282
+ --system-heading-size-xs-cjk-font-size
1283
+ );
1284
+ }
1285
+
1286
+ .spectrum-Heading--sizeS {
1287
+ --spectrum-heading-font-size: var(--system-heading-size-s-font-size);
1288
+ --spectrum-heading-cjk-font-size: var(
1289
+ --system-heading-size-s-cjk-font-size
1290
+ );
1291
+ }
1292
+
1293
+ .spectrum-Heading--sizeM {
1294
+ --spectrum-heading-font-size: var(--system-heading-size-m-font-size);
1295
+ --spectrum-heading-cjk-font-size: var(
1296
+ --system-heading-size-m-cjk-font-size
1297
+ );
1298
+ }
1299
+
1300
+ .spectrum-Heading--sizeL {
1301
+ --spectrum-heading-font-size: var(--system-heading-size-l-font-size);
1302
+ --spectrum-heading-cjk-font-size: var(
1303
+ --system-heading-size-l-cjk-font-size
1304
+ );
1305
+ }
1306
+
1307
+ .spectrum-Heading--sizeXL {
1308
+ --spectrum-heading-font-size: var(--system-heading-size-xl-font-size);
1309
+ --spectrum-heading-cjk-font-size: var(
1310
+ --system-heading-size-xl-cjk-font-size
1311
+ );
1312
+ }
1313
+
1314
+ .spectrum-Heading--sizeXXL {
1315
+ --spectrum-heading-font-size: var(--system-heading-size-xxl-font-size);
1316
+ --spectrum-heading-cjk-font-size: var(
1317
+ --system-heading-size-xxl-cjk-font-size
1318
+ );
1319
+ }
1320
+
1321
+ .spectrum-Heading--sizeXXXL {
1322
+ --spectrum-heading-font-size: var(--system-heading-size-xxxl-font-size);
1323
+ --spectrum-heading-cjk-font-size: var(
1324
+ --system-heading-size-xxxl-cjk-font-size
1325
+ );
1326
+ }
1327
+
1328
+ .spectrum-Body {
1329
+ --spectrum-body-sans-serif-font-family: var(
1330
+ --system-body-sans-serif-font-family
1331
+ );
1332
+ --spectrum-body-serif-font-family: var(--system-body-serif-font-family);
1333
+ --spectrum-body-cjk-font-family: var(--system-body-cjk-font-family);
1334
+ --spectrum-body-cjk-letter-spacing: var(--system-body-cjk-letter-spacing);
1335
+ --spectrum-body-font-color: var(--system-body-font-color);
1336
+ --spectrum-body-font-size: var(--system-body-font-size);
1337
+ }
1338
+
1339
+ .spectrum-Body--sizeXS {
1340
+ --spectrum-body-font-size: var(--system-body-size-xs-font-size);
1341
+ }
1342
+
1343
+ .spectrum-Body--sizeS {
1344
+ --spectrum-body-font-size: var(--system-body-size-s-font-size);
1345
+ }
1346
+
1347
+ .spectrum-Body--sizeM {
1348
+ --spectrum-body-font-size: var(--system-body-size-m-font-size);
1349
+ }
1350
+
1351
+ .spectrum-Body--sizeL {
1352
+ --spectrum-body-font-size: var(--system-body-size-l-font-size);
1353
+ }
1354
+
1355
+ .spectrum-Body--sizeXL {
1356
+ --spectrum-body-font-size: var(--system-body-size-xl-font-size);
1357
+ }
1358
+
1359
+ .spectrum-Body--sizeXXL {
1360
+ --spectrum-body-font-size: var(--system-body-size-xxl-font-size);
1361
+ }
1362
+
1363
+ .spectrum-Body--sizeXXXL {
1364
+ --spectrum-body-font-size: var(--system-body-size-xxxl-font-size);
1365
+ }
1366
+
1367
+ .spectrum-Detail {
1368
+ --spectrum-detail-sans-serif-font-family: var(
1369
+ --system-detail-sans-serif-font-family
1370
+ );
1371
+ --spectrum-detail-serif-font-family: var(--system-detail-serif-font-family);
1372
+ --spectrum-detail-cjk-font-family: var(--system-detail-cjk-font-family);
1373
+ --spectrum-detail-font-color: var(--system-detail-font-color);
1374
+ --spectrum-detail-font-size: var(--system-detail-font-size);
1375
+ }
1376
+
1377
+ .spectrum-Detail--sizeS {
1378
+ --spectrum-detail-font-size: var(--system-detail-size-s-font-size);
1379
+ }
1380
+
1381
+ .spectrum-Detail--sizeM {
1382
+ --spectrum-detail-font-size: var(--system-detail-size-m-font-size);
1383
+ }
1384
+
1385
+ .spectrum-Detail--sizeL {
1386
+ --spectrum-detail-font-size: var(--system-detail-size-l-font-size);
1387
+ }
1388
+
1389
+ .spectrum-Detail--sizeXL {
1390
+ --spectrum-detail-font-size: var(--system-detail-size-xl-font-size);
1391
+ }
1392
+
1393
+ .spectrum-Code {
1394
+ --spectrum-code-font-family: var(--system-code-font-family);
1395
+ --spectrum-code-cjk-letter-spacing: var(--system-code-cjk-letter-spacing);
1396
+ --spectrum-code-font-color: var(--system-code-font-color);
1397
+ --spectrum-code-font-size: var(--system-code-font-size);
1398
+ }
1399
+
1400
+ .spectrum-Code--sizeXS {
1401
+ --spectrum-code-font-size: var(--system-code-size-xs-font-size);
1402
+ }
1403
+
1404
+ .spectrum-Code--sizeS {
1405
+ --spectrum-code-font-size: var(--system-code-size-s-font-size);
1406
+ }
1407
+
1408
+ .spectrum-Code--sizeM {
1409
+ --spectrum-code-font-size: var(--system-code-size-m-font-size);
1410
+ }
1411
+
1412
+ .spectrum-Code--sizeL {
1413
+ --spectrum-code-font-size: var(--system-code-size-l-font-size);
1414
+ }
1415
+
1416
+ .spectrum-Code--sizeXL {
1417
+ --spectrum-code-font-size: var(--system-code-size-xl-font-size);
1418
+ }