@npm_leadtech/legal-lib-components 4.1.20 → 4.1.21

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.
@@ -1421,6 +1421,807 @@ html[data-theme=lawdistrict] .e-button.--primary-3 {
1421
1421
  .e-checkbox .tooltip-form {
1422
1422
  margin-top: 0;
1423
1423
  }
1424
+ .e-datepicker {
1425
+ max-width: 55%;
1426
+ width: 100%;
1427
+ display: flex;
1428
+ flex-flow: column-reverse;
1429
+ margin-bottom: 2rem;
1430
+ }
1431
+ .e-datepicker__inner {
1432
+ margin-bottom: 0.5rem;
1433
+ }
1434
+ .e-datepicker__label {
1435
+ font-weight: bold;
1436
+ }
1437
+ .e-datepicker ul li {
1438
+ margin: 0;
1439
+ }
1440
+ .e-datepicker ul li::before {
1441
+ background-color: transparent;
1442
+ }
1443
+ .e-datepicker .react-datepicker {
1444
+ border: 0.5px solid var(--neutral-neutral-4);
1445
+ }
1446
+ .e-datepicker .react-datepicker__input-container input {
1447
+ color: var(--neutral-main);
1448
+ border-radius: 4px;
1449
+ font-size: 1rem;
1450
+ background-color: var(--neutral-neutral-4);
1451
+ height: 40px;
1452
+ width: 100%;
1453
+ padding: 0.75rem 0 0.75rem 0.75rem;
1454
+ background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIHdpZHRoPSIyNHB4IiBoZWlnaHQ9IjI0cHgiIHZpZXdCb3g9IjAgMCAyNCAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj48IS0tR2VuZXJhdG9yOiBza2V0Y2h0b29sIDYwICgxMDEwMTApIC0gaHR0cHM6Ly9za2V0Y2guY29tLS0+PHRpdGxlPjNEODAzNjU0LUI3NjEtNEZEQy05MThDLTc1QzUwMjdEODcyMDwvdGl0bGU+PGRlc2M+Q3JlYXRlZCB3aXRoIHNrZXRjaHRvb2wuPC9kZXNjPjxkZWZzPjxwYXRoIGQ9Ik0yMiwzIEwxOSwzIEwxOSwxIEwxNywxIEwxNywzIEw3LDMgTDcsMSBMNSwxIEw1LDMgTDIsMyBMMiwyMyBMMjIsMjMgTDIyLDMgWiBNMjAsMjEgTDQsMjEgTDQsOCBMMjAsOCBMMjAsMjEgWiIgaWQ9InBhdGgtMSIvPjwvZGVmcz48ZyBpZD0iQXNzZXQtQXJ0Ym9hcmQtUGFnZSIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+PGcgaWQ9Imljb24vbmF2aWdhdGlvbi9leHBhbmRfbW9yZV8yNHB4LWljb24vYWN0aW9uL2NhbGVuZGFyX3RvZGF5XzI0cHgiPjxtYXNrIGlkPSJtYXNrLTIiIGZpbGw9IndoaXRlIj48dXNlIHhsaW5rOmhyZWY9IiNwYXRoLTEiLz48L21hc2s+PGcgaWQ9Imljb24vYWN0aW9uL2NhbGVuZGFyX3RvZGF5XzI0cHgiIGZpbGwtcnVsZT0ibm9uemVybyIvPjxnIGlkPSLihrMtQ29sb3ItY29sb3ItLy1JY29ucy0vLUJsYWNrLS8tSW5hY3RpdmUiIG1hc2s9InVybCgjbWFzay0yKSIgZmlsbD0iIzQzNDM0MyI+PHJlY3QgaWQ9IlJlY3RhbmdsZSIgeD0iMCIgeT0iMCIgd2lkdGg9IjI0IiBoZWlnaHQ9IjI0Ii8+PC9nPjwvZz48L2c+PC9zdmc+);
1455
+ background-position: 95% 50%;
1456
+ background-repeat: no-repeat;
1457
+ transition: box-shadow 0.3s ease;
1458
+ box-shadow: 0 0 0 0 var(--primary-main-light-4);
1459
+ margin: 0.0005em;
1460
+ border: none;
1461
+ }
1462
+ .e-datepicker .react-datepicker__input-container input:focus {
1463
+ outline: none;
1464
+ box-shadow: 0 0 0 2px var(--primary-main-light-1);
1465
+ }
1466
+ .e-datepicker .react-datepicker__day {
1467
+ font-size: 14px;
1468
+ text-align: center;
1469
+ border: 0.5px solid var(--neutral-neutral-4);
1470
+ width: 39px;
1471
+ height: 38px;
1472
+ border-collapse: collapse;
1473
+ vertical-align: middle;
1474
+ display: table-cell;
1475
+ line-height: 1.7rem;
1476
+ }
1477
+ .e-datepicker .react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::after {
1478
+ border-bottom-color: var(--others-white);
1479
+ }
1480
+ .e-datepicker .react-datepicker__day--selected {
1481
+ background-color: var(--primary-main-light-2);
1482
+ border: 1px double var(--primary-main-light-2);
1483
+ }
1484
+ .e-datepicker .react-datepicker__day--selected:hover {
1485
+ background-color: var(--primary-main-light-2);
1486
+ }
1487
+ .e-datepicker .react-datepicker__day--keyboard-selected {
1488
+ background-color: inherit;
1489
+ color: inherit;
1490
+ }
1491
+ .e-datepicker .react-datepicker__day--keyboard-selected:hover {
1492
+ border-radius: 0.3rem;
1493
+ background-color: #f0f0f0;
1494
+ }
1495
+ .e-datepicker .react-datepicker__month-container {
1496
+ padding: 0 15px 15px;
1497
+ }
1498
+ .e-datepicker .react-datepicker__month {
1499
+ margin: 0;
1500
+ }
1501
+ .e-datepicker .react-datepicker__header {
1502
+ background-color: inherit;
1503
+ border: none;
1504
+ }
1505
+ .e-datepicker .react-datepicker__header button {
1506
+ border: 0.5px solid var(--neutral-neutral-4);
1507
+ }
1508
+ .e-datepicker .react-datepicker__header select {
1509
+ -webkit-appearance: menulist-button;
1510
+ background-color: var(--others-white);
1511
+ }
1512
+ .e-datepicker .react-datepicker__day-name {
1513
+ width: 33px;
1514
+ }
1515
+ .e-datepicker .react-datepicker__day--outside-month {
1516
+ color: var(--neutral-neutral-3);
1517
+ pointer-events: none;
1518
+ }
1519
+ .react-datepicker__year-read-view--down-arrow,
1520
+ .react-datepicker__month-read-view--down-arrow,
1521
+ .react-datepicker__month-year-read-view--down-arrow,
1522
+ .react-datepicker__navigation-icon::before {
1523
+ border-color: #ccc;
1524
+ border-style: solid;
1525
+ border-width: 3px 3px 0 0;
1526
+ content: "";
1527
+ display: block;
1528
+ height: 9px;
1529
+ position: absolute;
1530
+ top: 6px;
1531
+ width: 9px;
1532
+ }
1533
+ .react-datepicker-wrapper {
1534
+ display: inline-block;
1535
+ padding: 0;
1536
+ border: 0;
1537
+ }
1538
+ .react-datepicker {
1539
+ font-family:
1540
+ "Helvetica Neue",
1541
+ helvetica,
1542
+ arial,
1543
+ sans-serif;
1544
+ font-size: 0.8rem;
1545
+ background-color: #fff;
1546
+ color: #000;
1547
+ border: 1px solid #aeaeae;
1548
+ border-radius: 0.3rem;
1549
+ display: inline-block;
1550
+ position: relative;
1551
+ line-height: initial;
1552
+ }
1553
+ .react-datepicker--time-only .react-datepicker__time-container {
1554
+ border-left: 0;
1555
+ }
1556
+ .react-datepicker--time-only .react-datepicker__time,
1557
+ .react-datepicker--time-only .react-datepicker__time-box {
1558
+ border-bottom-left-radius: 0.3rem;
1559
+ border-bottom-right-radius: 0.3rem;
1560
+ }
1561
+ .react-datepicker-popper {
1562
+ z-index: 1;
1563
+ line-height: 0;
1564
+ }
1565
+ .react-datepicker-popper .react-datepicker__triangle {
1566
+ stroke: #aeaeae;
1567
+ }
1568
+ .react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle {
1569
+ fill: #f0f0f0;
1570
+ color: #f0f0f0;
1571
+ }
1572
+ .react-datepicker-popper[data-placement^=top] .react-datepicker__triangle {
1573
+ fill: #fff;
1574
+ color: #fff;
1575
+ }
1576
+ .react-datepicker__header {
1577
+ text-align: center;
1578
+ background-color: #f0f0f0;
1579
+ border-bottom: 1px solid #aeaeae;
1580
+ border-top-left-radius: 0.3rem;
1581
+ padding: 8px 0;
1582
+ position: relative;
1583
+ }
1584
+ .react-datepicker__header--time {
1585
+ padding-bottom: 8px;
1586
+ padding-left: 5px;
1587
+ padding-right: 5px;
1588
+ }
1589
+ .react-datepicker__header--time:not(.react-datepicker__header--time--only) {
1590
+ border-top-left-radius: 0;
1591
+ }
1592
+ .react-datepicker__header:not(.react-datepicker__header--has-time-select) {
1593
+ border-top-right-radius: 0.3rem;
1594
+ }
1595
+ .react-datepicker__year-dropdown-container--select,
1596
+ .react-datepicker__month-dropdown-container--select,
1597
+ .react-datepicker__month-year-dropdown-container--select,
1598
+ .react-datepicker__year-dropdown-container--scroll,
1599
+ .react-datepicker__month-dropdown-container--scroll,
1600
+ .react-datepicker__month-year-dropdown-container--scroll {
1601
+ display: inline-block;
1602
+ margin: 0 15px;
1603
+ }
1604
+ .react-datepicker__current-month,
1605
+ .react-datepicker-time__header,
1606
+ .react-datepicker-year-header {
1607
+ margin-top: 0;
1608
+ color: #000;
1609
+ font-weight: bold;
1610
+ font-size: 0.944rem;
1611
+ }
1612
+ h2.react-datepicker__current-month {
1613
+ padding: 0;
1614
+ margin: 0;
1615
+ }
1616
+ .react-datepicker-time__header {
1617
+ text-overflow: ellipsis;
1618
+ white-space: nowrap;
1619
+ overflow: hidden;
1620
+ }
1621
+ .react-datepicker__navigation {
1622
+ align-items: center;
1623
+ background: none;
1624
+ display: flex;
1625
+ justify-content: center;
1626
+ text-align: center;
1627
+ cursor: pointer;
1628
+ position: absolute;
1629
+ top: 2px;
1630
+ padding: 0;
1631
+ border: none;
1632
+ z-index: 1;
1633
+ height: 32px;
1634
+ width: 32px;
1635
+ text-indent: -999em;
1636
+ overflow: hidden;
1637
+ }
1638
+ .react-datepicker__navigation--previous {
1639
+ left: 2px;
1640
+ }
1641
+ .react-datepicker__navigation--next {
1642
+ right: 2px;
1643
+ }
1644
+ .react-datepicker__navigation--next--with-time:not(.react-datepicker__navigation--next--with-today-button) {
1645
+ right: 85px;
1646
+ }
1647
+ .react-datepicker__navigation--years {
1648
+ position: relative;
1649
+ top: 0;
1650
+ display: block;
1651
+ margin-left: auto;
1652
+ margin-right: auto;
1653
+ }
1654
+ .react-datepicker__navigation--years-previous {
1655
+ top: 4px;
1656
+ }
1657
+ .react-datepicker__navigation--years-upcoming {
1658
+ top: -4px;
1659
+ }
1660
+ .react-datepicker__navigation:hover *::before {
1661
+ border-color: #a6a6a6;
1662
+ }
1663
+ .react-datepicker__navigation-icon {
1664
+ position: relative;
1665
+ top: -1px;
1666
+ font-size: 20px;
1667
+ width: 0;
1668
+ }
1669
+ .react-datepicker__navigation-icon--next {
1670
+ left: -2px;
1671
+ }
1672
+ .react-datepicker__navigation-icon--next::before {
1673
+ transform: rotate(45deg);
1674
+ left: -7px;
1675
+ }
1676
+ .react-datepicker__navigation-icon--previous {
1677
+ right: -2px;
1678
+ }
1679
+ .react-datepicker__navigation-icon--previous::before {
1680
+ transform: rotate(225deg);
1681
+ right: -7px;
1682
+ }
1683
+ .react-datepicker__month-container {
1684
+ float: left;
1685
+ }
1686
+ .react-datepicker__year {
1687
+ margin: 0.4rem;
1688
+ text-align: center;
1689
+ }
1690
+ .react-datepicker__year-wrapper {
1691
+ display: flex;
1692
+ flex-wrap: wrap;
1693
+ max-width: 180px;
1694
+ }
1695
+ .react-datepicker__year .react-datepicker__year-text {
1696
+ display: inline-block;
1697
+ width: 4rem;
1698
+ margin: 2px;
1699
+ }
1700
+ .react-datepicker__month {
1701
+ margin: 0.4rem;
1702
+ text-align: center;
1703
+ }
1704
+ .react-datepicker__month .react-datepicker__month-text,
1705
+ .react-datepicker__month .react-datepicker__quarter-text {
1706
+ display: inline-block;
1707
+ width: 4rem;
1708
+ margin: 2px;
1709
+ }
1710
+ .react-datepicker__input-time-container {
1711
+ clear: both;
1712
+ width: 100%;
1713
+ float: left;
1714
+ margin: 5px 0 10px 15px;
1715
+ text-align: left;
1716
+ }
1717
+ .react-datepicker__input-time-container .react-datepicker-time__caption {
1718
+ display: inline-block;
1719
+ }
1720
+ .react-datepicker__input-time-container .react-datepicker-time__input-container {
1721
+ display: inline-block;
1722
+ }
1723
+ .react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input {
1724
+ display: inline-block;
1725
+ margin-left: 10px;
1726
+ }
1727
+ .react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input {
1728
+ width: auto;
1729
+ }
1730
+ .react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]::-webkit-inner-spin-button,
1731
+ .react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]::-webkit-outer-spin-button {
1732
+ -webkit-appearance: none;
1733
+ margin: 0;
1734
+ }
1735
+ .react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time] {
1736
+ -moz-appearance: textfield;
1737
+ }
1738
+ .react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__delimiter {
1739
+ margin-left: 5px;
1740
+ display: inline-block;
1741
+ }
1742
+ .react-datepicker__time-container {
1743
+ float: right;
1744
+ border-left: 1px solid #aeaeae;
1745
+ width: 85px;
1746
+ }
1747
+ .react-datepicker__time-container--with-today-button {
1748
+ display: inline;
1749
+ border: 1px solid #aeaeae;
1750
+ border-radius: 0.3rem;
1751
+ position: absolute;
1752
+ right: -87px;
1753
+ top: 0;
1754
+ }
1755
+ .react-datepicker__time-container .react-datepicker__time {
1756
+ position: relative;
1757
+ background: white;
1758
+ border-bottom-right-radius: 0.3rem;
1759
+ }
1760
+ .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box {
1761
+ width: 85px;
1762
+ overflow-x: hidden;
1763
+ margin: 0 auto;
1764
+ text-align: center;
1765
+ border-bottom-right-radius: 0.3rem;
1766
+ }
1767
+ .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list {
1768
+ list-style: none;
1769
+ margin: 0;
1770
+ height: calc(195px + 0.85rem);
1771
+ overflow-y: scroll;
1772
+ padding-right: 0;
1773
+ padding-left: 0;
1774
+ width: 100%;
1775
+ box-sizing: content-box;
1776
+ }
1777
+ .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item {
1778
+ height: 30px;
1779
+ padding: 5px 10px;
1780
+ white-space: nowrap;
1781
+ }
1782
+ .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item:hover {
1783
+ cursor: pointer;
1784
+ background-color: #f0f0f0;
1785
+ }
1786
+ .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected {
1787
+ background-color: #216ba5;
1788
+ color: white;
1789
+ font-weight: bold;
1790
+ }
1791
+ .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected:hover {
1792
+ background-color: #216ba5;
1793
+ }
1794
+ .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled {
1795
+ color: #ccc;
1796
+ }
1797
+ .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled:hover {
1798
+ cursor: default;
1799
+ background-color: transparent;
1800
+ }
1801
+ .react-datepicker__week-number {
1802
+ color: #ccc;
1803
+ display: inline-block;
1804
+ width: 1.7rem;
1805
+ line-height: 1.7rem;
1806
+ text-align: center;
1807
+ margin: 0.166rem;
1808
+ }
1809
+ .react-datepicker__week-number.react-datepicker__week-number--clickable {
1810
+ cursor: pointer;
1811
+ }
1812
+ .react-datepicker__week-number.react-datepicker__week-number--clickable:not(.react-datepicker__week-number--selected, .react-datepicker__week-number--keyboard-selected):hover {
1813
+ border-radius: 0.3rem;
1814
+ background-color: #f0f0f0;
1815
+ }
1816
+ .react-datepicker__week-number--selected {
1817
+ border-radius: 0.3rem;
1818
+ background-color: #216ba5;
1819
+ color: #fff;
1820
+ }
1821
+ .react-datepicker__week-number--selected:hover {
1822
+ background-color: #1d5d90;
1823
+ }
1824
+ .react-datepicker__week-number--keyboard-selected {
1825
+ border-radius: 0.3rem;
1826
+ background-color: #2a87d0;
1827
+ color: #fff;
1828
+ }
1829
+ .react-datepicker__week-number--keyboard-selected:hover {
1830
+ background-color: #1d5d90;
1831
+ }
1832
+ .react-datepicker__day-names {
1833
+ white-space: nowrap;
1834
+ margin-bottom: -8px;
1835
+ }
1836
+ .react-datepicker__week {
1837
+ white-space: nowrap;
1838
+ }
1839
+ .react-datepicker__day-name,
1840
+ .react-datepicker__day,
1841
+ .react-datepicker__time-name {
1842
+ color: #000;
1843
+ display: inline-block;
1844
+ width: 1.7rem;
1845
+ line-height: 1.7rem;
1846
+ text-align: center;
1847
+ margin: 0.166rem;
1848
+ }
1849
+ .react-datepicker__day,
1850
+ .react-datepicker__month-text,
1851
+ .react-datepicker__quarter-text,
1852
+ .react-datepicker__year-text {
1853
+ cursor: pointer;
1854
+ }
1855
+ .react-datepicker__day:not([aria-disabled=true]):hover,
1856
+ .react-datepicker__month-text:not([aria-disabled=true]):hover,
1857
+ .react-datepicker__quarter-text:not([aria-disabled=true]):hover,
1858
+ .react-datepicker__year-text:not([aria-disabled=true]):hover {
1859
+ border-radius: 0.3rem;
1860
+ background-color: #f0f0f0;
1861
+ }
1862
+ .react-datepicker__day--today,
1863
+ .react-datepicker__month-text--today,
1864
+ .react-datepicker__quarter-text--today,
1865
+ .react-datepicker__year-text--today {
1866
+ font-weight: bold;
1867
+ }
1868
+ .react-datepicker__day--highlighted,
1869
+ .react-datepicker__month-text--highlighted,
1870
+ .react-datepicker__quarter-text--highlighted,
1871
+ .react-datepicker__year-text--highlighted {
1872
+ border-radius: 0.3rem;
1873
+ background-color: #3dcc4a;
1874
+ color: #fff;
1875
+ }
1876
+ .react-datepicker__day--highlighted:not([aria-disabled=true]):hover,
1877
+ .react-datepicker__month-text--highlighted:not([aria-disabled=true]):hover,
1878
+ .react-datepicker__quarter-text--highlighted:not([aria-disabled=true]):hover,
1879
+ .react-datepicker__year-text--highlighted:not([aria-disabled=true]):hover {
1880
+ background-color: #32be3f;
1881
+ }
1882
+ .react-datepicker__day--highlighted-custom-1,
1883
+ .react-datepicker__month-text--highlighted-custom-1,
1884
+ .react-datepicker__quarter-text--highlighted-custom-1,
1885
+ .react-datepicker__year-text--highlighted-custom-1 {
1886
+ color: magenta;
1887
+ }
1888
+ .react-datepicker__day--highlighted-custom-2,
1889
+ .react-datepicker__month-text--highlighted-custom-2,
1890
+ .react-datepicker__quarter-text--highlighted-custom-2,
1891
+ .react-datepicker__year-text--highlighted-custom-2 {
1892
+ color: green;
1893
+ }
1894
+ .react-datepicker__day--holidays,
1895
+ .react-datepicker__month-text--holidays,
1896
+ .react-datepicker__quarter-text--holidays,
1897
+ .react-datepicker__year-text--holidays {
1898
+ position: relative;
1899
+ border-radius: 0.3rem;
1900
+ background-color: #ff6803;
1901
+ color: #fff;
1902
+ }
1903
+ .react-datepicker__day--holidays .overlay,
1904
+ .react-datepicker__month-text--holidays .overlay,
1905
+ .react-datepicker__quarter-text--holidays .overlay,
1906
+ .react-datepicker__year-text--holidays .overlay {
1907
+ position: absolute;
1908
+ bottom: 100%;
1909
+ left: 50%;
1910
+ transform: translateX(-50%);
1911
+ background-color: #333;
1912
+ color: #fff;
1913
+ padding: 4px;
1914
+ border-radius: 4px;
1915
+ white-space: nowrap;
1916
+ visibility: hidden;
1917
+ opacity: 0;
1918
+ transition: visibility 0s, opacity 0.3s ease-in-out;
1919
+ }
1920
+ .react-datepicker__day--holidays:not([aria-disabled=true]):hover,
1921
+ .react-datepicker__month-text--holidays:not([aria-disabled=true]):hover,
1922
+ .react-datepicker__quarter-text--holidays:not([aria-disabled=true]):hover,
1923
+ .react-datepicker__year-text--holidays:not([aria-disabled=true]):hover {
1924
+ background-color: #cf5300;
1925
+ }
1926
+ .react-datepicker__day--holidays:hover .overlay,
1927
+ .react-datepicker__month-text--holidays:hover .overlay,
1928
+ .react-datepicker__quarter-text--holidays:hover .overlay,
1929
+ .react-datepicker__year-text--holidays:hover .overlay {
1930
+ visibility: visible;
1931
+ opacity: 1;
1932
+ }
1933
+ .react-datepicker__day--selected,
1934
+ .react-datepicker__day--in-selecting-range,
1935
+ .react-datepicker__day--in-range,
1936
+ .react-datepicker__month-text--selected,
1937
+ .react-datepicker__month-text--in-selecting-range,
1938
+ .react-datepicker__month-text--in-range,
1939
+ .react-datepicker__quarter-text--selected,
1940
+ .react-datepicker__quarter-text--in-selecting-range,
1941
+ .react-datepicker__quarter-text--in-range,
1942
+ .react-datepicker__year-text--selected,
1943
+ .react-datepicker__year-text--in-selecting-range,
1944
+ .react-datepicker__year-text--in-range {
1945
+ border-radius: 0.3rem;
1946
+ background-color: #216ba5;
1947
+ color: #fff;
1948
+ }
1949
+ .react-datepicker__day--selected:not([aria-disabled=true]):hover,
1950
+ .react-datepicker__day--in-selecting-range:not([aria-disabled=true]):hover,
1951
+ .react-datepicker__day--in-range:not([aria-disabled=true]):hover,
1952
+ .react-datepicker__month-text--selected:not([aria-disabled=true]):hover,
1953
+ .react-datepicker__month-text--in-selecting-range:not([aria-disabled=true]):hover,
1954
+ .react-datepicker__month-text--in-range:not([aria-disabled=true]):hover,
1955
+ .react-datepicker__quarter-text--selected:not([aria-disabled=true]):hover,
1956
+ .react-datepicker__quarter-text--in-selecting-range:not([aria-disabled=true]):hover,
1957
+ .react-datepicker__quarter-text--in-range:not([aria-disabled=true]):hover,
1958
+ .react-datepicker__year-text--selected:not([aria-disabled=true]):hover,
1959
+ .react-datepicker__year-text--in-selecting-range:not([aria-disabled=true]):hover,
1960
+ .react-datepicker__year-text--in-range:not([aria-disabled=true]):hover {
1961
+ background-color: #1d5d90;
1962
+ }
1963
+ .react-datepicker__day--keyboard-selected,
1964
+ .react-datepicker__month-text--keyboard-selected,
1965
+ .react-datepicker__quarter-text--keyboard-selected,
1966
+ .react-datepicker__year-text--keyboard-selected {
1967
+ border-radius: 0.3rem;
1968
+ background-color: #bad9f1;
1969
+ color: rgb(0, 0, 0);
1970
+ }
1971
+ .react-datepicker__day--keyboard-selected:not([aria-disabled=true]):hover,
1972
+ .react-datepicker__month-text--keyboard-selected:not([aria-disabled=true]):hover,
1973
+ .react-datepicker__quarter-text--keyboard-selected:not([aria-disabled=true]):hover,
1974
+ .react-datepicker__year-text--keyboard-selected:not([aria-disabled=true]):hover {
1975
+ background-color: #1d5d90;
1976
+ }
1977
+ .react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range, .react-datepicker__month-text--in-range, .react-datepicker__quarter-text--in-range, .react-datepicker__year-text--in-range),
1978
+ .react-datepicker__month-text--in-selecting-range:not(.react-datepicker__day--in-range, .react-datepicker__month-text--in-range, .react-datepicker__quarter-text--in-range, .react-datepicker__year-text--in-range),
1979
+ .react-datepicker__quarter-text--in-selecting-range:not(.react-datepicker__day--in-range, .react-datepicker__month-text--in-range, .react-datepicker__quarter-text--in-range, .react-datepicker__year-text--in-range),
1980
+ .react-datepicker__year-text--in-selecting-range:not(.react-datepicker__day--in-range, .react-datepicker__month-text--in-range, .react-datepicker__quarter-text--in-range, .react-datepicker__year-text--in-range) {
1981
+ background-color: rgba(33, 107, 165, 0.5);
1982
+ }
1983
+ .react-datepicker__month--selecting-range .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range, .react-datepicker__month-text--in-selecting-range, .react-datepicker__quarter-text--in-selecting-range, .react-datepicker__year-text--in-selecting-range),
1984
+ .react-datepicker__year--selecting-range .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range, .react-datepicker__month-text--in-selecting-range, .react-datepicker__quarter-text--in-selecting-range, .react-datepicker__year-text--in-selecting-range),
1985
+ .react-datepicker__month--selecting-range .react-datepicker__month-text--in-range:not(.react-datepicker__day--in-selecting-range, .react-datepicker__month-text--in-selecting-range, .react-datepicker__quarter-text--in-selecting-range, .react-datepicker__year-text--in-selecting-range),
1986
+ .react-datepicker__year--selecting-range .react-datepicker__month-text--in-range:not(.react-datepicker__day--in-selecting-range, .react-datepicker__month-text--in-selecting-range, .react-datepicker__quarter-text--in-selecting-range, .react-datepicker__year-text--in-selecting-range),
1987
+ .react-datepicker__month--selecting-range .react-datepicker__quarter-text--in-range:not(.react-datepicker__day--in-selecting-range, .react-datepicker__month-text--in-selecting-range, .react-datepicker__quarter-text--in-selecting-range, .react-datepicker__year-text--in-selecting-range),
1988
+ .react-datepicker__year--selecting-range .react-datepicker__quarter-text--in-range:not(.react-datepicker__day--in-selecting-range, .react-datepicker__month-text--in-selecting-range, .react-datepicker__quarter-text--in-selecting-range, .react-datepicker__year-text--in-selecting-range),
1989
+ .react-datepicker__month--selecting-range .react-datepicker__year-text--in-range:not(.react-datepicker__day--in-selecting-range, .react-datepicker__month-text--in-selecting-range, .react-datepicker__quarter-text--in-selecting-range, .react-datepicker__year-text--in-selecting-range),
1990
+ .react-datepicker__year--selecting-range .react-datepicker__year-text--in-range:not(.react-datepicker__day--in-selecting-range, .react-datepicker__month-text--in-selecting-range, .react-datepicker__quarter-text--in-selecting-range, .react-datepicker__year-text--in-selecting-range) {
1991
+ background-color: #f0f0f0;
1992
+ color: #000;
1993
+ }
1994
+ .react-datepicker__day--disabled,
1995
+ .react-datepicker__month-text--disabled,
1996
+ .react-datepicker__quarter-text--disabled,
1997
+ .react-datepicker__year-text--disabled {
1998
+ cursor: default;
1999
+ color: #ccc;
2000
+ }
2001
+ .react-datepicker__day--disabled .overlay,
2002
+ .react-datepicker__month-text--disabled .overlay,
2003
+ .react-datepicker__quarter-text--disabled .overlay,
2004
+ .react-datepicker__year-text--disabled .overlay {
2005
+ position: absolute;
2006
+ bottom: 70%;
2007
+ left: 50%;
2008
+ transform: translateX(-50%);
2009
+ background-color: #333;
2010
+ color: #fff;
2011
+ padding: 4px;
2012
+ border-radius: 4px;
2013
+ white-space: nowrap;
2014
+ visibility: hidden;
2015
+ opacity: 0;
2016
+ transition: visibility 0s, opacity 0.3s ease-in-out;
2017
+ }
2018
+ .react-datepicker__input-container {
2019
+ position: relative;
2020
+ display: inline-block;
2021
+ width: 100%;
2022
+ }
2023
+ .react-datepicker__input-container .react-datepicker__calendar-icon {
2024
+ position: absolute;
2025
+ padding: 0.5rem;
2026
+ box-sizing: content-box;
2027
+ }
2028
+ .react-datepicker__view-calendar-icon input {
2029
+ padding: 6px 10px 5px 25px;
2030
+ }
2031
+ .react-datepicker__year-read-view,
2032
+ .react-datepicker__month-read-view,
2033
+ .react-datepicker__month-year-read-view {
2034
+ border: 1px solid transparent;
2035
+ border-radius: 0.3rem;
2036
+ position: relative;
2037
+ }
2038
+ .react-datepicker__year-read-view:hover,
2039
+ .react-datepicker__month-read-view:hover,
2040
+ .react-datepicker__month-year-read-view:hover {
2041
+ cursor: pointer;
2042
+ }
2043
+ .react-datepicker__year-read-view:hover .react-datepicker__year-read-view--down-arrow,
2044
+ .react-datepicker__year-read-view:hover .react-datepicker__month-read-view--down-arrow,
2045
+ .react-datepicker__month-read-view:hover .react-datepicker__year-read-view--down-arrow,
2046
+ .react-datepicker__month-read-view:hover .react-datepicker__month-read-view--down-arrow,
2047
+ .react-datepicker__month-year-read-view:hover .react-datepicker__year-read-view--down-arrow,
2048
+ .react-datepicker__month-year-read-view:hover .react-datepicker__month-read-view--down-arrow {
2049
+ border-top-color: #b3b3b3;
2050
+ }
2051
+ .react-datepicker__year-read-view--down-arrow,
2052
+ .react-datepicker__month-read-view--down-arrow,
2053
+ .react-datepicker__month-year-read-view--down-arrow {
2054
+ transform: rotate(135deg);
2055
+ right: -16px;
2056
+ top: 0;
2057
+ }
2058
+ .react-datepicker__year-dropdown,
2059
+ .react-datepicker__month-dropdown,
2060
+ .react-datepicker__month-year-dropdown {
2061
+ background-color: #f0f0f0;
2062
+ position: absolute;
2063
+ width: 50%;
2064
+ left: 25%;
2065
+ top: 30px;
2066
+ z-index: 1;
2067
+ text-align: center;
2068
+ border-radius: 0.3rem;
2069
+ border: 1px solid #aeaeae;
2070
+ }
2071
+ .react-datepicker__year-dropdown:hover,
2072
+ .react-datepicker__month-dropdown:hover,
2073
+ .react-datepicker__month-year-dropdown:hover {
2074
+ cursor: pointer;
2075
+ }
2076
+ .react-datepicker__year-dropdown--scrollable,
2077
+ .react-datepicker__month-dropdown--scrollable,
2078
+ .react-datepicker__month-year-dropdown--scrollable {
2079
+ height: 150px;
2080
+ overflow-y: scroll;
2081
+ }
2082
+ .react-datepicker__year-option,
2083
+ .react-datepicker__month-option,
2084
+ .react-datepicker__month-year-option {
2085
+ line-height: 20px;
2086
+ width: 100%;
2087
+ display: block;
2088
+ margin-left: auto;
2089
+ margin-right: auto;
2090
+ }
2091
+ .react-datepicker__year-option:first-of-type,
2092
+ .react-datepicker__month-option:first-of-type,
2093
+ .react-datepicker__month-year-option:first-of-type {
2094
+ border-top-left-radius: 0.3rem;
2095
+ border-top-right-radius: 0.3rem;
2096
+ }
2097
+ .react-datepicker__year-option:last-of-type,
2098
+ .react-datepicker__month-option:last-of-type,
2099
+ .react-datepicker__month-year-option:last-of-type {
2100
+ -webkit-user-select: none;
2101
+ -moz-user-select: none;
2102
+ -ms-user-select: none;
2103
+ user-select: none;
2104
+ border-bottom-left-radius: 0.3rem;
2105
+ border-bottom-right-radius: 0.3rem;
2106
+ }
2107
+ .react-datepicker__year-option:hover,
2108
+ .react-datepicker__month-option:hover,
2109
+ .react-datepicker__month-year-option:hover {
2110
+ background-color: #ccc;
2111
+ }
2112
+ .react-datepicker__year-option:hover .react-datepicker__navigation--years-upcoming,
2113
+ .react-datepicker__month-option:hover .react-datepicker__navigation--years-upcoming,
2114
+ .react-datepicker__month-year-option:hover .react-datepicker__navigation--years-upcoming {
2115
+ border-bottom-color: #b3b3b3;
2116
+ }
2117
+ .react-datepicker__year-option:hover .react-datepicker__navigation--years-previous,
2118
+ .react-datepicker__month-option:hover .react-datepicker__navigation--years-previous,
2119
+ .react-datepicker__month-year-option:hover .react-datepicker__navigation--years-previous {
2120
+ border-top-color: #b3b3b3;
2121
+ }
2122
+ .react-datepicker__year-option--selected,
2123
+ .react-datepicker__month-option--selected,
2124
+ .react-datepicker__month-year-option--selected {
2125
+ position: absolute;
2126
+ left: 15px;
2127
+ }
2128
+ .react-datepicker__close-icon {
2129
+ cursor: pointer;
2130
+ background-color: transparent;
2131
+ border: 0;
2132
+ outline: 0;
2133
+ padding: 0 6px 0 0;
2134
+ position: absolute;
2135
+ top: 0;
2136
+ right: 0;
2137
+ height: 100%;
2138
+ display: table-cell;
2139
+ vertical-align: middle;
2140
+ }
2141
+ .react-datepicker__close-icon::after {
2142
+ cursor: pointer;
2143
+ background-color: #216ba5;
2144
+ color: #fff;
2145
+ border-radius: 50%;
2146
+ height: 16px;
2147
+ width: 16px;
2148
+ padding: 2px;
2149
+ font-size: 12px;
2150
+ line-height: 1;
2151
+ text-align: center;
2152
+ display: table-cell;
2153
+ vertical-align: middle;
2154
+ content: "\d7";
2155
+ }
2156
+ .react-datepicker__close-icon--disabled {
2157
+ cursor: default;
2158
+ }
2159
+ .react-datepicker__close-icon--disabled::after {
2160
+ cursor: default;
2161
+ background-color: #ccc;
2162
+ }
2163
+ .react-datepicker__today-button {
2164
+ background: #f0f0f0;
2165
+ border-top: 1px solid #aeaeae;
2166
+ cursor: pointer;
2167
+ text-align: center;
2168
+ font-weight: bold;
2169
+ padding: 5px 0;
2170
+ clear: left;
2171
+ }
2172
+ .react-datepicker__portal {
2173
+ position: fixed;
2174
+ width: 100vw;
2175
+ height: 100vh;
2176
+ background-color: rgba(0, 0, 0, 0.8);
2177
+ left: 0;
2178
+ top: 0;
2179
+ justify-content: center;
2180
+ align-items: center;
2181
+ display: flex;
2182
+ z-index: 2147483647;
2183
+ }
2184
+ .react-datepicker__portal .react-datepicker__day-name,
2185
+ .react-datepicker__portal .react-datepicker__day,
2186
+ .react-datepicker__portal .react-datepicker__time-name {
2187
+ width: 3rem;
2188
+ line-height: 3rem;
2189
+ }
2190
+ @media (max-width: 400px), (max-height: 550px) {
2191
+ .react-datepicker__portal .react-datepicker__day-name,
2192
+ .react-datepicker__portal .react-datepicker__day,
2193
+ .react-datepicker__portal .react-datepicker__time-name {
2194
+ width: 2rem;
2195
+ line-height: 2rem;
2196
+ }
2197
+ }
2198
+ .react-datepicker__portal .react-datepicker__current-month,
2199
+ .react-datepicker__portal .react-datepicker-time__header {
2200
+ font-size: 1.44rem;
2201
+ }
2202
+ .react-datepicker__children-container {
2203
+ width: 13.8rem;
2204
+ margin: 0.4rem;
2205
+ padding-right: 0.2rem;
2206
+ padding-left: 0.2rem;
2207
+ height: auto;
2208
+ }
2209
+ .react-datepicker__aria-live {
2210
+ position: absolute;
2211
+ clip-path: circle(0);
2212
+ border: 0;
2213
+ height: 1px;
2214
+ margin: -1px;
2215
+ overflow: hidden;
2216
+ padding: 0;
2217
+ width: 1px;
2218
+ white-space: nowrap;
2219
+ }
2220
+ .react-datepicker__calendar-icon {
2221
+ width: 1em;
2222
+ height: 1em;
2223
+ vertical-align: -0.125em;
2224
+ }
1424
2225
  .disclaimer {
1425
2226
  padding: 1rem;
1426
2227
  }