@digigov/theme-govgr 2.0.0-rc.21

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 (5) hide show
  1. package/dist/colors.css +572 -0
  2. package/dist/index.css +1586 -0
  3. package/dist/index.js +1 -0
  4. package/dist/variables.css +1014 -0
  5. package/package.json +47 -0
package/dist/variables.css ADDED
@@ -0,0 +1,1014 @@
1
+ :root {
2
+ --text-sm-default: 0.875rem;
3
+ --text-base-default: 1rem;
4
+ --text-lg-default: 1.1875rem;
5
+ --text-xl-default: 1.25rem;
6
+ --text-2xl-default: 1.5rem;
7
+ --text-3xl-default: 1.875rem;
8
+ --text-4xl-default: 2.25rem;
9
+ --text-5xl-default: 3rem;
10
+
11
+ --text-sm-large: 1rem;
12
+ --text-base-large: 1.25rem;
13
+ --text-lg-large: 1.4rem;
14
+ --text-xl-large: 1.6rem;
15
+ --text-2xl-large: 1.875rem;
16
+ --text-3xl-large: 2.25rem;
17
+ --text-4xl-large: 2.5rem;
18
+ --text-5xl-large: 3rem;
19
+
20
+ --text-sm: var(--text-sm-default);
21
+ --text-base: var(--text-base-default);
22
+ --text-lg: var(--text-lg-default);
23
+ --text-xl: var(--text-xl-default);
24
+ --text-2xl: var(--text-2xl-default);
25
+ --text-3xl: var(--text-3xl-default);
26
+ --text-4xl: var(--text-4xl-default);
27
+ --text-5xl: var(--text-5xl-default);
28
+
29
+ --line-h-sm-default: 1.375;
30
+ --line-h-base-default: 1.375;
31
+ --line-h-lg-default: 1.375;
32
+ --line-h-xl-default: 1.25;
33
+ --line-h-2xl-default: 1.25;
34
+ --line-h-3xl-default: 1.25;
35
+ --line-h-4xl-default: 1.25;
36
+ --line-h-5xl-default: 1.25;
37
+
38
+ --line-h-sm-large: 2;
39
+ --line-h-base-large: 2;
40
+ --line-h-lg-large: 2;
41
+ --line-h-xl-large: 1.75;
42
+ --line-h-2xl-large: 1.75;
43
+ --line-h-3xl-large: 1.5;
44
+ --line-h-4xl-large: 1.5;
45
+ --line-h-5xl-large: 1.25;
46
+
47
+ --line-h-sm: var(--line-h-sm-default);
48
+ --line-h-base: var(--line-h-base-default);
49
+ --line-h-lg: var(--line-h-lg-default);
50
+ --line-h-xl: var(--line-h-xl-default);
51
+ --line-h-2xl: var(--line-h-2xl-default);
52
+ --line-h-3xl: var(--line-h-3xl-default);
53
+ --line-h-4xl: var(--line-h-4xl-default);
54
+ --line-h-5xl: var(--line-h-5xl-default);
55
+
56
+ --letter-spacing-normal-default: normal;
57
+ --letter-spacing-wide-default: 0.025rem;
58
+ --letter-spacing-wider-default: 0.05rem;
59
+ --letter-spacing-widest-default: 0.075rem;
60
+
61
+ --letter-spacing-normal-extra: 0.05rem;
62
+ --letter-spacing-wide-extra: 0.075rem;
63
+ --letter-spacing-wider-extra: 0.01rem;
64
+ --letter-spacing-widest-extra: 0.125rem;
65
+
66
+ --letter-spacing-normal: var(--letter-spacing-normal-default);
67
+ --letter-spacing-wide: var(--letter-spacing-wide-default);
68
+ --letter-spacing-wider: var(--letter-spacing-wider-default);
69
+ --letter-spacing-widest: var(--letter-spacing-widest-default);
70
+
71
+ --border-radius-md: 0px;
72
+ --border-radius-lg: 0px;
73
+
74
+ --color-footer-link: var(--color-link);
75
+ --color-footer-link-hover: var(--color-link-hover);
76
+
77
+ --color-header-text: var(--color-white);
78
+ --color-header-text-hover: var(--color-white);
79
+ }
80
+
81
+ .ds-accordion__section-heading {
82
+ --accordion__section-heading-font-size: var(--text-lg);
83
+ }
84
+
85
+ @media (min-width: 768px) {
86
+
87
+ .ds-accordion__section-heading {
88
+ --accordion__section-heading-font-size: var(--text-xl)
89
+ }
90
+ }
91
+ .ds-accordion__section-summary {
92
+ --accordion__section-summary-background: var(--color-base-100);
93
+ --accordion__section-summary-background-hover: var(--color-base-200);
94
+ }
95
+ .ds-breadcrumbs__list-item {
96
+ --breadcrumbs__list-item-font-size: var(--text-sm);
97
+ }
98
+ @media (min-width: 768px) {
99
+ .ds-breadcrumbs__list-item {
100
+ --breadcrumbs__list-item-font-size: var(--text-base)
101
+ }
102
+ }
103
+ .ds-back-to-top-link {
104
+ --back-to-top-link-color: var(--color-link);
105
+ --back-to-top-link-color-active: var(--color-link-active);
106
+ --back-to-top-link-color-hover: var(--color-link-hover);
107
+ --back-to-top-link-padding: 0px;
108
+ --back-to-top-link-font-size: var(--text-base);
109
+ --back-to-top-link-line-height: var(--line-h-base);
110
+ --back-to-top-link-letter-spacing: var(--letter-spacing-normal);
111
+ }
112
+ @media (min-width: 768px) {
113
+ .ds-back-to-top-link {
114
+ --back-to-top-link-font-size: var(--text-lg);
115
+ --back-to-top-link-line-height: var(--line-h-lg)
116
+ }
117
+ }
118
+ .ds-btn {
119
+ --btn-border-radius: 0px;
120
+ --btn-padding-y: 0.5rem;
121
+ --btn-padding-x: 1.25rem;
122
+ --btn-letter-spacing: var(--letter-spacing-wide);
123
+ --btn-font-size: var(--text-base);
124
+ }
125
+ @media (min-width: 768px) {
126
+ .ds-btn {
127
+ --btn-font-size: var(--text-lg)
128
+ }
129
+ }
130
+ @media print {
131
+ .ds-btn {
132
+ --btn-padding-y: 0.5rem;
133
+ --btn-padding-x: 1rem
134
+ }
135
+ }
136
+ .ds-btn-cta {
137
+ --btn-cta-font-size: var(--text-lg);
138
+ }
139
+ @media (min-width: 768px) {
140
+ .ds-btn-cta {
141
+ --btn-cta-font-size: var(--text-xl)
142
+ }
143
+ }
144
+ .ds-btn-primary {
145
+ --btn-primary-background-color: var(--color-success);
146
+ --btn-primary-color: var(--color-white);
147
+ --btn-primary-background-color-hover: var(--color-success-hover);
148
+ --btn-primary-color-hover: var(--color-white);
149
+ --btn-primary-background-color-active: var(--color-success-hover);
150
+ --btn-primary-box-shadow: 0 2px 0 var(--color-base-content);
151
+ }
152
+ @media print {
153
+ .ds-btn-primary {
154
+ --btn-primary-background-color: var(--color-white);
155
+ --btn-primary-color: var(--color-base-content)
156
+ }
157
+ }
158
+ .ds-btn-secondary {
159
+ --btn-secondary-background-color: var(--color-base-300);
160
+ --btn-secondary-color: var(--color-base-content);
161
+ --btn-secondary-background-color-hover: var(--color-base-400);
162
+ --btn-secondary-color-hover: var(--color-base-content);
163
+ --btn-secondary-background-color-active: var(--color-base-500);
164
+ --btn-secondary-box-shadow: 0 2px 0 var(--color-base-500);
165
+ }
166
+ @media print {
167
+ .ds-btn-secondary {
168
+ --btn-secondary-background-color: var(--color-white);
169
+ --btn-secondary-color: var(--color-base-content)
170
+ }
171
+ }
172
+ .ds-btn-warning {
173
+ --btn-warning-background-color: var(--color-error);
174
+ --btn-warning-color: var(--color-white);
175
+ --btn-warning-background-color-hover: var(--color-error-hover);
176
+ --btn-warning-color-hover: var(--color-white);
177
+ --btn-warning-background-color-active: var(--color-error-hover);
178
+ --btn-warning-box-shadow: 0 2px 0 var(--color-base-content);
179
+ }
180
+ @media print {
181
+ .ds-btn-warning {
182
+ --btn-warning-background-color: var(--color-white);
183
+ --btn-warning-color: var(--color-base-content)
184
+ }
185
+ }
186
+ .ds-card__content {
187
+ --card__content-font-size: var(--text-sm);
188
+ --card__content-line-height: var(--line-h-sm);
189
+ }
190
+ @media (min-width: 768px) {
191
+ .ds-card__content {
192
+ --card__content-font-size: var(--text-base);
193
+ --card__content-line-height: var(--line-h-base)
194
+ }
195
+ }
196
+ .ds-card {
197
+ --card-border-radius: var(--border-radius-lg);
198
+ --card-background-color: var(--color-base-100);
199
+ --card-padding: 0;
200
+ }
201
+ .ds-fieldset__legend {
202
+ --fieldset__legend-margin-bottom: 1rem;
203
+ --fieldset__legend-font-weight: 700;
204
+ --fieldset__legend-letter-spacing: var(--letter-spacing-normal);
205
+ }
206
+ .ds-fieldset__legend--xl {
207
+ --fieldset__legend--xl-font-size: var(--text-3xl);
208
+ --fieldset__legend--xl-line-height: var(--line-h-3xl);
209
+ }
210
+ @media (min-width: 768px) {
211
+ .ds-fieldset__legend--xl {
212
+ --fieldset__legend--xl-font-size: var(--text-5xl);
213
+ --fieldset__legend--xl-line-height: var(--line-h-5xl)
214
+ }
215
+ }
216
+ .ds-fieldset__legend--lg {
217
+ --fieldset__legend--lg-font-size: var(--text-2xl);
218
+ --fieldset__legend--lg-line-height: var(--line-h-2xl);
219
+ }
220
+ @media (min-width: 768px) {
221
+ .ds-fieldset__legend--lg {
222
+ --fieldset__legend--lg-font-size: var(--text-4xl);
223
+ --fieldset__legend--lg-line-height: var(--line-h-4xl)
224
+ }
225
+ }
226
+ .ds-fieldset__legend--md {
227
+ --fieldset__legend--md-font-size: var(--text-xl);
228
+ --fieldset__legend--md-line-height: var(--line-h-xl);
229
+ }
230
+ @media (min-width: 768px) {
231
+ .ds-fieldset__legend--md {
232
+ --fieldset__legend--md-font-size: var(--text-2xl);
233
+ --fieldset__legend--md-line-height: var(--line-h-2xl)
234
+ }
235
+ }
236
+ .ds-fieldset__legend--sm {
237
+ --fieldset__legend--sm-font-size: var(--text-base);
238
+ --fieldset__legend--sm-line-height: var(--line-h-base);
239
+ }
240
+ @media (min-width: 768px) {
241
+ .ds-fieldset__legend--sm {
242
+ --fieldset__legend--sm-font-size: var(--text-lg);
243
+ --fieldset__legend--sm-line-height: var(--line-h-lg)
244
+ }
245
+ }
246
+ .ds-label {
247
+ --label-font-size: var(--text-base);
248
+ --label-line-height: var(--line-h-base);
249
+ --label-letter-spacing: var(--letter-spacing-normal);
250
+ }
251
+ @media (min-width: 768px) {
252
+ .ds-label {
253
+ --label-font-size: var(--text-lg);
254
+ --label-line-height: var(--line-h-lg)
255
+ }
256
+ }
257
+ .ds-label__title {
258
+ --label__title-margin-bottom: 0rem;
259
+ --label__title-font-weight: 700;
260
+ --label__title-letter-spacing: var(--letter-spacing-normal);
261
+ }
262
+ .ds-label__title--xl {
263
+ --label__title--xl-font-size: var(--text-3xl);
264
+ --label__title--xl-line-height: var(--line-h-3xl);
265
+ }
266
+ @media (min-width: 768px) {
267
+ .ds-label__title--xl {
268
+ --label__title--xl-font-size: var(--text-5xl);
269
+ --label__title--xl-line-height: var(--line-h-5xl)
270
+ }
271
+ }
272
+ .ds-label__title--lg {
273
+ --label__title--lg-font-size: var(--text-2xl);
274
+ --label__title--lg-line-height: var(--line-h-2xl);
275
+ }
276
+ @media (min-width: 768px) {
277
+ .ds-label__title--lg {
278
+ --label__title--lg-font-size: var(--text-4xl);
279
+ --label__title--lg-line-height: var(--line-h-4xl)
280
+ }
281
+ }
282
+ .ds-label__title--md {
283
+ --label__title--md-font-size: var(--text-xl);
284
+ --label__title--md-line-height: var(--line-h-xl);
285
+ }
286
+ @media (min-width: 768px) {
287
+ .ds-label__title--md {
288
+ --label__title--md-font-size: var(--text-2xl);
289
+ --label__title--md-line-height: var(--line-h-2xl)
290
+ }
291
+ }
292
+ .ds-label__title--sm {
293
+ --label__title--sm-font-size: var(--text-base);
294
+ --label__title--sm-line-height: var(--line-h-base);
295
+ }
296
+ @media (min-width: 768px) {
297
+ .ds-label__title--sm {
298
+ --label__title--sm-font-size: var(--text-lg);
299
+ --label__title--sm-line-height: var(--line-h-lg)
300
+ }
301
+ }
302
+ .ds-input {
303
+ --input-border-radius: var(--border-radius-md);
304
+ }
305
+ .ds-textarea {
306
+ --textarea-border-radius: var(--border-radius-md);
307
+ }
308
+ .ds-select {
309
+ --select-border-radius: var(--border-radius-md);
310
+ }
311
+ .ds-footer__copyright {
312
+ --footer__copyright-font-size: var(--text-sm);
313
+ }
314
+ @media (min-width: 768px) {
315
+ .ds-footer__copyright {
316
+ --footer__copyright-font-size: var(--text-base)
317
+ }
318
+ }
319
+ .ds-footer {
320
+ --footer-border: solid var(--color-tertiary);
321
+ --footer-border-width: 4px 0 0 0;
322
+ --footer-background-color: var(--color-base-200);
323
+ --footer-color: var(--color-base-800);
324
+ }
325
+ .ds-footer__link {
326
+ --footer__link-text-decoration: underline;
327
+ --footer__link-text-decoration-hover: underline;
328
+ --footer__link-color-hover: var(--link-color-hover);
329
+ --footer__link-color-focus: var(--link-color-active);
330
+ }
331
+ .ds-header {
332
+ --header-border: solid var(--color-tertiary);
333
+ --header-border-width: 0 0 8px 0;
334
+ --header-background: var(--color-primary);
335
+ }
336
+ .ds-header__title {
337
+ --header__title-color: var(--color-header-text);
338
+ --header__title-color-hover: var(--color-header-text-hover);
339
+ }
340
+ .ds-warning-text {
341
+ --warning-text-font-size: var(--text-base);
342
+ }
343
+ @media (min-width: 768px) {
344
+ .ds-warning-text {
345
+ --warning-text-font-size: var(--text-lg)
346
+ }
347
+ }
348
+ .ds-details {
349
+ --details-font-size: var(--text-base);
350
+ --details-line-height: var(--line-h-base);
351
+ }
352
+ @media (min-width: 768px) {
353
+ .ds-details {
354
+ --details-font-size: var(--text-lg);
355
+ --details-line-height: var(--line-h-lg)
356
+ }
357
+ }
358
+ .ds-details__summary {
359
+ --details__summary-font-size: var(--text-base);
360
+ --details__summary-line-height: var(--line-h-base);
361
+ }
362
+ @media (min-width: 768px) {
363
+ .ds-details__summary {
364
+ --details__summary-font-size: var(--text-lg);
365
+ --details__summary-line-height: var(--line-h-lg)
366
+ }
367
+ }
368
+ .ds-details__summary--lg {
369
+ --details__summary--lg-font-size: var(--text-lg);
370
+ --details__summary--lg-line-height: var(--line-h-lg);
371
+ }
372
+ @media (min-width: 768px) {
373
+ .ds-details__summary--lg {
374
+ --details__summary--lg-font-size: var(--text-xl);
375
+ --details__summary--lg-line-height: var(--line-h-xl)
376
+ }
377
+ }
378
+ .ds-blockquote {
379
+ --blockquote-font-size: var(--text-base);
380
+ --blockquote-line-height: var(--line-h-base);
381
+ }
382
+ @media (min-width: 768px) {
383
+ .ds-blockquote {
384
+ --blockquote-font-size: var(--text-lg);
385
+ --blockquote-line-height: var(--line-h-lg)
386
+ }
387
+ }
388
+ .ds-notification-banner {
389
+ --notification-banner-border-radius: var(--border-radius-md);
390
+ }
391
+ .ds-circular-progress__circle--1 {
392
+ --circular-progress__circle--1-stroke: var(--color-secondary);
393
+ }
394
+ .ds-circular-progress__circle--2 {
395
+ --circular-progress__circle--2-stroke: var(--color-primary);
396
+ }
397
+ .ds-tabs__panel {
398
+ --tabs__panel-border-radius: 0;
399
+ }
400
+ .ds-panel {
401
+ --panel-border-radius: var(--border-radius-md);
402
+ }
403
+ .ds-panel__title {
404
+ --panel__title-font-size: var(--text-4xl);
405
+ --panel__title-line-height: var(--line-h-4xl);
406
+ --panel__title-margin-bottom: 1rem;
407
+ --panel__title-font-weight: 700;
408
+ --panel__title-letter-spacing: var(--letter-spacing-normal);
409
+ }
410
+ @media (min-width: 768px) {
411
+ .ds-panel__title {
412
+ --panel__title-font-size: var(--text-5xl);
413
+ --panel__title-line-height: var(--line-h-5xl);
414
+ --panel__title-margin-bottom: 1.5rem
415
+ }
416
+ }
417
+ @media print {
418
+ .ds-panel__title {
419
+ --panel__title-font-size: var(--text-4xl);
420
+ --panel__title-line-height: var(--line-h-4xl);
421
+ --panel__title-margin-bottom: 1.5rem
422
+ }
423
+ }
424
+ .ds-panel__body {
425
+ --panel__body-font-size: var(--text-2xl);
426
+ --panel__body-line-height: var(--line-h-2xl);
427
+ --panel__body-margin: auto;
428
+ --panel__body-letter-spacing: var(--letter-spacing-normal);
429
+ }
430
+ @media (min-width: 768px) {
431
+ .ds-panel__body {
432
+ --panel__body-font-size: var(--text-4xl);
433
+ --panel__body-line-height: var(--line-h-4xl)
434
+ }
435
+ }
436
+ @media print {
437
+ .ds-panel__body {
438
+ --panel__body-font-size: var(--text-2xl);
439
+ --panel__body-line-height: var(--line-h-2xl)
440
+ }
441
+ }
442
+ .ds-phase-banner__content {
443
+ --phase-banner__content-font-size: var(--text-base);
444
+ }
445
+ @media (min-width: 768px) {
446
+ .ds-phase-banner__content {
447
+ --phase-banner__content-font-size: var(--text-lg)
448
+ }
449
+ }
450
+ .ds-radios__label {
451
+ --radios__label-font-size: var(--text-base);
452
+ }
453
+ @media (min-width: 768px) {
454
+ .ds-radios__label {
455
+ --radios__label-font-size: var(--text-lg)
456
+ }
457
+ }
458
+ .ds-summary-list {
459
+ --summary-list-font-size: var(--text-base);
460
+ }
461
+ @media (min-width: 768px) {
462
+ .ds-summary-list {
463
+ --summary-list-font-size: var(--text-lg)
464
+ }
465
+ }
466
+ .ds-heading-xl {
467
+ --heading-xl-font-size: var(--text-3xl);
468
+ --heading-xl-line-height: var(--line-h-3xl);
469
+ --heading-xl-margin-bottom: 2rem;
470
+ --heading-xl-font-weight: 700;
471
+ --heading-xl-letter-spacing: var(--letter-spacing-normal);
472
+ }
473
+ @media (min-width: 768px) {
474
+ .ds-heading-xl {
475
+ --heading-xl-font-size: var(--text-5xl);
476
+ --heading-xl-line-height: var(--line-h-5xl);
477
+ --heading-xl-margin-bottom: 3rem
478
+ }
479
+ }
480
+ .ds-heading-lg {
481
+ --heading-lg-font-size: var(--text-2xl);
482
+ --heading-lg-line-height: var(--line-h-2xl);
483
+ --heading-lg-margin-bottom: 2rem;
484
+ --heading-lg-font-weight: 700;
485
+ --heading-lg-letter-spacing: var(--letter-spacing-normal);
486
+ }
487
+ @media (min-width: 768px) {
488
+ .ds-heading-lg {
489
+ --heading-lg-font-size: var(--text-4xl);
490
+ --heading-lg-line-height: var(--line-h-4xl);
491
+ --heading-lg-margin-bottom: 2.5rem
492
+ }
493
+ }
494
+ .ds-heading-md {
495
+ --heading-md-font-size: var(--text-xl);
496
+ --heading-md-line-height: var(--line-h-xl);
497
+ --heading-md-margin-bottom: 1.5rem;
498
+ --heading-md-font-weight: 700;
499
+ --heading-md-letter-spacing: var(--letter-spacing-normal);
500
+ }
501
+ @media (min-width: 768px) {
502
+ .ds-heading-md {
503
+ --heading-md-font-size: var(--text-2xl);
504
+ --heading-md-line-height: var(--line-h-2xl);
505
+ --heading-md-margin-bottom: 2rem
506
+ }
507
+ }
508
+ .ds-heading-sm {
509
+ --heading-sm-font-size: var(--text-base);
510
+ --heading-sm-line-height: var(--line-h-base);
511
+ --heading-sm-margin-bottom: 0.75rem;
512
+ --heading-sm-font-weight: 700;
513
+ --heading-sm-letter-spacing: var(--letter-spacing-normal);
514
+ }
515
+ @media (min-width: 768px) {
516
+ .ds-heading-sm {
517
+ --heading-sm-font-size: var(--text-lg);
518
+ --heading-sm-line-height: var(--line-h-lg);
519
+ --heading-sm-margin-bottom: 1.25rem
520
+ }
521
+ }
522
+ .ds-heading-xs {
523
+ --heading-xs-font-size: var(--text-sm);
524
+ --heading-xs-line-height: var(--line-h-sm);
525
+ --heading-xs-margin-bottom: 0.5rem;
526
+ --heading-xs-font-weight: 700;
527
+ --heading-xs-letter-spacing: var(--letter-spacing-normal);
528
+ }
529
+ @media (min-width: 768px) {
530
+ .ds-heading-xs {
531
+ --heading-xs-font-size: var(--text-base);
532
+ --heading-xs-line-height: var(--line-h-base);
533
+ --heading-xs-margin-bottom: 1rem
534
+ }
535
+ }
536
+ .ds-caption-xl {
537
+ --caption-xl-font-size: var(--text-xl);
538
+ --caption-xl-line-height: var(--line-h-xl);
539
+ --caption-xl-margin-bottom: 0.25rem;
540
+ --caption-xl-color: var(--color-base-800);
541
+ --caption-xl-font-weight: 400;
542
+ --caption-xl-letter-spacing: var(--letter-spacing-normal);
543
+ }
544
+ @media (min-width: 768px) {
545
+ .ds-caption-xl {
546
+ --caption-xl-font-size: var(--text-2xl);
547
+ --caption-xl-line-height: var(--line-h-2xl);
548
+ --caption-xl-margin-bottom: 0.5rem
549
+ }
550
+ }
551
+ .ds-caption-lg {
552
+ --caption-lg-font-size: var(--text-lg);
553
+ --caption-lg-line-height: var(--line-h-lg);
554
+ --caption-lg-margin-bottom: 0rem;
555
+ --caption-lg-color: var(--color-base-800);
556
+ --caption-lg-font-weight: 400;
557
+ --caption-lg-letter-spacing: var(--letter-spacing-normal);
558
+ }
559
+ @media (min-width: 768px) {
560
+ .ds-caption-lg {
561
+ --caption-lg-font-size: var(--text-xl);
562
+ --caption-lg-line-height: var(--line-h-xl)
563
+ }
564
+ }
565
+ .ds-caption-md {
566
+ --caption-md-font-size: var(--text-base);
567
+ --caption-md-line-height: var(--line-h-base);
568
+ --caption-md-margin-bottom: 0rem;
569
+ --caption-md-color: var(--color-base-800);
570
+ --caption-md-font-weight: 400;
571
+ --caption-md-letter-spacing: var(--letter-spacing-normal);
572
+ }
573
+ @media (min-width: 768px) {
574
+ .ds-caption-md {
575
+ --caption-md-font-size: var(--text-lg);
576
+ --caption-md-line-height: var(--line-h-lg)
577
+ }
578
+ }
579
+ .ds-body {
580
+ --body-font-size: var(--text-base);
581
+ --body-line-height: var(--line-h-base);
582
+ --body-margin-bottom: 1rem;
583
+ --body-color: var(--color-base-content);
584
+ --body-letter-spacing: var(--letter-spacing-normal);
585
+ }
586
+ @media (min-width: 768px) {
587
+ .ds-body {
588
+ --body-font-size: var(--text-lg);
589
+ --body-line-height: var(--line-h-lg);
590
+ --body-margin-bottom: 2rem
591
+ }
592
+ }
593
+ .ds-body--lg {
594
+ --body--lg-font-size: var(--text-lg);
595
+ --body--lg-line-height: var(--line-h-lg);
596
+ }
597
+ @media (min-width: 768px) {
598
+ .ds-body--lg {
599
+ --body--lg-font-size: var(--text-2xl);
600
+ --body--lg-line-height: var(--line-h-2xl)
601
+ }
602
+ }
603
+ .ds-body--sm {
604
+ --body--sm-font-size: var(--text-sm);
605
+ --body--sm-line-height: var(--line-h-sm);
606
+ }
607
+ @media (min-width: 768px) {
608
+ .ds-body--sm {
609
+ --body--sm-font-size: var(--text-base);
610
+ --body--sm-line-height: var(--text-base)
611
+ }
612
+ }
613
+ .ds-hint {
614
+ --hint-font-size: var(--text-base);
615
+ --hint-line-height: var(--line-h-base);
616
+ --hint-margin-bottom: 1rem;
617
+ --hint-color: var(--color-base-800);
618
+ --hint-letter-spacing: var(--letter-spacing-normal);
619
+ }
620
+ @media (min-width: 768px) {
621
+ .ds-hint {
622
+ --hint-font-size: var(--text-lg);
623
+ --hint-line-height: var(--line-h-lg)
624
+ }
625
+ }
626
+ .ds-hint--lg {
627
+ --hint--lg-font-size: var(--text-lg);
628
+ --hint--lg-line-height: var(--line-h-lg);
629
+ }
630
+ @media (min-width: 768px) {
631
+ .ds-hint--lg {
632
+ --hint--lg-font-size: var(--text-2xl);
633
+ --hint--lg-line-height: var(--line-h-2xl)
634
+ }
635
+ }
636
+ .ds-hint--sm {
637
+ --hint--sm-font-size: var(--text-sm);
638
+ --hint--sm-line-height: var(--line-h-sm);
639
+ }
640
+ @media (min-width: 768px) {
641
+ .ds-hint--sm {
642
+ --hint--sm-font-size: var(--text-base);
643
+ --hint--sm-line-height: var(--text-lg)
644
+ }
645
+ }
646
+ .ds-link {
647
+ --link-color: var(--color-link);
648
+ --link-color-active: var(--color-link-active);
649
+ --link-color-hover: var(--color-link-hover);
650
+ --link-padding: 0px;
651
+ --link-font-size: var(--text-base);
652
+ --link-line-height: var(--line-h-base);
653
+ --link-letter-spacing: var(--letter-spacing-normal);
654
+ }
655
+ @media (min-width: 768px) {
656
+ .ds-link {
657
+ --link-font-size: var(--text-lg);
658
+ --link-line-height: var(--line-h-lg)
659
+ }
660
+ }
661
+ .ds-back-link {
662
+ --back-link-font-size: var(--text-base);
663
+ --back-link-letter-spacing: var(--letter-spacing-normal);
664
+ }
665
+ @media (min-width: 768px) {
666
+ .ds-back-link {
667
+ --back-link-font-size: var(--text-lg)
668
+ }
669
+ }
670
+ .ds-list {
671
+ --list-font-size: var(--text-base);
672
+ --list-line-height: var(--line-h-base);
673
+ --list-letter-spacing: var(--letter-spacing-normal);
674
+ }
675
+ @media (min-width: 768px) {
676
+ .ds-list {
677
+ --list-font-size: var(--text-lg);
678
+ --list-line-height: var(--line-h-lg)
679
+ }
680
+ }
681
+
682
+ /* LAYOUT */
683
+ .dark .ds-footer {
684
+ --tw-border-opacity: 1;
685
+ border-color: rgba(var(--color-tertiary-300-rgb), var(--tw-border-opacity));
686
+ }
687
+ .dark .ds-radios__input:focus {
688
+ border-width: 2px;
689
+ box-shadow:
690
+ 0 0 0 4px var(--color-base-100),
691
+ 0 0 0 7px var(--color-focus);
692
+ }
693
+ .dark .ds-radios__input:focus:before {
694
+ top: 6px;
695
+ left: 6px;
696
+ }
697
+ .dark .ds-footer__government-logo {
698
+ display: none;
699
+ }
700
+ .dark .ds-footer__government-logo-inverted {
701
+ display: block;
702
+ }
703
+ .dark .ds-image-logo-light {
704
+ display: none;
705
+ }
706
+ .dark .ds-image-logo-dark {
707
+ display: block;
708
+ }
709
+ .dark .ds-footer__link {
710
+ padding: 0 2px;
711
+ }
712
+ .dark .ds-footer__link:focus {
713
+ --tw-text-opacity: 1;
714
+ color: rgba(var(--color-link-active-rgb), var(--tw-text-opacity));
715
+ box-shadow:
716
+ 0 -2px var(--color-focus),
717
+ 0 4px var(--color-link-active);
718
+ }
719
+ .dark .ds-masthead.ds-masthead--primary {
720
+ color: rgba(var(--color-base-content-rgb),var(--tw-text-opacity));
721
+ --tw-text-opacity: 1;
722
+ color: rgba(var(--color-base-content-rgb), var(--tw-text-opacity));
723
+ }
724
+ .dark .ds-masthead.ds-masthead--primary .ds-body {
725
+ color: rgba(var(--color-base-content-rgb),var(--tw-text-opacity));
726
+ --tw-text-opacity: 1;
727
+ color: rgba(var(--color-base-content-rgb), var(--tw-text-opacity));
728
+ }
729
+ .dark .ds-masthead__body {
730
+ color: rgba(var(--color-base-content-rgb),var(--tw-text-opacity));
731
+ --tw-text-opacity: 1;
732
+ color: rgba(var(--color-base-content-rgb), var(--tw-text-opacity));
733
+ }
734
+ .dark .ds-background-dark .ds-hint, .dark .ds-masthead.ds-masthead--primary .ds-hint {
735
+ color: rgba(var(--color-base-content-rgb),var(--tw-text-opacity));
736
+ --tw-text-opacity: 1;
737
+ color: rgba(var(--color-base-content-rgb), var(--tw-text-opacity));
738
+ }
739
+ .dark .ds-background-dark .ds-btn, .dark .ds-masthead--primary .ds-btn {
740
+ border-color: rgba(var(--color-base-content-rgb),var(--tw-border-opacity));
741
+ --tw-border-opacity: 1;
742
+ border-color: rgba(var(--color-base-content-rgb), var(--tw-border-opacity));
743
+ }
744
+ .dark .ds-background-dark .ds-btn:focus, .dark .ds-masthead--primary .ds-btn:focus {
745
+ box-shadow:
746
+ 0 0 0 6px var(--color-tertiary),
747
+ 0 0 0 10px var(--color-focus);
748
+ }
749
+
750
+ /* FORM */
751
+ .dark .ds-checkboxes__input:focus {
752
+ box-shadow:
753
+ 0 0 0 3px var(--color-base-100),
754
+ 0 0 0 6px var(--color-focus);
755
+ }
756
+ .dark .ds-checkboxes__input:focus:before {
757
+ border-width: 3px;
758
+ }
759
+ .dark .ds-input:focus,
760
+ .dark .ds-select:focus,
761
+ .dark .ds-textarea:focus,
762
+ .dark
763
+ .ds-autocomplete__multi-input-container.ds-autocomplete__multi-input-container--focused,
764
+ .dark .ds-autocomplete__input.ds-autocomplete__input--focused {
765
+ outline: 4px solid transparent;
766
+ box-shadow:
767
+ 0 0 0 3px var(--color-base-100),
768
+ 0 0 0 6px var(--color-focus);
769
+ }
770
+
771
+ /* BUTTONS AND LINKS */
772
+ .dark .ds-btn:focus, .dark .ds-btn[type="button"]:focus, .dark .ds-btn[type="reset"]:focus, .dark .ds-btn[type="submit"]:focus {
773
+ box-shadow:
774
+ 0 0 0 6px var(--color-base-100),
775
+ 0 0 0 10px var(--color-focus);
776
+ }
777
+ .dark .ds-header .ds-dropdown__button.ds-link:focus, .dark .ds-admin-header .ds-dropdown__button.ds-link:focus {
778
+ --tw-text-opacity: 1;
779
+ color: rgba(var(--color-link-active-rgb), var(--tw-text-opacity));
780
+ }
781
+ .dark .ds-btn-secondary {
782
+ color: rgba(var(--color-base-100-rgb),var(--tw-text-opacity));
783
+ --tw-bg-opacity: 1;
784
+ background-color: rgba(var(--color-base-800-rgb), var(--tw-bg-opacity));
785
+ --tw-text-opacity: 1;
786
+ color: rgba(var(--color-base-100-rgb), var(--tw-text-opacity));
787
+ }
788
+ .dark .ds-btn-secondary:hover {
789
+ background-color: rgba(var(--color-base-700-rgb),var(--tw-bg-opacity));
790
+ --tw-bg-opacity: 1;
791
+ background-color: rgba(var(--color-base-700-rgb), var(--tw-bg-opacity));
792
+ --tw-text-opacity: 1;
793
+ color: rgba(var(--color-black-rgb), var(--tw-text-opacity));
794
+ }
795
+ .dark .ds-btn-secondary .ds-svg-icon {
796
+ fill: var(--color-base-100);
797
+ }
798
+ .dark .ds-dropdown[open] .ds-dropdown__button.ds-btn-secondary {
799
+ background-color: rgba(var(--color-base-700-rgb),var(--tw-bg-opacity));
800
+ color: rgba(var(--color-white-rgb),var(--tw-text-opacity));
801
+ --tw-bg-opacity: 1;
802
+ background-color: rgba(var(--color-base-700-rgb), var(--tw-bg-opacity));
803
+ --tw-text-opacity: 1;
804
+ color: rgba(var(--color-white-rgb), var(--tw-text-opacity));
805
+ }
806
+
807
+ .dark .ds-link {
808
+ padding: 0 2px;
809
+ }
810
+
811
+ .dark .ds-link:focus {
812
+ box-shadow:
813
+ 0 -2px var(--color-focus),
814
+ 0 4px var(--color-link-active);
815
+ }
816
+ .dark .ds-background-dark .ds-link,
817
+ .dark .ds-masthead.ds-masthead--primary .ds-link {
818
+ color: rgba(var(--color-base-content-rgb),var(--tw-text-opacity));
819
+ --tw-text-opacity: 1;
820
+ color: rgba(var(--color-base-content-rgb), var(--tw-text-opacity));
821
+ }
822
+ .dark .ds-background-dark .ds-link:focus, .dark .ds-masthead.ds-masthead--primary .ds-link:focus {
823
+ --tw-text-opacity: 1;
824
+ color: rgba(var(--color-link-active-rgb), var(--tw-text-opacity));
825
+ }
826
+ .dark .ds-breadcrumbs__list-item::before {
827
+ background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true"> <path d="M8.5,2L6.1,4.3l7.6,7.7l-7.6,7.6L8.5,22l10-10L8.5,2z" style="fill:%23fff;"/></svg>');
828
+ }
829
+ .dark .ds-breadcrumbs__link,
830
+ .dark .ds-back-link,
831
+ .dark .ds-back-to-top-link,
832
+ .dark .ds-details__summary {
833
+ padding: 0 2px;
834
+ }
835
+ .dark .ds-breadcrumbs__link:focus, .dark .ds-back-link:focus, .dark .ds-back-to-top-link:focus, .dark .ds-details__summary:focus {
836
+ --tw-text-opacity: 1;
837
+ color: rgba(var(--color-link-active-rgb), var(--tw-text-opacity));
838
+ box-shadow:
839
+ 0 -2px var(--color-focus),
840
+ 0 4px var(--color-link-active);
841
+ }
842
+ .dark .ds-back-link:focus .ds-svg-icon--caret,
843
+ .dark .ds-back-to-top-link:focus .ds-svg-icon--arrow {
844
+ fill: var(--color-link-active);
845
+ }
846
+
847
+ /* CORE COMPONENTS */
848
+ .dark .ds-accordion .ds-accordion__section-button {
849
+ padding: 0 1px;
850
+ }
851
+ .dark .ds-accordion .ds-accordion__section-button::after {
852
+ padding: 0 1px;
853
+ }
854
+ .dark .ds-accordion .ds-accordion__section-summary:focus .ds-accordion__section-button {
855
+ color: rgba(var(--color-base-content-invert-rgb),var(--tw-text-opacity));
856
+ --tw-text-opacity: 1;
857
+ color: rgba(var(--color-base-content-invert-rgb), var(--tw-text-opacity));
858
+ }
859
+ .dark .ds-accordion .ds-accordion__section-summary:focus .ds-accordion__section-button::after {
860
+ color: rgba(var(--color-base-content-invert-rgb),var(--tw-text-opacity));
861
+ --tw-text-opacity: 1;
862
+ color: rgba(var(--color-base-content-invert-rgb), var(--tw-text-opacity));
863
+ }
864
+
865
+ .dark .ds-card.ds-card--border.ds-card--border-light {
866
+ border-width: 0;
867
+ background-color: rgba(var(--color-base-300-rgb),var(--tw-bg-opacity));
868
+ border-width: 0px;
869
+ --tw-bg-opacity: 1;
870
+ background-color: rgba(var(--color-base-300-rgb), var(--tw-bg-opacity));
871
+ }
872
+ .dark .ds-card.ds-card--divider,
873
+ .dark .ds-card.ds-card--border-top,
874
+ .dark .ds-card.ds-card--border-light {
875
+ border-color: rgba(var(--color-base-500-rgb),var(--tw-border-opacity));
876
+ --tw-border-opacity: 1;
877
+ border-color: rgba(var(--color-base-500-rgb), var(--tw-border-opacity));
878
+ }
879
+ .dark .ds-card.ds-card--cta .ds-card__body:after {
880
+ background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' aria-hidden='true'> <path d='M8.5,2L6.1,4.3l7.6,7.7l-7.6,7.6L8.5,22l10-10L8.5,2z' style='fill:%23fff;' /> </svg>");
881
+ }
882
+ .dark .ds-section-break.ds-section-break--visible {
883
+ border-color: rgba(var(--color-base-500-rgb),var(--tw-border-opacity));
884
+ --tw-border-opacity: 1;
885
+ border-color: rgba(var(--color-base-500-rgb), var(--tw-border-opacity));
886
+ }
887
+ .dark .ds-phase-banner__tag {
888
+ color: rgba(var(--color-base-content-rgb),var(--tw-text-opacity));
889
+ --tw-text-opacity: 1;
890
+ color: rgba(var(--color-base-content-rgb), var(--tw-text-opacity));
891
+ }
892
+ .dark .ds-phase-banner-header .ds-phase-banner__message {
893
+ color: rgba(var(--color-base-content-invert-rgb),var(--tw-text-opacity));
894
+ --tw-text-opacity: 1;
895
+ color: rgba(var(--color-base-content-invert-rgb), var(--tw-text-opacity));
896
+ }
897
+ .dark .ds-summary-list__row {
898
+ border-color: rgba(var(--color-base-500-rgb),var(--tw-border-opacity));
899
+ --tw-border-opacity: 1;
900
+ border-color: rgba(var(--color-base-500-rgb), var(--tw-border-opacity));
901
+ }
902
+ @media (min-width: 640px) {
903
+
904
+ .dark .ds-summary-list__key,
905
+ .dark .ds-summary-list__value,
906
+ .dark .ds-summary-list__actions {
907
+ border-color: rgba(var(--color-base-500-rgb),var(--tw-border-opacity));
908
+ --tw-border-opacity: 1;
909
+ border-color: rgba(var(--color-base-500-rgb), var(--tw-border-opacity));
910
+ }
911
+ }
912
+
913
+ .dark .ds-table-container.ds-table-container--border {
914
+ border-color: rgba(var(--color-base-500-rgb),var(--tw-border-opacity));
915
+ --tw-border-opacity: 1;
916
+ border-color: rgba(var(--color-base-500-rgb), var(--tw-border-opacity));
917
+ }
918
+ .dark .ds-table.ds-table--vertical-lines .ds-table__cell,
919
+ .dark .ds-table.ds-table--vertical-lines .ds-table__header,
920
+ .dark .ds-table.ds-table--vertical-lines .ds-table__head {
921
+ border-color: rgba(var(--color-base-500-rgb),var(--tw-border-opacity));
922
+ --tw-border-opacity: 1;
923
+ border-color: rgba(var(--color-base-500-rgb), var(--tw-border-opacity));
924
+ }
925
+ @supports (-moz-appearance: none) {
926
+ .dark .ds-table.ds-table--vertical-lines .ds-table__header:last-child, .dark .ds-table.ds-table--vertical-lines .ds-table__cell:last-child {
927
+ border-color: rgba(var(--color-base-500-rgb),var(--tw-border-opacity)) !important;
928
+ --tw-border-opacity: 1 !important;
929
+ border-color: rgba(var(--color-base-500-rgb), var(--tw-border-opacity)) !important;
930
+ }
931
+ }
932
+ .dark .ds-table.ds-table--vertical-lines.ds-table--light .ds-table__body .ds-table__header {
933
+ border-color: rgba(var(--color-base-500-rgb),var(--tw-border-opacity)) !important;
934
+ --tw-border-opacity: 1 !important;
935
+ border-color: rgba(var(--color-base-500-rgb), var(--tw-border-opacity)) !important;
936
+ }
937
+ @media (min-width: 768px) {
938
+ .dark .ds-table.ds-table--stacked-md .ds-table__header:last-child, .dark .ds-table.ds-table--stacked-md .ds-table__cell:last-child {
939
+ border-bottom-color: rgb(var(--color-base-500-rgb));
940
+ }
941
+ }
942
+ .dark .ds-table__header,
943
+ .dark .ds-table__cell {
944
+ border-color: rgba(var(--color-base-500-rgb),var(--tw-border-opacity));
945
+ --tw-border-opacity: 1;
946
+ border-color: rgba(var(--color-base-500-rgb), var(--tw-border-opacity));
947
+ }
948
+ .dark .ds-table.ds-table--dark .ds-table__header {
949
+ color: rgba(var(--color-base-content-rgb),var(--tw-text-opacity));
950
+ --tw-text-opacity: 1;
951
+ color: rgba(var(--color-base-content-rgb), var(--tw-text-opacity));
952
+ }
953
+ .dark .ds-tabs .ds-tabs__list .ds-tabs__tab {
954
+ padding: 0 2px;
955
+ }
956
+ .dark .ds-tabs .ds-tabs__list .ds-tabs__tab:focus {
957
+ --tw-text-opacity: 1;
958
+ color: rgba(var(--color-link-active-rgb), var(--tw-text-opacity));
959
+ }
960
+ .dark .ds-step-nav__accordion__summary:focus .ds-step-nav__accordion__heading__title {
961
+ --tw-text-opacity: 1;
962
+ color: rgba(var(--color-link-active-rgb), var(--tw-text-opacity));
963
+ padding: 0 2px;
964
+ box-shadow:
965
+ 0 -2px var(--color-focus),
966
+ 0 4px var(--color-link-active);
967
+ }
968
+ .dark .ds-step-nav__accordion__summary:focus .ds-step-nav__accordion__closed,
969
+ .dark .ds-step-nav__accordion__summary:focus .ds-step-nav__accordion__opened {
970
+ --tw-text-opacity: 1;
971
+ color: rgba(var(--color-link-active-rgb), var(--tw-text-opacity));
972
+ padding: 0 2px;
973
+ }
974
+ .dark .ds-nav__list-item:focus {
975
+ --tw-text-opacity: 1;
976
+ color: rgba(var(--color-link-active-rgb), var(--tw-text-opacity));
977
+ box-shadow:
978
+ 0 -2px var(--color-focus),
979
+ 0 4px var(--color-link-active);
980
+ }
981
+ .dark .ds-task-list__content__tag.ds-task-list__content__tag--primary {
982
+ color: rgba(var(--color-base-content-rgb),var(--tw-text-opacity));
983
+ --tw-text-opacity: 1;
984
+ color: rgba(var(--color-base-content-rgb), var(--tw-text-opacity));
985
+ }
986
+ .dark .ds-notification-banner__link {
987
+ padding: 0 2px;
988
+ }
989
+ .dark .ds-notification-banner__link:focus {
990
+ --tw-text-opacity: 1;
991
+ color: rgba(var(--color-link-active-rgb), var(--tw-text-opacity));
992
+ box-shadow:
993
+ 0 -2px var(--color-focus),
994
+ 0 4px var(--color-link-active);
995
+ }
996
+ .dark .ds-chip:focus {
997
+ outline: 2px solid var(--color-focus);
998
+ outline-offset: 3px;
999
+ box-shadow: none;
1000
+ }
1001
+ @media (min-width: 0px) {
1002
+
1003
+ .dark .ds-nav__list-item-link:focus, .dark .ds-nav__list-item-btn:focus {
1004
+ --tw-text-opacity: 1 !important;
1005
+ color: rgba(var(--color-link-active-rgb), var(--tw-text-opacity)) !important;
1006
+ }
1007
+ }
1008
+ .dark .ds-nav__list-item-link:focus > .ds-svg-icon, .dark .ds-nav__list-item-btn:focus > .ds-svg-icon {
1009
+ fill: var(--color-link-active) !important;
1010
+ }
1011
+ .dark .ds-code.ds-code--name {
1012
+ --tw-text-opacity: 1 !important;
1013
+ color: rgba(var(--color-secondary-100-rgb), var(--tw-text-opacity)) !important;
1014
+ }