@rolster/styles-foundations 2.6.6 → 2.6.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (11) hide show
  1. package/dist/styles.css +94 -79
  2. package/dist/styles.css.map +1 -1
  3. package/dist/styles.min.css +4 -4
  4. package/dist/styles.rtl.css +94 -79
  5. package/dist/styles.rtl.min.css +4 -4
  6. package/package.json +1 -1
  7. package/scss/components/field-box.scss +4 -4
  8. package/scss/components/field-list.scss +3 -3
  9. package/scss/foundations/elevations.scss +46 -92
  10. package/scss/foundations/helpers.scss +5 -3
  11. package/scss/foundations/themes.scss +4 -2
package/dist/styles.rtl.css CHANGED
@@ -111,7 +111,8 @@ body {
111
111
  --rls-primary-skeleton-100: rgba(9, 78, 155, 0.1);
112
112
  --rls-primary-color-600: #0a63bf;
113
113
  --rls-primary-color-500: #1780e0;
114
- --rls-primary-shadow-500: rgba(23, 128, 224, 0.24);
114
+ --rls-primary-shadow-color-500: rgba(23, 128, 224, 0.24);
115
+ --rls-primary-shadow-500: 0px 0px 0px 3px var(--rls-primary-shadow-color-500);
115
116
  --rls-primary-color-400: #409cf0;
116
117
  --rls-primary-color-300: #82bdf7;
117
118
  --rls-primary-color-200: #bddbfa;
@@ -154,7 +155,9 @@ body {
154
155
  --rls-secondary-skeleton-100: rgba(38, 95, 91, 0.1);
155
156
  --rls-secondary-color-600: #2b7671;
156
157
  --rls-secondary-color-500: #39938b;
157
- --rls-secondary-shadow-500: rgba(57, 147, 139, 0.24);
158
+ --rls-secondary-shadow-color-500: rgba(57, 147, 139, 0.24);
159
+ --rls-secondary-shadow-500: 0px 0px 0px 3px
160
+ var(--rls-secondary-shadow-color-500);
158
161
  --rls-secondary-color-400: #53aea5;
159
162
  --rls-secondary-color-300: #7ecac0;
160
163
  --rls-secondary-color-200: #aee1d8;
@@ -197,7 +200,9 @@ body {
197
200
  --rls-tertiary-skeleton-100: rgba(204, 17, 2, 0.1);
198
201
  --rls-tertiary-color-600: #ff2101;
199
202
  --rls-tertiary-color-500: #ff3c0a;
200
- --rls-tertiary-shadow-500: rgba(255, 60, 10, 0.24);
203
+ --rls-tertiary-shadow-color-500: rgba(255, 60, 10, 0.24);
204
+ --rls-tertiary-shadow-500: 0px 0px 0px 3px
205
+ var(--rls-tertiary-shadow-color-500);
201
206
  --rls-tertiary-color-400: #ff6532;
202
207
  --rls-tertiary-color-300: #ff9a6d;
203
208
  --rls-tertiary-color-200: #ffc4a5;
@@ -240,7 +245,8 @@ body {
240
245
  --rls-success-skeleton-100: rgba(1, 123, 86, 0.1);
241
246
  --rls-success-color-600: #019f6c;
242
247
  --rls-success-color-500: #0bbe81;
243
- --rls-success-shadow-500: rgba(11, 190, 129, 0.24);
248
+ --rls-success-shadow-color-500: rgba(11, 190, 129, 0.24);
249
+ --rls-success-shadow-500: 0px 0px 0px 3px var(--rls-success-shadow-color-500);
244
250
  --rls-success-color-400: #30d798;
245
251
  --rls-success-color-300: #6beab6;
246
252
  --rls-success-color-200: #a5f5cf;
@@ -283,7 +289,8 @@ body {
283
289
  --rls-info-skeleton-100: rgba(0, 117, 167, 0.1);
284
290
  --rls-info-color-600: #0092cf;
285
291
  --rls-info-color-500: #06b6f1;
286
- --rls-info-shadow-500: rgba(6, 182, 241, 0.24);
292
+ --rls-info-shadow-color-500: rgba(6, 182, 241, 0.24);
293
+ --rls-info-shadow-500: 0px 0px 0px 3px var(--rls-info-shadow-color-500);
287
294
  --rls-info-color-400: #31ccff;
288
295
  --rls-info-color-300: #78ddff;
289
296
  --rls-info-color-200: #b7ebff;
@@ -326,7 +333,8 @@ body {
326
333
  --rls-warning-skeleton-100: rgba(170, 71, 19, 0.1);
327
334
  --rls-warning-color-600: #cd6512;
328
335
  --rls-warning-color-500: #e88918;
329
- --rls-warning-shadow-500: rgba(232, 137, 24, 0.24);
336
+ --rls-warning-shadow-color-500: rgba(232, 137, 24, 0.24);
337
+ --rls-warning-shadow-500: 0px 0px 0px 3px var(--rls-warning-shadow-color-500);
330
338
  --rls-warning-color-400: #efa930;
331
339
  --rls-warning-color-300: #f2c057;
332
340
  --rls-warning-color-200: #f6d991;
@@ -369,7 +377,8 @@ body {
369
377
  --rls-danger-skeleton-100: rgba(204, 0, 1, 0.1);
370
378
  --rls-danger-color-600: #fc0607;
371
379
  --rls-danger-color-500: #ff2627;
372
- --rls-danger-shadow-500: rgba(255, 38, 39, 0.24);
380
+ --rls-danger-shadow-color-500: rgba(255, 38, 39, 0.24);
381
+ --rls-danger-shadow-500: 0px 0px 0px 3px var(--rls-danger-shadow-color-500);
373
382
  --rls-danger-color-400: #ff595a;
374
383
  --rls-danger-color-300: #ff9596;
375
384
  --rls-danger-color-200: #ffc1c1;
@@ -412,7 +421,8 @@ body {
412
421
  --rls-berry-skeleton-100: rgba(167, 41, 74, 0.1);
413
422
  --rls-berry-color-600: #c7375a;
414
423
  --rls-berry-color-500: #dc5770;
415
- --rls-berry-shadow-500: rgba(220, 87, 112, 0.24);
424
+ --rls-berry-shadow-color-500: rgba(220, 87, 112, 0.24);
425
+ --rls-berry-shadow-500: 0px 0px 0px 3px var(--rls-berry-shadow-color-500);
416
426
  --rls-berry-color-400: #ec96a4;
417
427
  --rls-berry-color-300: #f1b0b9;
418
428
  --rls-berry-color-200: #f7d4d9;
@@ -455,7 +465,8 @@ body {
455
465
  --rls-ross-skeleton-100: rgba(200, 8, 59, 0.1);
456
466
  --rls-ross-color-600: #ed1146;
457
467
  --rls-ross-color-500: #ff4b6e;
458
- --rls-ross-shadow-500: rgba(255, 75, 110, 0.24);
468
+ --rls-ross-shadow-color-500: rgba(255, 75, 110, 0.24);
469
+ --rls-ross-shadow-500: 0px 0px 0px 3px var(--rls-ross-shadow-color-500);
459
470
  --rls-ross-color-400: #ff6982;
460
471
  --rls-ross-color-300: #ff9fad;
461
472
  --rls-ross-color-200: #ffcad2;
@@ -498,7 +509,8 @@ body {
498
509
  --rls-hope-skeleton-100: rgba(10, 123, 104, 0.1);
499
510
  --rls-hope-color-600: #07a287;
500
511
  --rls-hope-color-500: #0cc09d;
501
- --rls-hope-shadow-500: rgba(12, 192, 157, 0.24);
512
+ --rls-hope-shadow-color-500: rgba(12, 192, 157, 0.24);
513
+ --rls-hope-shadow-500: 0px 0px 0px 3px var(--rls-hope-shadow-color-500);
502
514
  --rls-hope-color-400: #25dcb5;
503
515
  --rls-hope-color-300: #57f1cc;
504
516
  --rls-hope-color-200: #95fade;
@@ -541,7 +553,9 @@ body {
541
553
  --rls-mountains-skeleton-100: rgba(59, 74, 65, 0.1);
542
554
  --rls-mountains-color-600: #4f6457;
543
555
  --rls-mountains-color-500: #5b7163;
544
- --rls-mountains-shadow-500: rgba(91, 113, 99, 0.24);
556
+ --rls-mountains-shadow-color-500: rgba(91, 113, 99, 0.24);
557
+ --rls-mountains-shadow-500: 0px 0px 0px 3px
558
+ var(--rls-mountains-shadow-color-500);
545
559
  --rls-mountains-color-400: #758c7d;
546
560
  --rls-mountains-color-300: #9aaea0;
547
561
  --rls-mountains-color-200: #c1cec4;
@@ -584,7 +598,9 @@ body {
584
598
  --rls-amaizing-skeleton-100: rgba(142, 58, 145, 0.1);
585
599
  --rls-amaizing-color-600: #aa49b0;
586
600
  --rls-amaizing-color-500: #c568cd;
587
- --rls-amaizing-shadow-500: rgba(197, 104, 205, 0.24);
601
+ --rls-amaizing-shadow-color-500: rgba(197, 104, 205, 0.24);
602
+ --rls-amaizing-shadow-500: 0px 0px 0px 3px
603
+ var(--rls-amaizing-shadow-color-500);
588
604
  --rls-amaizing-color-400: #d993df;
589
605
  --rls-amaizing-color-300: #e7bbec;
590
606
  --rls-amaizing-color-200: #f0d9f5;
@@ -627,7 +643,8 @@ body {
627
643
  --rls-purple-skeleton-100: rgba(72, 67, 191, 0.1);
628
644
  --rls-purple-color-600: #5552d9;
629
645
  --rls-purple-color-500: #6e74e6;
630
- --rls-purple-shadow-500: rgba(110, 116, 230, 0.24);
646
+ --rls-purple-shadow-color-500: rgba(110, 116, 230, 0.24);
647
+ --rls-purple-shadow-500: 0px 0px 0px 3px var(--rls-purple-shadow-color-500);
631
648
  --rls-purple-color-400: #8a96ef;
632
649
  --rls-purple-color-300: #acbbf5;
633
650
  --rls-purple-color-200: #cbd6fa;
@@ -670,7 +687,8 @@ body {
670
687
  --rls-amber-skeleton-100: rgba(186, 64, 20, 0.1);
671
688
  --rls-amber-color-600: #e15616;
672
689
  --rls-amber-color-500: #ef6f20;
673
- --rls-amber-shadow-500: rgba(239, 111, 32, 0.24);
690
+ --rls-amber-shadow-color-500: rgba(239, 111, 32, 0.24);
691
+ --rls-amber-shadow-500: 0px 0px 0px 3px var(--rls-amber-shadow-color-500);
674
692
  --rls-amber-color-400: #f28e45;
675
693
  --rls-amber-color-300: #f7b77a;
676
694
  --rls-amber-color-200: #fad5ae;
@@ -713,7 +731,9 @@ body {
713
731
  --rls-smartness-skeleton-100: rgba(131, 69, 58, 0.1);
714
732
  --rls-smartness-color-600: #9c5a43;
715
733
  --rls-smartness-color-500: #b67959;
716
- --rls-smartness-shadow-500: rgba(182, 121, 89, 0.24);
734
+ --rls-smartness-shadow-color-500: rgba(182, 121, 89, 0.24);
735
+ --rls-smartness-shadow-500: 0px 0px 0px 3px
736
+ var(--rls-smartness-shadow-color-500);
717
737
  --rls-smartness-color-400: #bd8a62;
718
738
  --rls-smartness-color-300: #c9a380;
719
739
  --rls-smartness-color-200: #dcc4ab;
@@ -756,7 +776,9 @@ body {
756
776
  --rls-obsidian-skeleton-100: rgba(98, 83, 70, 0.1);
757
777
  --rls-obsidian-color-600: #796955;
758
778
  --rls-obsidian-color-500: #8d7f65;
759
- --rls-obsidian-shadow-500: rgba(141, 127, 101, 0.24);
779
+ --rls-obsidian-shadow-color-500: rgba(141, 127, 101, 0.24);
780
+ --rls-obsidian-shadow-500: 0px 0px 0px 3px
781
+ var(--rls-obsidian-shadow-color-500);
760
782
  --rls-obsidian-color-400: #9c9073;
761
783
  --rls-obsidian-color-300: #b2aa92;
762
784
  --rls-obsidian-color-200: #cecaba;
@@ -1498,6 +1520,7 @@ body {
1498
1520
  }
1499
1521
  }
1500
1522
  body {
1523
+ --rls-app-shadow-color: rgba(173, 186, 230, 0.6);
1501
1524
  --rls-z-index-2: 2;
1502
1525
  --rls-z-index-4: 4;
1503
1526
  --rls-z-index-6: 6;
@@ -1513,38 +1536,44 @@ body {
1513
1536
  0px 16px 8px -4px rgba(173, 186, 230, 0.03);
1514
1537
  --rls-app-shadow-5: 0px 8px 24px -4px rgba(173, 186, 230, 0.08);
1515
1538
  --rls-app-shadow-6: 0px 8px 24px -4px rgba(173, 186, 230, 0.12);
1516
- --rls-app-shadow-bottom-2: 0px 2px 2px rgba(173, 186, 230, 0.4);
1517
- --rls-app-shadow-bottom-4: 0px 4px 4px rgba(173, 186, 230, 0.4);
1518
- --rls-app-shadow-bottom-8: 0px 8px 8px rgba(173, 186, 230, 0.4);
1519
- --rls-app-shadow-bottom-16: 0px 16px 16px rgba(173, 186, 230, 0.4);
1520
- --rls-app-shadow-bottom-24: 0px 24px 24px rgba(173, 186, 230, 0.4);
1521
- --rls-app-shadow-bottom-32: 0px 32px 32px rgba(173, 186, 230, 0.4);
1522
- --rls-app-shadow-top-2: 0px -2px 2px rgba(173, 186, 230, 0.4);
1523
- --rls-app-shadow-top-4: 0px -4px 4px rgba(173, 186, 230, 0.4);
1524
- --rls-app-shadow-top-8: 0px -8px 8px rgba(173, 186, 230, 0.4);
1525
- --rls-app-shadow-top-16: 0px -16px 16px rgba(173, 186, 230, 0.4);
1526
- --rls-app-shadow-top-24: 0px -24px 24px rgba(173, 186, 230, 0.4);
1527
- --rls-app-shadow-top-32: 0px -32px 32px rgba(173, 186, 230, 0.4);
1528
- --rls-app-shadow-right-2: 2px 0px 2px rgba(173, 186, 230, 0.4);
1529
- --rls-app-shadow-right-4: 4px 0px 4px rgba(173, 186, 230, 0.4);
1530
- --rls-app-shadow-right-8: 8px 0px 8px rgba(173, 186, 230, 0.4);
1531
- --rls-app-shadow-right-16: 16px 0px 16px rgba(173, 186, 230, 0.4);
1532
- --rls-app-shadow-right-24: 24px 0px 24px rgba(173, 186, 230, 0.4);
1533
- --rls-app-shadow-right-32: 32px 0px 32px rgba(173, 186, 230, 0.4);
1534
- --rls-app-shadow-left-2: -2px 0px 2px rgba(173, 186, 230, 0.4);
1535
- --rls-app-shadow-left-4: -4px 0px 4px rgba(173, 186, 230, 0.4);
1536
- --rls-app-shadow-left-8: -8px 0px 8px rgba(173, 186, 230, 0.4);
1537
- --rls-app-shadow-left-16: -16px 0px 16px rgba(173, 186, 230, 0.4);
1538
- --rls-app-shadow-left-24: -24px 0px 24px rgba(173, 186, 230, 0.4);
1539
- --rls-app-shadow-left-32: -32px 0px 32px rgba(173, 186, 230, 0.4);
1540
- --rls-app-shadow-center-2: 0px 0px 2px 0px rgba(173, 186, 230, 0.4);
1541
- --rls-app-shadow-center-4: 0px 0px 4px 0px rgba(173, 186, 230, 0.4);
1542
- --rls-app-shadow-center-8: 0px 0px 8px 0px rgba(173, 186, 230, 0.4);
1543
- --rls-app-shadow-center-16: 0px 0px 16px 0px rgba(173, 186, 230, 0.4);
1544
- --rls-app-shadow-center-24: 0px 0px 24px 0px rgba(173, 186, 230, 0.4);
1545
- --rls-app-shadow-center-32: 0px 0px 32px 0px rgba(173, 186, 230, 0.4);
1539
+ --rls-app-shadow-bottom-2: 0px 2px 2px var(--rls-app-shadow-color);
1540
+ --rls-app-shadow-bottom-4: 0px 4px 4px var(--rls-app-shadow-color);
1541
+ --rls-app-shadow-bottom-6: 0px 6px 6px var(--rls-app-shadow-color);
1542
+ --rls-app-shadow-bottom-8: 0px 8px 8px var(--rls-app-shadow-color);
1543
+ --rls-app-shadow-bottom-16: 0px 16px 16px var(--rls-app-shadow-color);
1544
+ --rls-app-shadow-bottom-24: 0px 24px 24px var(--rls-app-shadow-color);
1545
+ --rls-app-shadow-bottom-32: 0px 32px 32px var(--rls-app-shadow-color);
1546
+ --rls-app-shadow-top-2: 0px -2px 2px var(--rls-app-shadow-color);
1547
+ --rls-app-shadow-top-4: 0px -4px 4px var(--rls-app-shadow-color);
1548
+ --rls-app-shadow-top-6: 0px -6px 6px var(--rls-app-shadow-color);
1549
+ --rls-app-shadow-top-8: 0px -8px 8px var(--rls-app-shadow-color);
1550
+ --rls-app-shadow-top-16: 0px -16px 16px var(--rls-app-shadow-color);
1551
+ --rls-app-shadow-top-24: 0px -24px 24px var(--rls-app-shadow-color);
1552
+ --rls-app-shadow-top-32: 0px -32px 32px var(--rls-app-shadow-color);
1553
+ --rls-app-shadow-right-2: 2px 0px 2px var(--rls-app-shadow-color);
1554
+ --rls-app-shadow-right-4: 4px 0px 4px var(--rls-app-shadow-color);
1555
+ --rls-app-shadow-right-6: 6px 0px 6px var(--rls-app-shadow-color);
1556
+ --rls-app-shadow-right-8: 8px 0px 8px var(--rls-app-shadow-color);
1557
+ --rls-app-shadow-right-16: 16px 0px 16px var(--rls-app-shadow-color);
1558
+ --rls-app-shadow-right-24: 24px 0px 24px var(--rls-app-shadow-color);
1559
+ --rls-app-shadow-right-32: 32px 0px 32px var(--rls-app-shadow-color);
1560
+ --rls-app-shadow-left-2: -2px 0px 2px var(--rls-app-shadow-color);
1561
+ --rls-app-shadow-left-4: -4px 0px 4px var(--rls-app-shadow-color);
1562
+ --rls-app-shadow-left-6: -6px 0px 6px var(--rls-app-shadow-color);
1563
+ --rls-app-shadow-left-8: -8px 0px 8px var(--rls-app-shadow-color);
1564
+ --rls-app-shadow-left-16: -16px 0px 16px var(--rls-app-shadow-color);
1565
+ --rls-app-shadow-left-24: -24px 0px 24px var(--rls-app-shadow-color);
1566
+ --rls-app-shadow-left-32: -32px 0px 32px var(--rls-app-shadow-color);
1567
+ --rls-app-shadow-center-2: 0px 0px 2px 0px var(--rls-app-shadow-color);
1568
+ --rls-app-shadow-center-4: 0px 0px 4px 0px var(--rls-app-shadow-color);
1569
+ --rls-app-shadow-center-6: 0px 0px 6px 0px var(--rls-app-shadow-color);
1570
+ --rls-app-shadow-center-8: 0px 0px 8px 0px var(--rls-app-shadow-color);
1571
+ --rls-app-shadow-center-16: 0px 0px 16px 0px var(--rls-app-shadow-color);
1572
+ --rls-app-shadow-center-24: 0px 0px 24px 0px var(--rls-app-shadow-color);
1573
+ --rls-app-shadow-center-32: 0px 0px 32px 0px var(--rls-app-shadow-color);
1546
1574
  }
1547
1575
  *[app-theme='dark'] {
1576
+ --rls-app-shadow-color: rgb(98, 111, 155, 0.6);
1548
1577
  --rls-app-shadow-1: 0px 4px 2px -2px rgba(50, 44, 47, 0.02);
1549
1578
  --rls-app-shadow-2: 0px 4px 8px -2px rgba(50, 44, 47, 0.04);
1550
1579
  --rls-app-shadow-3: 0px 2px 4px -2px rgba(50, 44, 47, 0.08);
@@ -1552,36 +1581,6 @@ body {
1552
1581
  0px 16px 8px -4px rgba(50, 44, 47, 0.03);
1553
1582
  --rls-app-shadow-5: 0px 8px 24px -4px rgba(50, 44, 47, 0.08);
1554
1583
  --rls-app-shadow-6: 0px 8px 24px -4px rgba(50, 44, 47, 0.12);
1555
- --rls-app-shadow-bottom-2: 0px 2px 2px rgba(50, 44, 47, 0.4);
1556
- --rls-app-shadow-bottom-4: 0px 4px 4px rgba(50, 44, 47, 0.4);
1557
- --rls-app-shadow-bottom-8: 0px 8px 8px rgba(50, 44, 47, 0.4);
1558
- --rls-app-shadow-bottom-16: 0px 16px 16px rgba(50, 44, 47, 0.4);
1559
- --rls-app-shadow-bottom-24: 0px 24px 24px rgba(50, 44, 47, 0.4);
1560
- --rls-app-shadow-bottom-32: 0px 32px 32px rgba(50, 44, 47, 0.4);
1561
- --rls-app-shadow-top-2: 0px -2px 2px rgba(50, 44, 47, 0.4);
1562
- --rls-app-shadow-top-4: 0px -4px 4px rgba(50, 44, 47, 0.4);
1563
- --rls-app-shadow-top-8: 0px -8px 8px rgba(50, 44, 47, 0.4);
1564
- --rls-app-shadow-top-16: 0px -16px 16px rgba(50, 44, 47, 0.4);
1565
- --rls-app-shadow-top-24: 0px -24px 24px rgba(50, 44, 47, 0.4);
1566
- --rls-app-shadow-top-32: 0px -32px 32px rgba(50, 44, 47, 0.4);
1567
- --rls-app-shadow-right-2: 2px 0px 2px rgba(50, 44, 47, 0.4);
1568
- --rls-app-shadow-right-4: 4px 0px 4px rgba(50, 44, 47, 0.4);
1569
- --rls-app-shadow-right-8: 8px 0px 8px rgba(50, 44, 47, 0.4);
1570
- --rls-app-shadow-right-16: 16px 0px 16px rgba(50, 44, 47, 0.4);
1571
- --rls-app-shadow-right-24: 24px 0px 24px rgba(50, 44, 47, 0.4);
1572
- --rls-app-shadow-right-32: 32px 0px 32px rgba(50, 44, 47, 0.4);
1573
- --rls-app-shadow-left-2: -2px 0px 2px rgba(50, 44, 47, 0.4);
1574
- --rls-app-shadow-left-4: -4px 0px 4px rgba(50, 44, 47, 0.4);
1575
- --rls-app-shadow-left-8: -8px 0px 8px rgba(50, 44, 47, 0.4);
1576
- --rls-app-shadow-left-16: -16px 0px 16px rgba(50, 44, 47, 0.4);
1577
- --rls-app-shadow-left-24: -24px 0px 24px rgba(50, 44, 47, 0.4);
1578
- --rls-app-shadow-left-32: -32px 0px 32px rgba(50, 44, 47, 0.4);
1579
- --rls-app-shadow-center-2: 0px 0px 2px 0px rgba(50, 44, 47, 0.4);
1580
- --rls-app-shadow-center-4: 0px 0px 4px 0px rgba(50, 44, 47, 0.4);
1581
- --rls-app-shadow-center-8: 0px 0px 8px 0px rgba(50, 44, 47, 0.4);
1582
- --rls-app-shadow-center-16: 0px 0px 16px 0px rgba(50, 44, 47, 0.4);
1583
- --rls-app-shadow-center-24: 0px 0px 24px 0px rgba(50, 44, 47, 0.4);
1584
- --rls-app-shadow-center-32: 0px 0px 32px 0px rgba(50, 44, 47, 0.4);
1585
1584
  }
1586
1585
  body {
1587
1586
  --rls-app-border-1-050: var(--rls-border-1) solid var(--rls-app-color-050);
@@ -2362,6 +2361,7 @@ body {
2362
2361
  --rls-theme-skeleton-300: var(--rls-primary-skeleton-300);
2363
2362
  --rls-theme-skeleton-200: var(--rls-primary-skeleton-200);
2364
2363
  --rls-theme-skeleton-100: var(--rls-primary-skeleton-100);
2364
+ --rls-theme-shadow-color-500: var(--rls-primary-shadow-color-500);
2365
2365
  --rls-theme-shadow-500: var(--rls-primary-shadow-500);
2366
2366
  --rls-theme-backdrop-900: var(--rls-primary-backdrop-900);
2367
2367
  --rls-theme-gradient-700: var(--rls-primary-gradient-700);
@@ -2444,6 +2444,7 @@ body {
2444
2444
  --rls-theme-skeleton-300: var(--rls-secondary-skeleton-300);
2445
2445
  --rls-theme-skeleton-200: var(--rls-secondary-skeleton-200);
2446
2446
  --rls-theme-skeleton-100: var(--rls-secondary-skeleton-100);
2447
+ --rls-theme-shadow-color-500: var(--rls-secondary-shadow-color-500);
2447
2448
  --rls-theme-shadow-500: var(--rls-secondary-shadow-500);
2448
2449
  --rls-theme-backdrop-900: var(--rls-secondary-backdrop-900);
2449
2450
  --rls-theme-gradient-700: var(--rls-secondary-gradient-700);
@@ -2526,6 +2527,7 @@ body {
2526
2527
  --rls-theme-skeleton-300: var(--rls-tertiary-skeleton-300);
2527
2528
  --rls-theme-skeleton-200: var(--rls-tertiary-skeleton-200);
2528
2529
  --rls-theme-skeleton-100: var(--rls-tertiary-skeleton-100);
2530
+ --rls-theme-shadow-color-500: var(--rls-tertiary-shadow-color-500);
2529
2531
  --rls-theme-shadow-500: var(--rls-tertiary-shadow-500);
2530
2532
  --rls-theme-backdrop-900: var(--rls-tertiary-backdrop-900);
2531
2533
  --rls-theme-gradient-700: var(--rls-tertiary-gradient-700);
@@ -2608,6 +2610,7 @@ body {
2608
2610
  --rls-theme-skeleton-300: var(--rls-success-skeleton-300);
2609
2611
  --rls-theme-skeleton-200: var(--rls-success-skeleton-200);
2610
2612
  --rls-theme-skeleton-100: var(--rls-success-skeleton-100);
2613
+ --rls-theme-shadow-color-500: var(--rls-success-shadow-color-500);
2611
2614
  --rls-theme-shadow-500: var(--rls-success-shadow-500);
2612
2615
  --rls-theme-backdrop-900: var(--rls-success-backdrop-900);
2613
2616
  --rls-theme-gradient-700: var(--rls-success-gradient-700);
@@ -2690,6 +2693,7 @@ body {
2690
2693
  --rls-theme-skeleton-300: var(--rls-info-skeleton-300);
2691
2694
  --rls-theme-skeleton-200: var(--rls-info-skeleton-200);
2692
2695
  --rls-theme-skeleton-100: var(--rls-info-skeleton-100);
2696
+ --rls-theme-shadow-color-500: var(--rls-info-shadow-color-500);
2693
2697
  --rls-theme-shadow-500: var(--rls-info-shadow-500);
2694
2698
  --rls-theme-backdrop-900: var(--rls-info-backdrop-900);
2695
2699
  --rls-theme-gradient-700: var(--rls-info-gradient-700);
@@ -2745,6 +2749,7 @@ body {
2745
2749
  --rls-theme-skeleton-300: var(--rls-warning-skeleton-300);
2746
2750
  --rls-theme-skeleton-200: var(--rls-warning-skeleton-200);
2747
2751
  --rls-theme-skeleton-100: var(--rls-warning-skeleton-100);
2752
+ --rls-theme-shadow-color-500: var(--rls-warning-shadow-color-500);
2748
2753
  --rls-theme-shadow-500: var(--rls-warning-shadow-500);
2749
2754
  --rls-theme-backdrop-900: var(--rls-warning-backdrop-900);
2750
2755
  --rls-theme-gradient-700: var(--rls-warning-gradient-700);
@@ -2827,6 +2832,7 @@ body {
2827
2832
  --rls-theme-skeleton-300: var(--rls-danger-skeleton-300);
2828
2833
  --rls-theme-skeleton-200: var(--rls-danger-skeleton-200);
2829
2834
  --rls-theme-skeleton-100: var(--rls-danger-skeleton-100);
2835
+ --rls-theme-shadow-color-500: var(--rls-danger-shadow-color-500);
2830
2836
  --rls-theme-shadow-500: var(--rls-danger-shadow-500);
2831
2837
  --rls-theme-backdrop-900: var(--rls-danger-backdrop-900);
2832
2838
  --rls-theme-gradient-700: var(--rls-danger-gradient-700);
@@ -2909,6 +2915,7 @@ body {
2909
2915
  --rls-theme-skeleton-300: var(--rls-berry-skeleton-300);
2910
2916
  --rls-theme-skeleton-200: var(--rls-berry-skeleton-200);
2911
2917
  --rls-theme-skeleton-100: var(--rls-berry-skeleton-100);
2918
+ --rls-theme-shadow-color-500: var(--rls-berry-shadow-color-500);
2912
2919
  --rls-theme-shadow-500: var(--rls-berry-shadow-500);
2913
2920
  --rls-theme-backdrop-900: var(--rls-berry-backdrop-900);
2914
2921
  --rls-theme-gradient-700: var(--rls-berry-gradient-700);
@@ -2964,6 +2971,7 @@ body {
2964
2971
  --rls-theme-skeleton-300: var(--rls-ross-skeleton-300);
2965
2972
  --rls-theme-skeleton-200: var(--rls-ross-skeleton-200);
2966
2973
  --rls-theme-skeleton-100: var(--rls-ross-skeleton-100);
2974
+ --rls-theme-shadow-color-500: var(--rls-ross-shadow-color-500);
2967
2975
  --rls-theme-shadow-500: var(--rls-ross-shadow-500);
2968
2976
  --rls-theme-backdrop-900: var(--rls-ross-backdrop-900);
2969
2977
  --rls-theme-gradient-700: var(--rls-ross-gradient-700);
@@ -3019,6 +3027,7 @@ body {
3019
3027
  --rls-theme-skeleton-300: var(--rls-hope-skeleton-300);
3020
3028
  --rls-theme-skeleton-200: var(--rls-hope-skeleton-200);
3021
3029
  --rls-theme-skeleton-100: var(--rls-hope-skeleton-100);
3030
+ --rls-theme-shadow-color-500: var(--rls-hope-shadow-color-500);
3022
3031
  --rls-theme-shadow-500: var(--rls-hope-shadow-500);
3023
3032
  --rls-theme-backdrop-900: var(--rls-hope-backdrop-900);
3024
3033
  --rls-theme-gradient-700: var(--rls-hope-gradient-700);
@@ -3074,6 +3083,7 @@ body {
3074
3083
  --rls-theme-skeleton-300: var(--rls-mountains-skeleton-300);
3075
3084
  --rls-theme-skeleton-200: var(--rls-mountains-skeleton-200);
3076
3085
  --rls-theme-skeleton-100: var(--rls-mountains-skeleton-100);
3086
+ --rls-theme-shadow-color-500: var(--rls-mountains-shadow-color-500);
3077
3087
  --rls-theme-shadow-500: var(--rls-mountains-shadow-500);
3078
3088
  --rls-theme-backdrop-900: var(--rls-mountains-backdrop-900);
3079
3089
  --rls-theme-gradient-700: var(--rls-mountains-gradient-700);
@@ -3156,6 +3166,7 @@ body {
3156
3166
  --rls-theme-skeleton-300: var(--rls-amaizing-skeleton-300);
3157
3167
  --rls-theme-skeleton-200: var(--rls-amaizing-skeleton-200);
3158
3168
  --rls-theme-skeleton-100: var(--rls-amaizing-skeleton-100);
3169
+ --rls-theme-shadow-color-500: var(--rls-amaizing-shadow-color-500);
3159
3170
  --rls-theme-shadow-500: var(--rls-amaizing-shadow-500);
3160
3171
  --rls-theme-backdrop-900: var(--rls-amaizing-backdrop-900);
3161
3172
  --rls-theme-gradient-700: var(--rls-amaizing-gradient-700);
@@ -3238,6 +3249,7 @@ body {
3238
3249
  --rls-theme-skeleton-300: var(--rls-purple-skeleton-300);
3239
3250
  --rls-theme-skeleton-200: var(--rls-purple-skeleton-200);
3240
3251
  --rls-theme-skeleton-100: var(--rls-purple-skeleton-100);
3252
+ --rls-theme-shadow-color-500: var(--rls-purple-shadow-color-500);
3241
3253
  --rls-theme-shadow-500: var(--rls-purple-shadow-500);
3242
3254
  --rls-theme-backdrop-900: var(--rls-purple-backdrop-900);
3243
3255
  --rls-theme-gradient-700: var(--rls-purple-gradient-700);
@@ -3320,6 +3332,7 @@ body {
3320
3332
  --rls-theme-skeleton-300: var(--rls-amber-skeleton-300);
3321
3333
  --rls-theme-skeleton-200: var(--rls-amber-skeleton-200);
3322
3334
  --rls-theme-skeleton-100: var(--rls-amber-skeleton-100);
3335
+ --rls-theme-shadow-color-500: var(--rls-amber-shadow-color-500);
3323
3336
  --rls-theme-shadow-500: var(--rls-amber-shadow-500);
3324
3337
  --rls-theme-backdrop-900: var(--rls-amber-backdrop-900);
3325
3338
  --rls-theme-gradient-700: var(--rls-amber-gradient-700);
@@ -3375,6 +3388,7 @@ body {
3375
3388
  --rls-theme-skeleton-300: var(--rls-smartness-skeleton-300);
3376
3389
  --rls-theme-skeleton-200: var(--rls-smartness-skeleton-200);
3377
3390
  --rls-theme-skeleton-100: var(--rls-smartness-skeleton-100);
3391
+ --rls-theme-shadow-color-500: var(--rls-smartness-shadow-color-500);
3378
3392
  --rls-theme-shadow-500: var(--rls-smartness-shadow-500);
3379
3393
  --rls-theme-backdrop-900: var(--rls-smartness-backdrop-900);
3380
3394
  --rls-theme-gradient-700: var(--rls-smartness-gradient-700);
@@ -3457,6 +3471,7 @@ body {
3457
3471
  --rls-theme-skeleton-300: var(--rls-obsidian-skeleton-300);
3458
3472
  --rls-theme-skeleton-200: var(--rls-obsidian-skeleton-200);
3459
3473
  --rls-theme-skeleton-100: var(--rls-obsidian-skeleton-100);
3474
+ --rls-theme-shadow-color-500: var(--rls-obsidian-shadow-color-500);
3460
3475
  --rls-theme-shadow-500: var(--rls-obsidian-shadow-500);
3461
3476
  --rls-theme-backdrop-900: var(--rls-obsidian-backdrop-900);
3462
3477
  --rls-theme-gradient-700: var(--rls-obsidian-gradient-700);
@@ -6072,7 +6087,7 @@ button {
6072
6087
  .rls-field-box--focused {
6073
6088
  --pvt-body-shadow: var(
6074
6089
  --rlc-field-box-body-shadow,
6075
- 0px 0px 0px 3px var(--rls-theme-shadow-500)
6090
+ var(--rls-theme-shadow-500)
6076
6091
  );
6077
6092
  --pvt-label-font-color: var(--rls-theme-color-500);
6078
6093
  --pvt-body-border: var(--pvt-body-border-focused);
@@ -6080,7 +6095,7 @@ button {
6080
6095
  .rls-field-box--error {
6081
6096
  --pvt-body-shadow: var(
6082
6097
  --rlc-field-box-body-shadow-error,
6083
- 0px 0px 0px 3px var(--rls-danger-shadow-500)
6098
+ 0px 0px 0px 3px var(--rls-danger-shadow-color-500)
6084
6099
  );
6085
6100
  --pvt-label-font-color: var(--rls-danger-color-500);
6086
6101
  --pvt-body-border: var(--pvt-body-border-error);
@@ -6271,7 +6286,7 @@ button {
6271
6286
  z-index: var(--rls-z-index-2);
6272
6287
  border: var(--pvt-list-body-border);
6273
6288
  background: var(--rls-app-color-050);
6274
- box-shadow: 0px 0px 0px 3px var(--rls-theme-shadow-500);
6289
+ box-shadow: var(--rls-theme-shadow-500);
6275
6290
  transform: var(--pvt-list-transform);
6276
6291
  }
6277
6292
  .rls-field-list__suggestions__body::before {