@cirthcss/cirth 0.3.0 → 0.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,3104 +0,0 @@
1
- .cirth, .cirth *, .cirth :before, .cirth :after {
2
- box-sizing: border-box;
3
- background-repeat: no-repeat;
4
- }
5
-
6
- .cirth:before, .cirth:after, .cirth :before, .cirth :after {
7
- -webkit-text-decoration: inherit;
8
- text-decoration: inherit;
9
- vertical-align: inherit;
10
- }
11
-
12
- .cirth {
13
- -webkit-tap-highlight-color: transparent;
14
- -webkit-text-size-adjust: 100%;
15
- -moz-text-size-adjust: 100%;
16
- text-size-adjust: 100%;
17
- background-color: var(--cirth-background-color);
18
- color: var(--cirth-color);
19
- font-weight: var(--cirth-font-weight);
20
- font-size: var(--cirth-font-size);
21
- line-height: var(--cirth-line-height);
22
- font-family: var(--cirth-font-family);
23
- text-underline-offset: var(--cirth-text-underline-offset);
24
- text-rendering: optimizelegibility;
25
- overflow-wrap: break-word;
26
- tab-size: 4;
27
- width: 100%;
28
- margin: 0;
29
- }
30
-
31
- .cirth main {
32
- display: block;
33
- }
34
-
35
- .cirth > header, .cirth > main, .cirth > footer {
36
- width: 100%;
37
- padding: var(--cirth-block-spacing-vertical) var(--cirth-block-spacing-horizontal);
38
- margin-left: auto;
39
- margin-right: auto;
40
- }
41
-
42
- @media (width >= 576px) {
43
- .cirth > header, .cirth > main, .cirth > footer {
44
- max-width: 510px;
45
- padding-left: 0;
46
- padding-right: 0;
47
- }
48
- }
49
-
50
- @media (width >= 768px) {
51
- .cirth > header, .cirth > main, .cirth > footer {
52
- max-width: 700px;
53
- }
54
- }
55
-
56
- @media (width >= 1024px) {
57
- .cirth > header, .cirth > main, .cirth > footer {
58
- max-width: 950px;
59
- }
60
- }
61
-
62
- @media (width >= 1280px) {
63
- .cirth > header, .cirth > main, .cirth > footer {
64
- max-width: 1200px;
65
- }
66
- }
67
-
68
- @media (width >= 1536px) {
69
- .cirth > header, .cirth > main, .cirth > footer {
70
- max-width: 1450px;
71
- }
72
- }
73
-
74
- .cirth section {
75
- margin-bottom: var(--cirth-block-spacing-vertical);
76
- }
77
-
78
- .cirth b, .cirth strong {
79
- font-weight: bolder;
80
- }
81
-
82
- .cirth sub, .cirth sup {
83
- vertical-align: baseline;
84
- font-size: .75em;
85
- line-height: 0;
86
- position: relative;
87
- }
88
-
89
- .cirth sub {
90
- bottom: -.25em;
91
- }
92
-
93
- .cirth sup {
94
- top: -.5em;
95
- }
96
-
97
- .cirth address, .cirth blockquote, .cirth dl, .cirth ol, .cirth p, .cirth pre, .cirth table, .cirth ul {
98
- margin-top: 0;
99
- margin-bottom: var(--cirth-typography-spacing-vertical);
100
- color: var(--cirth-color);
101
- font-style: normal;
102
- font-weight: var(--cirth-font-weight);
103
- }
104
-
105
- .cirth h1, .cirth h2, .cirth h3, .cirth h4, .cirth h5, .cirth h6 {
106
- margin-top: 0;
107
- margin-bottom: var(--cirth-typography-spacing-vertical);
108
- color: var(--cirth-color);
109
- font-weight: var(--cirth-font-weight);
110
- font-size: var(--cirth-font-size);
111
- line-height: var(--cirth-line-height);
112
- font-family: var(--cirth-font-family);
113
- }
114
-
115
- .cirth h1 {
116
- --cirth-color: var(--cirth-h1-color);
117
- }
118
-
119
- .cirth h2 {
120
- --cirth-color: var(--cirth-h2-color);
121
- }
122
-
123
- .cirth h3 {
124
- --cirth-color: var(--cirth-h3-color);
125
- }
126
-
127
- .cirth h4 {
128
- --cirth-color: var(--cirth-h4-color);
129
- }
130
-
131
- .cirth h5 {
132
- --cirth-color: var(--cirth-h5-color);
133
- }
134
-
135
- .cirth h6 {
136
- --cirth-color: var(--cirth-h6-color);
137
- }
138
-
139
- .cirth :where(article, address, blockquote, dl, figure, form, ol, p, pre, table, ul) ~ :is(h1, h2, h3, h4, h5, h6) {
140
- margin-top: var(--cirth-typography-spacing-top);
141
- }
142
-
143
- .cirth p, .cirth hgroup {
144
- margin-bottom: var(--cirth-typography-spacing-vertical);
145
- }
146
-
147
- .cirth hgroup > * {
148
- margin-top: 0;
149
- margin-bottom: 0;
150
- }
151
-
152
- .cirth hgroup > :not(:first-child):last-child {
153
- --cirth-color: var(--cirth-muted-color);
154
- --cirth-font-weight: unset;
155
- font-size: var(--cirth-font-size-md);
156
- }
157
-
158
- .cirth :where(ol, ul) li {
159
- margin-bottom: calc(var(--cirth-typography-spacing-vertical) * .25);
160
- }
161
-
162
- .cirth :where(dl, ol, ul) :where(dl, ol, ul) {
163
- margin: 0;
164
- margin-top: calc(var(--cirth-typography-spacing-vertical) * .25);
165
- }
166
-
167
- .cirth ul li {
168
- list-style: square;
169
- }
170
-
171
- .cirth mark {
172
- background-color: var(--cirth-mark-background-color);
173
- color: var(--cirth-mark-color);
174
- vertical-align: baseline;
175
- padding: .125rem .25rem;
176
- }
177
-
178
- .cirth blockquote {
179
- margin: var(--cirth-typography-spacing-vertical) 0;
180
- padding: var(--cirth-spacing);
181
- border-right: none;
182
- border-left: var(--cirth-border-width-4) solid var(--cirth-blockquote-border-color);
183
- border-inline-start: var(--cirth-border-width-4) solid var(--cirth-blockquote-border-color);
184
- border-inline-end: none;
185
- display: block;
186
- }
187
-
188
- .cirth blockquote footer {
189
- margin-top: calc(var(--cirth-typography-spacing-vertical) * .5);
190
- color: var(--cirth-blockquote-footer-color);
191
- }
192
-
193
- .cirth abbr[title] {
194
- border-bottom: var(--cirth-border-width-1) dotted;
195
- cursor: help;
196
- text-decoration: none;
197
- }
198
-
199
- .cirth ins {
200
- color: var(--cirth-ins-color);
201
- text-decoration: none;
202
- }
203
-
204
- .cirth del {
205
- color: var(--cirth-del-color);
206
- }
207
-
208
- .cirth ::selection {
209
- background-color: var(--cirth-text-selection-color);
210
- }
211
-
212
- .cirth [role="link"] {
213
- --cirth-color: var(--cirth-primary);
214
- --cirth-background-color: transparent;
215
- --cirth-underline: var(--cirth-primary-underline);
216
- background-color: var(--cirth-background-color);
217
- color: var(--cirth-color);
218
- -webkit-text-decoration: var(--cirth-text-decoration);
219
- text-decoration: var(--cirth-text-decoration);
220
- -webkit-text-decoration-color: var(--cirth-underline);
221
- text-decoration-color: var(--cirth-underline);
222
- text-underline-offset: .125em;
223
- transition: background-color var(--cirth-transition), color var(--cirth-transition), text-decoration var(--cirth-transition), box-shadow var(--cirth-transition);
224
- outline: none;
225
- }
226
-
227
- .cirth :where(a:not([role="button"])) {
228
- --cirth-color: var(--cirth-primary);
229
- --cirth-background-color: transparent;
230
- --cirth-underline: var(--cirth-primary-underline);
231
- background-color: var(--cirth-background-color);
232
- color: var(--cirth-color);
233
- -webkit-text-decoration: var(--cirth-text-decoration);
234
- text-decoration: var(--cirth-text-decoration);
235
- -webkit-text-decoration-color: var(--cirth-underline);
236
- text-decoration-color: var(--cirth-underline);
237
- text-underline-offset: .125em;
238
- transition: background-color var(--cirth-transition), color var(--cirth-transition), text-decoration var(--cirth-transition), box-shadow var(--cirth-transition);
239
- outline: none;
240
- }
241
-
242
- .cirth :where(a:not([role="button"])):is([aria-current]:not([aria-current="false"]), :hover, :active, :focus) {
243
- --cirth-color: var(--cirth-primary-hover);
244
- --cirth-underline: var(--cirth-primary-hover-underline);
245
- --cirth-text-decoration: underline;
246
- }
247
-
248
- .cirth [role="link"]:is([aria-current]:not([aria-current="false"]), :hover, :active, :focus) {
249
- --cirth-color: var(--cirth-primary-hover);
250
- --cirth-underline: var(--cirth-primary-hover-underline);
251
- --cirth-text-decoration: underline;
252
- }
253
-
254
- .cirth :where(a:not([role="button"])):focus-visible {
255
- box-shadow: 0 0 0 var(--cirth-outline-width) var(--cirth-primary-focus);
256
- }
257
-
258
- .cirth [role="link"]:focus-visible {
259
- box-shadow: 0 0 0 var(--cirth-outline-width) var(--cirth-primary-focus);
260
- }
261
-
262
- .cirth a[role="button"] {
263
- display: inline-block;
264
- }
265
-
266
- .cirth button {
267
- text-transform: none;
268
- -webkit-appearance: button;
269
- margin: 0;
270
- font-family: inherit;
271
- overflow: visible;
272
- }
273
-
274
- .cirth button, .cirth [role="button"] {
275
- --cirth-background-color: var(--cirth-primary-background);
276
- --cirth-border-color: var(--cirth-primary-border);
277
- --cirth-color: var(--cirth-primary-inverse);
278
- --cirth-box-shadow: var(--cirth-button-box-shadow, 0 0 0 rgba(0, 0, 0, 0));
279
- padding: var(--cirth-form-element-spacing-vertical) var(--cirth-form-element-spacing-horizontal);
280
- border: var(--cirth-border-width) solid var(--cirth-border-color);
281
- border-radius: var(--cirth-border-radius);
282
- background-color: var(--cirth-background-color);
283
- box-shadow: var(--cirth-box-shadow);
284
- color: var(--cirth-color);
285
- font-weight: var(--cirth-font-weight);
286
- font-size: var(--cirth-font-size-md);
287
- line-height: var(--cirth-line-height);
288
- text-align: center;
289
- cursor: pointer;
290
- -webkit-user-select: none;
291
- user-select: none;
292
- transition: background-color var(--cirth-transition), border-color var(--cirth-transition), color var(--cirth-transition), box-shadow var(--cirth-transition);
293
- outline: none;
294
- text-decoration: none;
295
- }
296
-
297
- .cirth [type="submit"] {
298
- --cirth-background-color: var(--cirth-primary-background);
299
- --cirth-border-color: var(--cirth-primary-border);
300
- --cirth-color: var(--cirth-primary-inverse);
301
- --cirth-box-shadow: var(--cirth-button-box-shadow, 0 0 0 rgba(0, 0, 0, 0));
302
- padding: var(--cirth-form-element-spacing-vertical) var(--cirth-form-element-spacing-horizontal);
303
- border: var(--cirth-border-width) solid var(--cirth-border-color);
304
- border-radius: var(--cirth-border-radius);
305
- background-color: var(--cirth-background-color);
306
- box-shadow: var(--cirth-box-shadow);
307
- color: var(--cirth-color);
308
- font-weight: var(--cirth-font-weight);
309
- font-size: var(--cirth-font-size-md);
310
- line-height: var(--cirth-line-height);
311
- text-align: center;
312
- cursor: pointer;
313
- -webkit-user-select: none;
314
- user-select: none;
315
- transition: background-color var(--cirth-transition), border-color var(--cirth-transition), color var(--cirth-transition), box-shadow var(--cirth-transition);
316
- outline: none;
317
- text-decoration: none;
318
- }
319
-
320
- .cirth [type="reset"] {
321
- --cirth-background-color: var(--cirth-primary-background);
322
- --cirth-border-color: var(--cirth-primary-border);
323
- --cirth-color: var(--cirth-primary-inverse);
324
- --cirth-box-shadow: var(--cirth-button-box-shadow, 0 0 0 rgba(0, 0, 0, 0));
325
- padding: var(--cirth-form-element-spacing-vertical) var(--cirth-form-element-spacing-horizontal);
326
- border: var(--cirth-border-width) solid var(--cirth-border-color);
327
- border-radius: var(--cirth-border-radius);
328
- background-color: var(--cirth-background-color);
329
- box-shadow: var(--cirth-box-shadow);
330
- color: var(--cirth-color);
331
- font-weight: var(--cirth-font-weight);
332
- font-size: var(--cirth-font-size-md);
333
- line-height: var(--cirth-line-height);
334
- text-align: center;
335
- cursor: pointer;
336
- -webkit-user-select: none;
337
- user-select: none;
338
- transition: background-color var(--cirth-transition), border-color var(--cirth-transition), color var(--cirth-transition), box-shadow var(--cirth-transition);
339
- outline: none;
340
- text-decoration: none;
341
- }
342
-
343
- .cirth [type="button"] {
344
- --cirth-background-color: var(--cirth-primary-background);
345
- --cirth-border-color: var(--cirth-primary-border);
346
- --cirth-color: var(--cirth-primary-inverse);
347
- --cirth-box-shadow: var(--cirth-button-box-shadow, 0 0 0 rgba(0, 0, 0, 0));
348
- padding: var(--cirth-form-element-spacing-vertical) var(--cirth-form-element-spacing-horizontal);
349
- border: var(--cirth-border-width) solid var(--cirth-border-color);
350
- border-radius: var(--cirth-border-radius);
351
- background-color: var(--cirth-background-color);
352
- box-shadow: var(--cirth-box-shadow);
353
- color: var(--cirth-color);
354
- font-weight: var(--cirth-font-weight);
355
- font-size: var(--cirth-font-size-md);
356
- line-height: var(--cirth-line-height);
357
- text-align: center;
358
- cursor: pointer;
359
- -webkit-user-select: none;
360
- user-select: none;
361
- transition: background-color var(--cirth-transition), border-color var(--cirth-transition), color var(--cirth-transition), box-shadow var(--cirth-transition);
362
- outline: none;
363
- text-decoration: none;
364
- }
365
-
366
- .cirth [type="file"]::file-selector-button {
367
- --cirth-background-color: var(--cirth-primary-background);
368
- --cirth-border-color: var(--cirth-primary-border);
369
- --cirth-color: var(--cirth-primary-inverse);
370
- --cirth-box-shadow: var(--cirth-button-box-shadow, 0 0 0 rgba(0, 0, 0, 0));
371
- padding: var(--cirth-form-element-spacing-vertical) var(--cirth-form-element-spacing-horizontal);
372
- border: var(--cirth-border-width) solid var(--cirth-border-color);
373
- border-radius: var(--cirth-border-radius);
374
- background-color: var(--cirth-background-color);
375
- box-shadow: var(--cirth-box-shadow);
376
- color: var(--cirth-color);
377
- font-weight: var(--cirth-font-weight);
378
- font-size: var(--cirth-font-size-md);
379
- line-height: var(--cirth-line-height);
380
- text-align: center;
381
- cursor: pointer;
382
- -webkit-user-select: none;
383
- user-select: none;
384
- transition: background-color var(--cirth-transition), border-color var(--cirth-transition), color var(--cirth-transition), box-shadow var(--cirth-transition);
385
- outline: none;
386
- text-decoration: none;
387
- }
388
-
389
- .cirth button[aria-current]:not([aria-current="false"]), .cirth [role="button"][aria-current]:not([aria-current="false"]) {
390
- --cirth-background-color: var(--cirth-primary-hover-background);
391
- --cirth-border-color: var(--cirth-primary-hover-border);
392
- --cirth-box-shadow: var(--cirth-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0));
393
- --cirth-color: var(--cirth-primary-inverse);
394
- }
395
-
396
- .cirth button:is(:hover, :active, :focus) {
397
- --cirth-background-color: var(--cirth-primary-hover-background);
398
- --cirth-border-color: var(--cirth-primary-hover-border);
399
- --cirth-box-shadow: var(--cirth-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0));
400
- --cirth-color: var(--cirth-primary-inverse);
401
- }
402
-
403
- .cirth [type="submit"][aria-current]:not([aria-current="false"]) {
404
- --cirth-background-color: var(--cirth-primary-hover-background);
405
- --cirth-border-color: var(--cirth-primary-hover-border);
406
- --cirth-box-shadow: var(--cirth-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0));
407
- --cirth-color: var(--cirth-primary-inverse);
408
- }
409
-
410
- .cirth [type="submit"]:is(:hover, :active, :focus) {
411
- --cirth-background-color: var(--cirth-primary-hover-background);
412
- --cirth-border-color: var(--cirth-primary-hover-border);
413
- --cirth-box-shadow: var(--cirth-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0));
414
- --cirth-color: var(--cirth-primary-inverse);
415
- }
416
-
417
- .cirth [type="reset"][aria-current]:not([aria-current="false"]) {
418
- --cirth-background-color: var(--cirth-primary-hover-background);
419
- --cirth-border-color: var(--cirth-primary-hover-border);
420
- --cirth-box-shadow: var(--cirth-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0));
421
- --cirth-color: var(--cirth-primary-inverse);
422
- }
423
-
424
- .cirth [type="reset"]:is(:hover, :active, :focus) {
425
- --cirth-background-color: var(--cirth-primary-hover-background);
426
- --cirth-border-color: var(--cirth-primary-hover-border);
427
- --cirth-box-shadow: var(--cirth-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0));
428
- --cirth-color: var(--cirth-primary-inverse);
429
- }
430
-
431
- .cirth [type="button"][aria-current]:not([aria-current="false"]) {
432
- --cirth-background-color: var(--cirth-primary-hover-background);
433
- --cirth-border-color: var(--cirth-primary-hover-border);
434
- --cirth-box-shadow: var(--cirth-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0));
435
- --cirth-color: var(--cirth-primary-inverse);
436
- }
437
-
438
- .cirth [type="button"]:is(:hover, :active, :focus) {
439
- --cirth-background-color: var(--cirth-primary-hover-background);
440
- --cirth-border-color: var(--cirth-primary-hover-border);
441
- --cirth-box-shadow: var(--cirth-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0));
442
- --cirth-color: var(--cirth-primary-inverse);
443
- }
444
-
445
- .cirth [type="file"]::file-selector-button:is() {
446
- --cirth-background-color: var(--cirth-primary-hover-background);
447
- --cirth-border-color: var(--cirth-primary-hover-border);
448
- --cirth-box-shadow: var(--cirth-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0));
449
- --cirth-color: var(--cirth-primary-inverse);
450
- }
451
-
452
- .cirth [type="file"]::file-selector-button:is(:hover, :active, :focus) {
453
- --cirth-background-color: var(--cirth-primary-hover-background);
454
- --cirth-border-color: var(--cirth-primary-hover-border);
455
- --cirth-box-shadow: var(--cirth-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0));
456
- --cirth-color: var(--cirth-primary-inverse);
457
- }
458
-
459
- .cirth [role="button"]:is(:hover, :active, :focus) {
460
- --cirth-background-color: var(--cirth-primary-hover-background);
461
- --cirth-border-color: var(--cirth-primary-hover-border);
462
- --cirth-box-shadow: var(--cirth-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0));
463
- --cirth-color: var(--cirth-primary-inverse);
464
- }
465
-
466
- .cirth button:focus, .cirth button[aria-current]:not([aria-current="false"]):focus, .cirth [role="button"]:focus, .cirth [role="button"][aria-current]:not([aria-current="false"]):focus {
467
- --cirth-box-shadow: var(--cirth-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)),
468
- 0 0 0 var(--cirth-outline-width) var(--cirth-primary-focus);
469
- }
470
-
471
- .cirth [type="submit"]:focus {
472
- --cirth-box-shadow: var(--cirth-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)),
473
- 0 0 0 var(--cirth-outline-width) var(--cirth-primary-focus);
474
- }
475
-
476
- .cirth [type="submit"][aria-current]:not([aria-current="false"]):focus {
477
- --cirth-box-shadow: var(--cirth-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)),
478
- 0 0 0 var(--cirth-outline-width) var(--cirth-primary-focus);
479
- }
480
-
481
- .cirth [type="reset"]:focus {
482
- --cirth-box-shadow: var(--cirth-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)),
483
- 0 0 0 var(--cirth-outline-width) var(--cirth-primary-focus);
484
- }
485
-
486
- .cirth [type="reset"][aria-current]:not([aria-current="false"]):focus {
487
- --cirth-box-shadow: var(--cirth-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)),
488
- 0 0 0 var(--cirth-outline-width) var(--cirth-primary-focus);
489
- }
490
-
491
- .cirth [type="button"]:focus {
492
- --cirth-box-shadow: var(--cirth-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)),
493
- 0 0 0 var(--cirth-outline-width) var(--cirth-primary-focus);
494
- }
495
-
496
- .cirth [type="button"][aria-current]:not([aria-current="false"]):focus {
497
- --cirth-box-shadow: var(--cirth-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)),
498
- 0 0 0 var(--cirth-outline-width) var(--cirth-primary-focus);
499
- }
500
-
501
- .cirth [type="file"]::file-selector-button:focus {
502
- --cirth-box-shadow: var(--cirth-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)),
503
- 0 0 0 var(--cirth-outline-width) var(--cirth-primary-focus);
504
- }
505
-
506
- .cirth [type="file"]::file-selector-button:is():focus {
507
- --cirth-box-shadow: var(--cirth-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)),
508
- 0 0 0 var(--cirth-outline-width) var(--cirth-primary-focus);
509
- }
510
-
511
- .cirth [type="submit"] {
512
- margin-bottom: var(--cirth-spacing);
513
- }
514
-
515
- .cirth [type="reset"] {
516
- margin-bottom: var(--cirth-spacing);
517
- }
518
-
519
- .cirth [type="button"] {
520
- margin-bottom: var(--cirth-spacing);
521
- }
522
-
523
- .cirth [type="reset"] {
524
- --cirth-background-color: var(--cirth-secondary-background);
525
- --cirth-border-color: var(--cirth-secondary-border);
526
- --cirth-color: var(--cirth-secondary-inverse);
527
- cursor: pointer;
528
- }
529
-
530
- .cirth [type="file"]::file-selector-button {
531
- --cirth-background-color: var(--cirth-secondary-background);
532
- --cirth-border-color: var(--cirth-secondary-border);
533
- --cirth-color: var(--cirth-secondary-inverse);
534
- cursor: pointer;
535
- }
536
-
537
- .cirth [type="reset"]:is([aria-current]:not([aria-current="false"]), :hover, :active, :focus) {
538
- --cirth-background-color: var(--cirth-secondary-hover-background);
539
- --cirth-border-color: var(--cirth-secondary-hover-border);
540
- --cirth-color: var(--cirth-secondary-inverse);
541
- }
542
-
543
- .cirth [type="file"]::file-selector-button:is(:hover, :active, :focus) {
544
- --cirth-background-color: var(--cirth-secondary-hover-background);
545
- --cirth-border-color: var(--cirth-secondary-hover-border);
546
- --cirth-color: var(--cirth-secondary-inverse);
547
- }
548
-
549
- .cirth [type="reset"]:focus {
550
- --cirth-box-shadow: var(--cirth-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)),
551
- 0 0 0 var(--cirth-outline-width) var(--cirth-secondary-focus);
552
- }
553
-
554
- .cirth [type="file"]::file-selector-button:focus {
555
- --cirth-box-shadow: var(--cirth-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)),
556
- 0 0 0 var(--cirth-outline-width) var(--cirth-secondary-focus);
557
- }
558
-
559
- .cirth :where(button, [type="submit"], [type="reset"], [type="button"], [role="button"])[disabled] {
560
- opacity: var(--cirth-opacity-disabled);
561
- pointer-events: none;
562
- }
563
-
564
- .cirth :where(fieldset[disabled]) :is(button, [type="submit"], [type="button"], [type="reset"], [role="button"]) {
565
- opacity: var(--cirth-opacity-disabled);
566
- pointer-events: none;
567
- }
568
-
569
- .cirth :where(table) {
570
- border-collapse: collapse;
571
- border-spacing: 0;
572
- text-indent: 0;
573
- width: 100%;
574
- }
575
-
576
- .cirth th, .cirth td {
577
- padding: calc(var(--cirth-spacing) / 2) var(--cirth-spacing);
578
- border-bottom: var(--cirth-border-width) solid var(--cirth-table-border-color);
579
- background-color: var(--cirth-background-color);
580
- color: var(--cirth-color);
581
- font-weight: var(--cirth-font-weight);
582
- text-align: left;
583
- text-align: start;
584
- }
585
-
586
- .cirth tfoot th, .cirth tfoot td {
587
- border-top: var(--cirth-border-width) solid var(--cirth-table-border-color);
588
- border-bottom: 0;
589
- }
590
-
591
- .cirth table.striped tbody tr:nth-child(odd) th, .cirth table.striped tbody tr:nth-child(odd) td {
592
- background-color: var(--cirth-table-row-stripped-background-color);
593
- }
594
-
595
- .cirth :where(audio, canvas, iframe, img, svg, video) {
596
- vertical-align: middle;
597
- }
598
-
599
- .cirth audio, .cirth video {
600
- display: inline-block;
601
- }
602
-
603
- .cirth audio:not([controls]) {
604
- height: 0;
605
- display: none;
606
- }
607
-
608
- .cirth :where(iframe) {
609
- border-style: none;
610
- }
611
-
612
- .cirth img {
613
- border-style: none;
614
- max-width: 100%;
615
- height: auto;
616
- }
617
-
618
- .cirth :where(svg:not([fill])) {
619
- fill: currentColor;
620
- }
621
-
622
- .cirth svg:not(:root) {
623
- overflow: hidden;
624
- }
625
-
626
- .cirth svg:not(:host) {
627
- overflow: hidden;
628
- }
629
-
630
- .cirth pre, .cirth code, .cirth kbd, .cirth samp {
631
- font-size: .875em;
632
- font-family: var(--cirth-font-family);
633
- }
634
-
635
- .cirth pre code, .cirth pre samp {
636
- font-size: inherit;
637
- font-family: inherit;
638
- }
639
-
640
- .cirth pre {
641
- -ms-overflow-style: scrollbar;
642
- overflow: auto;
643
- }
644
-
645
- .cirth pre, .cirth code, .cirth kbd, .cirth samp {
646
- border-radius: var(--cirth-border-radius);
647
- background: var(--cirth-code-background-color);
648
- color: var(--cirth-code-color);
649
- font-weight: var(--cirth-font-weight);
650
- line-height: initial;
651
- }
652
-
653
- .cirth code, .cirth kbd, .cirth samp {
654
- padding: .375rem;
655
- display: inline-block;
656
- }
657
-
658
- .cirth pre {
659
- margin-bottom: var(--cirth-spacing);
660
- display: block;
661
- overflow-x: auto;
662
- }
663
-
664
- .cirth pre > code, .cirth pre > samp {
665
- padding: var(--cirth-spacing);
666
- line-height: var(--cirth-line-height);
667
- background: none;
668
- display: block;
669
- }
670
-
671
- .cirth kbd {
672
- background-color: var(--cirth-code-kbd-background-color);
673
- color: var(--cirth-code-kbd-color);
674
- vertical-align: baseline;
675
- }
676
-
677
- .cirth figure {
678
- margin: 0;
679
- padding: 0;
680
- display: block;
681
- }
682
-
683
- .cirth figure figcaption {
684
- padding: calc(var(--cirth-spacing) * .5) 0;
685
- color: var(--cirth-muted-color);
686
- }
687
-
688
- .cirth hr {
689
- height: 0;
690
- margin: var(--cirth-typography-spacing-vertical) 0;
691
- border: 0;
692
- border-top: var(--cirth-border-width-1) solid var(--cirth-muted-border-color);
693
- color: inherit;
694
- }
695
-
696
- .cirth [hidden], .cirth template {
697
- display: none;
698
- }
699
-
700
- .cirth canvas {
701
- display: inline-block;
702
- }
703
-
704
- .cirth input, .cirth optgroup, .cirth select, .cirth textarea {
705
- font-size: var(--cirth-font-size-md);
706
- line-height: var(--cirth-line-height);
707
- letter-spacing: inherit;
708
- margin: 0;
709
- font-family: inherit;
710
- }
711
-
712
- .cirth input {
713
- overflow: visible;
714
- }
715
-
716
- .cirth select {
717
- text-transform: none;
718
- }
719
-
720
- .cirth legend {
721
- max-width: 100%;
722
- color: inherit;
723
- white-space: normal;
724
- padding: 0;
725
- }
726
-
727
- .cirth textarea {
728
- overflow: auto;
729
- }
730
-
731
- .cirth [type="checkbox"] {
732
- padding: 0;
733
- }
734
-
735
- .cirth [type="radio"] {
736
- padding: 0;
737
- }
738
-
739
- .cirth ::-webkit-inner-spin-button {
740
- height: auto;
741
- }
742
-
743
- .cirth ::-webkit-outer-spin-button {
744
- height: auto;
745
- }
746
-
747
- .cirth [type="search"] {
748
- -webkit-appearance: textfield;
749
- outline-offset: -2px;
750
- }
751
-
752
- .cirth [type="search"]::-webkit-search-decoration {
753
- -webkit-appearance: none;
754
- }
755
-
756
- .cirth ::-webkit-file-upload-button {
757
- -webkit-appearance: button;
758
- font: inherit;
759
- }
760
-
761
- .cirth ::-moz-focus-inner {
762
- border-style: none;
763
- padding: 0;
764
- }
765
-
766
- .cirth :-moz-focusring {
767
- outline: none;
768
- }
769
-
770
- .cirth :-moz-ui-invalid {
771
- box-shadow: none;
772
- }
773
-
774
- .cirth ::-ms-expand {
775
- display: none;
776
- }
777
-
778
- .cirth [type="file"] {
779
- border-width: 0;
780
- padding: 0;
781
- }
782
-
783
- .cirth [type="range"] {
784
- border-width: 0;
785
- padding: 0;
786
- }
787
-
788
- .cirth input:not(:is([type="checkbox"], [type="radio"], [type="range"])) {
789
- height: calc(var(--cirth-size-4) * var(--cirth-line-height) + var(--cirth-form-element-spacing-vertical) * 2 + var(--cirth-border-width) * 2);
790
- }
791
-
792
- .cirth fieldset {
793
- width: 100%;
794
- margin: 0;
795
- margin-bottom: var(--cirth-spacing);
796
- border: 0;
797
- padding: 0;
798
- }
799
-
800
- .cirth label, .cirth fieldset legend {
801
- margin-bottom: calc(var(--cirth-spacing) * .375);
802
- color: var(--cirth-color);
803
- font-weight: var(--cirth-form-label-font-weight, var(--cirth-font-weight));
804
- display: block;
805
- }
806
-
807
- .cirth fieldset legend {
808
- margin-bottom: calc(var(--cirth-spacing) * .5);
809
- }
810
-
811
- .cirth select, .cirth textarea {
812
- width: 100%;
813
- }
814
-
815
- .cirth input:not(:is([type="checkbox"], [type="radio"])) {
816
- width: 100%;
817
- }
818
-
819
- .cirth button[type="submit"] {
820
- width: 100%;
821
- }
822
-
823
- .cirth select, .cirth textarea {
824
- appearance: none;
825
- padding: var(--cirth-form-element-spacing-vertical) var(--cirth-form-element-spacing-horizontal);
826
- }
827
-
828
- .cirth input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="file"])) {
829
- appearance: none;
830
- padding: var(--cirth-form-element-spacing-vertical) var(--cirth-form-element-spacing-horizontal);
831
- }
832
-
833
- .cirth input, .cirth select, .cirth textarea {
834
- --cirth-background-color: var(--cirth-form-element-background-color);
835
- --cirth-border-color: var(--cirth-form-element-border-color);
836
- --cirth-color: var(--cirth-form-element-color);
837
- --cirth-box-shadow: none;
838
- border: var(--cirth-border-width) solid var(--cirth-border-color);
839
- border-radius: var(--cirth-border-radius);
840
- background-color: var(--cirth-background-color);
841
- box-shadow: var(--cirth-box-shadow);
842
- color: var(--cirth-color);
843
- font-weight: var(--cirth-font-weight);
844
- transition: background-color var(--cirth-transition), border-color var(--cirth-transition), color var(--cirth-transition), box-shadow var(--cirth-transition);
845
- outline: none;
846
- }
847
-
848
- .cirth input:not(:is([type="submit"], [type="button"], [type="reset"], [type="checkbox"], [type="radio"], [readonly])):is(:active, :focus) {
849
- --cirth-background-color: var(--cirth-form-element-active-background-color);
850
- }
851
-
852
- .cirth :where(select, textarea):not([readonly]):is(:active, :focus) {
853
- --cirth-background-color: var(--cirth-form-element-active-background-color);
854
- }
855
-
856
- .cirth input:not(:is([type="submit"], [type="button"], [type="reset"], [role="switch"], [readonly])):is(:active, :focus) {
857
- --cirth-border-color: var(--cirth-form-element-active-border-color);
858
- }
859
-
860
- .cirth :where(select, textarea):not([readonly]):is(:active, :focus) {
861
- --cirth-border-color: var(--cirth-form-element-active-border-color);
862
- }
863
-
864
- .cirth input:not(:is([type="submit"], [type="button"], [type="reset"], [type="range"], [type="file"], [readonly])):focus {
865
- --cirth-box-shadow: 0 0 0 var(--cirth-outline-width)
866
- var(--cirth-form-element-focus-color);
867
- }
868
-
869
- .cirth :where(select, textarea):not([readonly]):focus {
870
- --cirth-box-shadow: 0 0 0 var(--cirth-outline-width)
871
- var(--cirth-form-element-focus-color);
872
- }
873
-
874
- .cirth select[disabled], .cirth textarea[disabled], .cirth label[aria-disabled="true"] {
875
- opacity: var(--cirth-form-element-disabled-opacity);
876
- pointer-events: none;
877
- }
878
-
879
- .cirth input:not(:is([type="submit"], [type="button"], [type="reset"]))[disabled] {
880
- opacity: var(--cirth-form-element-disabled-opacity);
881
- pointer-events: none;
882
- }
883
-
884
- .cirth :where(fieldset[disabled]) :is(input:not(:is([type="submit"], [type="button"], [type="reset"])), select, textarea) {
885
- opacity: var(--cirth-form-element-disabled-opacity);
886
- pointer-events: none;
887
- }
888
-
889
- .cirth label[aria-disabled="true"] input[disabled] {
890
- opacity: 1;
891
- }
892
-
893
- .cirth :where(input, select, textarea):not(:is([type="checkbox"], [type="radio"], [type="date"], [type="datetime-local"], [type="month"], [type="time"], [type="week"], [type="range"]))[aria-invalid] {
894
- padding-right: calc(var(--cirth-form-element-spacing-horizontal) + var(--cirth-space-6));
895
- padding-left: var(--cirth-form-element-spacing-horizontal);
896
- background-position: center right var(--cirth-space-3);
897
- background-size: var(--cirth-size-4) auto;
898
- background-repeat: no-repeat;
899
- padding-inline-start: var(--cirth-form-element-spacing-horizontal);
900
- padding-inline-end: calc(var(--cirth-form-element-spacing-horizontal) + var(--cirth-space-6));
901
- }
902
-
903
- .cirth :where(input, select, textarea):not(:is([type="checkbox"], [type="radio"], [type="date"], [type="datetime-local"], [type="month"], [type="time"], [type="week"], [type="range"]))[aria-invalid="false"]:not(select) {
904
- background-image: var(--cirth-icon-valid);
905
- }
906
-
907
- .cirth :where(input, select, textarea):not(:is([type="checkbox"], [type="radio"], [type="date"], [type="datetime-local"], [type="month"], [type="time"], [type="week"], [type="range"]))[aria-invalid="true"]:not(select) {
908
- background-image: var(--cirth-icon-invalid);
909
- }
910
-
911
- .cirth :where(input, select, textarea)[aria-invalid="false"] {
912
- --cirth-border-color: var(--cirth-form-element-valid-border-color);
913
- }
914
-
915
- .cirth :where(input, select, textarea)[aria-invalid="false"]:is(:active, :focus) {
916
- --cirth-border-color: var(--cirth-form-element-valid-active-border-color);
917
- }
918
-
919
- .cirth :where(input, select, textarea)[aria-invalid="false"]:is(:active, :focus):not(:is([type="checkbox"], [type="radio"])) {
920
- --cirth-box-shadow: 0 0 0 var(--cirth-outline-width)
921
- var(--cirth-form-element-valid-focus-color);
922
- }
923
-
924
- .cirth :where(input, select, textarea)[aria-invalid="true"] {
925
- --cirth-border-color: var(--cirth-form-element-invalid-border-color);
926
- }
927
-
928
- .cirth :where(input, select, textarea)[aria-invalid="true"]:is(:active, :focus) {
929
- --cirth-border-color: var(--cirth-form-element-invalid-active-border-color);
930
- }
931
-
932
- .cirth :where(input, select, textarea)[aria-invalid="true"]:is(:active, :focus):not(:is([type="checkbox"], [type="radio"])) {
933
- --cirth-box-shadow: 0 0 0 var(--cirth-outline-width)
934
- var(--cirth-form-element-invalid-focus-color);
935
- }
936
-
937
- [dir="rtl"] .cirth :where(input, select, textarea):not(:is([type="checkbox"], [type="radio"])):is([aria-invalid], [aria-invalid="true"], [aria-invalid="false"]) {
938
- background-position: center left var(--cirth-space-3);
939
- }
940
-
941
- .cirth select:invalid {
942
- color: var(--cirth-form-element-placeholder-color);
943
- opacity: 1;
944
- }
945
-
946
- .cirth input::placeholder {
947
- color: var(--cirth-form-element-placeholder-color);
948
- opacity: 1;
949
- }
950
-
951
- .cirth input::-webkit-input-placeholder {
952
- color: var(--cirth-form-element-placeholder-color);
953
- opacity: 1;
954
- }
955
-
956
- .cirth textarea::placeholder {
957
- color: var(--cirth-form-element-placeholder-color);
958
- opacity: 1;
959
- }
960
-
961
- .cirth textarea::-webkit-input-placeholder {
962
- color: var(--cirth-form-element-placeholder-color);
963
- opacity: 1;
964
- }
965
-
966
- .cirth select, .cirth textarea {
967
- margin-bottom: var(--cirth-spacing);
968
- }
969
-
970
- .cirth input:not(:is([type="checkbox"], [type="radio"])) {
971
- margin-bottom: var(--cirth-spacing);
972
- }
973
-
974
- .cirth select::-ms-expand {
975
- background-color: rgba(0, 0, 0, 0);
976
- border: 0;
977
- }
978
-
979
- .cirth select:not(:is([multiple], [size])) {
980
- padding-right: calc(var(--cirth-form-element-spacing-horizontal) + var(--cirth-space-6));
981
- padding-left: var(--cirth-form-element-spacing-horizontal);
982
- background-image: var(--cirth-icon-chevron);
983
- background-position: center right var(--cirth-space-3);
984
- background-size: var(--cirth-size-4) auto;
985
- background-repeat: no-repeat;
986
- padding-inline-start: var(--cirth-form-element-spacing-horizontal);
987
- padding-inline-end: calc(var(--cirth-form-element-spacing-horizontal) + var(--cirth-space-6));
988
- }
989
-
990
- .cirth select[multiple] option:checked {
991
- background: var(--cirth-form-element-selected-background-color);
992
- color: var(--cirth-form-element-color);
993
- }
994
-
995
- [dir="rtl"] .cirth select:not(:is([multiple], [size])) {
996
- background-position: center left var(--cirth-space-3);
997
- }
998
-
999
- .cirth textarea {
1000
- resize: vertical;
1001
- display: block;
1002
- }
1003
-
1004
- .cirth textarea[aria-invalid] {
1005
- --cirth-icon-height: calc(var(--cirth-size-4) * var(--cirth-line-height) +
1006
- var(--cirth-form-element-spacing-vertical) * 2 +
1007
- var(--cirth-border-width) * 2);
1008
- background-position: top right var(--cirth-space-3);
1009
- background-size: var(--cirth-size-4) var(--cirth-icon-height);
1010
- }
1011
-
1012
- .cirth :where(input, select, textarea, fieldset) + small {
1013
- width: 100%;
1014
- margin-top: calc(var(--cirth-spacing) * -.75);
1015
- margin-bottom: var(--cirth-spacing);
1016
- color: var(--cirth-muted-color);
1017
- display: block;
1018
- }
1019
-
1020
- .cirth :where(input, select, textarea, fieldset)[aria-invalid="false"] + small {
1021
- color: var(--cirth-ins-color);
1022
- }
1023
-
1024
- .cirth :where(input, select, textarea, fieldset)[aria-invalid="true"] + small {
1025
- color: var(--cirth-del-color);
1026
- }
1027
-
1028
- .cirth label > :where(input, select, textarea) {
1029
- margin-top: calc(var(--cirth-spacing) * .25);
1030
- }
1031
-
1032
- .cirth label:has([type="checkbox"], [type="radio"]) {
1033
- cursor: pointer;
1034
- width: fit-content;
1035
- }
1036
-
1037
- .cirth [type="checkbox"] {
1038
- appearance: none;
1039
- margin-top: -.125em;
1040
- border-width: var(--cirth-border-width);
1041
- vertical-align: middle;
1042
- cursor: pointer;
1043
- width: 1.25em;
1044
- height: 1.25em;
1045
- margin-inline-end: .5em;
1046
- }
1047
-
1048
- .cirth [type="radio"] {
1049
- appearance: none;
1050
- margin-top: -.125em;
1051
- border-width: var(--cirth-border-width);
1052
- vertical-align: middle;
1053
- cursor: pointer;
1054
- width: 1.25em;
1055
- height: 1.25em;
1056
- margin-inline-end: .5em;
1057
- }
1058
-
1059
- .cirth [type="checkbox"]::-ms-check {
1060
- display: none;
1061
- }
1062
-
1063
- .cirth [type="radio"]::-ms-check {
1064
- display: none;
1065
- }
1066
-
1067
- .cirth [type="checkbox"]:checked {
1068
- --cirth-background-color: var(--cirth-primary-background);
1069
- --cirth-border-color: var(--cirth-primary-border);
1070
- background-image: var(--cirth-icon-checkbox);
1071
- background-position: center;
1072
- background-repeat: no-repeat;
1073
- background-size: .75em;
1074
- }
1075
-
1076
- .cirth [type="checkbox"]:checked:active {
1077
- --cirth-background-color: var(--cirth-primary-background);
1078
- --cirth-border-color: var(--cirth-primary-border);
1079
- background-image: var(--cirth-icon-checkbox);
1080
- background-position: center;
1081
- background-repeat: no-repeat;
1082
- background-size: .75em;
1083
- }
1084
-
1085
- .cirth [type="checkbox"]:checked:focus {
1086
- --cirth-background-color: var(--cirth-primary-background);
1087
- --cirth-border-color: var(--cirth-primary-border);
1088
- background-image: var(--cirth-icon-checkbox);
1089
- background-position: center;
1090
- background-repeat: no-repeat;
1091
- background-size: .75em;
1092
- }
1093
-
1094
- .cirth [type="radio"]:checked {
1095
- --cirth-background-color: var(--cirth-primary-background);
1096
- --cirth-border-color: var(--cirth-primary-border);
1097
- background-image: var(--cirth-icon-checkbox);
1098
- background-position: center;
1099
- background-repeat: no-repeat;
1100
- background-size: .75em;
1101
- }
1102
-
1103
- .cirth [type="radio"]:checked:active {
1104
- --cirth-background-color: var(--cirth-primary-background);
1105
- --cirth-border-color: var(--cirth-primary-border);
1106
- background-image: var(--cirth-icon-checkbox);
1107
- background-position: center;
1108
- background-repeat: no-repeat;
1109
- background-size: .75em;
1110
- }
1111
-
1112
- .cirth [type="radio"]:checked:focus {
1113
- --cirth-background-color: var(--cirth-primary-background);
1114
- --cirth-border-color: var(--cirth-primary-border);
1115
- background-image: var(--cirth-icon-checkbox);
1116
- background-position: center;
1117
- background-repeat: no-repeat;
1118
- background-size: .75em;
1119
- }
1120
-
1121
- .cirth [type="checkbox"] ~ label {
1122
- cursor: pointer;
1123
- margin-bottom: 0;
1124
- display: inline-block;
1125
- }
1126
-
1127
- .cirth [type="radio"] ~ label {
1128
- cursor: pointer;
1129
- margin-bottom: 0;
1130
- display: inline-block;
1131
- }
1132
-
1133
- .cirth [type="checkbox"] ~ label:not(:last-of-type) {
1134
- margin-inline-end: 1em;
1135
- }
1136
-
1137
- .cirth [type="radio"] ~ label:not(:last-of-type) {
1138
- margin-inline-end: 1em;
1139
- }
1140
-
1141
- .cirth [type="checkbox"]:indeterminate {
1142
- --cirth-background-color: var(--cirth-primary-background);
1143
- --cirth-border-color: var(--cirth-primary-border);
1144
- background-image: var(--cirth-icon-minus);
1145
- background-position: center;
1146
- background-repeat: no-repeat;
1147
- background-size: .75em;
1148
- }
1149
-
1150
- .cirth [type="radio"] {
1151
- border-radius: 50%;
1152
- }
1153
-
1154
- .cirth [type="radio"]:checked {
1155
- --cirth-background-color: var(--cirth-primary-inverse);
1156
- background-image: none;
1157
- border-width: .35em;
1158
- }
1159
-
1160
- .cirth [type="radio"]:checked:active {
1161
- --cirth-background-color: var(--cirth-primary-inverse);
1162
- background-image: none;
1163
- border-width: .35em;
1164
- }
1165
-
1166
- .cirth [type="radio"]:checked:focus {
1167
- --cirth-background-color: var(--cirth-primary-inverse);
1168
- background-image: none;
1169
- border-width: .35em;
1170
- }
1171
-
1172
- .cirth [type="checkbox"][role="switch"] {
1173
- --cirth-background-color: var(--cirth-switch-background-color);
1174
- --cirth-color: var(--cirth-switch-color);
1175
- border: var(--cirth-border-width) solid var(--cirth-border-color);
1176
- background-color: var(--cirth-background-color);
1177
- border-radius: 1.25em;
1178
- width: 2.25em;
1179
- height: 1.25em;
1180
- line-height: 1.25em;
1181
- }
1182
-
1183
- .cirth [type="checkbox"][role="switch"]:not([aria-invalid]) {
1184
- --cirth-border-color: var(--cirth-switch-background-color);
1185
- }
1186
-
1187
- .cirth [type="checkbox"][role="switch"]:before {
1188
- aspect-ratio: 1;
1189
- background-color: var(--cirth-color);
1190
- height: 100%;
1191
- box-shadow: var(--cirth-switch-thumb-box-shadow);
1192
- content: "";
1193
- transition: margin var(--cirth-duration-fast) var(--cirth-ease-in-out);
1194
- border-radius: 50%;
1195
- display: block;
1196
- }
1197
-
1198
- .cirth [type="checkbox"][role="switch"]:focus {
1199
- --cirth-background-color: var(--cirth-switch-background-color);
1200
- --cirth-border-color: var(--cirth-switch-background-color);
1201
- }
1202
-
1203
- .cirth [type="checkbox"][role="switch"]:checked {
1204
- --cirth-background-color: var(--cirth-switch-checked-background-color);
1205
- --cirth-border-color: var(--cirth-switch-checked-background-color);
1206
- background-image: none;
1207
- }
1208
-
1209
- .cirth [type="checkbox"][role="switch"]:checked:before {
1210
- margin-inline-start: 1em;
1211
- }
1212
-
1213
- .cirth [type="checkbox"][role="switch"][disabled] {
1214
- --cirth-background-color: var(--cirth-border-color);
1215
- }
1216
-
1217
- .cirth [type="checkbox"][aria-invalid="false"]:checked {
1218
- --cirth-background-color: var(--cirth-form-element-valid-border-color);
1219
- }
1220
-
1221
- .cirth [type="checkbox"][aria-invalid="false"]:checked:active {
1222
- --cirth-background-color: var(--cirth-form-element-valid-border-color);
1223
- }
1224
-
1225
- .cirth [type="checkbox"][aria-invalid="false"]:checked:focus {
1226
- --cirth-background-color: var(--cirth-form-element-valid-border-color);
1227
- }
1228
-
1229
- .cirth [type="checkbox"][role="switch"][aria-invalid="false"]:checked {
1230
- --cirth-background-color: var(--cirth-form-element-valid-border-color);
1231
- }
1232
-
1233
- .cirth [type="checkbox"][role="switch"][aria-invalid="false"]:checked:active {
1234
- --cirth-background-color: var(--cirth-form-element-valid-border-color);
1235
- }
1236
-
1237
- .cirth [type="checkbox"][role="switch"][aria-invalid="false"]:checked:focus {
1238
- --cirth-background-color: var(--cirth-form-element-valid-border-color);
1239
- }
1240
-
1241
- .cirth [type="checkbox"]:checked[aria-invalid="true"] {
1242
- --cirth-background-color: var(--cirth-form-element-invalid-border-color);
1243
- }
1244
-
1245
- .cirth [type="checkbox"]:checked:active[aria-invalid="true"] {
1246
- --cirth-background-color: var(--cirth-form-element-invalid-border-color);
1247
- }
1248
-
1249
- .cirth [type="checkbox"]:checked:focus[aria-invalid="true"] {
1250
- --cirth-background-color: var(--cirth-form-element-invalid-border-color);
1251
- }
1252
-
1253
- .cirth [type="checkbox"][role="switch"]:checked[aria-invalid="true"] {
1254
- --cirth-background-color: var(--cirth-form-element-invalid-border-color);
1255
- }
1256
-
1257
- .cirth [type="checkbox"][role="switch"]:checked:active[aria-invalid="true"] {
1258
- --cirth-background-color: var(--cirth-form-element-invalid-border-color);
1259
- }
1260
-
1261
- .cirth [type="checkbox"][role="switch"]:checked:focus[aria-invalid="true"] {
1262
- --cirth-background-color: var(--cirth-form-element-invalid-border-color);
1263
- }
1264
-
1265
- .cirth [type="checkbox"][aria-invalid="false"]:checked {
1266
- --cirth-border-color: var(--cirth-form-element-valid-border-color);
1267
- }
1268
-
1269
- .cirth [type="checkbox"][aria-invalid="false"]:checked:active {
1270
- --cirth-border-color: var(--cirth-form-element-valid-border-color);
1271
- }
1272
-
1273
- .cirth [type="checkbox"][aria-invalid="false"]:checked:focus {
1274
- --cirth-border-color: var(--cirth-form-element-valid-border-color);
1275
- }
1276
-
1277
- .cirth [type="radio"][aria-invalid="false"]:checked {
1278
- --cirth-border-color: var(--cirth-form-element-valid-border-color);
1279
- }
1280
-
1281
- .cirth [type="radio"][aria-invalid="false"]:checked:active {
1282
- --cirth-border-color: var(--cirth-form-element-valid-border-color);
1283
- }
1284
-
1285
- .cirth [type="radio"][aria-invalid="false"]:checked:focus {
1286
- --cirth-border-color: var(--cirth-form-element-valid-border-color);
1287
- }
1288
-
1289
- .cirth [type="checkbox"][role="switch"][aria-invalid="false"]:checked {
1290
- --cirth-border-color: var(--cirth-form-element-valid-border-color);
1291
- }
1292
-
1293
- .cirth [type="checkbox"][role="switch"][aria-invalid="false"]:checked:active {
1294
- --cirth-border-color: var(--cirth-form-element-valid-border-color);
1295
- }
1296
-
1297
- .cirth [type="checkbox"][role="switch"][aria-invalid="false"]:checked:focus {
1298
- --cirth-border-color: var(--cirth-form-element-valid-border-color);
1299
- }
1300
-
1301
- .cirth [type="checkbox"]:checked[aria-invalid="true"] {
1302
- --cirth-border-color: var(--cirth-form-element-invalid-border-color);
1303
- }
1304
-
1305
- .cirth [type="checkbox"]:checked:active[aria-invalid="true"] {
1306
- --cirth-border-color: var(--cirth-form-element-invalid-border-color);
1307
- }
1308
-
1309
- .cirth [type="checkbox"]:checked:focus[aria-invalid="true"] {
1310
- --cirth-border-color: var(--cirth-form-element-invalid-border-color);
1311
- }
1312
-
1313
- .cirth [type="radio"]:checked[aria-invalid="true"] {
1314
- --cirth-border-color: var(--cirth-form-element-invalid-border-color);
1315
- }
1316
-
1317
- .cirth [type="radio"]:checked:active[aria-invalid="true"] {
1318
- --cirth-border-color: var(--cirth-form-element-invalid-border-color);
1319
- }
1320
-
1321
- .cirth [type="radio"]:checked:focus[aria-invalid="true"] {
1322
- --cirth-border-color: var(--cirth-form-element-invalid-border-color);
1323
- }
1324
-
1325
- .cirth [type="checkbox"][role="switch"]:checked[aria-invalid="true"] {
1326
- --cirth-border-color: var(--cirth-form-element-invalid-border-color);
1327
- }
1328
-
1329
- .cirth [type="checkbox"][role="switch"]:checked:active[aria-invalid="true"] {
1330
- --cirth-border-color: var(--cirth-form-element-invalid-border-color);
1331
- }
1332
-
1333
- .cirth [type="checkbox"][role="switch"]:checked:focus[aria-invalid="true"] {
1334
- --cirth-border-color: var(--cirth-form-element-invalid-border-color);
1335
- }
1336
-
1337
- .cirth [type="color"]::-webkit-color-swatch-wrapper {
1338
- padding: 0;
1339
- }
1340
-
1341
- .cirth [type="color"]::-moz-focus-inner {
1342
- padding: 0;
1343
- }
1344
-
1345
- .cirth [type="color"]::-webkit-color-swatch {
1346
- border-radius: calc(var(--cirth-border-radius) * .5);
1347
- border: 0;
1348
- }
1349
-
1350
- .cirth [type="color"]::-moz-color-swatch {
1351
- border-radius: calc(var(--cirth-border-radius) * .5);
1352
- border: 0;
1353
- }
1354
-
1355
- .cirth input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="file"])):is([type="date"], [type="datetime-local"], [type="month"], [type="time"], [type="week"]) {
1356
- --cirth-icon-position: var(--cirth-space-3);
1357
- --cirth-icon-width: var(--cirth-size-4);
1358
- padding-right: calc(var(--cirth-icon-width) + var(--cirth-icon-position));
1359
- background-image: var(--cirth-icon-date);
1360
- background-position: center right var(--cirth-icon-position);
1361
- background-size: var(--cirth-icon-width) auto;
1362
- background-repeat: no-repeat;
1363
- }
1364
-
1365
- .cirth input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="file"]))[type="time"] {
1366
- background-image: var(--cirth-icon-time);
1367
- }
1368
-
1369
- .cirth [type="date"]::-webkit-calendar-picker-indicator {
1370
- width: var(--cirth-icon-width);
1371
- margin-right: calc(var(--cirth-icon-width) * -1);
1372
- margin-left: var(--cirth-icon-position);
1373
- opacity: 0;
1374
- }
1375
-
1376
- .cirth [type="datetime-local"]::-webkit-calendar-picker-indicator {
1377
- width: var(--cirth-icon-width);
1378
- margin-right: calc(var(--cirth-icon-width) * -1);
1379
- margin-left: var(--cirth-icon-position);
1380
- opacity: 0;
1381
- }
1382
-
1383
- .cirth [type="month"]::-webkit-calendar-picker-indicator {
1384
- width: var(--cirth-icon-width);
1385
- margin-right: calc(var(--cirth-icon-width) * -1);
1386
- margin-left: var(--cirth-icon-position);
1387
- opacity: 0;
1388
- }
1389
-
1390
- .cirth [type="time"]::-webkit-calendar-picker-indicator {
1391
- width: var(--cirth-icon-width);
1392
- margin-right: calc(var(--cirth-icon-width) * -1);
1393
- margin-left: var(--cirth-icon-position);
1394
- opacity: 0;
1395
- }
1396
-
1397
- .cirth [type="week"]::-webkit-calendar-picker-indicator {
1398
- width: var(--cirth-icon-width);
1399
- margin-right: calc(var(--cirth-icon-width) * -1);
1400
- margin-left: var(--cirth-icon-position);
1401
- opacity: 0;
1402
- }
1403
-
1404
- @-moz-document url-prefix() {
1405
- .cirth [type="date"] {
1406
- padding-right: var(--cirth-form-element-spacing-horizontal);
1407
- background-image: none;
1408
- }
1409
-
1410
- .cirth [type="datetime-local"] {
1411
- padding-right: var(--cirth-form-element-spacing-horizontal);
1412
- background-image: none;
1413
- }
1414
-
1415
- .cirth [type="month"] {
1416
- padding-right: var(--cirth-form-element-spacing-horizontal);
1417
- background-image: none;
1418
- }
1419
-
1420
- .cirth [type="time"] {
1421
- padding-right: var(--cirth-form-element-spacing-horizontal);
1422
- background-image: none;
1423
- }
1424
-
1425
- .cirth [type="week"] {
1426
- padding-right: var(--cirth-form-element-spacing-horizontal);
1427
- background-image: none;
1428
- }
1429
- }
1430
-
1431
- [dir="rtl"] .cirth :is([type="date"], [type="datetime-local"], [type="month"], [type="time"], [type="week"]) {
1432
- text-align: right;
1433
- }
1434
-
1435
- .cirth [type="file"] {
1436
- --cirth-color: var(--cirth-muted-color);
1437
- margin-left: calc(var(--cirth-outline-width) * -1);
1438
- padding: calc(var(--cirth-form-element-spacing-vertical) * .5) 0;
1439
- padding-left: var(--cirth-outline-width);
1440
- background: none;
1441
- border: 0;
1442
- border-radius: 0;
1443
- }
1444
-
1445
- .cirth [type="file"]::file-selector-button {
1446
- margin-right: calc(var(--cirth-spacing) / 2);
1447
- padding: calc(var(--cirth-form-element-spacing-vertical) * .5) var(--cirth-form-element-spacing-horizontal);
1448
- }
1449
-
1450
- .cirth [type="file"]:is(:hover, :active, :focus)::file-selector-button {
1451
- --cirth-background-color: var(--cirth-secondary-hover-background);
1452
- --cirth-border-color: var(--cirth-secondary-hover-border);
1453
- }
1454
-
1455
- .cirth [type="file"]:focus::file-selector-button {
1456
- --cirth-box-shadow: var(--cirth-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)),
1457
- 0 0 0 var(--cirth-outline-width) var(--cirth-secondary-focus);
1458
- }
1459
-
1460
- .cirth [type="range"] {
1461
- appearance: none;
1462
- background: none;
1463
- width: 100%;
1464
- height: 1.25rem;
1465
- }
1466
-
1467
- .cirth [type="range"]::-webkit-slider-runnable-track {
1468
- border-radius: var(--cirth-border-radius);
1469
- background-color: var(--cirth-range-border-color);
1470
- width: 100%;
1471
- height: .375rem;
1472
- transition: background-color var(--cirth-transition), box-shadow var(--cirth-transition);
1473
- }
1474
-
1475
- .cirth [type="range"]::-moz-range-track {
1476
- border-radius: var(--cirth-border-radius);
1477
- background-color: var(--cirth-range-border-color);
1478
- width: 100%;
1479
- height: .375rem;
1480
- transition: background-color var(--cirth-transition), box-shadow var(--cirth-transition);
1481
- }
1482
-
1483
- .cirth [type="range"]::-ms-track {
1484
- border-radius: var(--cirth-border-radius);
1485
- background-color: var(--cirth-range-border-color);
1486
- width: 100%;
1487
- height: .375rem;
1488
- transition: background-color var(--cirth-transition), box-shadow var(--cirth-transition);
1489
- }
1490
-
1491
- .cirth [type="range"]::-webkit-slider-thumb {
1492
- -webkit-appearance: none;
1493
- border: var(--cirth-border-width-2) solid var(--cirth-range-thumb-border-color);
1494
- background-color: var(--cirth-range-thumb-color);
1495
- cursor: pointer;
1496
- width: 1.25rem;
1497
- height: 1.25rem;
1498
- transition: background-color var(--cirth-transition), transform var(--cirth-transition);
1499
- border-radius: 50%;
1500
- margin-top: -.4375rem;
1501
- }
1502
-
1503
- .cirth [type="range"]::-moz-range-thumb {
1504
- -webkit-appearance: none;
1505
- border: var(--cirth-border-width-2) solid var(--cirth-range-thumb-border-color);
1506
- background-color: var(--cirth-range-thumb-color);
1507
- cursor: pointer;
1508
- width: 1.25rem;
1509
- height: 1.25rem;
1510
- transition: background-color var(--cirth-transition), transform var(--cirth-transition);
1511
- border-radius: 50%;
1512
- margin-top: -.4375rem;
1513
- }
1514
-
1515
- .cirth [type="range"]::-ms-thumb {
1516
- -webkit-appearance: none;
1517
- border: var(--cirth-border-width-2) solid var(--cirth-range-thumb-border-color);
1518
- background-color: var(--cirth-range-thumb-color);
1519
- cursor: pointer;
1520
- width: 1.25rem;
1521
- height: 1.25rem;
1522
- transition: background-color var(--cirth-transition), transform var(--cirth-transition);
1523
- border-radius: 50%;
1524
- margin-top: -.4375rem;
1525
- }
1526
-
1527
- .cirth [type="range"]:active {
1528
- --cirth-range-border-color: var(--cirth-range-active-border-color);
1529
- --cirth-range-thumb-color: var(--cirth-range-thumb-active-color);
1530
- }
1531
-
1532
- .cirth [type="range"]:focus-within {
1533
- --cirth-range-border-color: var(--cirth-range-active-border-color);
1534
- --cirth-range-thumb-color: var(--cirth-range-thumb-active-color);
1535
- }
1536
-
1537
- .cirth [type="range"]:active::-webkit-slider-thumb {
1538
- transform: scale(1.25);
1539
- }
1540
-
1541
- .cirth [type="range"]:active::-moz-range-thumb {
1542
- transform: scale(1.25);
1543
- }
1544
-
1545
- .cirth [type="range"]:active::-ms-thumb {
1546
- transform: scale(1.25);
1547
- }
1548
-
1549
- .cirth input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="file"]))[type="search"] {
1550
- background-image: var(--cirth-icon-search);
1551
- background-position: center left calc(var(--cirth-form-element-spacing-horizontal) + .125rem);
1552
- background-repeat: no-repeat;
1553
- background-size: 1rem;
1554
- padding-inline-start: calc(var(--cirth-form-element-spacing-horizontal) + 1.75rem);
1555
- }
1556
-
1557
- .cirth input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="file"]))[type="search"][aria-invalid] {
1558
- background-position: 1.125rem, right .75rem center;
1559
- padding-inline-start: calc(var(--cirth-form-element-spacing-horizontal) + 1.75rem);
1560
- }
1561
-
1562
- .cirth input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="file"]))[type="search"][aria-invalid="false"] {
1563
- background-image: var(--cirth-icon-search), var(--cirth-icon-valid);
1564
- }
1565
-
1566
- .cirth input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="file"]))[type="search"][aria-invalid="true"] {
1567
- background-image: var(--cirth-icon-search), var(--cirth-icon-invalid);
1568
- }
1569
-
1570
- [dir="rtl"] .cirth :where(input):not(:is([type="checkbox"], [type="radio"], [type="range"], [type="file"]))[type="search"] {
1571
- background-position: right 1.125rem center;
1572
- }
1573
-
1574
- [dir="rtl"] .cirth :where(input):not(:is([type="checkbox"], [type="radio"], [type="range"], [type="file"]))[type="search"][aria-invalid] {
1575
- background-position: right 1.125rem center, .75rem;
1576
- }
1577
-
1578
- .cirth details {
1579
- margin-bottom: var(--cirth-spacing);
1580
- display: block;
1581
- }
1582
-
1583
- .cirth details summary {
1584
- line-height: var(--cirth-size-4);
1585
- cursor: pointer;
1586
- transition: color var(--cirth-transition);
1587
- list-style-type: none;
1588
- }
1589
-
1590
- .cirth details summary:not([role]) {
1591
- color: var(--cirth-accordion-close-summary-color);
1592
- }
1593
-
1594
- .cirth details summary::-webkit-details-marker {
1595
- display: none;
1596
- }
1597
-
1598
- .cirth details summary::marker {
1599
- display: none;
1600
- }
1601
-
1602
- .cirth details summary::-moz-list-bullet {
1603
- list-style-type: none;
1604
- }
1605
-
1606
- .cirth details summary:after {
1607
- width: var(--cirth-size-4);
1608
- height: var(--cirth-size-4);
1609
- float: right;
1610
- background-image: var(--cirth-icon-chevron);
1611
- background-position: 100%;
1612
- background-size: var(--cirth-size-4) auto;
1613
- content: "";
1614
- transition: transform var(--cirth-transition);
1615
- background-repeat: no-repeat;
1616
- margin-inline-start: calc(var(--cirth-spacing, var(--cirth-space-4)) * .5);
1617
- display: block;
1618
- transform: rotate(-90deg);
1619
- }
1620
-
1621
- .cirth details summary:focus {
1622
- outline: none;
1623
- }
1624
-
1625
- .cirth details summary:focus:not([role]) {
1626
- color: var(--cirth-accordion-active-summary-color);
1627
- }
1628
-
1629
- .cirth details summary:focus-visible:not([role]) {
1630
- outline: var(--cirth-outline-width) solid var(--cirth-primary-focus);
1631
- outline-offset: calc(var(--cirth-spacing, var(--cirth-space-4)) * .5);
1632
- color: var(--cirth-primary);
1633
- }
1634
-
1635
- .cirth details summary[role="button"] {
1636
- text-align: left;
1637
- width: 100%;
1638
- }
1639
-
1640
- .cirth details summary[role="button"]:after {
1641
- height: calc(var(--cirth-size-4) * var(--cirth-line-height, var(--cirth-line-height-normal)));
1642
- }
1643
-
1644
- .cirth details[open] > summary {
1645
- margin-bottom: var(--cirth-spacing);
1646
- }
1647
-
1648
- .cirth details[open] > summary:not([role]):not(:focus) {
1649
- color: var(--cirth-accordion-open-summary-color);
1650
- }
1651
-
1652
- .cirth details[open] > summary:after {
1653
- transform: rotate(0);
1654
- }
1655
-
1656
- [dir="rtl"] .cirth details summary {
1657
- text-align: right;
1658
- }
1659
-
1660
- [dir="rtl"] .cirth details summary:after {
1661
- float: left;
1662
- background-position: 0;
1663
- }
1664
-
1665
- .cirth article {
1666
- margin-bottom: var(--cirth-block-spacing-vertical);
1667
- padding: var(--cirth-block-spacing-vertical) var(--cirth-block-spacing-horizontal);
1668
- border-radius: var(--cirth-border-radius);
1669
- background: var(--cirth-card-background-color);
1670
- box-shadow: var(--cirth-card-box-shadow);
1671
- }
1672
-
1673
- .cirth article > header, .cirth article > footer {
1674
- margin-right: calc(var(--cirth-block-spacing-horizontal) * -1);
1675
- margin-left: calc(var(--cirth-block-spacing-horizontal) * -1);
1676
- padding: calc(var(--cirth-block-spacing-vertical) * .66) var(--cirth-block-spacing-horizontal);
1677
- background-color: var(--cirth-card-sectioning-background-color);
1678
- }
1679
-
1680
- .cirth article > header {
1681
- margin-top: calc(var(--cirth-block-spacing-vertical) * -1);
1682
- margin-bottom: var(--cirth-block-spacing-vertical);
1683
- border-bottom: var(--cirth-border-width) solid var(--cirth-card-border-color);
1684
- border-top-right-radius: var(--cirth-border-radius);
1685
- border-top-left-radius: var(--cirth-border-radius);
1686
- }
1687
-
1688
- .cirth article > footer {
1689
- margin-top: var(--cirth-block-spacing-vertical);
1690
- margin-bottom: calc(var(--cirth-block-spacing-vertical) * -1);
1691
- border-top: var(--cirth-border-width) solid var(--cirth-card-border-color);
1692
- border-bottom-right-radius: var(--cirth-border-radius);
1693
- border-bottom-left-radius: var(--cirth-border-radius);
1694
- }
1695
-
1696
- .cirth [role="search"], .cirth [role="group"] {
1697
- width: 100%;
1698
- margin-bottom: var(--cirth-spacing);
1699
- border-radius: var(--cirth-border-radius);
1700
- box-shadow: var(--cirth-group-box-shadow, 0 0 0 rgba(0, 0, 0, 0));
1701
- vertical-align: middle;
1702
- transition: box-shadow var(--cirth-transition);
1703
- display: inline-flex;
1704
- position: relative;
1705
- }
1706
-
1707
- .cirth [role="search"] > *, .cirth [role="search"] select, .cirth [role="group"] > *, .cirth [role="group"] select {
1708
- flex: auto;
1709
- margin-bottom: 0;
1710
- position: relative;
1711
- }
1712
-
1713
- .cirth [role="search"] input:not(:is([type="checkbox"], [type="radio"])) {
1714
- flex: auto;
1715
- margin-bottom: 0;
1716
- position: relative;
1717
- }
1718
-
1719
- .cirth [role="group"] input:not(:is([type="checkbox"], [type="radio"])) {
1720
- flex: auto;
1721
- margin-bottom: 0;
1722
- position: relative;
1723
- }
1724
-
1725
- .cirth [role="search"] > :not(:first-child), .cirth [role="search"] select:not(:first-child), .cirth [role="group"] > :not(:first-child), .cirth [role="group"] select:not(:first-child) {
1726
- border-top-left-radius: 0;
1727
- border-bottom-left-radius: 0;
1728
- margin-left: 0;
1729
- }
1730
-
1731
- .cirth [role="search"] input:not(:is([type="checkbox"], [type="radio"])):not(:first-child) {
1732
- border-top-left-radius: 0;
1733
- border-bottom-left-radius: 0;
1734
- margin-left: 0;
1735
- }
1736
-
1737
- .cirth [role="group"] input:not(:is([type="checkbox"], [type="radio"])):not(:first-child) {
1738
- border-top-left-radius: 0;
1739
- border-bottom-left-radius: 0;
1740
- margin-left: 0;
1741
- }
1742
-
1743
- .cirth [role="search"] > :not(:last-child), .cirth [role="search"] select:not(:last-child), .cirth [role="group"] > :not(:last-child), .cirth [role="group"] select:not(:last-child) {
1744
- border-top-right-radius: 0;
1745
- border-bottom-right-radius: 0;
1746
- }
1747
-
1748
- .cirth [role="search"] input:not(:is([type="checkbox"], [type="radio"])):not(:last-child) {
1749
- border-top-right-radius: 0;
1750
- border-bottom-right-radius: 0;
1751
- }
1752
-
1753
- .cirth [role="group"] input:not(:is([type="checkbox"], [type="radio"])):not(:last-child) {
1754
- border-top-right-radius: 0;
1755
- border-bottom-right-radius: 0;
1756
- }
1757
-
1758
- .cirth [role="search"] > :focus, .cirth [role="search"] select:focus, .cirth [role="group"] > :focus, .cirth [role="group"] select:focus {
1759
- z-index: 2;
1760
- }
1761
-
1762
- .cirth [role="search"] input:not(:is([type="checkbox"], [type="radio"])):focus {
1763
- z-index: 2;
1764
- }
1765
-
1766
- .cirth [role="group"] input:not(:is([type="checkbox"], [type="radio"])):focus {
1767
- z-index: 2;
1768
- }
1769
-
1770
- .cirth [role="search"] button:not(:first-child), .cirth [role="search"] [role="button"]:not(:first-child), .cirth [role="search"] select:not(:first-child), .cirth [role="group"] button:not(:first-child), .cirth [role="group"] [role="button"]:not(:first-child), .cirth [role="group"] select:not(:first-child) {
1771
- margin-left: calc(var(--cirth-border-width) * -1);
1772
- }
1773
-
1774
- .cirth [role="search"] [type="submit"]:not(:first-child) {
1775
- margin-left: calc(var(--cirth-border-width) * -1);
1776
- }
1777
-
1778
- .cirth [role="search"] [type="reset"]:not(:first-child) {
1779
- margin-left: calc(var(--cirth-border-width) * -1);
1780
- }
1781
-
1782
- .cirth [role="search"] [type="button"]:not(:first-child) {
1783
- margin-left: calc(var(--cirth-border-width) * -1);
1784
- }
1785
-
1786
- .cirth [role="search"] input:not(:is([type="checkbox"], [type="radio"])):not(:first-child) {
1787
- margin-left: calc(var(--cirth-border-width) * -1);
1788
- }
1789
-
1790
- .cirth [role="group"] [type="submit"]:not(:first-child) {
1791
- margin-left: calc(var(--cirth-border-width) * -1);
1792
- }
1793
-
1794
- .cirth [role="group"] [type="reset"]:not(:first-child) {
1795
- margin-left: calc(var(--cirth-border-width) * -1);
1796
- }
1797
-
1798
- .cirth [role="group"] [type="button"]:not(:first-child) {
1799
- margin-left: calc(var(--cirth-border-width) * -1);
1800
- }
1801
-
1802
- .cirth [role="group"] input:not(:is([type="checkbox"], [type="radio"])):not(:first-child) {
1803
- margin-left: calc(var(--cirth-border-width) * -1);
1804
- }
1805
-
1806
- .cirth [role="search"] button, .cirth [role="search"] [role="button"], .cirth [role="group"] button, .cirth [role="group"] [role="button"] {
1807
- width: auto;
1808
- }
1809
-
1810
- .cirth [role="search"] [type="submit"] {
1811
- width: auto;
1812
- }
1813
-
1814
- .cirth [role="search"] [type="reset"] {
1815
- width: auto;
1816
- }
1817
-
1818
- .cirth [role="search"] [type="button"] {
1819
- width: auto;
1820
- }
1821
-
1822
- .cirth [role="group"] [type="submit"] {
1823
- width: auto;
1824
- }
1825
-
1826
- .cirth [role="group"] [type="reset"] {
1827
- width: auto;
1828
- }
1829
-
1830
- .cirth [role="group"] [type="button"] {
1831
- width: auto;
1832
- }
1833
-
1834
- @supports selector(:has(*)) {
1835
- .cirth [role="search"]:has(button:focus, [type="submit"]:focus, [type="button"]:focus, [role="button"]:focus) {
1836
- --cirth-group-box-shadow: var(--cirth-group-box-shadow-focus-with-button);
1837
- }
1838
-
1839
- .cirth [role="group"]:has(button:focus, [type="submit"]:focus, [type="button"]:focus, [role="button"]:focus) {
1840
- --cirth-group-box-shadow: var(--cirth-group-box-shadow-focus-with-button);
1841
- }
1842
-
1843
- .cirth [role="search"]:has(button:focus, [type="submit"]:focus, [type="button"]:focus, [role="button"]:focus) input:not(:is([type="checkbox"], [type="radio"])) {
1844
- border-color: rgba(0, 0, 0, 0);
1845
- }
1846
-
1847
- .cirth [role="search"]:has(button:focus, [type="submit"]:focus, [type="button"]:focus, [role="button"]:focus) select {
1848
- border-color: rgba(0, 0, 0, 0);
1849
- }
1850
-
1851
- .cirth [role="group"]:has(button:focus, [type="submit"]:focus, [type="button"]:focus, [role="button"]:focus) input:not(:is([type="checkbox"], [type="radio"])) {
1852
- border-color: rgba(0, 0, 0, 0);
1853
- }
1854
-
1855
- .cirth [role="group"]:has(button:focus, [type="submit"]:focus, [type="button"]:focus, [role="button"]:focus) select {
1856
- border-color: rgba(0, 0, 0, 0);
1857
- }
1858
-
1859
- .cirth [role="search"]:has(input:not(:is([type="submit"], [type="button"])):focus, select:focus) {
1860
- --cirth-group-box-shadow: var(--cirth-group-box-shadow-focus-with-input);
1861
- }
1862
-
1863
- .cirth [role="group"]:has(input:not(:is([type="submit"], [type="button"])):focus, select:focus) {
1864
- --cirth-group-box-shadow: var(--cirth-group-box-shadow-focus-with-input);
1865
- }
1866
-
1867
- .cirth [role="search"]:has(input:not(:is([type="submit"], [type="button"])):focus, select:focus) button {
1868
- --cirth-button-box-shadow: 0 0 0 var(--cirth-border-width)
1869
- var(--cirth-primary-border);
1870
- --cirth-button-hover-box-shadow: 0 0 0 var(--cirth-border-width)
1871
- var(--cirth-primary-hover-border);
1872
- }
1873
-
1874
- .cirth [role="search"]:has(input:not(:is([type="submit"], [type="button"])):focus, select:focus) [type="submit"] {
1875
- --cirth-button-box-shadow: 0 0 0 var(--cirth-border-width)
1876
- var(--cirth-primary-border);
1877
- --cirth-button-hover-box-shadow: 0 0 0 var(--cirth-border-width)
1878
- var(--cirth-primary-hover-border);
1879
- }
1880
-
1881
- .cirth [role="search"]:has(input:not(:is([type="submit"], [type="button"])):focus, select:focus) [type="button"] {
1882
- --cirth-button-box-shadow: 0 0 0 var(--cirth-border-width)
1883
- var(--cirth-primary-border);
1884
- --cirth-button-hover-box-shadow: 0 0 0 var(--cirth-border-width)
1885
- var(--cirth-primary-hover-border);
1886
- }
1887
-
1888
- .cirth [role="search"]:has(input:not(:is([type="submit"], [type="button"])):focus, select:focus) [role="button"] {
1889
- --cirth-button-box-shadow: 0 0 0 var(--cirth-border-width)
1890
- var(--cirth-primary-border);
1891
- --cirth-button-hover-box-shadow: 0 0 0 var(--cirth-border-width)
1892
- var(--cirth-primary-hover-border);
1893
- }
1894
-
1895
- .cirth [role="group"]:has(input:not(:is([type="submit"], [type="button"])):focus, select:focus) button {
1896
- --cirth-button-box-shadow: 0 0 0 var(--cirth-border-width)
1897
- var(--cirth-primary-border);
1898
- --cirth-button-hover-box-shadow: 0 0 0 var(--cirth-border-width)
1899
- var(--cirth-primary-hover-border);
1900
- }
1901
-
1902
- .cirth [role="group"]:has(input:not(:is([type="submit"], [type="button"])):focus, select:focus) [type="submit"] {
1903
- --cirth-button-box-shadow: 0 0 0 var(--cirth-border-width)
1904
- var(--cirth-primary-border);
1905
- --cirth-button-hover-box-shadow: 0 0 0 var(--cirth-border-width)
1906
- var(--cirth-primary-hover-border);
1907
- }
1908
-
1909
- .cirth [role="group"]:has(input:not(:is([type="submit"], [type="button"])):focus, select:focus) [type="button"] {
1910
- --cirth-button-box-shadow: 0 0 0 var(--cirth-border-width)
1911
- var(--cirth-primary-border);
1912
- --cirth-button-hover-box-shadow: 0 0 0 var(--cirth-border-width)
1913
- var(--cirth-primary-hover-border);
1914
- }
1915
-
1916
- .cirth [role="group"]:has(input:not(:is([type="submit"], [type="button"])):focus, select:focus) [role="button"] {
1917
- --cirth-button-box-shadow: 0 0 0 var(--cirth-border-width)
1918
- var(--cirth-primary-border);
1919
- --cirth-button-hover-box-shadow: 0 0 0 var(--cirth-border-width)
1920
- var(--cirth-primary-hover-border);
1921
- }
1922
-
1923
- .cirth [role="search"] button:focus, .cirth [role="search"] [role="button"]:focus, .cirth [role="group"] button:focus, .cirth [role="group"] [role="button"]:focus {
1924
- box-shadow: none;
1925
- }
1926
-
1927
- .cirth [role="search"] [type="submit"]:focus {
1928
- box-shadow: none;
1929
- }
1930
-
1931
- .cirth [role="search"] [type="reset"]:focus {
1932
- box-shadow: none;
1933
- }
1934
-
1935
- .cirth [role="search"] [type="button"]:focus {
1936
- box-shadow: none;
1937
- }
1938
-
1939
- .cirth [role="group"] [type="submit"]:focus {
1940
- box-shadow: none;
1941
- }
1942
-
1943
- .cirth [role="group"] [type="reset"]:focus {
1944
- box-shadow: none;
1945
- }
1946
-
1947
- .cirth [role="group"] [type="button"]:focus {
1948
- box-shadow: none;
1949
- }
1950
- }
1951
-
1952
- .cirth [role="search"] > :first-child {
1953
- border-top-left-radius: var(--cirth-radius-pill);
1954
- border-bottom-left-radius: var(--cirth-radius-pill);
1955
- }
1956
-
1957
- .cirth [role="search"] > :last-child {
1958
- border-top-right-radius: var(--cirth-radius-pill);
1959
- border-bottom-right-radius: var(--cirth-radius-pill);
1960
- }
1961
-
1962
- .cirth [aria-busy="true"]:not(:is(input, select, textarea, html, form)) {
1963
- white-space: nowrap;
1964
- }
1965
-
1966
- .cirth [aria-busy="true"]:not(:is(input, select, textarea, html, form)):before {
1967
- background-image: var(--cirth-icon-loading);
1968
- content: "";
1969
- vertical-align: -.125em;
1970
- background-repeat: no-repeat;
1971
- background-size: 1em;
1972
- width: 1em;
1973
- height: 1em;
1974
- display: inline-block;
1975
- }
1976
-
1977
- .cirth [aria-busy="true"]:not(:is(input, select, textarea, html, form)):not(:empty):before {
1978
- margin-inline-end: calc(var(--cirth-spacing) * .5);
1979
- }
1980
-
1981
- .cirth [aria-busy="true"]:not(:is(input, select, textarea, html, form)):empty {
1982
- text-align: center;
1983
- }
1984
-
1985
- .cirth button[aria-busy="true"], .cirth [role="button"][aria-busy="true"], .cirth a[aria-busy="true"] {
1986
- pointer-events: none;
1987
- }
1988
-
1989
- .cirth [type="submit"][aria-busy="true"] {
1990
- pointer-events: none;
1991
- }
1992
-
1993
- .cirth [type="button"][aria-busy="true"] {
1994
- pointer-events: none;
1995
- }
1996
-
1997
- .cirth [type="reset"][aria-busy="true"] {
1998
- pointer-events: none;
1999
- }
2000
-
2001
- .cirth {
2002
- --cirth-scrollbar-width: 0px;
2003
- }
2004
-
2005
- .cirth dialog {
2006
- z-index: var(--cirth-z-index-modal);
2007
- width: inherit;
2008
- min-width: 100%;
2009
- height: inherit;
2010
- min-height: 100%;
2011
- -webkit-backdrop-filter: var(--cirth-modal-overlay-backdrop-filter);
2012
- backdrop-filter: var(--cirth-modal-overlay-backdrop-filter);
2013
- background-color: var(--cirth-modal-overlay-background-color);
2014
- color: var(--cirth-color);
2015
- border: 0;
2016
- justify-content: center;
2017
- align-items: center;
2018
- padding: 0;
2019
- display: flex;
2020
- position: fixed;
2021
- inset: 0;
2022
- }
2023
-
2024
- .cirth dialog > article {
2025
- width: 100%;
2026
- max-height: calc(100vh - var(--cirth-spacing) * 2);
2027
- margin: var(--cirth-spacing);
2028
- overflow: auto;
2029
- }
2030
-
2031
- @media (width >= 576px) {
2032
- .cirth dialog > article {
2033
- max-width: 510px;
2034
- }
2035
- }
2036
-
2037
- @media (width >= 768px) {
2038
- .cirth dialog > article {
2039
- max-width: 700px;
2040
- }
2041
- }
2042
-
2043
- .cirth dialog > article > header > * {
2044
- margin-bottom: 0;
2045
- }
2046
-
2047
- .cirth dialog > article > header :is(a, button)[rel="prev"] {
2048
- margin: 0;
2049
- margin-left: var(--cirth-spacing);
2050
- float: right;
2051
- padding: 0;
2052
- }
2053
-
2054
- .cirth dialog > article > footer {
2055
- text-align: right;
2056
- }
2057
-
2058
- .cirth dialog > article > footer button, .cirth dialog > article > footer [role="button"] {
2059
- margin-bottom: 0;
2060
- }
2061
-
2062
- .cirth dialog > article > footer button:not(:first-of-type), .cirth dialog > article > footer [role="button"]:not(:first-of-type) {
2063
- margin-left: calc(var(--cirth-spacing) * .5);
2064
- }
2065
-
2066
- .cirth dialog > article :is(a, button)[rel="prev"] {
2067
- width: var(--cirth-size-4);
2068
- height: var(--cirth-size-4);
2069
- margin-top: calc(var(--cirth-spacing) * -1);
2070
- margin-bottom: var(--cirth-spacing);
2071
- background-image: var(--cirth-icon-close);
2072
- background-position: center;
2073
- background-size: auto var(--cirth-size-4);
2074
- opacity: .5;
2075
- transition: opacity var(--cirth-transition);
2076
- background-color: rgba(0, 0, 0, 0);
2077
- background-repeat: no-repeat;
2078
- border: none;
2079
- margin-left: auto;
2080
- display: block;
2081
- }
2082
-
2083
- .cirth dialog > article :is(a, button)[rel="prev"]:is([aria-current]:not([aria-current="false"]), :hover, :active, :focus) {
2084
- opacity: 1;
2085
- }
2086
-
2087
- .cirth dialog:not([open]), .cirth dialog[open="false"] {
2088
- display: none;
2089
- }
2090
-
2091
- :where(nav li):before {
2092
- float: left;
2093
- content: "​";
2094
- }
2095
-
2096
- .cirth nav, .cirth nav ul {
2097
- display: flex;
2098
- }
2099
-
2100
- .cirth nav {
2101
- justify-content: space-between;
2102
- overflow: visible;
2103
- }
2104
-
2105
- .cirth nav ol, .cirth nav ul {
2106
- align-items: center;
2107
- margin-bottom: 0;
2108
- padding: 0;
2109
- list-style: none;
2110
- }
2111
-
2112
- .cirth nav ol:first-of-type, .cirth nav ul:first-of-type {
2113
- margin-left: calc(var(--cirth-nav-element-spacing-horizontal) * -1);
2114
- }
2115
-
2116
- .cirth nav ol:last-of-type, .cirth nav ul:last-of-type {
2117
- margin-right: calc(var(--cirth-nav-element-spacing-horizontal) * -1);
2118
- }
2119
-
2120
- .cirth nav li {
2121
- padding: var(--cirth-nav-element-spacing-vertical) var(--cirth-nav-element-spacing-horizontal);
2122
- margin: 0;
2123
- display: inline-block;
2124
- }
2125
-
2126
- .cirth nav li :where(a, [role="link"]) {
2127
- margin: calc(var(--cirth-nav-link-spacing-vertical) * -1) calc(var(--cirth-nav-link-spacing-horizontal) * -1);
2128
- padding: var(--cirth-nav-link-spacing-vertical) var(--cirth-nav-link-spacing-horizontal);
2129
- border-radius: var(--cirth-border-radius);
2130
- display: inline-block;
2131
- }
2132
-
2133
- .cirth nav li :where(a, [role="link"]):not(:hover) {
2134
- text-decoration: none;
2135
- }
2136
-
2137
- .cirth nav li button, .cirth nav li [role="button"], .cirth nav li select {
2138
- height: auto;
2139
- margin-right: inherit;
2140
- margin-bottom: 0;
2141
- margin-left: inherit;
2142
- padding: calc(var(--cirth-nav-link-spacing-vertical) - var(--cirth-border-width) * 2) var(--cirth-nav-link-spacing-horizontal);
2143
- }
2144
-
2145
- .cirth nav li [type="button"] {
2146
- height: auto;
2147
- margin-right: inherit;
2148
- margin-bottom: 0;
2149
- margin-left: inherit;
2150
- padding: calc(var(--cirth-nav-link-spacing-vertical) - var(--cirth-border-width) * 2) var(--cirth-nav-link-spacing-horizontal);
2151
- }
2152
-
2153
- .cirth nav li input:not(:is([type="checkbox"], [type="radio"], [type="range"], [type="file"])) {
2154
- height: auto;
2155
- margin-right: inherit;
2156
- margin-bottom: 0;
2157
- margin-left: inherit;
2158
- padding: calc(var(--cirth-nav-link-spacing-vertical) - var(--cirth-border-width) * 2) var(--cirth-nav-link-spacing-horizontal);
2159
- }
2160
-
2161
- .cirth nav[aria-label="breadcrumb"] {
2162
- justify-content: start;
2163
- align-items: center;
2164
- }
2165
-
2166
- .cirth nav[aria-label="breadcrumb"] ul li:not(:first-child) {
2167
- margin-inline-start: var(--cirth-nav-link-spacing-horizontal);
2168
- }
2169
-
2170
- .cirth nav[aria-label="breadcrumb"] ul li a {
2171
- margin: calc(var(--cirth-nav-link-spacing-vertical) * -1) 0;
2172
- margin-inline-start: calc(var(--cirth-nav-link-spacing-horizontal) * -1);
2173
- }
2174
-
2175
- .cirth nav[aria-label="breadcrumb"] ul li:not(:last-child):after {
2176
- width: calc(var(--cirth-nav-link-spacing-horizontal) * 4);
2177
- margin: 0 calc(var(--cirth-nav-link-spacing-horizontal) * -1);
2178
- content: var(--cirth-nav-breadcrumb-divider);
2179
- color: var(--cirth-muted-color);
2180
- text-align: center;
2181
- white-space: nowrap;
2182
- text-decoration: none;
2183
- display: inline-block;
2184
- position: absolute;
2185
- }
2186
-
2187
- .cirth nav[aria-label="breadcrumb"] a[aria-current]:not([aria-current="false"]) {
2188
- color: inherit;
2189
- pointer-events: none;
2190
- background-color: rgba(0, 0, 0, 0);
2191
- text-decoration: none;
2192
- }
2193
-
2194
- .cirth aside nav, .cirth aside ol, .cirth aside ul, .cirth aside li {
2195
- display: block;
2196
- }
2197
-
2198
- .cirth aside li {
2199
- padding: calc(var(--cirth-nav-element-spacing-vertical) * .5) var(--cirth-nav-element-spacing-horizontal);
2200
- }
2201
-
2202
- .cirth aside li a {
2203
- display: block;
2204
- }
2205
-
2206
- .cirth aside li [role="button"] {
2207
- margin: inherit;
2208
- }
2209
-
2210
- [dir="rtl"] .cirth nav[aria-label="breadcrumb"] ul li:not(:last-child) :after {
2211
- content: "\\";
2212
- }
2213
-
2214
- .cirth progress {
2215
- vertical-align: baseline;
2216
- appearance: none;
2217
- width: 100%;
2218
- height: var(--cirth-size-2);
2219
- margin-bottom: calc(var(--cirth-spacing) * .5);
2220
- border-radius: var(--cirth-border-radius);
2221
- background-color: var(--cirth-progress-background-color);
2222
- color: var(--cirth-progress-color);
2223
- border: 0;
2224
- display: inline-block;
2225
- overflow: hidden;
2226
- }
2227
-
2228
- .cirth progress::-webkit-progress-bar {
2229
- border-radius: var(--cirth-border-radius);
2230
- background: none;
2231
- }
2232
-
2233
- .cirth progress[value]::-webkit-progress-value {
2234
- background-color: var(--cirth-progress-color);
2235
- transition: inline-size var(--cirth-transition);
2236
- }
2237
-
2238
- .cirth progress::-moz-progress-bar {
2239
- background-color: var(--cirth-progress-color);
2240
- }
2241
-
2242
- @media (prefers-reduced-motion: no-preference) {
2243
- .cirth progress:indeterminate {
2244
- background: var(--cirth-progress-background-color) linear-gradient(to right, var(--cirth-progress-color) 30%, var(--cirth-progress-background-color) 30%) top left/150% 150% no-repeat;
2245
- animation: 1s linear infinite progress-indeterminate;
2246
- }
2247
-
2248
- .cirth progress:indeterminate[value]::-webkit-progress-value {
2249
- background-color: rgba(0, 0, 0, 0);
2250
- }
2251
-
2252
- .cirth progress:indeterminate::-moz-progress-bar {
2253
- background-color: rgba(0, 0, 0, 0);
2254
- }
2255
-
2256
- [dir="rtl"] .cirth progress:indeterminate {
2257
- animation-direction: reverse;
2258
- }
2259
- }
2260
-
2261
- @keyframes progress-indeterminate {
2262
- 0% {
2263
- background-position: 200% 0;
2264
- }
2265
-
2266
- 100% {
2267
- background-position: -200% 0;
2268
- }
2269
- }
2270
-
2271
- .cirth [data-tooltip] {
2272
- position: relative;
2273
- }
2274
-
2275
- .cirth [data-tooltip]:not(:is(a, button, input, [role="button"])) {
2276
- border-bottom: var(--cirth-border-width-1) dotted;
2277
- cursor: help;
2278
- text-decoration: none;
2279
- }
2280
-
2281
- .cirth [data-tooltip][data-placement="top"]:before, .cirth [data-tooltip][data-placement="top"]:after, .cirth [data-tooltip]:before, .cirth [data-tooltip]:after {
2282
- z-index: var(--cirth-z-index-tooltip);
2283
- padding: var(--cirth-space-1) var(--cirth-space-2);
2284
- border-radius: var(--cirth-border-radius);
2285
- background: var(--cirth-tooltip-background-color);
2286
- content: attr(data-tooltip);
2287
- color: var(--cirth-tooltip-color);
2288
- font-style: normal;
2289
- font-weight: var(--cirth-font-weight);
2290
- font-size: var(--cirth-font-size-sm);
2291
- text-overflow: ellipsis;
2292
- white-space: nowrap;
2293
- opacity: 0;
2294
- pointer-events: none;
2295
- text-decoration: none;
2296
- display: block;
2297
- position: absolute;
2298
- bottom: 100%;
2299
- left: 50%;
2300
- overflow: hidden;
2301
- transform: translate(-50%, -.25rem);
2302
- }
2303
-
2304
- .cirth [data-tooltip][data-placement="top"]:after, .cirth [data-tooltip]:after {
2305
- content: "";
2306
- color: var(--cirth-tooltip-background-color);
2307
- background-color: rgba(0, 0, 0, 0);
2308
- border-top: .3rem solid;
2309
- border-left: .3rem solid rgba(0, 0, 0, 0);
2310
- border-right: .3rem solid rgba(0, 0, 0, 0);
2311
- border-radius: 0;
2312
- padding: 0;
2313
- transform: translate(-50%);
2314
- }
2315
-
2316
- .cirth [data-tooltip][data-placement="bottom"]:before, .cirth [data-tooltip][data-placement="bottom"]:after {
2317
- top: 100%;
2318
- bottom: auto;
2319
- transform: translate(-50%, .25rem);
2320
- }
2321
-
2322
- .cirth [data-tooltip][data-placement="bottom"]:after {
2323
- border: .3rem solid rgba(0, 0, 0, 0);
2324
- border-bottom-color: currentColor;
2325
- transform: translate(-50%, -.3rem);
2326
- }
2327
-
2328
- .cirth [data-tooltip][data-placement="left"]:before, .cirth [data-tooltip][data-placement="left"]:after {
2329
- inset: 50% 100% auto auto;
2330
- transform: translate(-.25rem, -50%);
2331
- }
2332
-
2333
- .cirth [data-tooltip][data-placement="left"]:after {
2334
- border: .3rem solid rgba(0, 0, 0, 0);
2335
- border-left-color: currentColor;
2336
- transform: translate(.3rem, -50%);
2337
- }
2338
-
2339
- .cirth [data-tooltip][data-placement="right"]:before, .cirth [data-tooltip][data-placement="right"]:after {
2340
- inset: 50% auto auto 100%;
2341
- transform: translate(.25rem, -50%);
2342
- }
2343
-
2344
- .cirth [data-tooltip][data-placement="right"]:after {
2345
- border: .3rem solid rgba(0, 0, 0, 0);
2346
- border-right-color: currentColor;
2347
- transform: translate(-.3rem, -50%);
2348
- }
2349
-
2350
- .cirth [data-tooltip]:focus:before, .cirth [data-tooltip]:focus:after, .cirth [data-tooltip]:hover:before, .cirth [data-tooltip]:hover:after {
2351
- opacity: 1;
2352
- }
2353
-
2354
- @media (hover: hover) and (pointer: fine) {
2355
- .cirth [data-tooltip]:focus:before, .cirth [data-tooltip]:focus:after, .cirth [data-tooltip]:hover:before, .cirth [data-tooltip]:hover:after {
2356
- --cirth-tooltip-slide-to: translate(-50%, -.25rem);
2357
- animation-duration: var(--cirth-duration-normal);
2358
- opacity: 0;
2359
- animation-name: tooltip-slide;
2360
- animation-fill-mode: forwards;
2361
- transform: translate(-50%, .75rem);
2362
- }
2363
-
2364
- .cirth [data-tooltip]:focus:after, .cirth [data-tooltip]:hover:after {
2365
- --cirth-tooltip-caret-slide-to: translate(-50%, 0rem);
2366
- animation-name: tooltip-caret-slide;
2367
- transform: translate(-50%, -.25rem);
2368
- }
2369
-
2370
- .cirth [data-tooltip][data-placement="bottom"]:focus:before, .cirth [data-tooltip][data-placement="bottom"]:focus:after, .cirth [data-tooltip][data-placement="bottom"]:hover:before, .cirth [data-tooltip][data-placement="bottom"]:hover:after {
2371
- --cirth-tooltip-slide-to: translate(-50%, .25rem);
2372
- animation-name: tooltip-slide;
2373
- transform: translate(-50%, -.75rem);
2374
- }
2375
-
2376
- .cirth [data-tooltip][data-placement="bottom"]:focus:after, .cirth [data-tooltip][data-placement="bottom"]:hover:after {
2377
- --cirth-tooltip-caret-slide-to: translate(-50%, -.3rem);
2378
- animation-name: tooltip-caret-slide;
2379
- transform: translate(-50%, -.5rem);
2380
- }
2381
-
2382
- .cirth [data-tooltip][data-placement="left"]:focus:before, .cirth [data-tooltip][data-placement="left"]:focus:after, .cirth [data-tooltip][data-placement="left"]:hover:before, .cirth [data-tooltip][data-placement="left"]:hover:after {
2383
- --cirth-tooltip-slide-to: translate(-.25rem, -50%);
2384
- animation-name: tooltip-slide;
2385
- transform: translate(.75rem, -50%);
2386
- }
2387
-
2388
- .cirth [data-tooltip][data-placement="left"]:focus:after, .cirth [data-tooltip][data-placement="left"]:hover:after {
2389
- --cirth-tooltip-caret-slide-to: translate(.3rem, -50%);
2390
- animation-name: tooltip-caret-slide;
2391
- transform: translate(.05rem, -50%);
2392
- }
2393
-
2394
- .cirth [data-tooltip][data-placement="right"]:focus:before, .cirth [data-tooltip][data-placement="right"]:focus:after, .cirth [data-tooltip][data-placement="right"]:hover:before, .cirth [data-tooltip][data-placement="right"]:hover:after {
2395
- --cirth-tooltip-slide-to: translate(.25rem, -50%);
2396
- animation-name: tooltip-slide;
2397
- transform: translate(-.75rem, -50%);
2398
- }
2399
-
2400
- .cirth [data-tooltip][data-placement="right"]:focus:after, .cirth [data-tooltip][data-placement="right"]:hover:after {
2401
- --cirth-tooltip-caret-slide-to: translate(-.3rem, -50%);
2402
- animation-name: tooltip-caret-slide;
2403
- transform: translate(-.05rem, -50%);
2404
- }
2405
- }
2406
-
2407
- @keyframes tooltip-slide {
2408
- to {
2409
- transform: var(--cirth-tooltip-slide-to);
2410
- opacity: 1;
2411
- }
2412
- }
2413
-
2414
- @keyframes tooltip-caret-slide {
2415
- 50% {
2416
- opacity: 0;
2417
- }
2418
-
2419
- to {
2420
- transform: var(--cirth-tooltip-caret-slide-to);
2421
- opacity: 1;
2422
- }
2423
- }
2424
-
2425
- .cirth [aria-controls] {
2426
- cursor: pointer;
2427
- }
2428
-
2429
- .cirth [aria-disabled="true"], .cirth [disabled] {
2430
- cursor: not-allowed;
2431
- }
2432
-
2433
- .cirth [aria-hidden="false"][hidden] {
2434
- display: initial;
2435
- }
2436
-
2437
- .cirth [aria-hidden="false"][hidden]:not(:focus) {
2438
- clip: rect(0, 0, 0, 0);
2439
- position: absolute;
2440
- }
2441
-
2442
- .cirth a, .cirth area, .cirth button, .cirth input, .cirth label, .cirth select, .cirth summary, .cirth textarea, .cirth [tabindex] {
2443
- -ms-touch-action: manipulation;
2444
- }
2445
-
2446
- .cirth [dir="rtl"] {
2447
- direction: rtl;
2448
- }
2449
-
2450
- @media (prefers-reduced-motion: reduce) {
2451
- .cirth :not([aria-busy="true"]), .cirth :not([aria-busy="true"]):before, .cirth :not([aria-busy="true"]):after {
2452
- background-attachment: initial;
2453
- scroll-behavior: auto;
2454
- transition-delay: var(--cirth-duration-instant);
2455
- transition-duration: var(--cirth-duration-instant);
2456
- animation-duration: 1ms;
2457
- animation-iteration-count: 1;
2458
- animation-delay: -1ms;
2459
- }
2460
- }
2461
-
2462
- .cirth {
2463
- --cirth-color-black: #000;
2464
- --cirth-color-white: #fff;
2465
- --cirth-color-transparent: transparent;
2466
- --cirth-color-current: currentColor;
2467
- --cirth-font-family-ui: system-ui, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, Helvetica, Arial,
2468
- "Helvetica Neue", sans-serif;
2469
- --cirth-font-family-sans: var(--cirth-font-family-ui), "Apple Color Emoji", "Segoe UI Emoji",
2470
- "Segoe UI Symbol", "Noto Color Emoji";
2471
- --cirth-font-family-serif: Georgia, Cambria, "Times New Roman", Times, serif;
2472
- --cirth-font-family-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono",
2473
- monospace;
2474
- --cirth-font-family-display: var(--cirth-font-family-sans);
2475
- --cirth-font-size-xs: .75rem;
2476
- --cirth-font-size-sm: .875rem;
2477
- --cirth-font-size-md: 1rem;
2478
- --cirth-font-size-lg: 1.125rem;
2479
- --cirth-font-size-xl: 1.25rem;
2480
- --cirth-font-size-2xl: 1.425rem;
2481
- --cirth-font-size-3xl: 1.6rem;
2482
- --cirth-font-size-4xl: 1.8rem;
2483
- --cirth-font-size-5xl: 2rem;
2484
- --cirth-font-size-6xl: 2.3rem;
2485
- --cirth-font-weight-light: 300;
2486
- --cirth-font-weight-regular: 400;
2487
- --cirth-font-weight-medium: 500;
2488
- --cirth-font-weight-semibold: 600;
2489
- --cirth-font-weight-bold: 700;
2490
- --cirth-line-height-none: 1;
2491
- --cirth-line-height-tight: 1.125;
2492
- --cirth-line-height-snug: 1.25;
2493
- --cirth-line-height-normal: 1.5;
2494
- --cirth-line-height-relaxed: 1.625;
2495
- --cirth-line-height-loose: 2;
2496
- --cirth-letter-spacing-tight: 0;
2497
- --cirth-letter-spacing-normal: 0;
2498
- --cirth-letter-spacing-wide: .025em;
2499
- --cirth-space-0: 0;
2500
- --cirth-space-1: .25rem;
2501
- --cirth-space-2: .5rem;
2502
- --cirth-space-3: .75rem;
2503
- --cirth-space-4: 1rem;
2504
- --cirth-space-5: 1.25rem;
2505
- --cirth-space-6: 1.5rem;
2506
- --cirth-space-8: 2rem;
2507
- --cirth-space-10: 2.5rem;
2508
- --cirth-space-12: 3rem;
2509
- --cirth-space-16: 4rem;
2510
- --cirth-space-20: 5rem;
2511
- --cirth-space-24: 6rem;
2512
- --cirth-size-0: 0;
2513
- --cirth-size-1: .25rem;
2514
- --cirth-size-2: .5rem;
2515
- --cirth-size-3: .75rem;
2516
- --cirth-size-4: 1rem;
2517
- --cirth-size-5: 1.25rem;
2518
- --cirth-size-6: 1.5rem;
2519
- --cirth-size-8: 2rem;
2520
- --cirth-size-10: 2.5rem;
2521
- --cirth-size-12: 3rem;
2522
- --cirth-size-16: 4rem;
2523
- --cirth-size-20: 5rem;
2524
- --cirth-size-24: 6rem;
2525
- --cirth-radius-none: 0;
2526
- --cirth-radius-xs: .125rem;
2527
- --cirth-radius-sm: .25rem;
2528
- --cirth-radius-md: .375rem;
2529
- --cirth-radius-lg: .5rem;
2530
- --cirth-radius-xl: .75rem;
2531
- --cirth-radius-2xl: 1rem;
2532
- --cirth-radius-pill: 9999px;
2533
- --cirth-border-width-0: 0;
2534
- --cirth-border-width-1: .0625rem;
2535
- --cirth-border-width-2: .125rem;
2536
- --cirth-border-width-4: .25rem;
2537
- --cirth-outline-width-1: .0625rem;
2538
- --cirth-outline-width-2: .125rem;
2539
- --cirth-outline-width-4: .25rem;
2540
- --cirth-shadow-none: none;
2541
- --cirth-shadow-xs: 0 .0625rem .125rem rgba(0, 0, 0, .05);
2542
- --cirth-shadow-sm: 0 .0625rem .1875rem rgba(0, 0, 0, .1),
2543
- 0 .0625rem .125rem rgba(0, 0, 0, .06);
2544
- --cirth-shadow-md: 0 .25rem .375rem rgba(0, 0, 0, .07),
2545
- 0 .125rem .25rem rgba(0, 0, 0, .06);
2546
- --cirth-shadow-lg: 0 .625rem .9375rem rgba(0, 0, 0, .1),
2547
- 0 .25rem .375rem rgba(0, 0, 0, .05);
2548
- --cirth-shadow-xl: 0 1.25rem 1.5625rem rgba(0, 0, 0, .1),
2549
- 0 .625rem .625rem rgba(0, 0, 0, .04);
2550
- --cirth-shadow-inner: inset 0 .125rem .25rem rgba(0, 0, 0, .06);
2551
- --cirth-duration-instant: 0s;
2552
- --cirth-duration-fast: .1s;
2553
- --cirth-duration-normal: .2s;
2554
- --cirth-duration-slow: .3s;
2555
- --cirth-duration-slower: .5s;
2556
- --cirth-ease-linear: linear;
2557
- --cirth-ease-in: cubic-bezier(.4, 0, 1, 1);
2558
- --cirth-ease-out: cubic-bezier(0, 0, .2, 1);
2559
- --cirth-ease-in-out: cubic-bezier(.4, 0, .2, 1);
2560
- --cirth-opacity-disabled: .5;
2561
- --cirth-opacity-muted: .72;
2562
- --cirth-opacity-overlay: .75;
2563
- --cirth-z-index-dropdown: 1000;
2564
- --cirth-z-index-sticky: 1020;
2565
- --cirth-z-index-fixed: 1030;
2566
- --cirth-z-index-modal-backdrop: 1040;
2567
- --cirth-z-index-modal: 1050;
2568
- --cirth-z-index-tooltip: 1070;
2569
- --cirth-font-family-emoji: "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
2570
- --cirth-font-family-sans-serif: system-ui, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, Helvetica, Arial,
2571
- "Helvetica Neue", sans-serif, var(--cirth-font-family-emoji);
2572
- --cirth-font-family-monospace: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono",
2573
- monospace, var(--cirth-font-family-emoji);
2574
- --cirth-font-family: var(--cirth-font-family-sans-serif);
2575
- --cirth-line-height: var(--cirth-line-height-normal);
2576
- --cirth-font-weight: var(--cirth-font-weight-regular);
2577
- --cirth-font-size: 100%;
2578
- --cirth-text-underline-offset: .1rem;
2579
- --cirth-border-radius: var(--cirth-radius-sm);
2580
- --cirth-border-width: var(--cirth-border-width-1);
2581
- --cirth-outline-width: var(--cirth-outline-width-2);
2582
- --cirth-transition: var(--cirth-duration-normal) var(--cirth-ease-in-out);
2583
- --cirth-spacing: var(--cirth-space-4);
2584
- --cirth-typography-spacing-vertical: var(--cirth-space-4);
2585
- --cirth-block-spacing-vertical: var(--cirth-spacing);
2586
- --cirth-block-spacing-horizontal: var(--cirth-spacing);
2587
- --cirth-form-element-spacing-vertical: var(--cirth-space-3);
2588
- --cirth-form-element-spacing-horizontal: var(--cirth-space-4);
2589
- --cirth-form-label-font-weight: var(--cirth-font-weight);
2590
- --cirth-group-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
2591
- --cirth-group-box-shadow-focus-with-button: 0 0 0 var(--cirth-outline-width)
2592
- var(--cirth-primary-focus);
2593
- --cirth-group-box-shadow-focus-with-input: 0 0 0 var(--cirth-border-width-1)
2594
- var(--cirth-form-element-border-color);
2595
- --cirth-modal-overlay-backdrop-filter: blur(.375rem);
2596
- --cirth-nav-element-spacing-vertical: var(--cirth-space-4);
2597
- --cirth-nav-element-spacing-horizontal: var(--cirth-space-2);
2598
- --cirth-nav-link-spacing-vertical: var(--cirth-space-2);
2599
- --cirth-nav-link-spacing-horizontal: var(--cirth-space-2);
2600
- --cirth-nav-breadcrumb-divider: ">";
2601
- --cirth-icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(255, 255, 255)' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
2602
- --cirth-icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(255, 255, 255)' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
2603
- --cirth-icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(136, 145, 164)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
2604
- --cirth-icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(136, 145, 164)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
2605
- --cirth-icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(136, 145, 164)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
2606
- --cirth-icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(136, 145, 164)' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
2607
- --cirth-icon-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(136, 145, 164)' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E");
2608
- --cirth-icon-loading: url("data:image/svg+xml,%3Csvg fill='none' height='24' width='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E g %7B animation: rotate 2s linear infinite; transform-origin: center center; %7D circle %7B stroke-dasharray: 75,100; stroke-dashoffset: -5; animation: dash 1.5s ease-in-out infinite; stroke-linecap: round; %7D @keyframes rotate %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D @keyframes dash %7B 0%25 %7B stroke-dasharray: 1,100; stroke-dashoffset: 0; %7D 50%25 %7B stroke-dasharray: 44.5,100; stroke-dashoffset: -17.5; %7D 100%25 %7B stroke-dasharray: 44.5,100; stroke-dashoffset: -62; %7D %7D %3C/style%3E%3Cg%3E%3Ccircle cx='12' cy='12' r='10' fill='none' stroke='rgb(136, 145, 164)' stroke-width='4' /%3E%3C/g%3E%3C/svg%3E");
2609
- }
2610
-
2611
- @media (width >= 576px) {
2612
- .cirth {
2613
- --cirth-font-size: 106.25%;
2614
- }
2615
- }
2616
-
2617
- @media (width >= 768px) {
2618
- .cirth {
2619
- --cirth-font-size: 112.5%;
2620
- }
2621
- }
2622
-
2623
- @media (width >= 1024px) {
2624
- .cirth {
2625
- --cirth-font-size: 118.75%;
2626
- }
2627
- }
2628
-
2629
- @media (width >= 1280px) {
2630
- .cirth {
2631
- --cirth-font-size: 125%;
2632
- }
2633
- }
2634
-
2635
- @media (width >= 1536px) {
2636
- .cirth {
2637
- --cirth-font-size: 131.25%;
2638
- }
2639
- }
2640
-
2641
- .cirth a {
2642
- --cirth-text-decoration: underline;
2643
- }
2644
-
2645
- .cirth small {
2646
- --cirth-font-size: .875em;
2647
- }
2648
-
2649
- .cirth h1, .cirth h2, .cirth h3, .cirth h4, .cirth h5, .cirth h6 {
2650
- --cirth-font-weight: var(--cirth-font-weight-bold);
2651
- }
2652
-
2653
- .cirth h1 {
2654
- --cirth-font-size: var(--cirth-font-size-5xl);
2655
- --cirth-line-height: var(--cirth-line-height-tight);
2656
- --cirth-typography-spacing-top: var(--cirth-space-12);
2657
- }
2658
-
2659
- .cirth h2 {
2660
- --cirth-font-size: 1.75rem;
2661
- --cirth-line-height: 1.15;
2662
- --cirth-typography-spacing-top: 2.625rem;
2663
- }
2664
-
2665
- .cirth h3 {
2666
- --cirth-font-size: 1.5rem;
2667
- --cirth-line-height: 1.175;
2668
- --cirth-typography-spacing-top: 2.25rem;
2669
- }
2670
-
2671
- .cirth h4 {
2672
- --cirth-font-size: var(--cirth-font-size-xl);
2673
- --cirth-line-height: 1.2;
2674
- --cirth-typography-spacing-top: 1.874rem;
2675
- }
2676
-
2677
- .cirth h5 {
2678
- --cirth-font-size: var(--cirth-font-size-lg);
2679
- --cirth-line-height: 1.225;
2680
- --cirth-typography-spacing-top: 1.6875rem;
2681
- }
2682
-
2683
- .cirth h6 {
2684
- --cirth-font-size: var(--cirth-font-size-md);
2685
- --cirth-line-height: var(--cirth-line-height-snug);
2686
- --cirth-typography-spacing-top: var(--cirth-space-6);
2687
- }
2688
-
2689
- .cirth thead th, .cirth thead td, .cirth tfoot th, .cirth tfoot td {
2690
- --cirth-font-weight: var(--cirth-font-weight-semibold);
2691
- --cirth-border-width: .1875rem;
2692
- }
2693
-
2694
- .cirth pre, .cirth code, .cirth kbd, .cirth samp {
2695
- --cirth-font-family: var(--cirth-font-family-monospace);
2696
- }
2697
-
2698
- .cirth kbd {
2699
- --cirth-font-weight: bolder;
2700
- }
2701
-
2702
- .cirth input:not(:is([type="submit"], [type="button"], [type="reset"], [type="checkbox"], [type="radio"], [type="file"])) {
2703
- --cirth-outline-width: var(--cirth-outline-width-1);
2704
- }
2705
-
2706
- .cirth :where(select, textarea) {
2707
- --cirth-outline-width: var(--cirth-outline-width-1);
2708
- }
2709
-
2710
- .cirth [type="search"] {
2711
- --cirth-border-radius: var(--cirth-radius-pill);
2712
- }
2713
-
2714
- .cirth [type="checkbox"] {
2715
- --cirth-border-width: var(--cirth-border-width-2);
2716
- }
2717
-
2718
- .cirth [type="radio"] {
2719
- --cirth-border-width: var(--cirth-border-width-2);
2720
- }
2721
-
2722
- .cirth [type="checkbox"][role="switch"] {
2723
- --cirth-border-width: .1875rem;
2724
- }
2725
-
2726
- .cirth [role="search"] {
2727
- --cirth-border-radius: var(--cirth-radius-pill);
2728
- }
2729
-
2730
- .cirth [role="search"] button, .cirth [role="search"] [role="button"], .cirth [role="group"] button, .cirth [role="group"] [role="button"] {
2731
- --cirth-form-element-spacing-horizontal: var(--cirth-space-8);
2732
- }
2733
-
2734
- .cirth [role="search"] [type="submit"] {
2735
- --cirth-form-element-spacing-horizontal: var(--cirth-space-8);
2736
- }
2737
-
2738
- .cirth [role="search"] [type="button"] {
2739
- --cirth-form-element-spacing-horizontal: var(--cirth-space-8);
2740
- }
2741
-
2742
- .cirth [role="group"] [type="submit"] {
2743
- --cirth-form-element-spacing-horizontal: var(--cirth-space-8);
2744
- }
2745
-
2746
- .cirth [role="group"] [type="button"] {
2747
- --cirth-form-element-spacing-horizontal: var(--cirth-space-8);
2748
- }
2749
-
2750
- .cirth details summary[role="button"]:after {
2751
- filter: brightness(0) invert();
2752
- }
2753
-
2754
- .cirth [aria-busy="true"]:not(:is(input, select, textarea)):is(button, [type="submit"], [type="button"], [type="reset"], [role="button"]):before {
2755
- filter: brightness(0) invert();
2756
- }
2757
-
2758
- .cirth[data-theme="light"], .cirth [data-theme="light"], .cirth:not([data-theme="dark"]) {
2759
- --lightningcss-light: initial;
2760
- --lightningcss-dark: ;
2761
- color-scheme: light;
2762
- --cirth-background-color: #fff;
2763
- --cirth-color: #373c44;
2764
- --cirth-text-selection-color: rgba(0, 166, 110, .25);
2765
- --cirth-muted-color: #646b79;
2766
- --cirth-muted-border-color: #e7eaf0;
2767
- --cirth-primary: #007a50;
2768
- --cirth-primary-background: #007a50;
2769
- --cirth-primary-border: var(--cirth-primary-background);
2770
- --cirth-primary-underline: rgba(0, 122, 80, .5);
2771
- --cirth-primary-hover: #005f3d;
2772
- --cirth-primary-hover-background: #006d46;
2773
- --cirth-primary-hover-border: var(--cirth-primary-hover-background);
2774
- --cirth-primary-hover-underline: var(--cirth-primary-hover);
2775
- --cirth-primary-focus: rgba(0, 166, 110, .5);
2776
- --cirth-primary-inverse: #fff;
2777
- --cirth-secondary: #5d6b89;
2778
- --cirth-secondary-background: #525f7a;
2779
- --cirth-secondary-border: var(--cirth-secondary-background);
2780
- --cirth-secondary-underline: rgba(93, 107, 137, .5);
2781
- --cirth-secondary-hover: #48536b;
2782
- --cirth-secondary-hover-background: #48536b;
2783
- --cirth-secondary-hover-border: var(--cirth-secondary-hover-background);
2784
- --cirth-secondary-hover-underline: var(--cirth-secondary-hover);
2785
- --cirth-secondary-focus: rgba(93, 107, 137, .25);
2786
- --cirth-secondary-inverse: #fff;
2787
- --cirth-contrast: #181c25;
2788
- --cirth-contrast-background: #181c25;
2789
- --cirth-contrast-border: var(--cirth-contrast-background);
2790
- --cirth-contrast-underline: rgba(24, 28, 37, .5);
2791
- --cirth-contrast-hover: #000;
2792
- --cirth-contrast-hover-background: #000;
2793
- --cirth-contrast-hover-border: var(--cirth-contrast-hover-background);
2794
- --cirth-contrast-hover-underline: var(--cirth-secondary-hover);
2795
- --cirth-contrast-focus: rgba(93, 107, 137, .25);
2796
- --cirth-contrast-inverse: #fff;
2797
- --cirth-box-shadow: .0145rem .029rem .174rem rgba(129, 145, 181, .016), .0335rem .067rem .402rem rgba(129, 145, 181, .024), .0625rem .125rem .75rem rgba(129, 145, 181, .03), .1125rem .225rem 1.35rem rgba(129, 145, 181, .035), .2085rem .417rem 2.502rem rgba(129, 145, 181, .043), .5rem 1rem 6rem rgba(129, 145, 181, .06), 0 0 0 .0625rem rgba(129, 145, 181, .016);
2798
- --cirth-h1-color: #2d3138;
2799
- --cirth-h2-color: #373c44;
2800
- --cirth-h3-color: #424751;
2801
- --cirth-h4-color: #4d535e;
2802
- --cirth-h5-color: #5c6370;
2803
- --cirth-h6-color: #646b79;
2804
- --cirth-mark-background-color: #fde7c0;
2805
- --cirth-mark-color: #0f1114;
2806
- --cirth-ins-color: #1d6a54;
2807
- --cirth-del-color: #883935;
2808
- --cirth-blockquote-border-color: var(--cirth-muted-border-color);
2809
- --cirth-blockquote-footer-color: var(--cirth-muted-color);
2810
- --cirth-button-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
2811
- --cirth-button-hover-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
2812
- --cirth-table-border-color: var(--cirth-muted-border-color);
2813
- --cirth-table-row-stripped-background-color: rgba(111, 120, 135, .04);
2814
- --cirth-code-background-color: #f3f5f7;
2815
- --cirth-code-color: #646b79;
2816
- --cirth-code-kbd-background-color: var(--cirth-color);
2817
- --cirth-code-kbd-color: var(--cirth-background-color);
2818
- --cirth-form-element-background-color: #fbfcfc;
2819
- --cirth-form-element-selected-background-color: #dfe3eb;
2820
- --cirth-form-element-border-color: #cfd5e2;
2821
- --cirth-form-element-color: #23262c;
2822
- --cirth-form-element-placeholder-color: var(--cirth-muted-color);
2823
- --cirth-form-element-active-background-color: #fff;
2824
- --cirth-form-element-active-border-color: var(--cirth-primary-border);
2825
- --cirth-form-element-focus-color: var(--cirth-primary-border);
2826
- --cirth-form-element-disabled-opacity: var(--cirth-opacity-disabled);
2827
- --cirth-form-element-invalid-border-color: #b86a6b;
2828
- --cirth-form-element-invalid-active-border-color: #c84f48;
2829
- --cirth-form-element-invalid-focus-color: var(--cirth-form-element-invalid-active-border-color);
2830
- --cirth-form-element-valid-border-color: #4c9b8a;
2831
- --cirth-form-element-valid-active-border-color: #279977;
2832
- --cirth-form-element-valid-focus-color: var(--cirth-form-element-valid-active-border-color);
2833
- --cirth-switch-background-color: #bfc7d9;
2834
- --cirth-switch-checked-background-color: var(--cirth-primary-background);
2835
- --cirth-switch-color: #fff;
2836
- --cirth-switch-thumb-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
2837
- --cirth-range-border-color: #dfe3eb;
2838
- --cirth-range-active-border-color: #bfc7d9;
2839
- --cirth-range-thumb-border-color: var(--cirth-background-color);
2840
- --cirth-range-thumb-color: var(--cirth-secondary-background);
2841
- --cirth-range-thumb-active-color: var(--cirth-primary-background);
2842
- --cirth-accordion-border-color: var(--cirth-muted-border-color);
2843
- --cirth-accordion-active-summary-color: var(--cirth-primary-hover);
2844
- --cirth-accordion-close-summary-color: var(--cirth-color);
2845
- --cirth-accordion-open-summary-color: var(--cirth-muted-color);
2846
- --cirth-card-background-color: var(--cirth-background-color);
2847
- --cirth-card-border-color: var(--cirth-muted-border-color);
2848
- --cirth-card-box-shadow: var(--cirth-box-shadow);
2849
- --cirth-card-sectioning-background-color: #fbfcfc;
2850
- --cirth-loading-spinner-opacity: var(--cirth-opacity-disabled);
2851
- --cirth-modal-overlay-background-color: rgba(232, 234, 237, var(--cirth-opacity-overlay));
2852
- --cirth-progress-background-color: #dfe3eb;
2853
- --cirth-progress-color: var(--cirth-primary-background);
2854
- --cirth-tooltip-background-color: var(--cirth-contrast-background);
2855
- --cirth-tooltip-color: var(--cirth-contrast-inverse);
2856
- --cirth-icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(76, 154.5, 137.5)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
2857
- --cirth-icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(200.25, 79.25, 72.25)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
2858
- }
2859
-
2860
- .cirth[data-theme="light"] input:is([type="submit"], [type="button"], [type="reset"], [type="checkbox"], [type="radio"], [type="file"]) {
2861
- --cirth-form-element-focus-color: var(--cirth-primary-focus);
2862
- }
2863
-
2864
- .cirth [data-theme="light"] input:is([type="submit"], [type="button"], [type="reset"], [type="checkbox"], [type="radio"], [type="file"]) {
2865
- --cirth-form-element-focus-color: var(--cirth-primary-focus);
2866
- }
2867
-
2868
- .cirth:not([data-theme="dark"]) input:is([type="submit"], [type="button"], [type="reset"], [type="checkbox"], [type="radio"], [type="file"]) {
2869
- --cirth-form-element-focus-color: var(--cirth-primary-focus);
2870
- }
2871
-
2872
- @media only screen and (prefers-color-scheme: dark) {
2873
- .cirth:not([data-theme]) {
2874
- --lightningcss-light: ;
2875
- --lightningcss-dark: initial;
2876
- color-scheme: dark;
2877
- --cirth-background-color: #13171f;
2878
- --cirth-color: #c2c7d0;
2879
- --cirth-text-selection-color: rgba(0, 180, 120, .19);
2880
- --cirth-muted-color: #7b8495;
2881
- --cirth-muted-border-color: #202632;
2882
- --cirth-primary: #00b478;
2883
- --cirth-primary-background: #007a50;
2884
- --cirth-primary-border: var(--cirth-primary-background);
2885
- --cirth-primary-underline: rgba(0, 180, 120, .5);
2886
- --cirth-primary-hover: #0c8;
2887
- --cirth-primary-hover-background: #00895a;
2888
- --cirth-primary-hover-border: var(--cirth-primary-hover-background);
2889
- --cirth-primary-hover-underline: var(--cirth-primary-hover);
2890
- --cirth-primary-focus: rgba(0, 180, 120, .376);
2891
- --cirth-primary-inverse: #fff;
2892
- --cirth-secondary: #969eaf;
2893
- --cirth-secondary-background: #525f7a;
2894
- --cirth-secondary-border: var(--cirth-secondary-background);
2895
- --cirth-secondary-underline: rgba(150, 158, 175, .5);
2896
- --cirth-secondary-hover: #b3b9c5;
2897
- --cirth-secondary-hover-background: #5d6b89;
2898
- --cirth-secondary-hover-border: var(--cirth-secondary-hover-background);
2899
- --cirth-secondary-hover-underline: var(--cirth-secondary-hover);
2900
- --cirth-secondary-focus: rgba(144, 158, 190, .25);
2901
- --cirth-secondary-inverse: #fff;
2902
- --cirth-contrast: #dfe3eb;
2903
- --cirth-contrast-background: #eff1f4;
2904
- --cirth-contrast-border: var(--cirth-contrast-background);
2905
- --cirth-contrast-underline: rgba(223, 227, 235, .5);
2906
- --cirth-contrast-hover: #fff;
2907
- --cirth-contrast-hover-background: #fff;
2908
- --cirth-contrast-hover-border: var(--cirth-contrast-hover-background);
2909
- --cirth-contrast-hover-underline: var(--cirth-contrast-hover);
2910
- --cirth-contrast-focus: rgba(207, 213, 226, .25);
2911
- --cirth-contrast-inverse: #000;
2912
- --cirth-box-shadow: .0145rem .029rem .174rem rgba(7, 9, 12, .016), .0335rem .067rem .402rem rgba(7, 9, 12, .024), .0625rem .125rem .75rem rgba(7, 9, 12, .03), .1125rem .225rem 1.35rem rgba(7, 9, 12, .035), .2085rem .417rem 2.502rem rgba(7, 9, 12, .043), .5rem 1rem 6rem rgba(7, 9, 12, .06), 0 0 0 .0625rem rgba(7, 9, 12, .016);
2913
- --cirth-h1-color: #f0f1f3;
2914
- --cirth-h2-color: #e0e3e7;
2915
- --cirth-h3-color: #c2c7d0;
2916
- --cirth-h4-color: #b3b9c5;
2917
- --cirth-h5-color: #a4acba;
2918
- --cirth-h6-color: #8891a4;
2919
- --cirth-mark-background-color: #014063;
2920
- --cirth-mark-color: #fff;
2921
- --cirth-ins-color: #62af9a;
2922
- --cirth-del-color: #ce7e7b;
2923
- --cirth-blockquote-border-color: var(--cirth-muted-border-color);
2924
- --cirth-blockquote-footer-color: var(--cirth-muted-color);
2925
- --cirth-button-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
2926
- --cirth-button-hover-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
2927
- --cirth-table-border-color: var(--cirth-muted-border-color);
2928
- --cirth-table-row-stripped-background-color: rgba(111, 120, 135, .04);
2929
- --cirth-code-background-color: #1a1f28;
2930
- --cirth-code-color: #8891a4;
2931
- --cirth-code-kbd-background-color: var(--cirth-color);
2932
- --cirth-code-kbd-color: var(--cirth-background-color);
2933
- --cirth-form-element-background-color: #1c212c;
2934
- --cirth-form-element-selected-background-color: #2a3140;
2935
- --cirth-form-element-border-color: #2a3140;
2936
- --cirth-form-element-color: #e0e3e7;
2937
- --cirth-form-element-placeholder-color: #8891a4;
2938
- --cirth-form-element-active-background-color: #1a1f28;
2939
- --cirth-form-element-active-border-color: var(--cirth-primary-border);
2940
- --cirth-form-element-focus-color: var(--cirth-primary-border);
2941
- --cirth-form-element-disabled-opacity: var(--cirth-opacity-disabled);
2942
- --cirth-form-element-invalid-border-color: #964a50;
2943
- --cirth-form-element-invalid-active-border-color: #b7403b;
2944
- --cirth-form-element-invalid-focus-color: var(--cirth-form-element-invalid-active-border-color);
2945
- --cirth-form-element-valid-border-color: #2a7b6f;
2946
- --cirth-form-element-valid-active-border-color: #16896a;
2947
- --cirth-form-element-valid-focus-color: var(--cirth-form-element-valid-active-border-color);
2948
- --cirth-switch-background-color: #333c4e;
2949
- --cirth-switch-checked-background-color: var(--cirth-primary-background);
2950
- --cirth-switch-color: #fff;
2951
- --cirth-switch-thumb-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
2952
- --cirth-range-border-color: #202632;
2953
- --cirth-range-active-border-color: #2a3140;
2954
- --cirth-range-thumb-border-color: var(--cirth-background-color);
2955
- --cirth-range-thumb-color: var(--cirth-secondary-background);
2956
- --cirth-range-thumb-active-color: var(--cirth-primary-background);
2957
- --cirth-accordion-border-color: var(--cirth-muted-border-color);
2958
- --cirth-accordion-active-summary-color: var(--cirth-primary-hover);
2959
- --cirth-accordion-close-summary-color: var(--cirth-color);
2960
- --cirth-accordion-open-summary-color: var(--cirth-muted-color);
2961
- --cirth-card-background-color: #181c25;
2962
- --cirth-card-border-color: var(--cirth-card-background-color);
2963
- --cirth-card-box-shadow: var(--cirth-box-shadow);
2964
- --cirth-card-sectioning-background-color: #1a1f28;
2965
- --cirth-loading-spinner-opacity: var(--cirth-opacity-disabled);
2966
- --cirth-modal-overlay-background-color: rgba(7.5, 8.5, 10, var(--cirth-opacity-overlay));
2967
- --cirth-progress-background-color: #202632;
2968
- --cirth-progress-color: var(--cirth-primary-background);
2969
- --cirth-tooltip-background-color: var(--cirth-contrast-background);
2970
- --cirth-tooltip-color: var(--cirth-contrast-inverse);
2971
- --cirth-icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(42, 123, 111)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
2972
- --cirth-icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(149.5, 74, 80)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
2973
- }
2974
-
2975
- .cirth:not([data-theme]) input:is([type="submit"], [type="button"], [type="reset"], [type="checkbox"], [type="radio"], [type="file"]) {
2976
- --cirth-form-element-focus-color: var(--cirth-primary-focus);
2977
- }
2978
- }
2979
-
2980
- .cirth[data-theme="dark"], .cirth [data-theme="dark"] {
2981
- --lightningcss-light: ;
2982
- --lightningcss-dark: initial;
2983
- color-scheme: dark;
2984
- --cirth-background-color: #13171f;
2985
- --cirth-color: #c2c7d0;
2986
- --cirth-text-selection-color: rgba(0, 180, 120, .19);
2987
- --cirth-muted-color: #7b8495;
2988
- --cirth-muted-border-color: #202632;
2989
- --cirth-primary: #00b478;
2990
- --cirth-primary-background: #007a50;
2991
- --cirth-primary-border: var(--cirth-primary-background);
2992
- --cirth-primary-underline: rgba(0, 180, 120, .5);
2993
- --cirth-primary-hover: #0c8;
2994
- --cirth-primary-hover-background: #00895a;
2995
- --cirth-primary-hover-border: var(--cirth-primary-hover-background);
2996
- --cirth-primary-hover-underline: var(--cirth-primary-hover);
2997
- --cirth-primary-focus: rgba(0, 180, 120, .376);
2998
- --cirth-primary-inverse: #fff;
2999
- --cirth-secondary: #969eaf;
3000
- --cirth-secondary-background: #525f7a;
3001
- --cirth-secondary-border: var(--cirth-secondary-background);
3002
- --cirth-secondary-underline: rgba(150, 158, 175, .5);
3003
- --cirth-secondary-hover: #b3b9c5;
3004
- --cirth-secondary-hover-background: #5d6b89;
3005
- --cirth-secondary-hover-border: var(--cirth-secondary-hover-background);
3006
- --cirth-secondary-hover-underline: var(--cirth-secondary-hover);
3007
- --cirth-secondary-focus: rgba(144, 158, 190, .25);
3008
- --cirth-secondary-inverse: #fff;
3009
- --cirth-contrast: #dfe3eb;
3010
- --cirth-contrast-background: #eff1f4;
3011
- --cirth-contrast-border: var(--cirth-contrast-background);
3012
- --cirth-contrast-underline: rgba(223, 227, 235, .5);
3013
- --cirth-contrast-hover: #fff;
3014
- --cirth-contrast-hover-background: #fff;
3015
- --cirth-contrast-hover-border: var(--cirth-contrast-hover-background);
3016
- --cirth-contrast-hover-underline: var(--cirth-contrast-hover);
3017
- --cirth-contrast-focus: rgba(207, 213, 226, .25);
3018
- --cirth-contrast-inverse: #000;
3019
- --cirth-box-shadow: .0145rem .029rem .174rem rgba(7, 9, 12, .016), .0335rem .067rem .402rem rgba(7, 9, 12, .024), .0625rem .125rem .75rem rgba(7, 9, 12, .03), .1125rem .225rem 1.35rem rgba(7, 9, 12, .035), .2085rem .417rem 2.502rem rgba(7, 9, 12, .043), .5rem 1rem 6rem rgba(7, 9, 12, .06), 0 0 0 .0625rem rgba(7, 9, 12, .016);
3020
- --cirth-h1-color: #f0f1f3;
3021
- --cirth-h2-color: #e0e3e7;
3022
- --cirth-h3-color: #c2c7d0;
3023
- --cirth-h4-color: #b3b9c5;
3024
- --cirth-h5-color: #a4acba;
3025
- --cirth-h6-color: #8891a4;
3026
- --cirth-mark-background-color: #014063;
3027
- --cirth-mark-color: #fff;
3028
- --cirth-ins-color: #62af9a;
3029
- --cirth-del-color: #ce7e7b;
3030
- --cirth-blockquote-border-color: var(--cirth-muted-border-color);
3031
- --cirth-blockquote-footer-color: var(--cirth-muted-color);
3032
- --cirth-button-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
3033
- --cirth-button-hover-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
3034
- --cirth-table-border-color: var(--cirth-muted-border-color);
3035
- --cirth-table-row-stripped-background-color: rgba(111, 120, 135, .04);
3036
- --cirth-code-background-color: #1a1f28;
3037
- --cirth-code-color: #8891a4;
3038
- --cirth-code-kbd-background-color: var(--cirth-color);
3039
- --cirth-code-kbd-color: var(--cirth-background-color);
3040
- --cirth-form-element-background-color: #1c212c;
3041
- --cirth-form-element-selected-background-color: #2a3140;
3042
- --cirth-form-element-border-color: #2a3140;
3043
- --cirth-form-element-color: #e0e3e7;
3044
- --cirth-form-element-placeholder-color: #8891a4;
3045
- --cirth-form-element-active-background-color: #1a1f28;
3046
- --cirth-form-element-active-border-color: var(--cirth-primary-border);
3047
- --cirth-form-element-focus-color: var(--cirth-primary-border);
3048
- --cirth-form-element-disabled-opacity: var(--cirth-opacity-disabled);
3049
- --cirth-form-element-invalid-border-color: #964a50;
3050
- --cirth-form-element-invalid-active-border-color: #b7403b;
3051
- --cirth-form-element-invalid-focus-color: var(--cirth-form-element-invalid-active-border-color);
3052
- --cirth-form-element-valid-border-color: #2a7b6f;
3053
- --cirth-form-element-valid-active-border-color: #16896a;
3054
- --cirth-form-element-valid-focus-color: var(--cirth-form-element-valid-active-border-color);
3055
- --cirth-switch-background-color: #333c4e;
3056
- --cirth-switch-checked-background-color: var(--cirth-primary-background);
3057
- --cirth-switch-color: #fff;
3058
- --cirth-switch-thumb-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
3059
- --cirth-range-border-color: #202632;
3060
- --cirth-range-active-border-color: #2a3140;
3061
- --cirth-range-thumb-border-color: var(--cirth-background-color);
3062
- --cirth-range-thumb-color: var(--cirth-secondary-background);
3063
- --cirth-range-thumb-active-color: var(--cirth-primary-background);
3064
- --cirth-accordion-border-color: var(--cirth-muted-border-color);
3065
- --cirth-accordion-active-summary-color: var(--cirth-primary-hover);
3066
- --cirth-accordion-close-summary-color: var(--cirth-color);
3067
- --cirth-accordion-open-summary-color: var(--cirth-muted-color);
3068
- --cirth-card-background-color: #181c25;
3069
- --cirth-card-border-color: var(--cirth-card-background-color);
3070
- --cirth-card-box-shadow: var(--cirth-box-shadow);
3071
- --cirth-card-sectioning-background-color: #1a1f28;
3072
- --cirth-loading-spinner-opacity: var(--cirth-opacity-disabled);
3073
- --cirth-modal-overlay-background-color: rgba(7.5, 8.5, 10, var(--cirth-opacity-overlay));
3074
- --cirth-progress-background-color: #202632;
3075
- --cirth-progress-color: var(--cirth-primary-background);
3076
- --cirth-tooltip-background-color: var(--cirth-contrast-background);
3077
- --cirth-tooltip-color: var(--cirth-contrast-inverse);
3078
- --cirth-icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(42, 123, 111)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
3079
- --cirth-icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(149.5, 74, 80)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
3080
- }
3081
-
3082
- .cirth[data-theme="dark"] input:is([type="submit"], [type="button"], [type="reset"], [type="checkbox"], [type="radio"], [type="file"]) {
3083
- --cirth-form-element-focus-color: var(--cirth-primary-focus);
3084
- }
3085
-
3086
- .cirth [data-theme="dark"] input:is([type="submit"], [type="button"], [type="reset"], [type="checkbox"], [type="radio"], [type="file"]) {
3087
- --cirth-form-element-focus-color: var(--cirth-primary-focus);
3088
- }
3089
-
3090
- .cirth progress {
3091
- accent-color: var(--cirth-primary);
3092
- }
3093
-
3094
- .cirth [type="checkbox"] {
3095
- accent-color: var(--cirth-primary);
3096
- }
3097
-
3098
- .cirth [type="radio"] {
3099
- accent-color: var(--cirth-primary);
3100
- }
3101
-
3102
- .cirth [type="range"] {
3103
- accent-color: var(--cirth-primary);
3104
- }