lau-ecom-design-system 1.0.23 → 1.0.26

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.
package/dist/style.css CHANGED
@@ -1163,6 +1163,10 @@ video {
1163
1163
  visibility: hidden;
1164
1164
  }
1165
1165
 
1166
+ .dsEcom-static {
1167
+ position: static;
1168
+ }
1169
+
1166
1170
  .dsEcom-fixed {
1167
1171
  position: fixed;
1168
1172
  }
@@ -1196,10 +1200,6 @@ video {
1196
1200
  left: 50%;
1197
1201
  }
1198
1202
 
1199
- .dsEcom-left-4 {
1200
- left: 1rem;
1201
- }
1202
-
1203
1203
  .dsEcom-left-\[2px\] {
1204
1204
  left: 2px;
1205
1205
  }
@@ -1208,10 +1208,22 @@ video {
1208
1208
  right: 0px;
1209
1209
  }
1210
1210
 
1211
+ .dsEcom-right-12 {
1212
+ right: 3rem;
1213
+ }
1214
+
1215
+ .dsEcom-right-2 {
1216
+ right: 0.5rem;
1217
+ }
1218
+
1211
1219
  .dsEcom-right-4 {
1212
1220
  right: 1rem;
1213
1221
  }
1214
1222
 
1223
+ .dsEcom-top-0 {
1224
+ top: 0px;
1225
+ }
1226
+
1215
1227
  .dsEcom-top-1 {
1216
1228
  top: 0.25rem;
1217
1229
  }
@@ -1224,6 +1236,10 @@ video {
1224
1236
  top: 0.75rem;
1225
1237
  }
1226
1238
 
1239
+ .dsEcom-top-4 {
1240
+ top: 1rem;
1241
+ }
1242
+
1227
1243
  .dsEcom-top-\[10px\] {
1228
1244
  top: 10px;
1229
1245
  }
@@ -1232,6 +1248,10 @@ video {
1232
1248
  top: 100%;
1233
1249
  }
1234
1250
 
1251
+ .dsEcom-z-10 {
1252
+ z-index: 10;
1253
+ }
1254
+
1235
1255
  .dsEcom-z-20 {
1236
1256
  z-index: 20;
1237
1257
  }
@@ -1244,6 +1264,10 @@ video {
1244
1264
  z-index: 50;
1245
1265
  }
1246
1266
 
1267
+ .dsEcom-z-\[60\] {
1268
+ z-index: 60;
1269
+ }
1270
+
1247
1271
  .dsEcom-col-span-2 {
1248
1272
  grid-column: span 2 / span 2;
1249
1273
  }
@@ -1271,8 +1295,8 @@ video {
1271
1295
  margin-bottom: 2.5rem;
1272
1296
  }
1273
1297
 
1274
- .dsEcom-mb-2 {
1275
- margin-bottom: 0.5rem;
1298
+ .dsEcom-mb-3 {
1299
+ margin-bottom: 0.75rem;
1276
1300
  }
1277
1301
 
1278
1302
  .dsEcom-mb-4 {
@@ -1287,30 +1311,14 @@ video {
1287
1311
  margin-bottom: 1.5rem;
1288
1312
  }
1289
1313
 
1290
- .dsEcom-mb-8 {
1291
- margin-bottom: 2rem;
1292
- }
1293
-
1294
1314
  .dsEcom-ml-1 {
1295
1315
  margin-left: 0.25rem;
1296
1316
  }
1297
1317
 
1298
- .dsEcom-ml-8 {
1299
- margin-left: 2rem;
1300
- }
1301
-
1302
- .dsEcom-ml-auto {
1303
- margin-left: auto;
1304
- }
1305
-
1306
1318
  .dsEcom-mr-2 {
1307
1319
  margin-right: 0.5rem;
1308
1320
  }
1309
1321
 
1310
- .dsEcom-mt-2 {
1311
- margin-top: 0.5rem;
1312
- }
1313
-
1314
1322
  .dsEcom-mt-4 {
1315
1323
  margin-top: 1rem;
1316
1324
  }
@@ -1319,6 +1327,10 @@ video {
1319
1327
  margin-top: 1.5rem;
1320
1328
  }
1321
1329
 
1330
+ .dsEcom-mt-8 {
1331
+ margin-top: 2rem;
1332
+ }
1333
+
1322
1334
  .dsEcom-mt-\[2px\] {
1323
1335
  margin-top: 2px;
1324
1336
  }
@@ -1331,6 +1343,10 @@ video {
1331
1343
  display: flex;
1332
1344
  }
1333
1345
 
1346
+ .dsEcom-inline-flex {
1347
+ display: inline-flex;
1348
+ }
1349
+
1334
1350
  .dsEcom-grid {
1335
1351
  display: grid;
1336
1352
  }
@@ -1352,6 +1368,10 @@ video {
1352
1368
  height: 2.5rem;
1353
1369
  }
1354
1370
 
1371
+ .dsEcom-h-12 {
1372
+ height: 3rem;
1373
+ }
1374
+
1355
1375
  .dsEcom-h-16 {
1356
1376
  height: 4rem;
1357
1377
  }
@@ -1360,6 +1380,10 @@ video {
1360
1380
  height: 1rem;
1361
1381
  }
1362
1382
 
1383
+ .dsEcom-h-48 {
1384
+ height: 12rem;
1385
+ }
1386
+
1363
1387
  .dsEcom-h-5 {
1364
1388
  height: 1.25rem;
1365
1389
  }
@@ -1400,6 +1424,14 @@ video {
1400
1424
  height: auto;
1401
1425
  }
1402
1426
 
1427
+ .dsEcom-h-full {
1428
+ height: 100%;
1429
+ }
1430
+
1431
+ .dsEcom-h-screen {
1432
+ height: 100vh;
1433
+ }
1434
+
1403
1435
  .dsEcom-min-h-screen {
1404
1436
  min-height: 100vh;
1405
1437
  }
@@ -1412,6 +1444,14 @@ video {
1412
1444
  width: 2.5rem;
1413
1445
  }
1414
1446
 
1447
+ .dsEcom-w-12 {
1448
+ width: 3rem;
1449
+ }
1450
+
1451
+ .dsEcom-w-32 {
1452
+ width: 8rem;
1453
+ }
1454
+
1415
1455
  .dsEcom-w-4 {
1416
1456
  width: 1rem;
1417
1457
  }
@@ -1420,6 +1460,10 @@ video {
1420
1460
  width: 1.25rem;
1421
1461
  }
1422
1462
 
1463
+ .dsEcom-w-6 {
1464
+ width: 1.5rem;
1465
+ }
1466
+
1423
1467
  .dsEcom-w-8 {
1424
1468
  width: 2rem;
1425
1469
  }
@@ -1440,14 +1484,6 @@ video {
1440
1484
  width: 350px;
1441
1485
  }
1442
1486
 
1443
- .dsEcom-w-\[426px\] {
1444
- width: 426px;
1445
- }
1446
-
1447
- .dsEcom-w-\[500px\] {
1448
- width: 500px;
1449
- }
1450
-
1451
1487
  .dsEcom-w-\[584px\] {
1452
1488
  width: 584px;
1453
1489
  }
@@ -1460,6 +1496,10 @@ video {
1460
1496
  width: 883px;
1461
1497
  }
1462
1498
 
1499
+ .dsEcom-w-\[calc\(100\%-2rem\)\] {
1500
+ width: calc(100% - 2rem);
1501
+ }
1502
+
1463
1503
  .dsEcom-w-auto {
1464
1504
  width: auto;
1465
1505
  }
@@ -1472,16 +1512,12 @@ video {
1472
1512
  width: 100%;
1473
1513
  }
1474
1514
 
1475
- .dsEcom-max-w-3xl {
1476
- max-width: 48rem;
1477
- }
1478
-
1479
- .dsEcom-max-w-\[1200px\] {
1480
- max-width: 1200px;
1515
+ .dsEcom-w-screen {
1516
+ width: 100vw;
1481
1517
  }
1482
1518
 
1483
- .dsEcom-max-w-xl {
1484
- max-width: 36rem;
1519
+ .dsEcom-max-w-\[500px\] {
1520
+ max-width: 500px;
1485
1521
  }
1486
1522
 
1487
1523
  .dsEcom-flex-1 {
@@ -1506,8 +1542,13 @@ video {
1506
1542
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
1507
1543
  }
1508
1544
 
1509
- .dsEcom-translate-y-1\/2 {
1510
- --tw-translate-y: 50%;
1545
+ .dsEcom--translate-y-1\/2 {
1546
+ --tw-translate-y: -50%;
1547
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
1548
+ }
1549
+
1550
+ .dsEcom--rotate-90 {
1551
+ --tw-rotate: -90deg;
1511
1552
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
1512
1553
  }
1513
1554
 
@@ -1559,6 +1600,10 @@ video {
1559
1600
  grid-template-columns: repeat(1, minmax(0, 1fr));
1560
1601
  }
1561
1602
 
1603
+ .dsEcom-grid-cols-2 {
1604
+ grid-template-columns: repeat(2, minmax(0, 1fr));
1605
+ }
1606
+
1562
1607
  .dsEcom-grid-cols-4 {
1563
1608
  grid-template-columns: repeat(4, minmax(0, 1fr));
1564
1609
  }
@@ -1575,14 +1620,6 @@ video {
1575
1620
  align-items: stretch;
1576
1621
  }
1577
1622
 
1578
- .dsEcom-justify-start {
1579
- justify-content: flex-start;
1580
- }
1581
-
1582
- .dsEcom-justify-end {
1583
- justify-content: flex-end;
1584
- }
1585
-
1586
1623
  .dsEcom-justify-center {
1587
1624
  justify-content: center;
1588
1625
  }
@@ -1627,12 +1664,6 @@ video {
1627
1664
  gap: 2rem;
1628
1665
  }
1629
1666
 
1630
- .dsEcom-space-y-2 > :not([hidden]) ~ :not([hidden]) {
1631
- --tw-space-y-reverse: 0;
1632
- margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
1633
- margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
1634
- }
1635
-
1636
1667
  .dsEcom-space-y-4 > :not([hidden]) ~ :not([hidden]) {
1637
1668
  --tw-space-y-reverse: 0;
1638
1669
  margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
@@ -1700,10 +1731,6 @@ video {
1700
1731
  border-width: 0px;
1701
1732
  }
1702
1733
 
1703
- .dsEcom-border-2 {
1704
- border-width: 2px;
1705
- }
1706
-
1707
1734
  .dsEcom-border-\[1px\] {
1708
1735
  border-width: 1px;
1709
1736
  }
@@ -1720,6 +1747,10 @@ video {
1720
1747
  border-style: solid;
1721
1748
  }
1722
1749
 
1750
+ .dsEcom-border-none {
1751
+ border-style: none;
1752
+ }
1753
+
1723
1754
  .\!dsEcom-border-feedback-success-60 {
1724
1755
  border-color: var(--feedback-success-60) !important;
1725
1756
  }
@@ -1736,6 +1767,11 @@ video {
1736
1767
  border-color: var(--neutral-70) !important;
1737
1768
  }
1738
1769
 
1770
+ .dsEcom-border-neutral-200 {
1771
+ --tw-border-opacity: 1;
1772
+ border-color: rgb(229 229 229 / var(--tw-border-opacity, 1));
1773
+ }
1774
+
1739
1775
  .dsEcom-border-neutral-60 {
1740
1776
  border-color: var(--neutral-60);
1741
1777
  }
@@ -1768,19 +1804,14 @@ video {
1768
1804
  background-color: var(--primary-60) !important;
1769
1805
  }
1770
1806
 
1771
- .dsEcom-bg-\[\#00A08C\] {
1772
- --tw-bg-opacity: 1;
1773
- background-color: rgb(0 160 140 / var(--tw-bg-opacity, 1));
1774
- }
1775
-
1776
- .dsEcom-bg-\[\#37516D\] {
1807
+ .dsEcom-bg-\[\#00A19C\] {
1777
1808
  --tw-bg-opacity: 1;
1778
- background-color: rgb(55 81 109 / var(--tw-bg-opacity, 1));
1809
+ background-color: rgb(0 161 156 / var(--tw-bg-opacity, 1));
1779
1810
  }
1780
1811
 
1781
- .dsEcom-bg-\[\#E5F3F1\] {
1812
+ .dsEcom-bg-\[\#E8F3F3\] {
1782
1813
  --tw-bg-opacity: 1;
1783
- background-color: rgb(229 243 241 / var(--tw-bg-opacity, 1));
1814
+ background-color: rgb(232 243 243 / var(--tw-bg-opacity, 1));
1784
1815
  }
1785
1816
 
1786
1817
  .dsEcom-bg-black {
@@ -1788,11 +1819,6 @@ video {
1788
1819
  background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1));
1789
1820
  }
1790
1821
 
1791
- .dsEcom-bg-blue-600 {
1792
- --tw-bg-opacity: 1;
1793
- background-color: rgb(37 99 235 / var(--tw-bg-opacity, 1));
1794
- }
1795
-
1796
1822
  .dsEcom-bg-gray-100 {
1797
1823
  --tw-bg-opacity: 1;
1798
1824
  background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));
@@ -1808,11 +1834,6 @@ video {
1808
1834
  background-color: rgb(34 197 94 / var(--tw-bg-opacity, 1));
1809
1835
  }
1810
1836
 
1811
- .dsEcom-bg-green-600 {
1812
- --tw-bg-opacity: 1;
1813
- background-color: rgb(22 163 74 / var(--tw-bg-opacity, 1));
1814
- }
1815
-
1816
1837
  .dsEcom-bg-neutral-10 {
1817
1838
  background-color: var(--neutral-10);
1818
1839
  }
@@ -1825,6 +1846,11 @@ video {
1825
1846
  background-color: var(--neutral-20);
1826
1847
  }
1827
1848
 
1849
+ .dsEcom-bg-neutral-200 {
1850
+ --tw-bg-opacity: 1;
1851
+ background-color: rgb(229 229 229 / var(--tw-bg-opacity, 1));
1852
+ }
1853
+
1828
1854
  .dsEcom-bg-neutral-40 {
1829
1855
  background-color: var(--neutral-40);
1830
1856
  }
@@ -1845,49 +1871,21 @@ video {
1845
1871
  background-color: var(--neutral-90);
1846
1872
  }
1847
1873
 
1848
- .dsEcom-bg-neutral-900 {
1849
- --tw-bg-opacity: 1;
1850
- background-color: rgb(23 23 23 / var(--tw-bg-opacity, 1));
1851
- }
1852
-
1853
1874
  .dsEcom-bg-primary-60 {
1854
1875
  background-color: var(--primary-60);
1855
1876
  }
1856
1877
 
1857
- .dsEcom-bg-red-600 {
1858
- --tw-bg-opacity: 1;
1859
- background-color: rgb(220 38 38 / var(--tw-bg-opacity, 1));
1860
- }
1861
-
1862
- .dsEcom-bg-secondary-60 {
1863
- background-color: var(--secondary-60);
1864
- }
1865
-
1866
- .dsEcom-bg-tertiary-60 {
1867
- background-color: var(--tertiary-60);
1868
- }
1869
-
1870
1878
  .dsEcom-bg-white {
1871
1879
  --tw-bg-opacity: 1;
1872
1880
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
1873
1881
  }
1874
1882
 
1875
- .dsEcom-bg-opacity-70 {
1876
- --tw-bg-opacity: 0.7;
1877
- }
1878
-
1879
- .dsEcom-bg-gradient-to-r {
1880
- background-image: linear-gradient(to right, var(--tw-gradient-stops));
1881
- }
1882
-
1883
- .dsEcom-from-purple-600 {
1884
- --tw-gradient-from: #9333ea var(--tw-gradient-from-position);
1885
- --tw-gradient-to: rgb(147 51 234 / 0) var(--tw-gradient-to-position);
1886
- --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
1883
+ .dsEcom-bg-opacity-50 {
1884
+ --tw-bg-opacity: 0.5;
1887
1885
  }
1888
1886
 
1889
- .dsEcom-to-pink-600 {
1890
- --tw-gradient-to: #db2777 var(--tw-gradient-to-position);
1887
+ .dsEcom-bg-opacity-70 {
1888
+ --tw-bg-opacity: 0.7;
1891
1889
  }
1892
1890
 
1893
1891
  .dsEcom-fill-feedback-critical-60 {
@@ -1938,16 +1936,12 @@ video {
1938
1936
  padding: 0.5rem;
1939
1937
  }
1940
1938
 
1941
- .dsEcom-p-4 {
1942
- padding: 1rem;
1943
- }
1944
-
1945
- .dsEcom-p-6 {
1946
- padding: 1.5rem;
1939
+ .dsEcom-p-3 {
1940
+ padding: 0.75rem;
1947
1941
  }
1948
1942
 
1949
- .dsEcom-p-8 {
1950
- padding: 2rem;
1943
+ .dsEcom-p-4 {
1944
+ padding: 1rem;
1951
1945
  }
1952
1946
 
1953
1947
  .dsEcom-p-\[10px\] {
@@ -2009,11 +2003,6 @@ video {
2009
2003
  padding-bottom: 2.5rem;
2010
2004
  }
2011
2005
 
2012
- .dsEcom-py-16 {
2013
- padding-top: 4rem;
2014
- padding-bottom: 4rem;
2015
- }
2016
-
2017
2006
  .dsEcom-py-2 {
2018
2007
  padding-top: 0.5rem;
2019
2008
  padding-bottom: 0.5rem;
@@ -2073,6 +2062,10 @@ video {
2073
2062
  padding-left: 51px;
2074
2063
  }
2075
2064
 
2065
+ .dsEcom-pr-12 {
2066
+ padding-right: 3rem;
2067
+ }
2068
+
2076
2069
  .dsEcom-pr-24 {
2077
2070
  padding-right: 6rem;
2078
2071
  }
@@ -2089,6 +2082,10 @@ video {
2089
2082
  padding-right: 51px;
2090
2083
  }
2091
2084
 
2085
+ .dsEcom-pt-16 {
2086
+ padding-top: 4rem;
2087
+ }
2088
+
2092
2089
  .dsEcom-pt-2 {
2093
2090
  padding-top: 0.5rem;
2094
2091
  }
@@ -2110,11 +2107,6 @@ video {
2110
2107
  line-height: 2rem;
2111
2108
  }
2112
2109
 
2113
- .dsEcom-text-4xl {
2114
- font-size: 2.25rem;
2115
- line-height: 2.5rem;
2116
- }
2117
-
2118
2110
  .dsEcom-text-\[12px\] {
2119
2111
  font-size: 12px;
2120
2112
  }
@@ -2146,10 +2138,6 @@ video {
2146
2138
  font-weight: 500;
2147
2139
  }
2148
2140
 
2149
- .dsEcom-font-semibold {
2150
- font-weight: 600;
2151
- }
2152
-
2153
2141
  .dsEcom-uppercase {
2154
2142
  text-transform: uppercase;
2155
2143
  }
@@ -2175,39 +2163,9 @@ video {
2175
2163
  color: rgb(0 160 140 / var(--tw-text-opacity, 1));
2176
2164
  }
2177
2165
 
2178
- .dsEcom-text-\[\#37516D\] {
2179
- --tw-text-opacity: 1;
2180
- color: rgb(55 81 109 / var(--tw-text-opacity, 1));
2181
- }
2182
-
2183
- .dsEcom-text-black {
2184
- --tw-text-opacity: 1;
2185
- color: rgb(0 0 0 / var(--tw-text-opacity, 1));
2186
- }
2187
-
2188
- .dsEcom-text-blue-600 {
2189
- --tw-text-opacity: 1;
2190
- color: rgb(37 99 235 / var(--tw-text-opacity, 1));
2191
- }
2192
-
2193
- .dsEcom-text-gray-200 {
2194
- --tw-text-opacity: 1;
2195
- color: rgb(229 231 235 / var(--tw-text-opacity, 1));
2196
- }
2197
-
2198
- .dsEcom-text-gray-600 {
2199
- --tw-text-opacity: 1;
2200
- color: rgb(75 85 99 / var(--tw-text-opacity, 1));
2201
- }
2202
-
2203
- .dsEcom-text-gray-800 {
2204
- --tw-text-opacity: 1;
2205
- color: rgb(31 41 55 / var(--tw-text-opacity, 1));
2206
- }
2207
-
2208
- .dsEcom-text-gray-900 {
2166
+ .dsEcom-text-\[\#00A19C\] {
2209
2167
  --tw-text-opacity: 1;
2210
- color: rgb(17 24 39 / var(--tw-text-opacity, 1));
2168
+ color: rgb(0 161 156 / var(--tw-text-opacity, 1));
2211
2169
  }
2212
2170
 
2213
2171
  .dsEcom-text-link-60 {
@@ -2222,6 +2180,16 @@ video {
2222
2180
  color: var(--neutral-100);
2223
2181
  }
2224
2182
 
2183
+ .dsEcom-text-neutral-400 {
2184
+ --tw-text-opacity: 1;
2185
+ color: rgb(163 163 163 / var(--tw-text-opacity, 1));
2186
+ }
2187
+
2188
+ .dsEcom-text-neutral-600 {
2189
+ --tw-text-opacity: 1;
2190
+ color: rgb(82 82 82 / var(--tw-text-opacity, 1));
2191
+ }
2192
+
2225
2193
  .dsEcom-text-neutral-70 {
2226
2194
  color: var(--neutral-70);
2227
2195
  }
@@ -2260,30 +2228,22 @@ video {
2260
2228
  opacity: 1;
2261
2229
  }
2262
2230
 
2263
- .dsEcom-opacity-20 {
2264
- opacity: 0.2;
2265
- }
2266
-
2267
- .dsEcom-opacity-30 {
2268
- opacity: 0.3;
2269
- }
2270
-
2271
2231
  .dsEcom-opacity-50 {
2272
2232
  opacity: 0.5;
2273
2233
  }
2274
2234
 
2275
- .dsEcom-shadow {
2276
- --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
2277
- --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
2278
- box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
2279
- }
2280
-
2281
2235
  .dsEcom-shadow-lg {
2282
2236
  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
2283
2237
  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
2284
2238
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
2285
2239
  }
2286
2240
 
2241
+ .dsEcom-shadow-md {
2242
+ --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
2243
+ --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
2244
+ box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
2245
+ }
2246
+
2287
2247
  .dsEcom-shadow-sm {
2288
2248
  --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
2289
2249
  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
@@ -2314,6 +2274,12 @@ video {
2314
2274
  transition-duration: 150ms;
2315
2275
  }
2316
2276
 
2277
+ .dsEcom-transition-colors {
2278
+ transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
2279
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
2280
+ transition-duration: 150ms;
2281
+ }
2282
+
2317
2283
  .dsEcom-transition-opacity {
2318
2284
  transition-property: opacity;
2319
2285
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
@@ -2596,21 +2562,11 @@ video {
2596
2562
  border-color: var(--stroke-secondary-60);
2597
2563
  }
2598
2564
 
2599
- .hover\:dsEcom-bg-gray-100:hover {
2600
- --tw-bg-opacity: 1;
2601
- background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));
2602
- }
2603
-
2604
2565
  .hover\:dsEcom-bg-green-600:hover {
2605
2566
  --tw-bg-opacity: 1;
2606
2567
  background-color: rgb(22 163 74 / var(--tw-bg-opacity, 1));
2607
2568
  }
2608
2569
 
2609
- .hover\:dsEcom-bg-green-700:hover {
2610
- --tw-bg-opacity: 1;
2611
- background-color: rgb(21 128 61 / var(--tw-bg-opacity, 1));
2612
- }
2613
-
2614
2570
  .hover\:dsEcom-bg-neutral-10:hover {
2615
2571
  background-color: var(--neutral-10);
2616
2572
  }
@@ -2627,23 +2583,8 @@ video {
2627
2583
  background-color: var(--primary-70);
2628
2584
  }
2629
2585
 
2630
- .hover\:dsEcom-bg-red-700:hover {
2631
- --tw-bg-opacity: 1;
2632
- background-color: rgb(185 28 28 / var(--tw-bg-opacity, 1));
2633
- }
2634
-
2635
- .hover\:dsEcom-bg-secondary-70:hover {
2636
- background-color: var(--secondary-70);
2637
- }
2638
-
2639
- .hover\:dsEcom-from-purple-700:hover {
2640
- --tw-gradient-from: #7e22ce var(--tw-gradient-from-position);
2641
- --tw-gradient-to: rgb(126 34 206 / 0) var(--tw-gradient-to-position);
2642
- --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
2643
- }
2644
-
2645
- .hover\:dsEcom-to-pink-700:hover {
2646
- --tw-gradient-to: #be185d var(--tw-gradient-to-position);
2586
+ .hover\:dsEcom-bg-opacity-80:hover {
2587
+ --tw-bg-opacity: 0.8;
2647
2588
  }
2648
2589
 
2649
2590
  .hover\:dsEcom-fill-neutral-70:hover {
@@ -2658,9 +2599,9 @@ video {
2658
2599
  fill: var(--secondary-70);
2659
2600
  }
2660
2601
 
2661
- .hover\:dsEcom-text-blue-800:hover {
2602
+ .hover\:dsEcom-text-neutral-600:hover {
2662
2603
  --tw-text-opacity: 1;
2663
- color: rgb(30 64 175 / var(--tw-text-opacity, 1));
2604
+ color: rgb(82 82 82 / var(--tw-text-opacity, 1));
2664
2605
  }
2665
2606
 
2666
2607
  .hover\:dsEcom-text-neutral-70:hover {
@@ -2671,10 +2612,6 @@ video {
2671
2612
  color: var(--neutral-80);
2672
2613
  }
2673
2614
 
2674
- .hover\:dsEcom-text-primary-60:hover {
2675
- color: var(--primary-60);
2676
- }
2677
-
2678
2615
  .hover\:dsEcom-text-primary-70:hover {
2679
2616
  color: var(--primary-70);
2680
2617
  }
@@ -2687,6 +2624,17 @@ video {
2687
2624
  color: var(--neutral-100) !important;
2688
2625
  }
2689
2626
 
2627
+ .focus\:dsEcom-outline-none:focus {
2628
+ outline: 2px solid transparent;
2629
+ outline-offset: 2px;
2630
+ }
2631
+
2632
+ .focus\:dsEcom-ring-0:focus {
2633
+ --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
2634
+ --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);
2635
+ box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
2636
+ }
2637
+
2690
2638
  .focus-visible\:dsEcom-outline-none:focus-visible {
2691
2639
  outline: 2px solid transparent;
2692
2640
  outline-offset: 2px;
@@ -2737,10 +2685,6 @@ video {
2737
2685
  }
2738
2686
 
2739
2687
  @media (min-width: 768px) {
2740
- .md\:dsEcom-flex {
2741
- display: flex;
2742
- }
2743
-
2744
2688
  .md\:dsEcom-w-\[350px\] {
2745
2689
  width: 350px;
2746
2690
  }