tide-design-system 2.0.33 → 2.0.35

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.
@@ -3,6 +3,7 @@
3
3
  .tide-position-absolute {position: absolute;}
4
4
  .tide-position-fixed {position: fixed;}
5
5
  .tide-position-relative {position: relative;}
6
+ .tide-position-static {position: static;}
6
7
  .tide-position-sticky {position: sticky;}
7
8
 
8
9
  .tide-top-0 {top: 0;}
@@ -46,13 +47,15 @@
46
47
  .tide-axis2-start {align-items: flex-start;}
47
48
  .tide-axis2-stretch {align-items: stretch;}
48
49
 
50
+ .tide-gap-0 {gap: 0;}
49
51
  .tide-gap-1\/4 {gap: var(--tide-spacing-1\/4);}
50
52
  .tide-gap-1\/2 {gap: var(--tide-spacing-1\/2);}
51
53
  .tide-gap-1 {gap: var(--tide-spacing-1);}
52
54
  .tide-gap-2 {gap: var(--tide-spacing-2);}
53
55
  .tide-gap-4 {gap: var(--tide-spacing-4);}
54
56
 
55
- .tide-flex-basis-0 {flex-basis: 0;}
57
+ .tide-flex-basis-auto {flex-basis: auto;}
58
+ .tide-flex-basis-0 {flex-basis: 0;}
56
59
 
57
60
  /* Box Sizing */
58
61
  .tide-box-border {box-sizing: border-box;}
@@ -66,15 +69,15 @@
66
69
  .tide-margin-2 {margin: var(--tide-spacing-2);}
67
70
  .tide-margin-4 {margin: var(--tide-spacing-4);}
68
71
 
69
- .tide-margin-x-0 {margin-left: 0; margin-right: 0;}
72
+ .tide-margin-x-0 {margin-left: 0; margin-right: 0;}
70
73
  .tide-margin-x-1\/4 {margin-left: var(--tide-spacing-1\/4); margin-right: var(--tide-spacing-1\/4);}
71
74
  .tide-margin-x-1\/2 {margin-left: var(--tide-spacing-1\/2); margin-right: var(--tide-spacing-1\/2);}
72
75
  .tide-margin-x-1 {margin-left: var(--tide-spacing-1); margin-right: var(--tide-spacing-1);}
73
76
  .tide-margin-x-2 {margin-left: var(--tide-spacing-2); margin-right: var(--tide-spacing-2);}
74
77
  .tide-margin-x-4 {margin-left: var(--tide-spacing-4); margin-right: var(--tide-spacing-4);}
75
- .tide-margin-x-auto {margin-left: auto; margin-right: auto;}
78
+ .tide-margin-x-auto {margin-left: auto; margin-right: auto;}
76
79
 
77
- .tide-margin-y-0 {margin-top: 0; margin-bottom: 0;}
80
+ .tide-margin-y-0 {margin-top: 0; margin-bottom: 0;}
78
81
  .tide-margin-y-1\/4 {margin-top: var(--tide-spacing-1\/4); margin-bottom: var(--tide-spacing-1\/4);}
79
82
  .tide-margin-y-1\/2 {margin-top: var(--tide-spacing-1\/2); margin-bottom: var(--tide-spacing-1\/2);}
80
83
  .tide-margin-y-1 {margin-top: var(--tide-spacing-1); margin-bottom: var(--tide-spacing-1);}
@@ -111,6 +114,8 @@
111
114
  .tide-margin-left-auto {margin-left: auto;}
112
115
 
113
116
  /* Border */
117
+ .tide-border-color-initial {border-color: initial;}
118
+
114
119
  .tide-border-1,
115
120
  .tide-border-2,
116
121
  .tide-border-bottom-1,
@@ -124,9 +129,15 @@
124
129
  border-style: solid;
125
130
  }
126
131
 
132
+ .tide-border-0 {border-width: 0;}
127
133
  .tide-border-1 {border-width: var(--tide-border-width-1);}
128
134
  .tide-border-2 {border-width: var(--tide-border-width-2);}
129
135
 
136
+ .tide-border-top-0 {border-top-width: 0;}
137
+ .tide-border-right-0 {border-right-width: 0;}
138
+ .tide-border-bottom-0 {border-bottom-width: 0;}
139
+ .tide-border-left-0 {border-left-width: 0;}
140
+
130
141
  .tide-border-top-1 {border-top-width: var(--tide-border-width-1);}
131
142
  .tide-border-right-1 {border-right-width: var(--tide-border-width-1);}
132
143
  .tide-border-bottom-1 {border-bottom-width: var(--tide-border-width-1);}
@@ -137,6 +148,7 @@
137
148
  .tide-border-bottom-2 {border-bottom-width: var(--tide-border-width-2);}
138
149
  .tide-border-left-2 {border-left-width: var(--tide-border-width-2);}
139
150
 
151
+ .tide-radius-0 {border-radius: 0;}
140
152
  .tide-radius-1\/4 {border-radius: var(--tide-radius-1\/4);}
141
153
  .tide-radius-1\/2 {border-radius: var(--tide-radius-1\/2);}
142
154
  .tide-radius-1 {border-radius: var(--tide-radius-1);}
@@ -150,14 +162,14 @@
150
162
  .tide-padding-2 {padding: var(--tide-spacing-2);}
151
163
  .tide-padding-4 {padding: var(--tide-spacing-4);}
152
164
 
153
- .tide-padding-x-0 {padding-left: 0; padding-right: 0;}
165
+ .tide-padding-x-0 {padding-left: 0; padding-right: 0;}
154
166
  .tide-padding-x-1\/4 {padding-left: var(--tide-spacing-1\/4); padding-right: var(--tide-spacing-1\/4);}
155
167
  .tide-padding-x-1\/2 {padding-left: var(--tide-spacing-1\/2); padding-right: var(--tide-spacing-1\/2);}
156
168
  .tide-padding-x-1 {padding-left: var(--tide-spacing-1); padding-right: var(--tide-spacing-1);}
157
169
  .tide-padding-x-2 {padding-left: var(--tide-spacing-2); padding-right: var(--tide-spacing-2);}
158
170
  .tide-padding-x-4 {padding-left: var(--tide-spacing-4); padding-right: var(--tide-spacing-4);}
159
171
 
160
- .tide-padding-y-0 {padding-top: 0; padding-bottom: 0;}
172
+ .tide-padding-y-0 {padding-top: 0; padding-bottom: 0;}
161
173
  .tide-padding-y-1\/4 {padding-top: var(--tide-spacing-1\/4); padding-bottom: var(--tide-spacing-1\/4);}
162
174
  .tide-padding-y-1\/2 {padding-top: var(--tide-spacing-1\/2); padding-bottom: var(--tide-spacing-1\/2);}
163
175
  .tide-padding-y-1 {padding-top: var(--tide-spacing-1); padding-bottom: var(--tide-spacing-1);}
@@ -201,18 +213,42 @@
201
213
 
202
214
  .tide-width-container {max-width: 1168px;}
203
215
 
216
+ .tide-width-auto {width: auto;}
204
217
  .tide-width-0 {width: 0;}
205
218
  .tide-width-full {width: 100%;}
206
219
 
220
+ .tide-height-auto {height: auto;}
207
221
  .tide-height-0 {height: 0;}
208
222
  .tide-height-full {height: 100%;}
209
223
 
210
224
  /* Backgrounds */
225
+ .tide-bg-initial {background-color: initial;}
226
+
211
227
  .tide-transparent-100 {background-color: var(--tide-transparent-100);}
212
228
  .tide-transparent-200 {background-color: var(--tide-transparent-200);}
213
229
  .tide-transparent-300 {background-color: var(--tide-transparent-300);}
214
230
  .tide-transparent-400 {background-color: var(--tide-transparent-400);}
215
231
 
232
+ /* Typographic roles */
233
+ .tide-typography-display-1 {font-size: var(--tide-font-32); font-weight: 700;}
234
+ .tide-typography-headline-1 {font-size: var(--tide-font-24); font-weight: 700;}
235
+ .tide-typography-headline-2 {font-size: var(--tide-font-20); font-weight: 700;}
236
+ .tide-typography-headline-3 {font-size: var(--tide-font-16); font-weight: 700;}
237
+ .tide-typography-title-1 {font-size: var(--tide-font-20); font-weight: 600;}
238
+ .tide-typography-title-2 {font-size: var(--tide-font-18); font-weight: 600;}
239
+ .tide-typography-body-1 {font-size: var(--tide-font-16); font-weight: 400;}
240
+ .tide-typography-body-2 {font-size: var(--tide-font-14); font-weight: 400;}
241
+ .tide-typography-label-1 {font-size: var(--tide-font-16); font-weight: 500;}
242
+ .tide-typography-label-1-semibold {font-size: var(--tide-font-16); font-weight: 600;}
243
+ .tide-typography-label-2 {font-size: var(--tide-font-14); font-weight: 500;}
244
+ .tide-typography-label-2-semibold {font-size: var(--tide-font-14); font-weight: 600;}
245
+ .tide-typography-label-3 {font-size: var(--tide-font-12); font-weight: 500;}
246
+ .tide-typography-link-1 {font-size: var(--tide-font-16); font-weight: 500;}
247
+ .tide-typography-link-2 {font-size: var(--tide-font-14); font-weight: 500;}
248
+ .tide-typography-link-3 {font-size: var(--tide-font-12); font-weight: 500;}
249
+ .tide-typography-button-1 {font-size: var(--tide-font-16); font-weight: 600;}
250
+ .tide-typography-button-2 {font-size: var(--tide-font-14); font-weight: 600;}
251
+
216
252
  /* Font Size */
217
253
  .tide-font-10 {font-size: var(--tide-font-10);}
218
254
  .tide-font-12 {font-size: var(--tide-font-12);}
@@ -229,16 +265,19 @@
229
265
  .tide-font-700 {font-weight: 700;}
230
266
 
231
267
  /* Misc */
232
- .tide-align-middle {vertical-align: middle;}
268
+ .tide-align-middle {vertical-align: middle;}
269
+ .tide-align-initial {vertical-align: initial;}
233
270
 
234
271
  .tide-bg-blur {backdrop-filter: blur(8px);}
235
272
 
236
- .tide-break-word {overflow-wrap: break-word;}
273
+ .tide-break-initial {overflow-wrap: initial;}
274
+ .tide-break-word {overflow-wrap: break-word;}
237
275
 
238
- .tide-columns-1 {column-count: 1;}
239
- .tide-columns-2 {column-count: 2;}
240
- .tide-columns-3 {column-count: 3;}
241
- .tide-columns-4 {column-count: 4;}
276
+ .tide-columns-initial {column-count: initial;}
277
+ .tide-columns-1 {column-count: 1;}
278
+ .tide-columns-2 {column-count: 2;}
279
+ .tide-columns-3 {column-count: 3;}
280
+ .tide-columns-4 {column-count: 4;}
242
281
 
243
282
  .tide-cursor-not-allowed {cursor: not-allowed;}
244
283
  .tide-cursor-pointer {cursor: pointer;}
@@ -279,8 +318,9 @@
279
318
  scroll-snap-align: start;
280
319
  }
281
320
 
282
- .tide-shadow-bottom {box-shadow: var(--tide-shadow-bottom);}
283
- .tide-shadow-top {box-shadow: var(--tide-shadow-top);}
321
+ .tide-shadow-initial {box-shadow: initial;}
322
+ .tide-shadow-bottom {box-shadow: var(--tide-shadow-bottom);}
323
+ .tide-shadow-top {box-shadow: var(--tide-shadow-top);}
284
324
 
285
325
  .tide-text-center {text-align: center;}
286
326
  .tide-text-left {text-align: left;}
@@ -317,7 +357,8 @@
317
357
  .tide-y-auto {overflow-y: auto;}
318
358
  .tide-y-hidden {overflow-y: hidden;}
319
359
 
320
- .tide-z-index-1 {z-index: 1;}
360
+ .tide-z-index-initial {z-index: initial;}
361
+ .tide-z-index-1 {z-index: 1;}
321
362
 
322
363
  /* Small breakpoint */
323
364
  @media (min-width: 768px) {
@@ -325,6 +366,7 @@
325
366
  .sm-tide-position-absolute {position: absolute;}
326
367
  .sm-tide-position-fixed {position: fixed;}
327
368
  .sm-tide-position-relative {position: relative;}
369
+ .sm-tide-position-static {position: static;}
328
370
  .sm-tide-position-sticky {position: sticky;}
329
371
 
330
372
  .sm-tide-top-0 {top: 0;}
@@ -368,13 +410,15 @@
368
410
  .sm-tide-axis2-start {align-items: flex-start;}
369
411
  .sm-tide-axis2-stretch {align-items: stretch;}
370
412
 
413
+ .sm-tide-gap-0 {gap: 0;}
371
414
  .sm-tide-gap-1\/4 {gap: var(--tide-spacing-1\/4);}
372
415
  .sm-tide-gap-1\/2 {gap: var(--tide-spacing-1\/2);}
373
416
  .sm-tide-gap-1 {gap: var(--tide-spacing-1);}
374
417
  .sm-tide-gap-2 {gap: var(--tide-spacing-2);}
375
418
  .sm-tide-gap-4 {gap: var(--tide-spacing-4);}
376
419
 
377
- .sm-tide-flex-basis-0 {flex-basis: 0;}
420
+ .sm-tide-flex-basis-auto {flex-basis: auto;}
421
+ .sm-tide-flex-basis-0 {flex-basis: 0;}
378
422
 
379
423
  /* Box Sizing */
380
424
  .sm-tide-box-border {box-sizing: border-box;}
@@ -388,15 +432,15 @@
388
432
  .sm-tide-margin-2 {margin: var(--tide-spacing-2);}
389
433
  .sm-tide-margin-4 {margin: var(--tide-spacing-4);}
390
434
 
391
- .sm-tide-margin-x-0 {margin-left: 0; margin-right: 0;}
435
+ .sm-tide-margin-x-0 {margin-left: 0; margin-right: 0;}
392
436
  .sm-tide-margin-x-1\/4 {margin-left: var(--tide-spacing-1\/4); margin-right: var(--tide-spacing-1\/4);}
393
437
  .sm-tide-margin-x-1\/2 {margin-left: var(--tide-spacing-1\/2); margin-right: var(--tide-spacing-1\/2);}
394
438
  .sm-tide-margin-x-1 {margin-left: var(--tide-spacing-1); margin-right: var(--tide-spacing-1);}
395
439
  .sm-tide-margin-x-2 {margin-left: var(--tide-spacing-2); margin-right: var(--tide-spacing-2);}
396
440
  .sm-tide-margin-x-4 {margin-left: var(--tide-spacing-4); margin-right: var(--tide-spacing-4);}
397
- .sm-tide-margin-x-auto {margin-left: auto; margin-right: auto;}
441
+ .sm-tide-margin-x-auto {margin-left: auto; margin-right: auto;}
398
442
 
399
- .sm-tide-margin-y-0 {margin-top: 0; margin-bottom: 0;}
443
+ .sm-tide-margin-y-0 {margin-top: 0; margin-bottom: 0;}
400
444
  .sm-tide-margin-y-1\/4 {margin-top: var(--tide-spacing-1\/4); margin-bottom: var(--tide-spacing-1\/4);}
401
445
  .sm-tide-margin-y-1\/2 {margin-top: var(--tide-spacing-1\/2); margin-bottom: var(--tide-spacing-1\/2);}
402
446
  .sm-tide-margin-y-1 {margin-top: var(--tide-spacing-1); margin-bottom: var(--tide-spacing-1);}
@@ -433,6 +477,8 @@
433
477
  .sm-tide-margin-left-auto {margin-left: auto;}
434
478
 
435
479
  /* Border */
480
+ .sm-tide-border-color-initial {border-color: initial;}
481
+
436
482
  .sm-tide-border-1,
437
483
  .sm-tide-border-2,
438
484
  .sm-tide-border-bottom-1,
@@ -446,9 +492,15 @@
446
492
  border-style: solid;
447
493
  }
448
494
 
495
+ .sm-tide-border-0 {border-width: 0;}
449
496
  .sm-tide-border-1 {border-width: var(--tide-border-width-1);}
450
497
  .sm-tide-border-2 {border-width: var(--tide-border-width-2);}
451
498
 
499
+ .sm-tide-border-top-0 {border-top-width: 0;}
500
+ .sm-tide-border-right-0 {border-right-width: 0;}
501
+ .sm-tide-border-bottom-0 {border-bottom-width: 0;}
502
+ .sm-tide-border-left-0 {border-left-width: 0;}
503
+
452
504
  .sm-tide-border-top-1 {border-top-width: var(--tide-border-width-1);}
453
505
  .sm-tide-border-right-1 {border-right-width: var(--tide-border-width-1);}
454
506
  .sm-tide-border-bottom-1 {border-bottom-width: var(--tide-border-width-1);}
@@ -459,6 +511,7 @@
459
511
  .sm-tide-border-bottom-2 {border-bottom-width: var(--tide-border-width-2);}
460
512
  .sm-tide-border-left-2 {border-left-width: var(--tide-border-width-2);}
461
513
 
514
+ .sm-tide-radius-0 {border-radius: 0;}
462
515
  .sm-tide-radius-1\/4 {border-radius: var(--tide-radius-1\/4);}
463
516
  .sm-tide-radius-1\/2 {border-radius: var(--tide-radius-1\/2);}
464
517
  .sm-tide-radius-1 {border-radius: var(--tide-radius-1);}
@@ -472,14 +525,14 @@
472
525
  .sm-tide-padding-2 {padding: var(--tide-spacing-2);}
473
526
  .sm-tide-padding-4 {padding: var(--tide-spacing-4);}
474
527
 
475
- .sm-tide-padding-x-0 {padding-left: 0; padding-right: 0;}
528
+ .sm-tide-padding-x-0 {padding-left: 0; padding-right: 0;}
476
529
  .sm-tide-padding-x-1\/4 {padding-left: var(--tide-spacing-1\/4); padding-right: var(--tide-spacing-1\/4);}
477
530
  .sm-tide-padding-x-1\/2 {padding-left: var(--tide-spacing-1\/2); padding-right: var(--tide-spacing-1\/2);}
478
531
  .sm-tide-padding-x-1 {padding-left: var(--tide-spacing-1); padding-right: var(--tide-spacing-1);}
479
532
  .sm-tide-padding-x-2 {padding-left: var(--tide-spacing-2); padding-right: var(--tide-spacing-2);}
480
533
  .sm-tide-padding-x-4 {padding-left: var(--tide-spacing-4); padding-right: var(--tide-spacing-4);}
481
534
 
482
- .sm-tide-padding-y-0 {padding-top: 0; padding-bottom: 0;}
535
+ .sm-tide-padding-y-0 {padding-top: 0; padding-bottom: 0;}
483
536
  .sm-tide-padding-y-1\/4 {padding-top: var(--tide-spacing-1\/4); padding-bottom: var(--tide-spacing-1\/4);}
484
537
  .sm-tide-padding-y-1\/2 {padding-top: var(--tide-spacing-1\/2); padding-bottom: var(--tide-spacing-1\/2);}
485
538
  .sm-tide-padding-y-1 {padding-top: var(--tide-spacing-1); padding-bottom: var(--tide-spacing-1);}
@@ -523,18 +576,42 @@
523
576
 
524
577
  .sm-tide-width-container {max-width: 1168px;}
525
578
 
579
+ .sm-tide-width-auto {width: auto;}
526
580
  .sm-tide-width-0 {width: 0;}
527
581
  .sm-tide-width-full {width: 100%;}
528
582
 
583
+ .sm-tide-height-auto {height: auto;}
529
584
  .sm-tide-height-0 {height: 0;}
530
585
  .sm-tide-height-full {height: 100%;}
531
586
 
532
587
  /* Backgrounds */
588
+ .sm-tide-bg-initial {background-color: initial;}
589
+
533
590
  .sm-tide-transparent-100 {background-color: var(--tide-transparent-100);}
534
591
  .sm-tide-transparent-200 {background-color: var(--tide-transparent-200);}
535
592
  .sm-tide-transparent-300 {background-color: var(--tide-transparent-300);}
536
593
  .sm-tide-transparent-400 {background-color: var(--tide-transparent-400);}
537
594
 
595
+ /* Typographic roles */
596
+ .sm-tide-typography-display-1 {font-size: var(--tide-font-32); font-weight: 700;}
597
+ .sm-tide-typography-headline-1 {font-size: var(--tide-font-24); font-weight: 700;}
598
+ .sm-tide-typography-headline-2 {font-size: var(--tide-font-20); font-weight: 700;}
599
+ .sm-tide-typography-headline-3 {font-size: var(--tide-font-16); font-weight: 700;}
600
+ .sm-tide-typography-title-1 {font-size: var(--tide-font-20); font-weight: 600;}
601
+ .sm-tide-typography-title-2 {font-size: var(--tide-font-18); font-weight: 600;}
602
+ .sm-tide-typography-body-1 {font-size: var(--tide-font-16); font-weight: 400;}
603
+ .sm-tide-typography-body-2 {font-size: var(--tide-font-14); font-weight: 400;}
604
+ .sm-tide-typography-label-1 {font-size: var(--tide-font-16); font-weight: 500;}
605
+ .sm-tide-typography-label-1-semibold {font-size: var(--tide-font-16); font-weight: 600;}
606
+ .sm-tide-typography-label-2 {font-size: var(--tide-font-14); font-weight: 500;}
607
+ .sm-tide-typography-label-2-semibold {font-size: var(--tide-font-14); font-weight: 600;}
608
+ .sm-tide-typography-label-3 {font-size: var(--tide-font-12); font-weight: 500;}
609
+ .sm-tide-typography-link-1 {font-size: var(--tide-font-16); font-weight: 500;}
610
+ .sm-tide-typography-link-2 {font-size: var(--tide-font-14); font-weight: 500;}
611
+ .sm-tide-typography-link-3 {font-size: var(--tide-font-12); font-weight: 500;}
612
+ .sm-tide-typography-button-1 {font-size: var(--tide-font-16); font-weight: 600;}
613
+ .sm-tide-typography-button-2 {font-size: var(--tide-font-14); font-weight: 600;}
614
+
538
615
  /* Font Size */
539
616
  .sm-tide-font-10 {font-size: var(--tide-font-10);}
540
617
  .sm-tide-font-12 {font-size: var(--tide-font-12);}
@@ -551,16 +628,19 @@
551
628
  .sm-tide-font-700 {font-weight: 700;}
552
629
 
553
630
  /* Misc */
554
- .sm-tide-align-middle {vertical-align: middle;}
631
+ .sm-tide-align-middle {vertical-align: middle;}
632
+ .sm-tide-align-initial {vertical-align: initial;}
555
633
 
556
634
  .sm-tide-bg-blur {backdrop-filter: blur(8px);}
557
635
 
558
- .sm-tide-break-word {overflow-wrap: break-word;}
636
+ .sm-tide-break-initial {overflow-wrap: initial;}
637
+ .sm-tide-break-word {overflow-wrap: break-word;}
559
638
 
560
- .sm-tide-columns-1 {column-count: 1;}
561
- .sm-tide-columns-2 {column-count: 2;}
562
- .sm-tide-columns-3 {column-count: 3;}
563
- .sm-tide-columns-4 {column-count: 4;}
639
+ .sm-tide-columns-initial {column-count: initial;}
640
+ .sm-tide-columns-1 {column-count: 1;}
641
+ .sm-tide-columns-2 {column-count: 2;}
642
+ .sm-tide-columns-3 {column-count: 3;}
643
+ .sm-tide-columns-4 {column-count: 4;}
564
644
 
565
645
  .sm-tide-cursor-not-allowed {cursor: not-allowed;}
566
646
  .sm-tide-cursor-pointer {cursor: pointer;}
@@ -601,8 +681,9 @@
601
681
  scroll-snap-align: start;
602
682
  }
603
683
 
604
- .sm-tide-shadow-bottom {box-shadow: var(--tide-shadow-bottom);}
605
- .sm-tide-shadow-top {box-shadow: var(--tide-shadow-top);}
684
+ .sm-tide-shadow-initial {box-shadow: initial;}
685
+ .sm-tide-shadow-bottom {box-shadow: var(--tide-shadow-bottom);}
686
+ .sm-tide-shadow-top {box-shadow: var(--tide-shadow-top);}
606
687
 
607
688
  .sm-tide-text-center {text-align: center;}
608
689
  .sm-tide-text-left {text-align: left;}
@@ -639,7 +720,8 @@
639
720
  .sm-tide-y-auto {overflow-y: auto;}
640
721
  .sm-tide-y-hidden {overflow-y: hidden;}
641
722
 
642
- .sm-tide-z-index-1 {z-index: 1;}
723
+ .sm-tide-z-index-initial {z-index: initial;}
724
+ .sm-tide-z-index-1 {z-index: 1;}
643
725
  }
644
726
 
645
727
  /* Medium breakpoint */
@@ -648,6 +730,7 @@
648
730
  .md-tide-position-absolute {position: absolute;}
649
731
  .md-tide-position-fixed {position: fixed;}
650
732
  .md-tide-position-relative {position: relative;}
733
+ .md-tide-position-static {position: static;}
651
734
  .md-tide-position-sticky {position: sticky;}
652
735
 
653
736
  .md-tide-top-0 {top: 0;}
@@ -691,13 +774,15 @@
691
774
  .md-tide-axis2-start {align-items: flex-start;}
692
775
  .md-tide-axis2-stretch {align-items: stretch;}
693
776
 
777
+ .md-tide-gap-0 {gap: 0;}
694
778
  .md-tide-gap-1\/4 {gap: var(--tide-spacing-1\/4);}
695
779
  .md-tide-gap-1\/2 {gap: var(--tide-spacing-1\/2);}
696
780
  .md-tide-gap-1 {gap: var(--tide-spacing-1);}
697
781
  .md-tide-gap-2 {gap: var(--tide-spacing-2);}
698
782
  .md-tide-gap-4 {gap: var(--tide-spacing-4);}
699
783
 
700
- .md-tide-flex-basis-0 {flex-basis: 0;}
784
+ .md-tide-flex-basis-auto {flex-basis: auto;}
785
+ .md-tide-flex-basis-0 {flex-basis: 0;}
701
786
 
702
787
  /* Box Sizing */
703
788
  .md-tide-box-border {box-sizing: border-box;}
@@ -711,15 +796,15 @@
711
796
  .md-tide-margin-2 {margin: var(--tide-spacing-2);}
712
797
  .md-tide-margin-4 {margin: var(--tide-spacing-4);}
713
798
 
714
- .md-tide-margin-x-0 {margin-left: 0; margin-right: 0;}
799
+ .md-tide-margin-x-0 {margin-left: 0; margin-right: 0;}
715
800
  .md-tide-margin-x-1\/4 {margin-left: var(--tide-spacing-1\/4); margin-right: var(--tide-spacing-1\/4);}
716
801
  .md-tide-margin-x-1\/2 {margin-left: var(--tide-spacing-1\/2); margin-right: var(--tide-spacing-1\/2);}
717
802
  .md-tide-margin-x-1 {margin-left: var(--tide-spacing-1); margin-right: var(--tide-spacing-1);}
718
803
  .md-tide-margin-x-2 {margin-left: var(--tide-spacing-2); margin-right: var(--tide-spacing-2);}
719
804
  .md-tide-margin-x-4 {margin-left: var(--tide-spacing-4); margin-right: var(--tide-spacing-4);}
720
- .md-tide-margin-x-auto {margin-left: auto; margin-right: auto;}
805
+ .md-tide-margin-x-auto {margin-left: auto; margin-right: auto;}
721
806
 
722
- .md-tide-margin-y-0 {margin-top: 0; margin-bottom: 0;}
807
+ .md-tide-margin-y-0 {margin-top: 0; margin-bottom: 0;}
723
808
  .md-tide-margin-y-1\/4 {margin-top: var(--tide-spacing-1\/4); margin-bottom: var(--tide-spacing-1\/4);}
724
809
  .md-tide-margin-y-1\/2 {margin-top: var(--tide-spacing-1\/2); margin-bottom: var(--tide-spacing-1\/2);}
725
810
  .md-tide-margin-y-1 {margin-top: var(--tide-spacing-1); margin-bottom: var(--tide-spacing-1);}
@@ -756,6 +841,8 @@
756
841
  .md-tide-margin-left-auto {margin-left: auto;}
757
842
 
758
843
  /* Border */
844
+ .md-tide-border-color-initial {border-color: initial;}
845
+
759
846
  .md-tide-border-1,
760
847
  .md-tide-border-2,
761
848
  .md-tide-border-bottom-1,
@@ -769,9 +856,15 @@
769
856
  border-style: solid;
770
857
  }
771
858
 
859
+ .md-tide-border-0 {border-width: 0;}
772
860
  .md-tide-border-1 {border-width: var(--tide-border-width-1);}
773
861
  .md-tide-border-2 {border-width: var(--tide-border-width-2);}
774
862
 
863
+ .md-tide-border-top-0 {border-top-width: 0;}
864
+ .md-tide-border-right-0 {border-right-width: 0;}
865
+ .md-tide-border-bottom-0 {border-bottom-width: 0;}
866
+ .md-tide-border-left-0 {border-left-width: 0;}
867
+
775
868
  .md-tide-border-top-1 {border-top-width: var(--tide-border-width-1);}
776
869
  .md-tide-border-right-1 {border-right-width: var(--tide-border-width-1);}
777
870
  .md-tide-border-bottom-1 {border-bottom-width: var(--tide-border-width-1);}
@@ -782,6 +875,7 @@
782
875
  .md-tide-border-bottom-2 {border-bottom-width: var(--tide-border-width-2);}
783
876
  .md-tide-border-left-2 {border-left-width: var(--tide-border-width-2);}
784
877
 
878
+ .md-tide-radius-0 {border-radius: 0;}
785
879
  .md-tide-radius-1\/4 {border-radius: var(--tide-radius-1\/4);}
786
880
  .md-tide-radius-1\/2 {border-radius: var(--tide-radius-1\/2);}
787
881
  .md-tide-radius-1 {border-radius: var(--tide-radius-1);}
@@ -795,14 +889,14 @@
795
889
  .md-tide-padding-2 {padding: var(--tide-spacing-2);}
796
890
  .md-tide-padding-4 {padding: var(--tide-spacing-4);}
797
891
 
798
- .md-tide-padding-x-0 {padding-left: 0; padding-right: 0;}
892
+ .md-tide-padding-x-0 {padding-left: 0; padding-right: 0;}
799
893
  .md-tide-padding-x-1\/4 {padding-left: var(--tide-spacing-1\/4); padding-right: var(--tide-spacing-1\/4);}
800
894
  .md-tide-padding-x-1\/2 {padding-left: var(--tide-spacing-1\/2); padding-right: var(--tide-spacing-1\/2);}
801
895
  .md-tide-padding-x-1 {padding-left: var(--tide-spacing-1); padding-right: var(--tide-spacing-1);}
802
896
  .md-tide-padding-x-2 {padding-left: var(--tide-spacing-2); padding-right: var(--tide-spacing-2);}
803
897
  .md-tide-padding-x-4 {padding-left: var(--tide-spacing-4); padding-right: var(--tide-spacing-4);}
804
898
 
805
- .md-tide-padding-y-0 {padding-top: 0; padding-bottom: 0;}
899
+ .md-tide-padding-y-0 {padding-top: 0; padding-bottom: 0;}
806
900
  .md-tide-padding-y-1\/4 {padding-top: var(--tide-spacing-1\/4); padding-bottom: var(--tide-spacing-1\/4);}
807
901
  .md-tide-padding-y-1\/2 {padding-top: var(--tide-spacing-1\/2); padding-bottom: var(--tide-spacing-1\/2);}
808
902
  .md-tide-padding-y-1 {padding-top: var(--tide-spacing-1); padding-bottom: var(--tide-spacing-1);}
@@ -846,18 +940,42 @@
846
940
 
847
941
  .md-tide-width-container {max-width: 1168px;}
848
942
 
943
+ .md-tide-width-auto {width: auto;}
849
944
  .md-tide-width-0 {width: 0;}
850
945
  .md-tide-width-full {width: 100%;}
851
946
 
947
+ .md-tide-height-auto {height: auto;}
852
948
  .md-tide-height-0 {height: 0;}
853
949
  .md-tide-height-full {height: 100%;}
854
950
 
855
951
  /* Backgrounds */
952
+ .md-tide-bg-initial {background-color: initial;}
953
+
856
954
  .md-tide-transparent-100 {background-color: var(--tide-transparent-100);}
857
955
  .md-tide-transparent-200 {background-color: var(--tide-transparent-200);}
858
956
  .md-tide-transparent-300 {background-color: var(--tide-transparent-300);}
859
957
  .md-tide-transparent-400 {background-color: var(--tide-transparent-400);}
860
958
 
959
+ /* Typographic roles */
960
+ .md-tide-typography-display-1 {font-size: var(--tide-font-32); font-weight: 700;}
961
+ .md-tide-typography-headline-1 {font-size: var(--tide-font-24); font-weight: 700;}
962
+ .md-tide-typography-headline-2 {font-size: var(--tide-font-20); font-weight: 700;}
963
+ .md-tide-typography-headline-3 {font-size: var(--tide-font-16); font-weight: 700;}
964
+ .md-tide-typography-title-1 {font-size: var(--tide-font-20); font-weight: 600;}
965
+ .md-tide-typography-title-2 {font-size: var(--tide-font-18); font-weight: 600;}
966
+ .md-tide-typography-body-1 {font-size: var(--tide-font-16); font-weight: 400;}
967
+ .md-tide-typography-body-2 {font-size: var(--tide-font-14); font-weight: 400;}
968
+ .md-tide-typography-label-1 {font-size: var(--tide-font-16); font-weight: 500;}
969
+ .md-tide-typography-label-1-semibold {font-size: var(--tide-font-16); font-weight: 600;}
970
+ .md-tide-typography-label-2 {font-size: var(--tide-font-14); font-weight: 500;}
971
+ .md-tide-typography-label-2-semibold {font-size: var(--tide-font-14); font-weight: 600;}
972
+ .md-tide-typography-label-3 {font-size: var(--tide-font-12); font-weight: 500;}
973
+ .md-tide-typography-link-1 {font-size: var(--tide-font-16); font-weight: 500;}
974
+ .md-tide-typography-link-2 {font-size: var(--tide-font-14); font-weight: 500;}
975
+ .md-tide-typography-link-3 {font-size: var(--tide-font-12); font-weight: 500;}
976
+ .md-tide-typography-button-1 {font-size: var(--tide-font-16); font-weight: 600;}
977
+ .md-tide-typography-button-2 {font-size: var(--tide-font-14); font-weight: 600;}
978
+
861
979
  /* Font Size */
862
980
  .md-tide-font-10 {font-size: var(--tide-font-10);}
863
981
  .md-tide-font-12 {font-size: var(--tide-font-12);}
@@ -874,16 +992,19 @@
874
992
  .md-tide-font-700 {font-weight: 700;}
875
993
 
876
994
  /* Misc */
877
- .md-tide-align-middle {vertical-align: middle;}
995
+ .md-tide-align-middle {vertical-align: middle;}
996
+ .md-tide-align-initial {vertical-align: initial;}
878
997
 
879
998
  .md-tide-bg-blur {backdrop-filter: blur(8px);}
880
999
 
881
- .md-tide-break-word {overflow-wrap: break-word;}
1000
+ .md-tide-break-initial {overflow-wrap: initial;}
1001
+ .md-tide-break-word {overflow-wrap: break-word;}
882
1002
 
883
- .md-tide-columns-1 {column-count: 1;}
884
- .md-tide-columns-2 {column-count: 2;}
885
- .md-tide-columns-3 {column-count: 3;}
886
- .md-tide-columns-4 {column-count: 4;}
1003
+ .md-tide-columns-initial {column-count: initial;}
1004
+ .md-tide-columns-1 {column-count: 1;}
1005
+ .md-tide-columns-2 {column-count: 2;}
1006
+ .md-tide-columns-3 {column-count: 3;}
1007
+ .md-tide-columns-4 {column-count: 4;}
887
1008
 
888
1009
  .md-tide-cursor-not-allowed {cursor: not-allowed;}
889
1010
  .md-tide-cursor-pointer {cursor: pointer;}
@@ -924,8 +1045,9 @@
924
1045
  scroll-snap-align: start;
925
1046
  }
926
1047
 
927
- .md-tide-shadow-bottom {box-shadow: var(--tide-shadow-bottom);}
928
- .md-tide-shadow-top {box-shadow: var(--tide-shadow-top);}
1048
+ .md-tide-shadow-initial {box-shadow: initial;}
1049
+ .md-tide-shadow-bottom {box-shadow: var(--tide-shadow-bottom);}
1050
+ .md-tide-shadow-top {box-shadow: var(--tide-shadow-top);}
929
1051
 
930
1052
  .md-tide-text-center {text-align: center;}
931
1053
  .md-tide-text-left {text-align: left;}
@@ -962,6 +1084,7 @@
962
1084
  .md-tide-y-auto {overflow-y: auto;}
963
1085
  .md-tide-y-hidden {overflow-y: hidden;}
964
1086
 
1087
+ .md-tide-z-index-initial {z-index: initial;}
965
1088
  .md-tide-z-index-1 {z-index: 1;}
966
1089
  }
967
1090
 
@@ -971,6 +1094,7 @@
971
1094
  .lg-tide-position-absolute {position: absolute;}
972
1095
  .lg-tide-position-fixed {position: fixed;}
973
1096
  .lg-tide-position-relative {position: relative;}
1097
+ .lg-tide-position-static {position: static;}
974
1098
  .lg-tide-position-sticky {position: sticky;}
975
1099
 
976
1100
  .lg-tide-top-0 {top: 0;}
@@ -1014,12 +1138,14 @@
1014
1138
  .lg-tide-axis2-start {align-items: flex-start;}
1015
1139
  .lg-tide-axis2-stretch {align-items: stretch;}
1016
1140
 
1141
+ .lg-tide-gap-0 {gap: 0;}
1017
1142
  .lg-tide-gap-1\/4 {gap: var(--tide-spacing-1\/4);}
1018
1143
  .lg-tide-gap-1\/2 {gap: var(--tide-spacing-1\/2);}
1019
1144
  .lg-tide-gap-1 {gap: var(--tide-spacing-1);}
1020
1145
  .lg-tide-gap-2 {gap: var(--tide-spacing-2);}
1021
1146
  .lg-tide-gap-4 {gap: var(--tide-spacing-4);}
1022
1147
 
1148
+ .lg-tide-flex-basis-auto {flex-basis: auto;}
1023
1149
  .lg-tide-flex-basis-0 {flex-basis: 0;}
1024
1150
 
1025
1151
  /* Box Sizing */
@@ -1034,15 +1160,15 @@
1034
1160
  .lg-tide-margin-2 {margin: var(--tide-spacing-2);}
1035
1161
  .lg-tide-margin-4 {margin: var(--tide-spacing-4);}
1036
1162
 
1037
- .lg-tide-margin-x-0 {margin-left: 0; margin-right: 0;}
1163
+ .lg-tide-margin-x-0 {margin-left: 0; margin-right: 0;}
1038
1164
  .lg-tide-margin-x-1\/4 {margin-left: var(--tide-spacing-1\/4); margin-right: var(--tide-spacing-1\/4);}
1039
1165
  .lg-tide-margin-x-1\/2 {margin-left: var(--tide-spacing-1\/2); margin-right: var(--tide-spacing-1\/2);}
1040
1166
  .lg-tide-margin-x-1 {margin-left: var(--tide-spacing-1); margin-right: var(--tide-spacing-1);}
1041
1167
  .lg-tide-margin-x-2 {margin-left: var(--tide-spacing-2); margin-right: var(--tide-spacing-2);}
1042
1168
  .lg-tide-margin-x-4 {margin-left: var(--tide-spacing-4); margin-right: var(--tide-spacing-4);}
1043
- .lg-tide-margin-x-auto {margin-left: auto; margin-right: auto;}
1169
+ .lg-tide-margin-x-auto {margin-left: auto; margin-right: auto;}
1044
1170
 
1045
- .lg-tide-margin-y-0 {margin-top: 0; margin-bottom: 0;}
1171
+ .lg-tide-margin-y-0 {margin-top: 0; margin-bottom: 0;}
1046
1172
  .lg-tide-margin-y-1\/4 {margin-top: var(--tide-spacing-1\/4); margin-bottom: var(--tide-spacing-1\/4);}
1047
1173
  .lg-tide-margin-y-1\/2 {margin-top: var(--tide-spacing-1\/2); margin-bottom: var(--tide-spacing-1\/2);}
1048
1174
  .lg-tide-margin-y-1 {margin-top: var(--tide-spacing-1); margin-bottom: var(--tide-spacing-1);}
@@ -1079,6 +1205,8 @@
1079
1205
  .lg-tide-margin-left-auto {margin-left: auto;}
1080
1206
 
1081
1207
  /* Border */
1208
+ .lg-tide-border-color-initial {border-color: initial;}
1209
+
1082
1210
  .lg-tide-border-1,
1083
1211
  .lg-tide-border-2,
1084
1212
  .lg-tide-border-bottom-1,
@@ -1092,9 +1220,15 @@
1092
1220
  border-style: solid;
1093
1221
  }
1094
1222
 
1223
+ .lg-tide-border-0 {border-width: 0;}
1095
1224
  .lg-tide-border-1 {border-width: var(--tide-border-width-1);}
1096
1225
  .lg-tide-border-2 {border-width: var(--tide-border-width-2);}
1097
1226
 
1227
+ .lg-tide-border-top-0 {border-top-width: 0;}
1228
+ .lg-tide-border-right-0 {border-right-width: 0;}
1229
+ .lg-tide-border-bottom-0 {border-bottom-width: 0;}
1230
+ .lg-tide-border-left-0 {border-left-width: 0;}
1231
+
1098
1232
  .lg-tide-border-top-1 {border-top-width: var(--tide-border-width-1);}
1099
1233
  .lg-tide-border-right-1 {border-right-width: var(--tide-border-width-1);}
1100
1234
  .lg-tide-border-bottom-1 {border-bottom-width: var(--tide-border-width-1);}
@@ -1105,6 +1239,7 @@
1105
1239
  .lg-tide-border-bottom-2 {border-bottom-width: var(--tide-border-width-2);}
1106
1240
  .lg-tide-border-left-2 {border-left-width: var(--tide-border-width-2);}
1107
1241
 
1242
+ .lg-tide-radius-0 {border-radius: 0;}
1108
1243
  .lg-tide-radius-1\/4 {border-radius: var(--tide-radius-1\/4);}
1109
1244
  .lg-tide-radius-1\/2 {border-radius: var(--tide-radius-1\/2);}
1110
1245
  .lg-tide-radius-1 {border-radius: var(--tide-radius-1);}
@@ -1118,14 +1253,14 @@
1118
1253
  .lg-tide-padding-2 {padding: var(--tide-spacing-2);}
1119
1254
  .lg-tide-padding-4 {padding: var(--tide-spacing-4);}
1120
1255
 
1121
- .lg-tide-padding-x-0 {padding-left: 0; padding-right: 0;}
1256
+ .lg-tide-padding-x-0 {padding-left: 0; padding-right: 0;}
1122
1257
  .lg-tide-padding-x-1\/4 {padding-left: var(--tide-spacing-1\/4); padding-right: var(--tide-spacing-1\/4);}
1123
1258
  .lg-tide-padding-x-1\/2 {padding-left: var(--tide-spacing-1\/2); padding-right: var(--tide-spacing-1\/2);}
1124
1259
  .lg-tide-padding-x-1 {padding-left: var(--tide-spacing-1); padding-right: var(--tide-spacing-1);}
1125
1260
  .lg-tide-padding-x-2 {padding-left: var(--tide-spacing-2); padding-right: var(--tide-spacing-2);}
1126
1261
  .lg-tide-padding-x-4 {padding-left: var(--tide-spacing-4); padding-right: var(--tide-spacing-4);}
1127
1262
 
1128
- .lg-tide-padding-y-0 {padding-top: 0; padding-bottom: 0;}
1263
+ .lg-tide-padding-y-0 {padding-top: 0; padding-bottom: 0;}
1129
1264
  .lg-tide-padding-y-1\/4 {padding-top: var(--tide-spacing-1\/4); padding-bottom: var(--tide-spacing-1\/4);}
1130
1265
  .lg-tide-padding-y-1\/2 {padding-top: var(--tide-spacing-1\/2); padding-bottom: var(--tide-spacing-1\/2);}
1131
1266
  .lg-tide-padding-y-1 {padding-top: var(--tide-spacing-1); padding-bottom: var(--tide-spacing-1);}
@@ -1169,18 +1304,42 @@
1169
1304
 
1170
1305
  .lg-tide-width-container {max-width: 1168px;}
1171
1306
 
1307
+ .lg-tide-width-auto {width: auto;}
1172
1308
  .lg-tide-width-0 {width: 0;}
1173
1309
  .lg-tide-width-full {width: 100%;}
1174
1310
 
1311
+ .lg-tide-height-auto {height: auto;}
1175
1312
  .lg-tide-height-0 {height: 0;}
1176
1313
  .lg-tide-height-full {height: 100%;}
1177
1314
 
1178
1315
  /* Backgrounds */
1316
+ .lg-tide-bg-initial {background-color: initial;}
1317
+
1179
1318
  .lg-tide-transparent-100 {background-color: var(--tide-transparent-100);}
1180
1319
  .lg-tide-transparent-200 {background-color: var(--tide-transparent-200);}
1181
1320
  .lg-tide-transparent-300 {background-color: var(--tide-transparent-300);}
1182
1321
  .lg-tide-transparent-400 {background-color: var(--tide-transparent-400);}
1183
1322
 
1323
+ /* Typographic roles */
1324
+ .lg-tide-typography-display-1 {font-size: var(--tide-font-32); font-weight: 700;}
1325
+ .lg-tide-typography-headline-1 {font-size: var(--tide-font-24); font-weight: 700;}
1326
+ .lg-tide-typography-headline-2 {font-size: var(--tide-font-20); font-weight: 700;}
1327
+ .lg-tide-typography-headline-3 {font-size: var(--tide-font-16); font-weight: 700;}
1328
+ .lg-tide-typography-title-1 {font-size: var(--tide-font-20); font-weight: 600;}
1329
+ .lg-tide-typography-title-2 {font-size: var(--tide-font-18); font-weight: 600;}
1330
+ .lg-tide-typography-body-1 {font-size: var(--tide-font-16); font-weight: 400;}
1331
+ .lg-tide-typography-body-2 {font-size: var(--tide-font-14); font-weight: 400;}
1332
+ .lg-tide-typography-label-1 {font-size: var(--tide-font-16); font-weight: 500;}
1333
+ .lg-tide-typography-label-1-semibold {font-size: var(--tide-font-16); font-weight: 600;}
1334
+ .lg-tide-typography-label-2 {font-size: var(--tide-font-14); font-weight: 500;}
1335
+ .lg-tide-typography-label-2-semibold {font-size: var(--tide-font-14); font-weight: 600;}
1336
+ .lg-tide-typography-label-3 {font-size: var(--tide-font-12); font-weight: 500;}
1337
+ .lg-tide-typography-link-1 {font-size: var(--tide-font-16); font-weight: 500;}
1338
+ .lg-tide-typography-link-2 {font-size: var(--tide-font-14); font-weight: 500;}
1339
+ .lg-tide-typography-link-3 {font-size: var(--tide-font-12); font-weight: 500;}
1340
+ .lg-tide-typography-button-1 {font-size: var(--tide-font-16); font-weight: 600;}
1341
+ .lg-tide-typography-button-2 {font-size: var(--tide-font-14); font-weight: 600;}
1342
+
1184
1343
  /* Font Size */
1185
1344
  .lg-tide-font-10 {font-size: var(--tide-font-10);}
1186
1345
  .lg-tide-font-12 {font-size: var(--tide-font-12);}
@@ -1197,16 +1356,19 @@
1197
1356
  .lg-tide-font-700 {font-weight: 700;}
1198
1357
 
1199
1358
  /* Misc */
1200
- .lg-tide-align-middle {vertical-align: middle;}
1359
+ .lg-tide-align-middle {vertical-align: middle;}
1360
+ .lg-tide-align-initial {vertical-align: initial;}
1201
1361
 
1202
1362
  .lg-tide-bg-blur {backdrop-filter: blur(8px);}
1203
1363
 
1204
- .lg-tide-break-word {overflow-wrap: break-word;}
1364
+ .lg-tide-break-initial {overflow-wrap: initial;}
1365
+ .lg-tide-break-word {overflow-wrap: break-word;}
1205
1366
 
1206
- .lg-tide-columns-1 {column-count: 1;}
1207
- .lg-tide-columns-2 {column-count: 2;}
1208
- .lg-tide-columns-3 {column-count: 3;}
1209
- .lg-tide-columns-4 {column-count: 4;}
1367
+ .lg-tide-columns-initial {column-count: initial;}
1368
+ .lg-tide-columns-1 {column-count: 1;}
1369
+ .lg-tide-columns-2 {column-count: 2;}
1370
+ .lg-tide-columns-3 {column-count: 3;}
1371
+ .lg-tide-columns-4 {column-count: 4;}
1210
1372
 
1211
1373
  .lg-tide-cursor-not-allowed {cursor: not-allowed;}
1212
1374
  .lg-tide-cursor-pointer {cursor: pointer;}
@@ -1247,8 +1409,9 @@
1247
1409
  scroll-snap-align: start;
1248
1410
  }
1249
1411
 
1250
- .lg-tide-shadow-bottom {box-shadow: var(--tide-shadow-bottom);}
1251
- .lg-tide-shadow-top {box-shadow: var(--tide-shadow-top);}
1412
+ .lg-tide-shadow-initial {box-shadow: initial;}
1413
+ .lg-tide-shadow-bottom {box-shadow: var(--tide-shadow-bottom);}
1414
+ .lg-tide-shadow-top {box-shadow: var(--tide-shadow-top);}
1252
1415
 
1253
1416
  .lg-tide-text-center {text-align: center;}
1254
1417
  .lg-tide-text-left {text-align: left;}
@@ -1285,7 +1448,8 @@
1285
1448
  .lg-tide-y-auto {overflow-y: auto;}
1286
1449
  .lg-tide-y-hidden {overflow-y: hidden;}
1287
1450
 
1288
- .lg-tide-z-index-1 {z-index: 1;}
1451
+ .lg-tide-z-index-initial {z-index: initial;}
1452
+ .lg-tide-z-index-1 {z-index: 1;}
1289
1453
  }
1290
1454
 
1291
1455
  /* Large breakpoint */
@@ -1294,6 +1458,7 @@
1294
1458
  .xl-tide-position-absolute {position: absolute;}
1295
1459
  .xl-tide-position-fixed {position: fixed;}
1296
1460
  .xl-tide-position-relative {position: relative;}
1461
+ .xl-tide-position-static {position: static;}
1297
1462
  .xl-tide-position-sticky {position: sticky;}
1298
1463
 
1299
1464
  .xl-tide-top-0 {top: 0;}
@@ -1337,12 +1502,14 @@
1337
1502
  .xl-tide-axis2-start {align-items: flex-start;}
1338
1503
  .xl-tide-axis2-stretch {align-items: stretch;}
1339
1504
 
1505
+ .xl-tide-gap-0 {gap: 0;}
1340
1506
  .xl-tide-gap-1\/4 {gap: var(--tide-spacing-1\/4);}
1341
1507
  .xl-tide-gap-1\/2 {gap: var(--tide-spacing-1\/2);}
1342
1508
  .xl-tide-gap-1 {gap: var(--tide-spacing-1);}
1343
1509
  .xl-tide-gap-2 {gap: var(--tide-spacing-2);}
1344
1510
  .xl-tide-gap-4 {gap: var(--tide-spacing-4);}
1345
1511
 
1512
+ .xl-tide-flex-basis-auto {flex-basis: auto;}
1346
1513
  .xl-tide-flex-basis-0 {flex-basis: 0;}
1347
1514
 
1348
1515
  /* Box Sizing */
@@ -1357,15 +1524,15 @@
1357
1524
  .xl-tide-margin-2 {margin: var(--tide-spacing-2);}
1358
1525
  .xl-tide-margin-4 {margin: var(--tide-spacing-4);}
1359
1526
 
1360
- .xl-tide-margin-x-0 {margin-left: 0; margin-right: 0;}
1527
+ .xl-tide-margin-x-0 {margin-left: 0; margin-right: 0;}
1361
1528
  .xl-tide-margin-x-1\/4 {margin-left: var(--tide-spacing-1\/4); margin-right: var(--tide-spacing-1\/4);}
1362
1529
  .xl-tide-margin-x-1\/2 {margin-left: var(--tide-spacing-1\/2); margin-right: var(--tide-spacing-1\/2);}
1363
1530
  .xl-tide-margin-x-1 {margin-left: var(--tide-spacing-1); margin-right: var(--tide-spacing-1);}
1364
1531
  .xl-tide-margin-x-2 {margin-left: var(--tide-spacing-2); margin-right: var(--tide-spacing-2);}
1365
1532
  .xl-tide-margin-x-4 {margin-left: var(--tide-spacing-4); margin-right: var(--tide-spacing-4);}
1366
- .xl-tide-margin-x-auto {margin-left: auto; margin-right: auto;}
1533
+ .xl-tide-margin-x-auto {margin-left: auto; margin-right: auto;}
1367
1534
 
1368
- .xl-tide-margin-y-0 {margin-top: 0; margin-bottom: 0;}
1535
+ .xl-tide-margin-y-0 {margin-top: 0; margin-bottom: 0;}
1369
1536
  .xl-tide-margin-y-1\/4 {margin-top: var(--tide-spacing-1\/4); margin-bottom: var(--tide-spacing-1\/4);}
1370
1537
  .xl-tide-margin-y-1\/2 {margin-top: var(--tide-spacing-1\/2); margin-bottom: var(--tide-spacing-1\/2);}
1371
1538
  .xl-tide-margin-y-1 {margin-top: var(--tide-spacing-1); margin-bottom: var(--tide-spacing-1);}
@@ -1402,6 +1569,8 @@
1402
1569
  .xl-tide-margin-left-auto {margin-left: auto;}
1403
1570
 
1404
1571
  /* Border */
1572
+ .xl-tide-border-color-initial {border-color: initial;}
1573
+
1405
1574
  .xl-tide-border-1,
1406
1575
  .xl-tide-border-2,
1407
1576
  .xl-tide-border-bottom-1,
@@ -1415,9 +1584,15 @@
1415
1584
  border-style: solid;
1416
1585
  }
1417
1586
 
1587
+ .xl-tide-border-0 {border-width: 0;}
1418
1588
  .xl-tide-border-1 {border-width: var(--tide-border-width-1);}
1419
1589
  .xl-tide-border-2 {border-width: var(--tide-border-width-2);}
1420
1590
 
1591
+ .xl-tide-border-top-0 {border-top-width: 0;}
1592
+ .xl-tide-border-right-0 {border-right-width: 0;}
1593
+ .xl-tide-border-bottom-0 {border-bottom-width: 0;}
1594
+ .xl-tide-border-left-0 {border-left-width: 0;}
1595
+
1421
1596
  .xl-tide-border-top-1 {border-top-width: var(--tide-border-width-1);}
1422
1597
  .xl-tide-border-right-1 {border-right-width: var(--tide-border-width-1);}
1423
1598
  .xl-tide-border-bottom-1 {border-bottom-width: var(--tide-border-width-1);}
@@ -1428,6 +1603,7 @@
1428
1603
  .xl-tide-border-bottom-2 {border-bottom-width: var(--tide-border-width-2);}
1429
1604
  .xl-tide-border-left-2 {border-left-width: var(--tide-border-width-2);}
1430
1605
 
1606
+ .xl-tide-radius-0 {border-radius: 0;}
1431
1607
  .xl-tide-radius-1\/4 {border-radius: var(--tide-radius-1\/4);}
1432
1608
  .xl-tide-radius-1\/2 {border-radius: var(--tide-radius-1\/2);}
1433
1609
  .xl-tide-radius-1 {border-radius: var(--tide-radius-1);}
@@ -1441,14 +1617,14 @@
1441
1617
  .xl-tide-padding-2 {padding: var(--tide-spacing-2);}
1442
1618
  .xl-tide-padding-4 {padding: var(--tide-spacing-4);}
1443
1619
 
1444
- .xl-tide-padding-x-0 {padding-left: 0; padding-right: 0;}
1620
+ .xl-tide-padding-x-0 {padding-left: 0; padding-right: 0;}
1445
1621
  .xl-tide-padding-x-1\/4 {padding-left: var(--tide-spacing-1\/4); padding-right: var(--tide-spacing-1\/4);}
1446
1622
  .xl-tide-padding-x-1\/2 {padding-left: var(--tide-spacing-1\/2); padding-right: var(--tide-spacing-1\/2);}
1447
1623
  .xl-tide-padding-x-1 {padding-left: var(--tide-spacing-1); padding-right: var(--tide-spacing-1);}
1448
1624
  .xl-tide-padding-x-2 {padding-left: var(--tide-spacing-2); padding-right: var(--tide-spacing-2);}
1449
1625
  .xl-tide-padding-x-4 {padding-left: var(--tide-spacing-4); padding-right: var(--tide-spacing-4);}
1450
1626
 
1451
- .xl-tide-padding-y-0 {padding-top: 0; padding-bottom: 0;}
1627
+ .xl-tide-padding-y-0 {padding-top: 0; padding-bottom: 0;}
1452
1628
  .xl-tide-padding-y-1\/4 {padding-top: var(--tide-spacing-1\/4); padding-bottom: var(--tide-spacing-1\/4);}
1453
1629
  .xl-tide-padding-y-1\/2 {padding-top: var(--tide-spacing-1\/2); padding-bottom: var(--tide-spacing-1\/2);}
1454
1630
  .xl-tide-padding-y-1 {padding-top: var(--tide-spacing-1); padding-bottom: var(--tide-spacing-1);}
@@ -1492,18 +1668,42 @@
1492
1668
 
1493
1669
  .xl-tide-width-container {max-width: 1168px;}
1494
1670
 
1671
+ .xl-tide-width-auto {width: auto;}
1495
1672
  .xl-tide-width-0 {width: 0;}
1496
1673
  .xl-tide-width-full {width: 100%;}
1497
1674
 
1675
+ .xl-tide-height-auto {height: auto;}
1498
1676
  .xl-tide-height-0 {height: 0;}
1499
1677
  .xl-tide-height-full {height: 100%;}
1500
1678
 
1501
1679
  /* Backgrounds */
1680
+ .xl-tide-bg-initial {background-color: initial;}
1681
+
1502
1682
  .xl-tide-transparent-100 {background-color: var(--tide-transparent-100);}
1503
1683
  .xl-tide-transparent-200 {background-color: var(--tide-transparent-200);}
1504
1684
  .xl-tide-transparent-300 {background-color: var(--tide-transparent-300);}
1505
1685
  .xl-tide-transparent-400 {background-color: var(--tide-transparent-400);}
1506
1686
 
1687
+ /* Typographic roles */
1688
+ .xl-tide-typography-display-1 {font-size: var(--tide-font-32); font-weight: 700;}
1689
+ .xl-tide-typography-headline-1 {font-size: var(--tide-font-24); font-weight: 700;}
1690
+ .xl-tide-typography-headline-2 {font-size: var(--tide-font-20); font-weight: 700;}
1691
+ .xl-tide-typography-headline-3 {font-size: var(--tide-font-16); font-weight: 700;}
1692
+ .xl-tide-typography-title-1 {font-size: var(--tide-font-20); font-weight: 600;}
1693
+ .xl-tide-typography-title-2 {font-size: var(--tide-font-18); font-weight: 600;}
1694
+ .xl-tide-typography-body-1 {font-size: var(--tide-font-16); font-weight: 400;}
1695
+ .xl-tide-typography-body-2 {font-size: var(--tide-font-14); font-weight: 400;}
1696
+ .xl-tide-typography-label-1 {font-size: var(--tide-font-16); font-weight: 500;}
1697
+ .xl-tide-typography-label-1-semibold {font-size: var(--tide-font-16); font-weight: 600;}
1698
+ .xl-tide-typography-label-2 {font-size: var(--tide-font-14); font-weight: 500;}
1699
+ .xl-tide-typography-label-2-semibold {font-size: var(--tide-font-14); font-weight: 600;}
1700
+ .xl-tide-typography-label-3 {font-size: var(--tide-font-12); font-weight: 500;}
1701
+ .xl-tide-typography-link-1 {font-size: var(--tide-font-16); font-weight: 500;}
1702
+ .xl-tide-typography-link-2 {font-size: var(--tide-font-14); font-weight: 500;}
1703
+ .xl-tide-typography-link-3 {font-size: var(--tide-font-12); font-weight: 500;}
1704
+ .xl-tide-typography-button-1 {font-size: var(--tide-font-16); font-weight: 600;}
1705
+ .xl-tide-typography-button-2 {font-size: var(--tide-font-14); font-weight: 600;}
1706
+
1507
1707
  /* Font Size */
1508
1708
  .xl-tide-font-10 {font-size: var(--tide-font-10);}
1509
1709
  .xl-tide-font-12 {font-size: var(--tide-font-12);}
@@ -1520,16 +1720,19 @@
1520
1720
  .xl-tide-font-700 {font-weight: 700;}
1521
1721
 
1522
1722
  /* Misc */
1523
- .xl-tide-align-middle {vertical-align: middle;}
1723
+ .xl-tide-align-middle {vertical-align: middle;}
1724
+ .xl-tide-align-initial {vertical-align: initial;}
1524
1725
 
1525
1726
  .xl-tide-bg-blur {backdrop-filter: blur(8px);}
1526
1727
 
1527
- .xl-tide-break-word {overflow-wrap: break-word;}
1728
+ .xl-tide-break-initial {overflow-wrap: initial;}
1729
+ .xl-tide-break-word {overflow-wrap: break-word;}
1528
1730
 
1529
- .xl-tide-columns-1 {column-count: 1;}
1530
- .xl-tide-columns-2 {column-count: 2;}
1531
- .xl-tide-columns-3 {column-count: 3;}
1532
- .xl-tide-columns-4 {column-count: 4;}
1731
+ .xl-tide-columns-initial {column-count: initial;}
1732
+ .xl-tide-columns-1 {column-count: 1;}
1733
+ .xl-tide-columns-2 {column-count: 2;}
1734
+ .xl-tide-columns-3 {column-count: 3;}
1735
+ .xl-tide-columns-4 {column-count: 4;}
1533
1736
 
1534
1737
  .xl-tide-cursor-not-allowed {cursor: not-allowed;}
1535
1738
  .xl-tide-cursor-pointer {cursor: pointer;}
@@ -1570,8 +1773,9 @@
1570
1773
  scroll-snap-align: start;
1571
1774
  }
1572
1775
 
1573
- .xl-tide-shadow-bottom {box-shadow: var(--tide-shadow-bottom);}
1574
- .xl-tide-shadow-top {box-shadow: var(--tide-shadow-top);}
1776
+ .xl-tide-shadow-initial {box-shadow: initial;}
1777
+ .xl-tide-shadow-bottom {box-shadow: var(--tide-shadow-bottom);}
1778
+ .xl-tide-shadow-top {box-shadow: var(--tide-shadow-top);}
1575
1779
 
1576
1780
  .xl-tide-text-center {text-align: center;}
1577
1781
  .xl-tide-text-left {text-align: left;}
@@ -1608,5 +1812,6 @@
1608
1812
  .xl-tide-y-auto {overflow-y: auto;}
1609
1813
  .xl-tide-y-hidden {overflow-y: hidden;}
1610
1814
 
1611
- .xl-tide-z-index-1 {z-index: 1;}
1815
+ .xl-tide-z-index-initial {z-index: initial;}
1816
+ .xl-tide-z-index-1 {z-index: 1;}
1612
1817
  }