@aivenio/aquarium 1.19.0 → 1.20.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (12) hide show
  1. package/dist/_variables.scss +104 -104
  2. package/dist/_variables_timescale.scss +104 -104
  3. package/dist/atoms.cjs +88 -88
  4. package/dist/atoms.mjs +88 -88
  5. package/dist/styles.css +395 -391
  6. package/dist/styles_timescaledb.css +395 -391
  7. package/dist/system.cjs +88 -88
  8. package/dist/system.mjs +88 -88
  9. package/dist/tailwind.config.js +46 -44
  10. package/dist/tailwind.theme.json +88 -88
  11. package/dist/tsconfig.module.tsbuildinfo +1 -1
  12. package/package.json +1 -1
package/dist/styles.css CHANGED
@@ -370,6 +370,7 @@ input[type='number'].no-arrows {
370
370
  line-height: 1.26;
371
371
  text-transform: none;
372
372
  fill: #787885;
373
+ fill: var(--aquarium-colors-grey-50, #787885);
373
374
  }
374
375
  .recharts-tooltip-wrapper {
375
376
  font-family: Inter;
@@ -378,8 +379,8 @@ input[type='number'].no-arrows {
378
379
  font-style: normal;
379
380
  line-height: 1.26;
380
381
  text-transform: none;
381
- --tw-text-opacity: 1;
382
- color: rgb(255 255 255 / var(--tw-text-opacity));
382
+ color: white;
383
+ color: var(--aquarium-colors-white, white);
383
384
  }
384
385
  .recharts-tooltip-item {
385
386
  align-items: center;
@@ -398,6 +399,27 @@ input[type='number'].no-arrows {
398
399
  .recharts-tooltip-item-separator {
399
400
  margin-right: 2px;
400
401
  }
402
+ .focusable.focus-visible {
403
+ outline: 2px solid transparent;
404
+ outline-offset: 2px;
405
+ --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
406
+ --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
407
+ box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), 0 0 rgba(0,0,0,0);
408
+ box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 rgba(0,0,0,0));
409
+ --tw-ring-color: var(--aquarium-colors-info-70, #0399e3);
410
+ }
411
+ .focusable:focus-visible {
412
+ outline: 2px solid transparent;
413
+ outline-offset: 2px;
414
+ --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
415
+ --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
416
+ box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), 0 0 rgba(0,0,0,0);
417
+ box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 rgba(0,0,0,0));
418
+ --tw-ring-color: var(--aquarium-colors-info-70, #0399e3);
419
+ }
420
+ .icon-stroke-2 svg path {
421
+ stroke-width: 2;
422
+ }
401
423
  .container {
402
424
  width: 100%;
403
425
  }
@@ -703,29 +725,6 @@ input[type='number'].no-arrows {
703
725
  letter-spacing: -1.98px;
704
726
  text-transform: none;
705
727
  }
706
- .focusable.focus-visible {
707
- outline: 2px solid transparent;
708
- outline-offset: 2px;
709
- --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
710
- --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
711
- box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), 0 0 rgba(0,0,0,0);
712
- box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 rgba(0,0,0,0));
713
- --tw-ring-opacity: 1;
714
- --tw-ring-color: rgb(3 153 227 / var(--tw-ring-opacity));
715
- }
716
- .focusable:focus-visible {
717
- outline: 2px solid transparent;
718
- outline-offset: 2px;
719
- --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
720
- --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
721
- box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), 0 0 rgba(0,0,0,0);
722
- box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 rgba(0,0,0,0));
723
- --tw-ring-opacity: 1;
724
- --tw-ring-color: rgb(3 153 227 / var(--tw-ring-opacity));
725
- }
726
- .icon-stroke-2 svg path {
727
- stroke-width: 2;
728
- }
729
728
  .pointer-events-none {
730
729
  pointer-events: none;
731
730
  }
@@ -1344,12 +1343,15 @@ input[type='number'].no-arrows {
1344
1343
  }
1345
1344
  .rounded-sm {
1346
1345
  border-radius: 0.125rem;
1346
+ border-radius: var(--aquarium-border-radius-sm, 0.125rem);
1347
1347
  }
1348
1348
  .rounded-full {
1349
1349
  border-radius: 9999px;
1350
+ border-radius: var(--aquarium-border-radius-full, 9999px);
1350
1351
  }
1351
1352
  .rounded {
1352
1353
  border-radius: 4px;
1354
+ border-radius: var(--aquarium-border-radius-DEFAULT, 4px);
1353
1355
  }
1354
1356
  .rounded-\[2px\] {
1355
1357
  border-radius: 2px;
@@ -1388,152 +1390,156 @@ input[type='number'].no-arrows {
1388
1390
  border-style: none;
1389
1391
  }
1390
1392
  .border-error-50 {
1391
- --tw-border-opacity: 1;
1392
- border-color: rgb(230 39 40 / var(--tw-border-opacity));
1393
+ border-color: #e62728;
1394
+ border-color: var(--aquarium-colors-error-50, #e62728);
1393
1395
  }
1394
1396
  .border-grey-20 {
1395
- --tw-border-opacity: 1;
1396
- border-color: rgb(210 210 214 / var(--tw-border-opacity));
1397
+ border-color: #d2d2d6;
1398
+ border-color: var(--aquarium-colors-grey-20, #d2d2d6);
1397
1399
  }
1398
1400
  .border-info-70 {
1399
- --tw-border-opacity: 1;
1400
- border-color: rgb(3 153 227 / var(--tw-border-opacity));
1401
+ border-color: #0399e3;
1402
+ border-color: var(--aquarium-colors-info-70, #0399e3);
1401
1403
  }
1402
1404
  .border-grey-5 {
1403
- --tw-border-opacity: 1;
1404
- border-color: rgb(237 237 240 / var(--tw-border-opacity));
1405
+ border-color: #ededf0;
1406
+ border-color: var(--aquarium-colors-grey-5, #ededf0);
1405
1407
  }
1406
1408
  .border-transparent {
1407
1409
  border-color: transparent;
1410
+ border-color: var(--aquarium-colors-transparent, transparent);
1408
1411
  }
1409
1412
  .border-grey-10 {
1410
- --tw-border-opacity: 1;
1411
- border-color: rgb(225 225 227 / var(--tw-border-opacity));
1413
+ border-color: #e1e1e3;
1414
+ border-color: var(--aquarium-colors-grey-10, #e1e1e3);
1412
1415
  }
1413
1416
  .border-navyBlue-100 {
1414
1417
  --tw-border-opacity: 1;
1415
1418
  border-color: rgb(48 55 94 / var(--tw-border-opacity));
1416
1419
  }
1417
1420
  .border-grey-50 {
1418
- --tw-border-opacity: 1;
1419
- border-color: rgb(120 120 133 / var(--tw-border-opacity));
1421
+ border-color: #787885;
1422
+ border-color: var(--aquarium-colors-grey-50, #787885);
1420
1423
  }
1421
1424
  .border-grey-90 {
1422
- --tw-border-opacity: 1;
1423
- border-color: rgb(41 42 49 / var(--tw-border-opacity));
1425
+ border-color: #292a31;
1426
+ border-color: var(--aquarium-colors-grey-90, #292a31);
1424
1427
  }
1425
1428
  .border-success-70 {
1426
- --tw-border-opacity: 1;
1427
- border-color: rgb(0 179 0 / var(--tw-border-opacity));
1429
+ border-color: #00b300;
1430
+ border-color: var(--aquarium-colors-success-70, #00b300);
1428
1431
  }
1429
1432
  .border-grey-40 {
1430
- --tw-border-opacity: 1;
1431
- border-color: rgb(150 150 160 / var(--tw-border-opacity));
1433
+ border-color: #9696a0;
1434
+ border-color: var(--aquarium-colors-grey-40, #9696a0);
1432
1435
  }
1433
1436
  .border-current {
1434
1437
  border-color: currentColor;
1438
+ border-color: var(--aquarium-colors-current, currentColor);
1435
1439
  }
1436
1440
  .border-grey-100 {
1437
- --tw-border-opacity: 1;
1438
- border-color: rgb(25 25 29 / var(--tw-border-opacity));
1441
+ border-color: #19191d;
1442
+ border-color: var(--aquarium-colors-grey-100, #19191d);
1439
1443
  }
1440
1444
  .border-primary-80 {
1441
- --tw-border-opacity: 1;
1442
- border-color: rgb(228 26 74 / var(--tw-border-opacity));
1445
+ border-color: #e41a4a;
1446
+ border-color: var(--aquarium-colors-primary-80, #e41a4a);
1443
1447
  }
1444
1448
  .bg-grey-10 {
1445
- --tw-bg-opacity: 1;
1446
- background-color: rgb(225 225 227 / var(--tw-bg-opacity));
1449
+ background-color: #e1e1e3;
1450
+ background-color: var(--aquarium-colors-grey-10, #e1e1e3);
1447
1451
  }
1448
1452
  .bg-error-5 {
1449
- --tw-bg-opacity: 1;
1450
- background-color: rgb(254 232 231 / var(--tw-bg-opacity));
1453
+ background-color: #fee8e7;
1454
+ background-color: var(--aquarium-colors-error-5, #fee8e7);
1451
1455
  }
1452
1456
  .bg-info-5 {
1453
- --tw-bg-opacity: 1;
1454
- background-color: rgb(239 250 255 / var(--tw-bg-opacity));
1457
+ background-color: #effaff;
1458
+ background-color: var(--aquarium-colors-info-5, #effaff);
1455
1459
  }
1456
1460
  .bg-success-5 {
1457
- --tw-bg-opacity: 1;
1458
- background-color: rgb(236 247 237 / var(--tw-bg-opacity));
1461
+ background-color: #ecf7ed;
1462
+ background-color: var(--aquarium-colors-success-5, #ecf7ed);
1459
1463
  }
1460
1464
  .bg-warning-5 {
1461
- --tw-bg-opacity: 1;
1462
- background-color: rgb(255 248 234 / var(--tw-bg-opacity));
1465
+ background-color: #fff8ea;
1466
+ background-color: var(--aquarium-colors-warning-5, #fff8ea);
1463
1467
  }
1464
1468
  .bg-grey-0 {
1465
- --tw-bg-opacity: 1;
1466
- background-color: rgb(247 247 250 / var(--tw-bg-opacity));
1469
+ background-color: #f7f7fa;
1470
+ background-color: var(--aquarium-colors-grey-0, #f7f7fa);
1467
1471
  }
1468
1472
  .bg-white {
1469
- --tw-bg-opacity: 1;
1470
- background-color: rgb(255 255 255 / var(--tw-bg-opacity));
1473
+ background-color: white;
1474
+ background-color: var(--aquarium-colors-white, white);
1471
1475
  }
1472
1476
  .bg-navyBlue-100 {
1473
1477
  --tw-bg-opacity: 1;
1474
1478
  background-color: rgb(48 55 94 / var(--tw-bg-opacity));
1475
1479
  }
1476
1480
  .bg-grey-5 {
1477
- --tw-bg-opacity: 1;
1478
- background-color: rgb(237 237 240 / var(--tw-bg-opacity));
1481
+ background-color: #ededf0;
1482
+ background-color: var(--aquarium-colors-grey-5, #ededf0);
1479
1483
  }
1480
1484
  .bg-info-50 {
1481
- --tw-bg-opacity: 1;
1482
- background-color: rgb(40 180 244 / var(--tw-bg-opacity));
1485
+ background-color: #28b4f4;
1486
+ background-color: var(--aquarium-colors-info-50, #28b4f4);
1483
1487
  }
1484
1488
  .bg-warning-70 {
1485
- --tw-bg-opacity: 1;
1486
- background-color: rgb(255 179 0 / var(--tw-bg-opacity));
1489
+ background-color: #ffb300;
1490
+ background-color: var(--aquarium-colors-warning-70, #ffb300);
1487
1491
  }
1488
1492
  .bg-success-70 {
1489
- --tw-bg-opacity: 1;
1490
- background-color: rgb(0 179 0 / var(--tw-bg-opacity));
1493
+ background-color: #00b300;
1494
+ background-color: var(--aquarium-colors-success-70, #00b300);
1491
1495
  }
1492
1496
  .bg-error-70 {
1493
- --tw-bg-opacity: 1;
1494
- background-color: rgb(216 0 5 / var(--tw-bg-opacity));
1497
+ background-color: #d80005;
1498
+ background-color: var(--aquarium-colors-error-70, #d80005);
1495
1499
  }
1496
1500
  .bg-grey-20 {
1497
- --tw-bg-opacity: 1;
1498
- background-color: rgb(210 210 214 / var(--tw-bg-opacity));
1501
+ background-color: #d2d2d6;
1502
+ background-color: var(--aquarium-colors-grey-20, #d2d2d6);
1499
1503
  }
1500
1504
  .bg-grey-90 {
1501
- --tw-bg-opacity: 1;
1502
- background-color: rgb(41 42 49 / var(--tw-bg-opacity));
1505
+ background-color: #292a31;
1506
+ background-color: var(--aquarium-colors-grey-90, #292a31);
1503
1507
  }
1504
1508
  .bg-grey-30 {
1505
- --tw-bg-opacity: 1;
1506
- background-color: rgb(180 180 187 / var(--tw-bg-opacity));
1509
+ background-color: #b4b4bb;
1510
+ background-color: var(--aquarium-colors-grey-30, #b4b4bb);
1507
1511
  }
1508
1512
  .bg-grey-80 {
1509
- --tw-bg-opacity: 1;
1510
- background-color: rgb(58 58 68 / var(--tw-bg-opacity));
1513
+ background-color: #3a3a44;
1514
+ background-color: var(--aquarium-colors-grey-80, #3a3a44);
1511
1515
  }
1512
1516
  .bg-current {
1513
1517
  background-color: currentColor;
1518
+ background-color: var(--aquarium-colors-current, currentColor);
1514
1519
  }
1515
1520
  .bg-primary-80 {
1516
- --tw-bg-opacity: 1;
1517
- background-color: rgb(228 26 74 / var(--tw-bg-opacity));
1521
+ background-color: #e41a4a;
1522
+ background-color: var(--aquarium-colors-primary-80, #e41a4a);
1518
1523
  }
1519
1524
  .bg-transparent {
1520
1525
  background-color: transparent;
1526
+ background-color: var(--aquarium-colors-transparent, transparent);
1521
1527
  }
1522
1528
  .bg-secondary-5 {
1523
- --tw-bg-opacity: 1;
1524
- background-color: rgb(255 243 232 / var(--tw-bg-opacity));
1529
+ background-color: #fff3e8;
1530
+ background-color: var(--aquarium-colors-secondary-5, #fff3e8);
1525
1531
  }
1526
1532
  .bg-error-0 {
1527
- --tw-bg-opacity: 1;
1528
- background-color: rgb(254 242 241 / var(--tw-bg-opacity));
1533
+ background-color: #fef2f1;
1534
+ background-color: var(--aquarium-colors-error-0, #fef2f1);
1529
1535
  }
1530
1536
  .bg-error-20 {
1531
- --tw-bg-opacity: 1;
1532
- background-color: rgb(255 173 179 / var(--tw-bg-opacity));
1537
+ background-color: #ffadb3;
1538
+ background-color: var(--aquarium-colors-error-20, #ffadb3);
1533
1539
  }
1534
1540
  .bg-primary-70 {
1535
- --tw-bg-opacity: 1;
1536
- background-color: rgb(255 53 84 / var(--tw-bg-opacity));
1541
+ background-color: #ff3554;
1542
+ background-color: var(--aquarium-colors-primary-70, #ff3554);
1537
1543
  }
1538
1544
  .bg-opacity-40 {
1539
1545
  --tw-bg-opacity: 0.4;
@@ -1545,19 +1551,20 @@ input[type='number'].no-arrows {
1545
1551
  background-image: linear-gradient(to left, var(--tw-gradient-stops));
1546
1552
  }
1547
1553
  .from-white {
1548
- --tw-gradient-from: white;
1554
+ --tw-gradient-from: var(--aquarium-colors-white, white);
1549
1555
  --tw-gradient-to: rgba(255, 255, 255, 0);
1550
1556
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
1551
1557
  }
1552
1558
  .via-white {
1553
1559
  --tw-gradient-to: rgba(255, 255, 255, 0);
1554
- --tw-gradient-stops: var(--tw-gradient-from), white, var(--tw-gradient-to);
1560
+ --tw-gradient-stops: var(--tw-gradient-from), var(--aquarium-colors-white, white), var(--tw-gradient-to);
1555
1561
  }
1556
1562
  .bg-cover {
1557
1563
  background-size: cover;
1558
1564
  }
1559
1565
  .stroke-grey-30 {
1560
1566
  stroke: #b4b4bb;
1567
+ stroke: var(--aquarium-colors-grey-30, #b4b4bb);
1561
1568
  }
1562
1569
  .object-cover {
1563
1570
  -o-object-fit: cover;
@@ -1729,347 +1736,348 @@ input[type='number'].no-arrows {
1729
1736
  line-height: 0px;
1730
1737
  }
1731
1738
  .text-error-100 {
1732
- --tw-text-opacity: 1;
1733
- color: rgb(170 0 0 / var(--tw-text-opacity));
1739
+ color: #aa0000;
1740
+ color: var(--aquarium-colors-error-100, #aa0000);
1734
1741
  }
1735
1742
  .text-error-90 {
1736
- --tw-text-opacity: 1;
1737
- color: rgb(185 0 0 / var(--tw-text-opacity));
1743
+ color: #b90000;
1744
+ color: var(--aquarium-colors-error-90, #b90000);
1738
1745
  }
1739
1746
  .text-error-80 {
1740
- --tw-text-opacity: 1;
1741
- color: rgb(197 0 1 / var(--tw-text-opacity));
1747
+ color: #c50001;
1748
+ color: var(--aquarium-colors-error-80, #c50001);
1742
1749
  }
1743
1750
  .text-error-70 {
1744
- --tw-text-opacity: 1;
1745
- color: rgb(216 0 5 / var(--tw-text-opacity));
1751
+ color: #d80005;
1752
+ color: var(--aquarium-colors-error-70, #d80005);
1746
1753
  }
1747
1754
  .text-error-60 {
1748
- --tw-text-opacity: 1;
1749
- color: rgb(231 0 0 / var(--tw-text-opacity));
1755
+ color: #e70000;
1756
+ color: var(--aquarium-colors-error-60, #e70000);
1750
1757
  }
1751
1758
  .text-error-50 {
1752
- --tw-text-opacity: 1;
1753
- color: rgb(230 39 40 / var(--tw-text-opacity));
1759
+ color: #e62728;
1760
+ color: var(--aquarium-colors-error-50, #e62728);
1754
1761
  }
1755
1762
  .text-error-40 {
1756
- --tw-text-opacity: 1;
1757
- color: rgb(224 80 79 / var(--tw-text-opacity));
1763
+ color: #e0504f;
1764
+ color: var(--aquarium-colors-error-40, #e0504f);
1758
1765
  }
1759
1766
  .text-error-30 {
1760
- --tw-text-opacity: 1;
1761
- color: rgb(237 121 117 / var(--tw-text-opacity));
1767
+ color: #ed7975;
1768
+ color: var(--aquarium-colors-error-30, #ed7975);
1762
1769
  }
1763
1770
  .text-error-20 {
1764
- --tw-text-opacity: 1;
1765
- color: rgb(255 173 179 / var(--tw-text-opacity));
1771
+ color: #ffadb3;
1772
+ color: var(--aquarium-colors-error-20, #ffadb3);
1766
1773
  }
1767
1774
  .text-error-10 {
1768
- --tw-text-opacity: 1;
1769
- color: rgb(255 203 210 / var(--tw-text-opacity));
1775
+ color: #ffcbd2;
1776
+ color: var(--aquarium-colors-error-10, #ffcbd2);
1770
1777
  }
1771
1778
  .text-error-5 {
1772
- --tw-text-opacity: 1;
1773
- color: rgb(254 232 231 / var(--tw-text-opacity));
1779
+ color: #fee8e7;
1780
+ color: var(--aquarium-colors-error-5, #fee8e7);
1774
1781
  }
1775
1782
  .text-error-0 {
1776
- --tw-text-opacity: 1;
1777
- color: rgb(254 242 241 / var(--tw-text-opacity));
1783
+ color: #fef2f1;
1784
+ color: var(--aquarium-colors-error-0, #fef2f1);
1778
1785
  }
1779
1786
  .text-warning-100 {
1780
- --tw-text-opacity: 1;
1781
- color: rgb(254 109 0 / var(--tw-text-opacity));
1787
+ color: #fe6d00;
1788
+ color: var(--aquarium-colors-warning-100, #fe6d00);
1782
1789
  }
1783
1790
  .text-warning-90 {
1784
- --tw-text-opacity: 1;
1785
- color: rgb(255 144 3 / var(--tw-text-opacity));
1791
+ color: #ff9003;
1792
+ color: var(--aquarium-colors-warning-90, #ff9003);
1786
1793
  }
1787
1794
  .text-warning-80 {
1788
- --tw-text-opacity: 1;
1789
- color: rgb(253 159 0 / var(--tw-text-opacity));
1795
+ color: #fd9f00;
1796
+ color: var(--aquarium-colors-warning-80, #fd9f00);
1790
1797
  }
1791
1798
  .text-warning-70 {
1792
- --tw-text-opacity: 1;
1793
- color: rgb(255 179 0 / var(--tw-text-opacity));
1799
+ color: #ffb300;
1800
+ color: var(--aquarium-colors-warning-70, #ffb300);
1794
1801
  }
1795
1802
  .text-warning-60 {
1796
- --tw-text-opacity: 1;
1797
- color: rgb(255 193 7 / var(--tw-text-opacity));
1803
+ color: #ffc107;
1804
+ color: var(--aquarium-colors-warning-60, #ffc107);
1798
1805
  }
1799
1806
  .text-warning-50 {
1800
- --tw-text-opacity: 1;
1801
- color: rgb(253 201 38 / var(--tw-text-opacity));
1807
+ color: #fdc926;
1808
+ color: var(--aquarium-colors-warning-50, #fdc926);
1802
1809
  }
1803
1810
  .text-warning-40 {
1804
- --tw-text-opacity: 1;
1805
- color: rgb(253 212 77 / var(--tw-text-opacity));
1811
+ color: #fdd44d;
1812
+ color: var(--aquarium-colors-warning-40, #fdd44d);
1806
1813
  }
1807
1814
  .text-warning-30 {
1808
- --tw-text-opacity: 1;
1809
- color: rgb(253 223 129 / var(--tw-text-opacity));
1815
+ color: #fddf81;
1816
+ color: var(--aquarium-colors-warning-30, #fddf81);
1810
1817
  }
1811
1818
  .text-warning-20 {
1812
- --tw-text-opacity: 1;
1813
- color: rgb(254 235 178 / var(--tw-text-opacity));
1819
+ color: #feebb2;
1820
+ color: var(--aquarium-colors-warning-20, #feebb2);
1814
1821
  }
1815
1822
  .text-warning-10 {
1816
- --tw-text-opacity: 1;
1817
- color: rgb(255 242 205 / var(--tw-text-opacity));
1823
+ color: #fff2cd;
1824
+ color: var(--aquarium-colors-warning-10, #fff2cd);
1818
1825
  }
1819
1826
  .text-warning-5 {
1820
- --tw-text-opacity: 1;
1821
- color: rgb(255 248 234 / var(--tw-text-opacity));
1827
+ color: #fff8ea;
1828
+ color: var(--aquarium-colors-warning-5, #fff8ea);
1822
1829
  }
1823
1830
  .text-warning-0 {
1824
- --tw-text-opacity: 1;
1825
- color: rgb(255 253 249 / var(--tw-text-opacity));
1831
+ color: #fffdf9;
1832
+ color: var(--aquarium-colors-warning-0, #fffdf9);
1826
1833
  }
1827
1834
  .text-success-100 {
1828
- --tw-text-opacity: 1;
1829
- color: rgb(0 111 0 / var(--tw-text-opacity));
1835
+ color: #006f00;
1836
+ color: var(--aquarium-colors-success-100, #006f00);
1830
1837
  }
1831
1838
  .text-success-90 {
1832
- --tw-text-opacity: 1;
1833
- color: rgb(0 142 0 / var(--tw-text-opacity));
1839
+ color: #008e00;
1840
+ color: var(--aquarium-colors-success-90, #008e00);
1834
1841
  }
1835
1842
  .text-success-80 {
1836
- --tw-text-opacity: 1;
1837
- color: rgb(0 159 0 / var(--tw-text-opacity));
1843
+ color: #009f00;
1844
+ color: var(--aquarium-colors-success-80, #009f00);
1838
1845
  }
1839
1846
  .text-success-70 {
1840
- --tw-text-opacity: 1;
1841
- color: rgb(0 179 0 / var(--tw-text-opacity));
1847
+ color: #00b300;
1848
+ color: var(--aquarium-colors-success-70, #00b300);
1842
1849
  }
1843
1850
  .text-success-60 {
1844
- --tw-text-opacity: 1;
1845
- color: rgb(0 195 0 / var(--tw-text-opacity));
1851
+ color: #00c300;
1852
+ color: var(--aquarium-colors-success-60, #00c300);
1846
1853
  }
1847
1854
  .text-success-50 {
1848
- --tw-text-opacity: 1;
1849
- color: rgb(64 206 55 / var(--tw-text-opacity));
1855
+ color: #40ce37;
1856
+ color: var(--aquarium-colors-success-50, #40ce37);
1850
1857
  }
1851
1858
  .text-success-40 {
1852
- --tw-text-opacity: 1;
1853
- color: rgb(96 219 87 / var(--tw-text-opacity));
1859
+ color: #60db57;
1860
+ color: var(--aquarium-colors-success-40, #60db57);
1854
1861
  }
1855
1862
  .text-success-30 {
1856
- --tw-text-opacity: 1;
1857
- color: rgb(137 235 128 / var(--tw-text-opacity));
1863
+ color: #89eb80;
1864
+ color: var(--aquarium-colors-success-30, #89eb80);
1858
1865
  }
1859
1866
  .text-success-20 {
1860
- --tw-text-opacity: 1;
1861
- color: rgb(175 255 167 / var(--tw-text-opacity));
1867
+ color: #afffa7;
1868
+ color: var(--aquarium-colors-success-20, #afffa7);
1862
1869
  }
1863
1870
  .text-success-10 {
1864
- --tw-text-opacity: 1;
1865
- color: rgb(203 255 201 / var(--tw-text-opacity));
1871
+ color: #cbffc9;
1872
+ color: var(--aquarium-colors-success-10, #cbffc9);
1866
1873
  }
1867
1874
  .text-success-5 {
1868
- --tw-text-opacity: 1;
1869
- color: rgb(236 247 237 / var(--tw-text-opacity));
1875
+ color: #ecf7ed;
1876
+ color: var(--aquarium-colors-success-5, #ecf7ed);
1870
1877
  }
1871
1878
  .text-success-0 {
1872
- --tw-text-opacity: 1;
1873
- color: rgb(245 250 245 / var(--tw-text-opacity));
1879
+ color: #f5faf5;
1880
+ color: var(--aquarium-colors-success-0, #f5faf5);
1874
1881
  }
1875
1882
  .text-info-100 {
1876
- --tw-text-opacity: 1;
1877
- color: rgb(2 86 154 / var(--tw-text-opacity));
1883
+ color: #02569a;
1884
+ color: var(--aquarium-colors-info-100, #02569a);
1878
1885
  }
1879
1886
  .text-info-90 {
1880
- --tw-text-opacity: 1;
1881
- color: rgb(1 116 186 / var(--tw-text-opacity));
1887
+ color: #0174ba;
1888
+ color: var(--aquarium-colors-info-90, #0174ba);
1882
1889
  }
1883
1890
  .text-info-80 {
1884
- --tw-text-opacity: 1;
1885
- color: rgb(7 136 209 / var(--tw-text-opacity));
1891
+ color: #0788d1;
1892
+ color: var(--aquarium-colors-info-80, #0788d1);
1886
1893
  }
1887
1894
  .text-info-70 {
1888
- --tw-text-opacity: 1;
1889
- color: rgb(3 153 227 / var(--tw-text-opacity));
1895
+ color: #0399e3;
1896
+ color: var(--aquarium-colors-info-70, #0399e3);
1890
1897
  }
1891
1898
  .text-info-60 {
1892
- --tw-text-opacity: 1;
1893
- color: rgb(2 168 243 / var(--tw-text-opacity));
1899
+ color: #02a8f3;
1900
+ color: var(--aquarium-colors-info-60, #02a8f3);
1894
1901
  }
1895
1902
  .text-info-50 {
1896
- --tw-text-opacity: 1;
1897
- color: rgb(40 180 244 / var(--tw-text-opacity));
1903
+ color: #28b4f4;
1904
+ color: var(--aquarium-colors-info-50, #28b4f4);
1898
1905
  }
1899
1906
  .text-info-40 {
1900
- --tw-text-opacity: 1;
1901
- color: rgb(76 194 247 / var(--tw-text-opacity));
1907
+ color: #4cc2f7;
1908
+ color: var(--aquarium-colors-info-40, #4cc2f7);
1902
1909
  }
1903
1910
  .text-info-30 {
1904
- --tw-text-opacity: 1;
1905
- color: rgb(127 209 247 / var(--tw-text-opacity));
1911
+ color: #7fd1f7;
1912
+ color: var(--aquarium-colors-info-30, #7fd1f7);
1906
1913
  }
1907
1914
  .text-info-20 {
1908
- --tw-text-opacity: 1;
1909
- color: rgb(180 229 251 / var(--tw-text-opacity));
1915
+ color: #b4e5fb;
1916
+ color: var(--aquarium-colors-info-20, #b4e5fb);
1910
1917
  }
1911
1918
  .text-info-10 {
1912
- --tw-text-opacity: 1;
1913
- color: rgb(224 245 254 / var(--tw-text-opacity));
1919
+ color: #e0f5fe;
1920
+ color: var(--aquarium-colors-info-10, #e0f5fe);
1914
1921
  }
1915
1922
  .text-info-5 {
1916
- --tw-text-opacity: 1;
1917
- color: rgb(239 250 255 / var(--tw-text-opacity));
1923
+ color: #effaff;
1924
+ color: var(--aquarium-colors-info-5, #effaff);
1918
1925
  }
1919
1926
  .text-info-0 {
1920
- --tw-text-opacity: 1;
1921
- color: rgb(249 253 255 / var(--tw-text-opacity));
1927
+ color: #f9fdff;
1928
+ color: var(--aquarium-colors-info-0, #f9fdff);
1922
1929
  }
1923
1930
  .text-grey-100 {
1924
- --tw-text-opacity: 1;
1925
- color: rgb(25 25 29 / var(--tw-text-opacity));
1931
+ color: #19191d;
1932
+ color: var(--aquarium-colors-grey-100, #19191d);
1926
1933
  }
1927
1934
  .text-grey-90 {
1928
- --tw-text-opacity: 1;
1929
- color: rgb(41 42 49 / var(--tw-text-opacity));
1935
+ color: #292a31;
1936
+ color: var(--aquarium-colors-grey-90, #292a31);
1930
1937
  }
1931
1938
  .text-grey-80 {
1932
- --tw-text-opacity: 1;
1933
- color: rgb(58 58 68 / var(--tw-text-opacity));
1939
+ color: #3a3a44;
1940
+ color: var(--aquarium-colors-grey-80, #3a3a44);
1934
1941
  }
1935
1942
  .text-grey-70 {
1936
- --tw-text-opacity: 1;
1937
- color: rgb(74 75 87 / var(--tw-text-opacity));
1943
+ color: #4a4b57;
1944
+ color: var(--aquarium-colors-grey-70, #4a4b57);
1938
1945
  }
1939
1946
  .text-grey-60 {
1940
- --tw-text-opacity: 1;
1941
- color: rgb(90 91 106 / var(--tw-text-opacity));
1947
+ color: #5a5b6a;
1948
+ color: var(--aquarium-colors-grey-60, #5a5b6a);
1942
1949
  }
1943
1950
  .text-grey-50 {
1944
- --tw-text-opacity: 1;
1945
- color: rgb(120 120 133 / var(--tw-text-opacity));
1951
+ color: #787885;
1952
+ color: var(--aquarium-colors-grey-50, #787885);
1946
1953
  }
1947
1954
  .text-grey-40 {
1948
- --tw-text-opacity: 1;
1949
- color: rgb(150 150 160 / var(--tw-text-opacity));
1955
+ color: #9696a0;
1956
+ color: var(--aquarium-colors-grey-40, #9696a0);
1950
1957
  }
1951
1958
  .text-grey-30 {
1952
- --tw-text-opacity: 1;
1953
- color: rgb(180 180 187 / var(--tw-text-opacity));
1959
+ color: #b4b4bb;
1960
+ color: var(--aquarium-colors-grey-30, #b4b4bb);
1954
1961
  }
1955
1962
  .text-grey-10 {
1956
- --tw-text-opacity: 1;
1957
- color: rgb(225 225 227 / var(--tw-text-opacity));
1963
+ color: #e1e1e3;
1964
+ color: var(--aquarium-colors-grey-10, #e1e1e3);
1958
1965
  }
1959
1966
  .text-grey-5 {
1960
- --tw-text-opacity: 1;
1961
- color: rgb(237 237 240 / var(--tw-text-opacity));
1967
+ color: #ededf0;
1968
+ color: var(--aquarium-colors-grey-5, #ededf0);
1962
1969
  }
1963
1970
  .text-grey-0 {
1964
- --tw-text-opacity: 1;
1965
- color: rgb(247 247 250 / var(--tw-text-opacity));
1971
+ color: #f7f7fa;
1972
+ color: var(--aquarium-colors-grey-0, #f7f7fa);
1966
1973
  }
1967
1974
  .text-secondary-100 {
1968
- --tw-text-opacity: 1;
1969
- color: rgb(225 29 22 / var(--tw-text-opacity));
1975
+ color: #e11d16;
1976
+ color: var(--aquarium-colors-secondary-100, #e11d16);
1970
1977
  }
1971
1978
  .text-secondary-90 {
1972
- --tw-text-opacity: 1;
1973
- color: rgb(235 70 16 / var(--tw-text-opacity));
1979
+ color: #eb4610;
1980
+ color: var(--aquarium-colors-secondary-90, #eb4610);
1974
1981
  }
1975
1982
  .text-secondary-80 {
1976
- --tw-text-opacity: 1;
1977
- color: rgb(243 88 13 / var(--tw-text-opacity));
1983
+ color: #f3580d;
1984
+ color: var(--aquarium-colors-secondary-80, #f3580d);
1978
1985
  }
1979
1986
  .text-secondary-70 {
1980
- --tw-text-opacity: 1;
1981
- color: rgb(249 106 2 / var(--tw-text-opacity));
1987
+ color: #f96a02;
1988
+ color: var(--aquarium-colors-secondary-70, #f96a02);
1982
1989
  }
1983
1990
  .text-secondary-60 {
1984
- --tw-text-opacity: 1;
1985
- color: rgb(255 119 0 / var(--tw-text-opacity));
1991
+ color: #ff7700;
1992
+ color: var(--aquarium-colors-secondary-60, #ff7700);
1986
1993
  }
1987
1994
  .text-secondary-50 {
1988
- --tw-text-opacity: 1;
1989
- color: rgb(252 135 26 / var(--tw-text-opacity));
1995
+ color: #fc871a;
1996
+ color: var(--aquarium-colors-secondary-50, #fc871a);
1990
1997
  }
1991
1998
  .text-secondary-40 {
1992
- --tw-text-opacity: 1;
1993
- color: rgb(251 154 62 / var(--tw-text-opacity));
1999
+ color: #fb9a3e;
2000
+ color: var(--aquarium-colors-secondary-40, #fb9a3e);
1994
2001
  }
1995
2002
  .text-secondary-30 {
1996
- --tw-text-opacity: 1;
1997
- color: rgb(250 178 110 / var(--tw-text-opacity));
2003
+ color: #fab26e;
2004
+ color: var(--aquarium-colors-secondary-30, #fab26e);
1998
2005
  }
1999
2006
  .text-secondary-20 {
2000
- --tw-text-opacity: 1;
2001
- color: rgb(248 201 156 / var(--tw-text-opacity));
2007
+ color: #f8c99c;
2008
+ color: var(--aquarium-colors-secondary-20, #f8c99c);
2002
2009
  }
2003
2010
  .text-secondary-10 {
2004
- --tw-text-opacity: 1;
2005
- color: rgb(254 232 208 / var(--tw-text-opacity));
2011
+ color: #fee8d0;
2012
+ color: var(--aquarium-colors-secondary-10, #fee8d0);
2006
2013
  }
2007
2014
  .text-secondary-5 {
2008
- --tw-text-opacity: 1;
2009
- color: rgb(255 243 232 / var(--tw-text-opacity));
2015
+ color: #fff3e8;
2016
+ color: var(--aquarium-colors-secondary-5, #fff3e8);
2010
2017
  }
2011
2018
  .text-secondary-0 {
2012
- --tw-text-opacity: 1;
2013
- color: rgb(255 251 248 / var(--tw-text-opacity));
2019
+ color: #fffbf8;
2020
+ color: var(--aquarium-colors-secondary-0, #fffbf8);
2014
2021
  }
2015
2022
  .text-primary-100 {
2016
- --tw-text-opacity: 1;
2017
- color: rgb(167 0 69 / var(--tw-text-opacity));
2023
+ color: #a70045;
2024
+ color: var(--aquarium-colors-primary-100, #a70045);
2018
2025
  }
2019
2026
  .text-primary-90 {
2020
- --tw-text-opacity: 1;
2021
- color: rgb(198 4 67 / var(--tw-text-opacity));
2027
+ color: #c60443;
2028
+ color: var(--aquarium-colors-primary-90, #c60443);
2022
2029
  }
2023
2030
  .text-primary-80 {
2024
- --tw-text-opacity: 1;
2025
- color: rgb(228 26 74 / var(--tw-text-opacity));
2031
+ color: #e41a4a;
2032
+ color: var(--aquarium-colors-primary-80, #e41a4a);
2026
2033
  }
2027
2034
  .text-primary-70 {
2028
- --tw-text-opacity: 1;
2029
- color: rgb(255 53 84 / var(--tw-text-opacity));
2035
+ color: #ff3554;
2036
+ color: var(--aquarium-colors-primary-70, #ff3554);
2030
2037
  }
2031
2038
  .text-primary-60 {
2032
- --tw-text-opacity: 1;
2033
- color: rgb(255 82 117 / var(--tw-text-opacity));
2039
+ color: #ff5275;
2040
+ color: var(--aquarium-colors-primary-60, #ff5275);
2034
2041
  }
2035
2042
  .text-primary-50 {
2036
- --tw-text-opacity: 1;
2037
- color: rgb(255 111 148 / var(--tw-text-opacity));
2043
+ color: #ff6f94;
2044
+ color: var(--aquarium-colors-primary-50, #ff6f94);
2038
2045
  }
2039
2046
  .text-primary-40 {
2040
- --tw-text-opacity: 1;
2041
- color: rgb(255 141 176 / var(--tw-text-opacity));
2047
+ color: #ff8db0;
2048
+ color: var(--aquarium-colors-primary-40, #ff8db0);
2042
2049
  }
2043
2050
  .text-primary-30 {
2044
- --tw-text-opacity: 1;
2045
- color: rgb(255 169 201 / var(--tw-text-opacity));
2051
+ color: #ffa9c9;
2052
+ color: var(--aquarium-colors-primary-30, #ffa9c9);
2046
2053
  }
2047
2054
  .text-primary-20 {
2048
- --tw-text-opacity: 1;
2049
- color: rgb(255 196 222 / var(--tw-text-opacity));
2055
+ color: #ffc4de;
2056
+ color: var(--aquarium-colors-primary-20, #ffc4de);
2050
2057
  }
2051
2058
  .text-primary-10 {
2052
- --tw-text-opacity: 1;
2053
- color: rgb(255 222 239 / var(--tw-text-opacity));
2059
+ color: #ffdeef;
2060
+ color: var(--aquarium-colors-primary-10, #ffdeef);
2054
2061
  }
2055
2062
  .text-primary-5 {
2056
- --tw-text-opacity: 1;
2057
- color: rgb(255 232 244 / var(--tw-text-opacity));
2063
+ color: #ffe8f4;
2064
+ color: var(--aquarium-colors-primary-5, #ffe8f4);
2058
2065
  }
2059
2066
  .text-primary-0 {
2060
- --tw-text-opacity: 1;
2061
- color: rgb(255 249 252 / var(--tw-text-opacity));
2067
+ color: #fff9fc;
2068
+ color: var(--aquarium-colors-primary-0, #fff9fc);
2062
2069
  }
2063
2070
  .text-grey-20 {
2064
- --tw-text-opacity: 1;
2065
- color: rgb(210 210 214 / var(--tw-text-opacity));
2071
+ color: #d2d2d6;
2072
+ color: var(--aquarium-colors-grey-20, #d2d2d6);
2066
2073
  }
2067
2074
  .text-transparent {
2068
2075
  color: transparent;
2076
+ color: var(--aquarium-colors-transparent, transparent);
2069
2077
  }
2070
2078
  .text-white {
2071
- --tw-text-opacity: 1;
2072
- color: rgb(255 255 255 / var(--tw-text-opacity));
2079
+ color: white;
2080
+ color: var(--aquarium-colors-white, white);
2073
2081
  }
2074
2082
  .no-underline {
2075
2083
  -webkit-text-decoration-line: none;
@@ -2082,20 +2090,20 @@ input[type='number'].no-arrows {
2082
2090
  opacity: 0.4;
2083
2091
  }
2084
2092
  .shadow-16dp {
2085
- --tw-shadow: 0px 16px 32px rgba(90, 91, 106, 0.12), 0px 8px 16px rgba(58, 58, 68, 0.12);
2086
- --tw-shadow-colored: 0px 16px 32px var(--tw-shadow-color), 0px 8px 16px var(--tw-shadow-color);
2093
+ --tw-shadow: var(--aquarium-box-shadow-16dp, 0px 16px 32px rgba(90, 91, 106, 0.12), 0px 8px 16px rgba(58, 58, 68, 0.12));
2094
+ --tw-shadow-colored: 0px 16px 32px 0px var(--tw-shadow-color);
2087
2095
  box-shadow: 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0), var(--tw-shadow);
2088
2096
  box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0,0,0,0)), var(--tw-ring-shadow, 0 0 rgba(0,0,0,0)), var(--tw-shadow);
2089
2097
  }
2090
2098
  .shadow-4dp {
2091
- --tw-shadow: 0px 4px 8px rgba(90, 91, 106, 0.20), 0px 2px 4px rgba(58, 58, 68, 0.20);
2092
- --tw-shadow-colored: 0px 4px 8px var(--tw-shadow-color), 0px 2px 4px var(--tw-shadow-color);
2099
+ --tw-shadow: var(--aquarium-box-shadow-4dp, 0px 4px 8px rgba(90, 91, 106, 0.20), 0px 2px 4px rgba(58, 58, 68, 0.20));
2100
+ --tw-shadow-colored: 0px 4px 8px 0px var(--tw-shadow-color);
2093
2101
  box-shadow: 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0), var(--tw-shadow);
2094
2102
  box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0,0,0,0)), var(--tw-ring-shadow, 0 0 rgba(0,0,0,0)), var(--tw-shadow);
2095
2103
  }
2096
2104
  .shadow-2dp {
2097
- --tw-shadow: 0px 2px 4px rgba(90, 91, 106, 0.24), 0px 1px 2px rgba(58, 58, 68, 0.24);
2098
- --tw-shadow-colored: 0px 2px 4px var(--tw-shadow-color), 0px 1px 2px var(--tw-shadow-color);
2105
+ --tw-shadow: var(--aquarium-box-shadow-2dp, 0px 2px 4px rgba(90, 91, 106, 0.24), 0px 1px 2px rgba(58, 58, 68, 0.24));
2106
+ --tw-shadow-colored: 0px 2px 4px 0px var(--tw-shadow-color);
2099
2107
  box-shadow: 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0), var(--tw-shadow);
2100
2108
  box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0,0,0,0)), var(--tw-ring-shadow, 0 0 rgba(0,0,0,0)), var(--tw-shadow);
2101
2109
  }
@@ -2125,8 +2133,7 @@ input[type='number'].no-arrows {
2125
2133
  --tw-ring-inset: inset;
2126
2134
  }
2127
2135
  .ring-grey-30 {
2128
- --tw-ring-opacity: 1;
2129
- --tw-ring-color: rgb(180 180 187 / var(--tw-ring-opacity));
2136
+ --tw-ring-color: var(--aquarium-colors-grey-30, #b4b4bb);
2130
2137
  }
2131
2138
  .ring-offset-0 {
2132
2139
  --tw-ring-offset-width: 0px;
@@ -2203,12 +2210,12 @@ input[type='number'].no-arrows {
2203
2210
  display: none;
2204
2211
  }
2205
2212
  .placeholder\:text-grey-40::-moz-placeholder {
2206
- --tw-text-opacity: 1;
2207
- color: rgb(150 150 160 / var(--tw-text-opacity));
2213
+ color: #9696a0;
2214
+ color: var(--aquarium-colors-grey-40, #9696a0);
2208
2215
  }
2209
2216
  .placeholder\:text-grey-40::placeholder {
2210
- --tw-text-opacity: 1;
2211
- color: rgb(150 150 160 / var(--tw-text-opacity));
2217
+ color: #9696a0;
2218
+ color: var(--aquarium-colors-grey-40, #9696a0);
2212
2219
  }
2213
2220
  .before\:content-\[\'_\'\]::before {
2214
2221
  --tw-content: ' ';
@@ -2218,7 +2225,8 @@ input[type='number'].no-arrows {
2218
2225
  margin-top: 0;
2219
2226
  }
2220
2227
  .visited\:text-primary-80:visited {
2221
- color: rgb(228, 26, 74 );
2228
+ color: #e41a4a;
2229
+ color: var(--aquarium-colors-primary-80, #e41a4a);
2222
2230
  }
2223
2231
  .checked\:border-navyBlue-100:checked {
2224
2232
  --tw-border-opacity: 1;
@@ -2235,7 +2243,7 @@ input[type='number'].no-arrows {
2235
2243
  opacity: 0.4;
2236
2244
  }
2237
2245
  .checked\:shadow-whiteInset:checked {
2238
- --tw-shadow: inset 0 0 0 3px rgba(255,255,255,1);
2246
+ --tw-shadow: var(--aquarium-box-shadow-whiteInset, inset 0 0 0 3px rgba(255,255,255,1));
2239
2247
  --tw-shadow-colored: inset 0 0 0 3px var(--tw-shadow-color);
2240
2248
  box-shadow: 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0), var(--tw-shadow);
2241
2249
  box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0,0,0,0)), var(--tw-ring-shadow, 0 0 rgba(0,0,0,0)), var(--tw-shadow);
@@ -2244,56 +2252,55 @@ input[type='number'].no-arrows {
2244
2252
  cursor: pointer;
2245
2253
  }
2246
2254
  .hover\:border-grey-50:hover {
2247
- --tw-border-opacity: 1;
2248
- border-color: rgb(120 120 133 / var(--tw-border-opacity));
2255
+ border-color: #787885;
2256
+ border-color: var(--aquarium-colors-grey-50, #787885);
2249
2257
  }
2250
2258
  .hover\:border-grey-20:hover {
2251
- --tw-border-opacity: 1;
2252
- border-color: rgb(210 210 214 / var(--tw-border-opacity));
2259
+ border-color: #d2d2d6;
2260
+ border-color: var(--aquarium-colors-grey-20, #d2d2d6);
2253
2261
  }
2254
2262
  .hover\:bg-grey-0:hover {
2255
- --tw-bg-opacity: 1;
2256
- background-color: rgb(247 247 250 / var(--tw-bg-opacity));
2263
+ background-color: #f7f7fa;
2264
+ background-color: var(--aquarium-colors-grey-0, #f7f7fa);
2257
2265
  }
2258
2266
  .hover\:bg-grey-5:hover {
2259
- --tw-bg-opacity: 1;
2260
- background-color: rgb(237 237 240 / var(--tw-bg-opacity));
2267
+ background-color: #ededf0;
2268
+ background-color: var(--aquarium-colors-grey-5, #ededf0);
2261
2269
  }
2262
2270
  .hover\:bg-grey-30:hover {
2263
- --tw-bg-opacity: 1;
2264
- background-color: rgb(180 180 187 / var(--tw-bg-opacity));
2271
+ background-color: #b4b4bb;
2272
+ background-color: var(--aquarium-colors-grey-30, #b4b4bb);
2265
2273
  }
2266
2274
  .hover\:bg-primary-70:hover {
2267
- --tw-bg-opacity: 1;
2268
- background-color: rgb(255 53 84 / var(--tw-bg-opacity));
2275
+ background-color: #ff3554;
2276
+ background-color: var(--aquarium-colors-primary-70, #ff3554);
2269
2277
  }
2270
2278
  .hover\:bg-error-10:hover {
2271
- --tw-bg-opacity: 1;
2272
- background-color: rgb(255 203 210 / var(--tw-bg-opacity));
2279
+ background-color: #ffcbd2;
2280
+ background-color: var(--aquarium-colors-error-10, #ffcbd2);
2273
2281
  }
2274
2282
  .hover\:bg-grey-10:hover {
2275
- --tw-bg-opacity: 1;
2276
- background-color: rgb(225 225 227 / var(--tw-bg-opacity));
2283
+ background-color: #e1e1e3;
2284
+ background-color: var(--aquarium-colors-grey-10, #e1e1e3);
2277
2285
  }
2278
2286
  .hover\:text-primary-70:hover {
2279
- --tw-text-opacity: 1;
2280
- color: rgb(255 53 84 / var(--tw-text-opacity));
2287
+ color: #ff3554;
2288
+ color: var(--aquarium-colors-primary-70, #ff3554);
2281
2289
  }
2282
2290
  .hover\:text-grey-80:hover {
2283
- --tw-text-opacity: 1;
2284
- color: rgb(58 58 68 / var(--tw-text-opacity));
2291
+ color: #3a3a44;
2292
+ color: var(--aquarium-colors-grey-80, #3a3a44);
2285
2293
  }
2286
2294
  .hover\:text-grey-90:hover {
2287
- --tw-text-opacity: 1;
2288
- color: rgb(41 42 49 / var(--tw-text-opacity));
2295
+ color: #292a31;
2296
+ color: var(--aquarium-colors-grey-90, #292a31);
2289
2297
  }
2290
2298
  .hover\:text-primary-80:hover {
2291
- --tw-text-opacity: 1;
2292
- color: rgb(228 26 74 / var(--tw-text-opacity));
2299
+ color: #e41a4a;
2300
+ color: var(--aquarium-colors-primary-80, #e41a4a);
2293
2301
  }
2294
2302
  .hover\:ring-grey-50:hover {
2295
- --tw-ring-opacity: 1;
2296
- --tw-ring-color: rgb(120 120 133 / var(--tw-ring-opacity));
2303
+ --tw-ring-color: var(--aquarium-colors-grey-50, #787885);
2297
2304
  }
2298
2305
  .hover\:checked\:bg-navyBlue-100:checked:hover {
2299
2306
  --tw-bg-opacity: 1;
@@ -2303,23 +2310,24 @@ input[type='number'].no-arrows {
2303
2310
  border-width: 1px;
2304
2311
  }
2305
2312
  .focus\:border-info-70:focus {
2306
- --tw-border-opacity: 1;
2307
- border-color: rgb(3 153 227 / var(--tw-border-opacity));
2313
+ border-color: #0399e3;
2314
+ border-color: var(--aquarium-colors-info-70, #0399e3);
2308
2315
  }
2309
2316
  .focus\:border-transparent:focus {
2310
2317
  border-color: transparent;
2318
+ border-color: var(--aquarium-colors-transparent, transparent);
2311
2319
  }
2312
2320
  .focus\:bg-error-20:focus {
2313
- --tw-bg-opacity: 1;
2314
- background-color: rgb(255 173 179 / var(--tw-bg-opacity));
2321
+ background-color: #ffadb3;
2322
+ background-color: var(--aquarium-colors-error-20, #ffadb3);
2315
2323
  }
2316
2324
  .focus\:bg-grey-20:focus {
2317
- --tw-bg-opacity: 1;
2318
- background-color: rgb(210 210 214 / var(--tw-bg-opacity));
2325
+ background-color: #d2d2d6;
2326
+ background-color: var(--aquarium-colors-grey-20, #d2d2d6);
2319
2327
  }
2320
2328
  .focus\:text-primary-80:focus {
2321
- --tw-text-opacity: 1;
2322
- color: rgb(228 26 74 / var(--tw-text-opacity));
2329
+ color: #e41a4a;
2330
+ color: var(--aquarium-colors-primary-80, #e41a4a);
2323
2331
  }
2324
2332
  .focus\:outline-none:focus {
2325
2333
  outline: 2px solid transparent;
@@ -2344,43 +2352,42 @@ input[type='number'].no-arrows {
2344
2352
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 rgba(0,0,0,0));
2345
2353
  }
2346
2354
  .focus\:ring-grey-60:focus {
2347
- --tw-ring-opacity: 1;
2348
- --tw-ring-color: rgb(90 91 106 / var(--tw-ring-opacity));
2355
+ --tw-ring-color: var(--aquarium-colors-grey-60, #5a5b6a);
2349
2356
  }
2350
2357
  .focus\:ring-offset-0:focus {
2351
2358
  --tw-ring-offset-width: 0px;
2352
2359
  }
2353
2360
  .focus-visible\:border-info-70.focus-visible {
2354
- --tw-border-opacity: 1;
2355
- border-color: rgb(3 153 227 / var(--tw-border-opacity));
2361
+ border-color: #0399e3;
2362
+ border-color: var(--aquarium-colors-info-70, #0399e3);
2356
2363
  }
2357
2364
  .focus-visible\:border-info-70:focus-visible {
2358
- --tw-border-opacity: 1;
2359
- border-color: rgb(3 153 227 / var(--tw-border-opacity));
2365
+ border-color: #0399e3;
2366
+ border-color: var(--aquarium-colors-info-70, #0399e3);
2360
2367
  }
2361
2368
  .focus-visible\:bg-grey-0.focus-visible {
2362
- --tw-bg-opacity: 1;
2363
- background-color: rgb(247 247 250 / var(--tw-bg-opacity));
2369
+ background-color: #f7f7fa;
2370
+ background-color: var(--aquarium-colors-grey-0, #f7f7fa);
2364
2371
  }
2365
2372
  .focus-visible\:bg-grey-0:focus-visible {
2366
- --tw-bg-opacity: 1;
2367
- background-color: rgb(247 247 250 / var(--tw-bg-opacity));
2373
+ background-color: #f7f7fa;
2374
+ background-color: var(--aquarium-colors-grey-0, #f7f7fa);
2368
2375
  }
2369
2376
  .focus-visible\:text-grey-90.focus-visible {
2370
- --tw-text-opacity: 1;
2371
- color: rgb(41 42 49 / var(--tw-text-opacity));
2377
+ color: #292a31;
2378
+ color: var(--aquarium-colors-grey-90, #292a31);
2372
2379
  }
2373
2380
  .focus-visible\:text-grey-90:focus-visible {
2374
- --tw-text-opacity: 1;
2375
- color: rgb(41 42 49 / var(--tw-text-opacity));
2381
+ color: #292a31;
2382
+ color: var(--aquarium-colors-grey-90, #292a31);
2376
2383
  }
2377
2384
  .focus-visible\:text-grey-80.focus-visible {
2378
- --tw-text-opacity: 1;
2379
- color: rgb(58 58 68 / var(--tw-text-opacity));
2385
+ color: #3a3a44;
2386
+ color: var(--aquarium-colors-grey-80, #3a3a44);
2380
2387
  }
2381
2388
  .focus-visible\:text-grey-80:focus-visible {
2382
- --tw-text-opacity: 1;
2383
- color: rgb(58 58 68 / var(--tw-text-opacity));
2389
+ color: #3a3a44;
2390
+ color: var(--aquarium-colors-grey-80, #3a3a44);
2384
2391
  }
2385
2392
  .focus-visible\:outline-0.focus-visible {
2386
2393
  outline-width: 0px;
@@ -2419,59 +2426,54 @@ input[type='number'].no-arrows {
2419
2426
  --tw-ring-inset: inset;
2420
2427
  }
2421
2428
  .focus-visible\:ring-primary-100.focus-visible {
2422
- --tw-ring-opacity: 1;
2423
- --tw-ring-color: rgb(167 0 69 / var(--tw-ring-opacity));
2429
+ --tw-ring-color: var(--aquarium-colors-primary-100, #a70045);
2424
2430
  }
2425
2431
  .focus-visible\:ring-primary-100:focus-visible {
2426
- --tw-ring-opacity: 1;
2427
- --tw-ring-color: rgb(167 0 69 / var(--tw-ring-opacity));
2432
+ --tw-ring-color: var(--aquarium-colors-primary-100, #a70045);
2428
2433
  }
2429
2434
  .focus-visible\:ring-grey-50.focus-visible {
2430
- --tw-ring-opacity: 1;
2431
- --tw-ring-color: rgb(120 120 133 / var(--tw-ring-opacity));
2435
+ --tw-ring-color: var(--aquarium-colors-grey-50, #787885);
2432
2436
  }
2433
2437
  .focus-visible\:ring-grey-50:focus-visible {
2434
- --tw-ring-opacity: 1;
2435
- --tw-ring-color: rgb(120 120 133 / var(--tw-ring-opacity));
2438
+ --tw-ring-color: var(--aquarium-colors-grey-50, #787885);
2436
2439
  }
2437
2440
  .focus-visible\:ring-info-70.focus-visible {
2438
- --tw-ring-opacity: 1;
2439
- --tw-ring-color: rgb(3 153 227 / var(--tw-ring-opacity));
2441
+ --tw-ring-color: var(--aquarium-colors-info-70, #0399e3);
2440
2442
  }
2441
2443
  .focus-visible\:ring-info-70:focus-visible {
2442
- --tw-ring-opacity: 1;
2443
- --tw-ring-color: rgb(3 153 227 / var(--tw-ring-opacity));
2444
+ --tw-ring-color: var(--aquarium-colors-info-70, #0399e3);
2444
2445
  }
2445
2446
  .active\:bg-grey-5:active {
2446
- --tw-bg-opacity: 1;
2447
- background-color: rgb(237 237 240 / var(--tw-bg-opacity));
2447
+ background-color: #ededf0;
2448
+ background-color: var(--aquarium-colors-grey-5, #ededf0);
2448
2449
  }
2449
2450
  .active\:bg-primary-90:active {
2450
- --tw-bg-opacity: 1;
2451
- background-color: rgb(198 4 67 / var(--tw-bg-opacity));
2451
+ background-color: #c60443;
2452
+ background-color: var(--aquarium-colors-primary-90, #c60443);
2452
2453
  }
2453
2454
  .active\:bg-transparent:active {
2454
2455
  background-color: transparent;
2456
+ background-color: var(--aquarium-colors-transparent, transparent);
2455
2457
  }
2456
2458
  .active\:bg-grey-10:active {
2457
- --tw-bg-opacity: 1;
2458
- background-color: rgb(225 225 227 / var(--tw-bg-opacity));
2459
+ background-color: #e1e1e3;
2460
+ background-color: var(--aquarium-colors-grey-10, #e1e1e3);
2459
2461
  }
2460
2462
  .active\:text-primary-70:active {
2461
- --tw-text-opacity: 1;
2462
- color: rgb(255 53 84 / var(--tw-text-opacity));
2463
+ color: #ff3554;
2464
+ color: var(--aquarium-colors-primary-70, #ff3554);
2463
2465
  }
2464
2466
  .active\:text-grey-80:active {
2465
- --tw-text-opacity: 1;
2466
- color: rgb(58 58 68 / var(--tw-text-opacity));
2467
+ color: #3a3a44;
2468
+ color: var(--aquarium-colors-grey-80, #3a3a44);
2467
2469
  }
2468
2470
  .active\:text-grey-50:active {
2469
- --tw-text-opacity: 1;
2470
- color: rgb(120 120 133 / var(--tw-text-opacity));
2471
+ color: #787885;
2472
+ color: var(--aquarium-colors-grey-50, #787885);
2471
2473
  }
2472
2474
  .active\:text-grey-70:active {
2473
- --tw-text-opacity: 1;
2474
- color: rgb(74 75 87 / var(--tw-text-opacity));
2475
+ color: #4a4b57;
2476
+ color: var(--aquarium-colors-grey-70, #4a4b57);
2475
2477
  }
2476
2478
  .active\:ring-0:active {
2477
2479
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
@@ -2480,50 +2482,49 @@ input[type='number'].no-arrows {
2480
2482
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 rgba(0,0,0,0));
2481
2483
  }
2482
2484
  .active\:ring-grey-50:active {
2483
- --tw-ring-opacity: 1;
2484
- --tw-ring-color: rgb(120 120 133 / var(--tw-ring-opacity));
2485
+ --tw-ring-color: var(--aquarium-colors-grey-50, #787885);
2485
2486
  }
2486
2487
  .disabled\:cursor-not-allowed:disabled {
2487
2488
  cursor: not-allowed;
2488
2489
  }
2489
2490
  .disabled\:border-grey-20:disabled {
2490
- --tw-border-opacity: 1;
2491
- border-color: rgb(210 210 214 / var(--tw-border-opacity));
2491
+ border-color: #d2d2d6;
2492
+ border-color: var(--aquarium-colors-grey-20, #d2d2d6);
2492
2493
  }
2493
2494
  .disabled\:bg-grey-5:disabled {
2494
- --tw-bg-opacity: 1;
2495
- background-color: rgb(237 237 240 / var(--tw-bg-opacity));
2495
+ background-color: #ededf0;
2496
+ background-color: var(--aquarium-colors-grey-5, #ededf0);
2496
2497
  }
2497
2498
  .disabled\:bg-primary-5:disabled {
2498
- --tw-bg-opacity: 1;
2499
- background-color: rgb(255 232 244 / var(--tw-bg-opacity));
2499
+ background-color: #ffe8f4;
2500
+ background-color: var(--aquarium-colors-primary-5, #ffe8f4);
2500
2501
  }
2501
2502
  .disabled\:bg-grey-0:disabled {
2502
- --tw-bg-opacity: 1;
2503
- background-color: rgb(247 247 250 / var(--tw-bg-opacity));
2503
+ background-color: #f7f7fa;
2504
+ background-color: var(--aquarium-colors-grey-0, #f7f7fa);
2504
2505
  }
2505
2506
  .disabled\:bg-transparent:disabled {
2506
2507
  background-color: transparent;
2508
+ background-color: var(--aquarium-colors-transparent, transparent);
2507
2509
  }
2508
2510
  .disabled\:text-grey-40:disabled {
2509
- --tw-text-opacity: 1;
2510
- color: rgb(150 150 160 / var(--tw-text-opacity));
2511
+ color: #9696a0;
2512
+ color: var(--aquarium-colors-grey-40, #9696a0);
2511
2513
  }
2512
2514
  .disabled\:text-primary-40:disabled {
2513
- --tw-text-opacity: 1;
2514
- color: rgb(255 141 176 / var(--tw-text-opacity));
2515
+ color: #ff8db0;
2516
+ color: var(--aquarium-colors-primary-40, #ff8db0);
2515
2517
  }
2516
2518
  .disabled\:text-grey-30:disabled {
2517
- --tw-text-opacity: 1;
2518
- color: rgb(180 180 187 / var(--tw-text-opacity));
2519
+ color: #b4b4bb;
2520
+ color: var(--aquarium-colors-grey-30, #b4b4bb);
2519
2521
  }
2520
2522
  .disabled\:text-grey-20:disabled {
2521
- --tw-text-opacity: 1;
2522
- color: rgb(210 210 214 / var(--tw-text-opacity));
2523
+ color: #d2d2d6;
2524
+ color: var(--aquarium-colors-grey-20, #d2d2d6);
2523
2525
  }
2524
2526
  .disabled\:ring-grey-20:disabled {
2525
- --tw-ring-opacity: 1;
2526
- --tw-ring-color: rgb(210 210 214 / var(--tw-ring-opacity));
2527
+ --tw-ring-color: var(--aquarium-colors-grey-20, #d2d2d6);
2527
2528
  }
2528
2529
  .group:last-child .group-last\:border-b-0 {
2529
2530
  border-bottom-width: 0px;
@@ -2532,8 +2533,8 @@ input[type='number'].no-arrows {
2532
2533
  visibility: visible;
2533
2534
  }
2534
2535
  .group:hover .group-hover\:bg-grey-0 {
2535
- --tw-bg-opacity: 1;
2536
- background-color: rgb(247 247 250 / var(--tw-bg-opacity));
2536
+ background-color: #f7f7fa;
2537
+ background-color: var(--aquarium-colors-grey-0, #f7f7fa);
2537
2538
  }
2538
2539
  .peer\/switch:checked~.peer-checked\/switch\:left-1 {
2539
2540
  left: 2px;
@@ -2547,54 +2548,57 @@ input[type='number'].no-arrows {
2547
2548
  border-color: rgb(48 55 94 / var(--tw-border-opacity));
2548
2549
  }
2549
2550
  .peer:checked~.peer-checked\:text-white {
2550
- --tw-text-opacity: 1;
2551
- color: rgb(255 255 255 / var(--tw-text-opacity));
2551
+ color: white;
2552
+ color: var(--aquarium-colors-white, white);
2552
2553
  }
2553
2554
  .peer:checked~.peer-checked\:text-grey-30 {
2554
- --tw-text-opacity: 1;
2555
- color: rgb(180 180 187 / var(--tw-text-opacity));
2555
+ color: #b4b4bb;
2556
+ color: var(--aquarium-colors-grey-30, #b4b4bb);
2556
2557
  }
2557
2558
  .peer:hover~.peer-hover\:border-grey-50 {
2558
- --tw-border-opacity: 1;
2559
- border-color: rgb(120 120 133 / var(--tw-border-opacity));
2559
+ border-color: #787885;
2560
+ border-color: var(--aquarium-colors-grey-50, #787885);
2560
2561
  }
2561
2562
  .peer:focus~.peer-focus\:border-info-70 {
2562
- --tw-border-opacity: 1;
2563
- border-color: rgb(3 153 227 / var(--tw-border-opacity));
2563
+ border-color: #0399e3;
2564
+ border-color: var(--aquarium-colors-info-70, #0399e3);
2564
2565
  }
2565
2566
  .peer\/switch:disabled~.peer-disabled\/switch\:bg-grey-0 {
2566
- --tw-bg-opacity: 1;
2567
- background-color: rgb(247 247 250 / var(--tw-bg-opacity));
2567
+ background-color: #f7f7fa;
2568
+ background-color: var(--aquarium-colors-grey-0, #f7f7fa);
2568
2569
  }
2569
2570
  .children\:inline-block>* {
2570
2571
  display: inline-block;
2571
2572
  }
2572
2573
  .children\:border-grey-10>* {
2573
- --tw-border-opacity: 1;
2574
- border-color: rgb(225 225 227 / var(--tw-border-opacity));
2574
+ border-color: #e1e1e3;
2575
+ border-color: var(--aquarium-colors-grey-10, #e1e1e3);
2575
2576
  }
2576
2577
  .children\:last\:border-b-0:last-child>* {
2577
2578
  border-bottom-width: 0px;
2578
2579
  }
2579
2580
  .\[\&\>path\]\:stroke-transparent>path {
2580
2581
  stroke: transparent;
2582
+ stroke: var(--aquarium-colors-transparent, transparent);
2581
2583
  }
2582
2584
  .peer:checked~.peer-checked\:\[\&\>path\]\:stroke-white>path {
2583
2585
  stroke: white;
2586
+ stroke: var(--aquarium-colors-white, white);
2584
2587
  }
2585
2588
  .peer:checked~.peer-checked\:\[\&\>path\]\:stroke-grey-30>path {
2586
2589
  stroke: #b4b4bb;
2590
+ stroke: var(--aquarium-colors-grey-30, #b4b4bb);
2587
2591
  }
2588
2592
  .\[\&\>button\]\:p-0>button {
2589
2593
  padding: 0;
2590
2594
  }
2591
2595
  .\[\&\>button\]\:text-grey-50>button {
2592
- --tw-text-opacity: 1;
2593
- color: rgb(120 120 133 / var(--tw-text-opacity));
2596
+ color: #787885;
2597
+ color: var(--aquarium-colors-grey-50, #787885);
2594
2598
  }
2595
2599
  .\[\&\>button\]\:text-error-20>button {
2596
- --tw-text-opacity: 1;
2597
- color: rgb(255 173 179 / var(--tw-text-opacity));
2600
+ color: #ffadb3;
2601
+ color: var(--aquarium-colors-error-20, #ffadb3);
2598
2602
  }
2599
2603
  .\[\&\>\*\:not\(\:first-child\)\]\:-ml-3>*:not(:first-child) {
2600
2604
  margin-left: -8px;