mozrest-sdk-react-dev 0.3.36 → 0.3.39

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 (3) hide show
  1. package/mozrest-sdk.es.js +26898 -3670
  2. package/package.json +1 -1
  3. package/style.css +1217 -308
package/style.css CHANGED
@@ -1,4 +1,4 @@
1
- @import url("https://fonts.googleapis.com/css2?family=Lato:wght@400;700&family=Noto+Sans:wght@600&display=swap");@import url("https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,100..900;1,100..900&display=swap");@import url("https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,100..900;1,100..900&display=swap");@import url("https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,100..900;1,100..900&display=swap");
1
+ @charset "UTF-8";@import url("https://fonts.googleapis.com/css2?family=Lato:wght@400;700&family=Noto+Sans:wght@600&display=swap");@import url("https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,100..900;1,100..900&display=swap");@import url("https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,100..900;1,100..900&display=swap");@import url("https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,100..900;1,100..900&display=swap");
2
2
  .moz {
3
3
  /**
4
4
  Use a more readable tab size (opinionated).
@@ -1302,389 +1302,1294 @@
1302
1302
  position: absolute;
1303
1303
  top: 1rem;
1304
1304
  right: 1rem;
1305
- }.litepicker {
1306
- background-color: var(--moz-cta-content-bg);
1307
- border-radius: 1rem;
1308
- font: var(--moz-font-weight-input) var(--moz-font-size-input)/var(--moz-line-height-input) var(--moz-font-family-input);
1309
- z-index: 999999 !important;
1310
- margin-top: 7px;
1311
- box-shadow: 0px 3px 20px var(--moz-input-border);
1312
- border: 1px solid var(--moz-input-border);
1313
- }
1314
- @media (max-width: 1023px) {
1315
- .litepicker {
1316
- width: 310px;
1317
- }
1305
+ }._filterButton_c0yjo_1 {
1306
+ display: flex;
1307
+ background: var(--moz-cta-content-bg);
1308
+ color: var(--moz-text-label);
1309
+ border: 1px solid var(--moz-border);
1310
+ padding: 0.5rem;
1311
+ border-radius: 2px;
1312
+ justify-content: center;
1313
+ align-items: center;
1314
+ gap: 0.5rem;
1315
+ cursor: pointer;
1316
+ margin-left: auto;
1317
+ margin-bottom: 1rem;
1318
1318
  }
1319
- @media (max-width: 767px) {
1320
- .litepicker {
1321
- left: 0px !important;
1322
- right: 0px;
1323
- margin-left: auto;
1324
- margin-right: auto;
1319
+ @media (min-width: 768px) {
1320
+ ._filterButton_c0yjo_1 {
1321
+ display: none;
1325
1322
  }
1326
1323
  }
1327
- .litepicker .litepicker .container__footer {
1324
+
1325
+ ._buttonClose_c0yjo_21 {
1328
1326
  display: flex;
1329
- flex-direction: column;
1327
+ color: var(--moz-text-label);
1328
+ justify-content: flex-end;
1329
+ cursor: pointer;
1330
+ flex: 1;
1331
+ width: 100%;
1330
1332
  }
1331
- .litepicker .litepicker-shortcuts {
1332
- order: -1;
1333
+ ._buttonClose--hidden_c0yjo_29 {
1334
+ display: none;
1333
1335
  }
1334
- .litepicker .container__months,
1335
- .litepicker .container__footer {
1336
- box-shadow: none;
1337
- background-color: transparent;
1338
- padding-top: 0;
1336
+ @media (min-width: 768px) {
1337
+ ._buttonClose_c0yjo_21 {
1338
+ display: none;
1339
+ }
1339
1340
  }
1340
- .litepicker .container__footer {
1341
- border-top: 1px solid var(--moz-input-border);
1342
- margin: 0;
1343
- padding: 0.5rem;
1344
- color: var(--moz-text-primary);
1341
+
1342
+ ._toolbar_c0yjo_38 {
1343
+ background-color: var(--moz-cta-content-bg);
1344
+ box-shadow: var(--moz-input-border) 0px 10px 10px -10px;
1345
+ position: absolute;
1346
+ padding: 1rem;
1347
+ left: 0;
1348
+ right: 0;
1349
+ z-index: 10;
1345
1350
  }
1346
- @media (max-width: 1023px) {
1347
- .litepicker .container__footer {
1348
- display: flex;
1349
- flex-direction: column-reverse;
1350
- text-align: center;
1351
- }
1351
+ ._toolbar--hide_c0yjo_47 {
1352
+ display: none;
1352
1353
  }
1353
- @media (max-width: 1023px) {
1354
- .litepicker .container__footer .preview-date-range {
1355
- width: 100%;
1354
+ @media (min-width: 768px) {
1355
+ ._toolbar--hide_c0yjo_47 {
1356
1356
  display: block;
1357
- order: 1;
1358
- margin-bottom: 1.5rem;
1359
1357
  }
1360
1358
  }
1361
- @media (max-width: 1023px) {
1362
- .litepicker .container__footer .button-cancel {
1363
- width: 100% !important;
1364
- margin-left: 0px !important;
1365
- padding-top: 0.375rem !important;
1366
- padding-bottom: 0.375rem !important;
1359
+ @media (min-width: 768px) {
1360
+ ._toolbar_c0yjo_38 {
1361
+ background-color: transparent;
1362
+ box-shadow: none;
1363
+ padding: 1rem 0;
1364
+ position: relative;
1365
+ gap: 1rem;
1367
1366
  }
1368
- }
1369
- @media (max-width: 1023px) {
1370
- .litepicker .container__footer .button-apply {
1371
- width: 100% !important;
1372
- margin-left: 0px !important;
1373
- padding-top: 0.375rem !important;
1374
- padding-bottom: 0.375rem !important;
1375
- margin-bottom: 1.5rem;
1367
+ ._toolbar--hidden_c0yjo_63 {
1368
+ display: flex;
1376
1369
  }
1370
+ }._inputWrapper_c5acm_1 {
1371
+ position: relative;
1372
+ display: flex;
1373
+ align-items: center;
1374
+ width: 100%;
1377
1375
  }
1378
- .litepicker .container__footer .button-apply,
1379
- .litepicker .container__footer .button-cancel {
1380
- width: 5rem;
1381
- padding: 0.5rem 0.5rem;
1382
- border-radius: 0.5rem;
1383
- margin-left: 0.5rem;
1384
- margin-right: 0;
1376
+
1377
+ ._input_c5acm_1 {
1378
+ flex: 1;
1379
+ font: var(--moz-font-weight-input) var(--moz-font-size-input)/var(--moz-line-height-input) var(--moz-font-family-input);
1380
+ padding: 0.75rem 0.75rem;
1381
+ background: transparent;
1382
+ border: none;
1383
+ border-bottom: 1px solid var(--moz-input-border);
1384
+ color: var(--moz-text-input);
1385
+ color-scheme: var(--moz-input-scheme);
1386
+ border-radius: 0;
1387
+ max-width: 100%;
1388
+ width: auto;
1389
+ box-sizing: border-box;
1385
1390
  }
1386
- .litepicker .container__footer .button-apply {
1387
- background-color: var(--moz-cta-primary);
1388
- color: var(--moz-cta-primary-text);
1391
+ ._input_c5acm_1:focus {
1392
+ outline: none;
1393
+ box-shadow: 0 0 5px var(--moz-input-border);
1389
1394
  }
1390
- .litepicker .container__footer .button-cancel {
1391
- background-color: var(--moz-cta-tertiary);
1392
- color: var(--moz-cta-secondary-text);
1395
+ ._input_c5acm_1:disabled {
1396
+ color: var(--moz-bg-gray);
1397
+ background: var(--moz-input-disabled);
1393
1398
  }
1394
- .litepicker .container__months {
1395
- padding-left: 1rem;
1396
- padding-right: 1rem;
1399
+ ._input_c5acm_1[type=number] {
1400
+ appearance: textfield;
1397
1401
  }
1398
- .litepicker .container__months .month-item-weekdays-row {
1399
- color: var(--moz-text-label);
1400
- margin-top: 1rem;
1402
+ ._input_c5acm_1[type=number]::-webkit-outer-spin-button, ._input_c5acm_1[type=number]::-webkit-inner-spin-button {
1403
+ margin: 0;
1404
+ appearance: none;
1401
1405
  }
1402
- .litepicker .container__months .month-item-header {
1403
- padding-left: 0;
1404
- padding-right: 0;
1405
- padding-bottom: 0;
1406
- padding-top: 10px;
1406
+ ._input--r-md_c5acm_37 {
1407
+ border-radius: 8px;
1408
+ border-bottom-left-radius: 0;
1409
+ border-bottom-right-radius: 0;
1407
1410
  }
1408
- .litepicker .container__months .month-item-header .button-previous-month {
1409
- display: flex;
1410
- align-items: center;
1411
- justify-content: center;
1412
- width: 1.5rem;
1413
- height: 1.5rem;
1411
+ ._input--r-sm_c5acm_42 {
1412
+ border-radius: 2px;
1413
+ border-bottom-left-radius: 0;
1414
+ border-bottom-right-radius: 0;
1414
1415
  }
1415
- .litepicker .container__months .month-item-header .button-previous-month:hover {
1416
- background-color: var(--moz-cta-content-sec-bg);
1416
+ ._input--with-icon-left_c5acm_47 {
1417
+ padding-left: 2rem;
1417
1418
  }
1418
- .litepicker .container__months .month-item-header .button-previous-month svg {
1419
- transform: rotate(135deg);
1420
- margin-right: -0.5rem;
1419
+ ._input--with-icon-right_c5acm_50 {
1420
+ padding-right: 2rem;
1421
+ }
1422
+ ._input--filled_c5acm_53 {
1423
+ background: var(--moz-input-filled);
1424
+ }
1425
+ ._input--error_c5acm_56 {
1426
+ border-color: rgb(220, 53, 69);
1427
+ }
1428
+ ._input--line-through_c5acm_59 {
1429
+ text-decoration: line-through;
1430
+ }
1431
+ ._input--line-through_c5acm_59::-webkit-datetime-edit, ._input--line-through_c5acm_59::-webkit-calendar-picker-indicator {
1432
+ text-decoration: line-through !important;
1433
+ -webkit-text-decoration: line-through !important;
1434
+ }
1435
+ ._input--line-through_c5acm_59[type=date]::-webkit-datetime-edit, ._input--line-through_c5acm_59[type=date]::-webkit-datetime-edit-fields-wrapper, ._input--line-through_c5acm_59[type=date]::-webkit-datetime-edit-text, ._input--line-through_c5acm_59[type=date]::-webkit-datetime-edit-month-field, ._input--line-through_c5acm_59[type=date]::-webkit-datetime-edit-day-field, ._input--line-through_c5acm_59[type=date]::-webkit-datetime-edit-year-field {
1436
+ text-decoration: line-through !important;
1437
+ -webkit-text-decoration: line-through !important;
1438
+ }
1439
+ ._input--borderless_c5acm_70 {
1440
+ border: none;
1441
+ border-bottom: none;
1442
+ }
1443
+ ._input--rounded_c5acm_74 {
1444
+ border-bottom-left-radius: 8px;
1445
+ border-bottom-right-radius: 8px;
1446
+ }
1447
+ ._input_c5acm_1::placeholder {
1448
+ color: var(--moz-text-input);
1449
+ opacity: 1;
1450
+ }
1451
+ ._input_c5acm_1:-ms-input-placeholder {
1452
+ color: var(--moz-text-input);
1421
1453
  }
1422
- .litepicker .container__months .month-item-header .button-next-month {
1454
+ ._input_c5acm_1::-ms-input-placeholder {
1455
+ color: var(--moz-text-input);
1456
+ }
1457
+
1458
+ ._inputIcon_c5acm_89 {
1459
+ position: absolute;
1460
+ pointer-events: none;
1423
1461
  display: flex;
1424
1462
  align-items: center;
1425
1463
  justify-content: center;
1426
- width: 1.5rem;
1427
- height: 1.5rem;
1464
+ top: 50%;
1465
+ transform: translateY(-50%);
1428
1466
  }
1429
- .litepicker .container__months .month-item-header .button-next-month:hover {
1430
- background-color: var(--moz-cta-content-sec-bg);
1467
+ ._inputIcon--p-left_c5acm_98 {
1468
+ left: 0.5rem;
1431
1469
  }
1432
- .litepicker .container__months .month-item-header .button-next-month svg {
1433
- transform: rotate(-45deg);
1434
- margin-left: -0.5rem;
1435
- }
1436
- .litepicker .container__months .month-item-header .button-previous-month:hover svg,
1437
- .litepicker .container__months .month-item-header .button-previous-month svg,
1438
- .litepicker .container__months .month-item-header .button-next-month:hover svg,
1439
- .litepicker .container__months .month-item-header .button-next-month svg {
1440
- fill: transparent;
1441
- border: solid var(--moz-input-border);
1442
- border-width: 0 2px 2px 0;
1443
- border-radius: 0;
1444
- display: inline-block;
1445
- border-color: var(--moz-input-border);
1446
- width: 0.5rem;
1447
- height: 0.5rem;
1470
+ ._inputIcon--p-right_c5acm_101 {
1471
+ right: 0.5rem;
1472
+ }._datePicker_aezmq_1 {
1473
+ position: relative;
1474
+ width: 100%;
1475
+ transition: all 0.2s ease-in-out;
1476
+ border: none !important;
1477
+ }
1478
+
1479
+ ._inlinePicker_aezmq_8 {
1480
+ position: absolute;
1481
+ top: 100%;
1482
+ left: 0;
1483
+ z-index: 1000;
1484
+ background: var(--moz-cta-content-bg);
1485
+ border: 1px solid var(--moz-border);
1486
+ border-radius: 0.5rem;
1487
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
1488
+ margin-top: 1rem;
1489
+ opacity: 0;
1490
+ visibility: hidden;
1491
+ transform: translateY(-10px) scale(0.98);
1492
+ transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
1493
+ pointer-events: none;
1494
+ }
1495
+ ._inlinePicker_aezmq_8._visible_aezmq_24 {
1496
+ opacity: 1;
1497
+ visibility: visible;
1498
+ transform: translateY(0) scale(1);
1499
+ pointer-events: auto;
1500
+ }
1501
+
1502
+ ._singleMode_aezmq_31 {
1503
+ --picker-width: 251px;
1504
+ --picker-mobile-width: 251px;
1505
+ }
1506
+
1507
+ ._rangeMode_aezmq_36 {
1508
+ --picker-width: 540px;
1509
+ --picker-mobile-width: 260px;
1510
+ }
1511
+
1512
+ .react-datepicker {
1513
+ width: var(--picker-width, 540px) !important;
1514
+ }
1515
+ @media only screen and (max-width: 768px) {
1516
+ .react-datepicker {
1517
+ width: var(--picker-mobile-width, 260px) !important;
1518
+ }
1519
+ }
1520
+ .react-datepicker__navigation-icon::before, .react-datepicker__year-read-view--down-arrow,
1521
+ .react-datepicker__month-read-view--down-arrow,
1522
+ .react-datepicker__month-year-read-view--down-arrow {
1523
+ border-color: #ccc;
1524
+ border-style: solid;
1525
+ border-width: 3px 3px 0 0;
1526
+ content: "";
1448
1527
  display: block;
1528
+ height: 9px;
1529
+ position: absolute;
1530
+ top: 6px;
1531
+ width: 9px;
1532
+ }
1533
+ /* sr-only utility class for accessibility */
1534
+ .sr-only {
1535
+ position: absolute;
1536
+ width: 1px;
1537
+ height: 1px;
1538
+ padding: 0;
1539
+ margin: -1px;
1540
+ overflow: hidden;
1541
+ clip: rect(0, 0, 0, 0);
1542
+ white-space: nowrap;
1543
+ border: 0;
1544
+ }
1545
+
1546
+ .react-datepicker-wrapper {
1547
+ display: inline-block;
1548
+ padding: 0;
1549
+ border: 0;
1550
+ }
1551
+
1552
+ .react-datepicker {
1553
+ font-family: "Helvetica Neue", helvetica, arial, sans-serif;
1554
+ font-size: 0.8rem;
1555
+ background-color: #fff;
1556
+ color: #000;
1557
+ border: 1px solid #aeaeae;
1558
+ border-radius: 0.3rem;
1559
+ display: inline-block;
1560
+ position: relative;
1561
+ line-height: initial;
1562
+ }
1563
+
1564
+ .react-datepicker--time-only .react-datepicker__time-container {
1565
+ border-left: 0;
1566
+ }
1567
+ .react-datepicker--time-only .react-datepicker__time,
1568
+ .react-datepicker--time-only .react-datepicker__time-box {
1569
+ border-bottom-left-radius: 0.3rem;
1570
+ border-bottom-right-radius: 0.3rem;
1571
+ }
1572
+
1573
+ .react-datepicker-popper {
1574
+ z-index: 1;
1575
+ line-height: 0;
1576
+ }
1577
+ .react-datepicker-popper .react-datepicker__triangle {
1578
+ stroke: #aeaeae;
1579
+ }
1580
+ .react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle {
1581
+ fill: #f0f0f0;
1582
+ color: #f0f0f0;
1583
+ }
1584
+ .react-datepicker-popper[data-placement^=top] .react-datepicker__triangle {
1585
+ fill: #fff;
1586
+ color: #fff;
1587
+ }
1588
+
1589
+ .react-datepicker__header {
1590
+ text-align: center;
1591
+ background-color: #f0f0f0;
1592
+ border-bottom: 1px solid #aeaeae;
1593
+ border-top-left-radius: 0.3rem;
1594
+ padding: 8px 0;
1595
+ position: relative;
1596
+ }
1597
+ .react-datepicker__header--time {
1598
+ padding-bottom: 8px;
1599
+ padding-left: 5px;
1600
+ padding-right: 5px;
1601
+ }
1602
+ .react-datepicker__header--time:not(.react-datepicker__header--time--only) {
1603
+ border-top-left-radius: 0;
1604
+ }
1605
+ .react-datepicker__header:not(.react-datepicker__header--has-time-select) {
1606
+ border-top-right-radius: 0.3rem;
1607
+ }
1608
+
1609
+ .react-datepicker__year-dropdown-container--select,
1610
+ .react-datepicker__month-dropdown-container--select,
1611
+ .react-datepicker__month-year-dropdown-container--select,
1612
+ .react-datepicker__year-dropdown-container--scroll,
1613
+ .react-datepicker__month-dropdown-container--scroll,
1614
+ .react-datepicker__month-year-dropdown-container--scroll {
1615
+ display: inline-block;
1616
+ margin: 0 15px;
1617
+ }
1618
+
1619
+ .react-datepicker__current-month,
1620
+ .react-datepicker-time__header,
1621
+ .react-datepicker-year-header {
1622
+ margin-top: 0;
1623
+ color: #000;
1624
+ font-weight: bold;
1625
+ font-size: 0.944rem;
1626
+ }
1627
+
1628
+ h2.react-datepicker__current-month {
1629
+ padding: 0;
1630
+ margin: 0;
1631
+ }
1632
+
1633
+ .react-datepicker-time__header {
1634
+ text-overflow: ellipsis;
1635
+ white-space: nowrap;
1636
+ overflow: hidden;
1637
+ }
1638
+
1639
+ .react-datepicker__navigation {
1640
+ align-items: center;
1641
+ background: none;
1642
+ display: flex;
1643
+ justify-content: center;
1644
+ text-align: center;
1645
+ cursor: pointer;
1646
+ position: absolute;
1647
+ top: 2px;
1648
+ padding: 0;
1649
+ border: none;
1650
+ z-index: 1;
1651
+ height: 32px;
1652
+ width: 32px;
1653
+ text-indent: -999em;
1654
+ overflow: hidden;
1655
+ }
1656
+ .react-datepicker__navigation--previous {
1657
+ left: 2px;
1658
+ }
1659
+ .react-datepicker__navigation--next {
1660
+ right: 2px;
1661
+ }
1662
+ .react-datepicker__navigation--next--with-time:not(.react-datepicker__navigation--next--with-today-button) {
1663
+ right: 85px;
1664
+ }
1665
+ .react-datepicker__navigation--years {
1666
+ position: relative;
1667
+ top: 0;
1668
+ display: block;
1669
+ margin-left: auto;
1670
+ margin-right: auto;
1671
+ }
1672
+ .react-datepicker__navigation--years-previous {
1673
+ top: 4px;
1674
+ }
1675
+ .react-datepicker__navigation--years-upcoming {
1676
+ top: -4px;
1677
+ }
1678
+ .react-datepicker__navigation:hover *::before {
1679
+ border-color: rgb(165.75, 165.75, 165.75);
1680
+ }
1681
+
1682
+ .react-datepicker__navigation-icon {
1683
+ position: relative;
1684
+ top: -1px;
1685
+ font-size: 20px;
1686
+ width: 0;
1687
+ }
1688
+ .react-datepicker__navigation-icon--next {
1689
+ left: -2px;
1690
+ }
1691
+ .react-datepicker__navigation-icon--next::before {
1692
+ transform: rotate(45deg);
1693
+ left: -7px;
1694
+ }
1695
+ .react-datepicker__navigation-icon--previous {
1696
+ right: -2px;
1697
+ }
1698
+ .react-datepicker__navigation-icon--previous::before {
1699
+ transform: rotate(225deg);
1700
+ right: -7px;
1701
+ }
1702
+
1703
+ .react-datepicker__month-container {
1704
+ float: left;
1705
+ }
1706
+
1707
+ .react-datepicker__year {
1708
+ margin: 0.4rem;
1709
+ text-align: center;
1710
+ }
1711
+ .react-datepicker__year-wrapper {
1712
+ display: flex;
1713
+ flex-wrap: wrap;
1714
+ max-width: 180px;
1715
+ }
1716
+ .react-datepicker__year .react-datepicker__year-text {
1717
+ display: inline-block;
1718
+ width: 4rem;
1719
+ margin: 2px;
1720
+ }
1721
+
1722
+ .react-datepicker__month {
1723
+ margin: 0.4rem;
1724
+ text-align: center;
1725
+ }
1726
+ .react-datepicker__month .react-datepicker__month-text,
1727
+ .react-datepicker__month .react-datepicker__quarter-text {
1728
+ display: inline-block;
1729
+ width: 4rem;
1730
+ margin: 2px;
1731
+ }
1732
+
1733
+ .react-datepicker__input-time-container {
1734
+ clear: both;
1735
+ width: 100%;
1736
+ float: left;
1737
+ margin: 5px 0 10px 15px;
1738
+ text-align: left;
1739
+ }
1740
+ .react-datepicker__input-time-container .react-datepicker-time__caption {
1741
+ display: inline-block;
1742
+ }
1743
+ .react-datepicker__input-time-container .react-datepicker-time__input-container {
1744
+ display: inline-block;
1745
+ }
1746
+ .react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input {
1747
+ display: inline-block;
1748
+ margin-left: 10px;
1749
+ }
1750
+ .react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input {
1751
+ width: auto;
1752
+ }
1753
+ .react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]::-webkit-inner-spin-button,
1754
+ .react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]::-webkit-outer-spin-button {
1755
+ -webkit-appearance: none;
1756
+ margin: 0;
1757
+ }
1758
+ .react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time] {
1759
+ -moz-appearance: textfield;
1760
+ }
1761
+ .react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__delimiter {
1762
+ margin-left: 5px;
1763
+ display: inline-block;
1764
+ }
1765
+
1766
+ .react-datepicker__time-container {
1767
+ float: right;
1768
+ border-left: 1px solid #aeaeae;
1769
+ width: 85px;
1770
+ }
1771
+ .react-datepicker__time-container--with-today-button {
1772
+ display: inline;
1773
+ border: 1px solid #aeaeae;
1774
+ border-radius: 0.3rem;
1775
+ position: absolute;
1776
+ right: -87px;
1777
+ top: 0;
1778
+ }
1779
+ .react-datepicker__time-container .react-datepicker__time {
1780
+ position: relative;
1781
+ background: white;
1782
+ border-bottom-right-radius: 0.3rem;
1783
+ }
1784
+ .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box {
1785
+ width: 85px;
1786
+ overflow-x: hidden;
1787
+ margin: 0 auto;
1788
+ text-align: center;
1789
+ border-bottom-right-radius: 0.3rem;
1790
+ }
1791
+ .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list {
1792
+ list-style: none;
1793
+ margin: 0;
1794
+ height: calc(195px + 1.7rem / 2);
1795
+ overflow-y: scroll;
1796
+ padding-right: 0;
1797
+ padding-left: 0;
1798
+ width: 100%;
1799
+ box-sizing: content-box;
1800
+ }
1801
+ .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item {
1802
+ height: 30px;
1803
+ padding: 5px 10px;
1804
+ white-space: nowrap;
1805
+ }
1806
+ .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item:hover {
1807
+ cursor: pointer;
1808
+ background-color: #f0f0f0;
1809
+ }
1810
+ .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected {
1811
+ background-color: #216ba5;
1812
+ color: white;
1813
+ font-weight: bold;
1814
+ }
1815
+ .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected:hover {
1816
+ background-color: #216ba5;
1817
+ }
1818
+ .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled {
1819
+ color: #ccc;
1820
+ }
1821
+ .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled:hover {
1822
+ cursor: default;
1823
+ background-color: transparent;
1824
+ }
1825
+
1826
+ .react-datepicker__week-number {
1827
+ color: #ccc;
1828
+ display: inline-block;
1829
+ width: 1.7rem;
1830
+ line-height: 1.7rem;
1831
+ text-align: center;
1832
+ margin: 0.166rem;
1833
+ }
1834
+ .react-datepicker__week-number.react-datepicker__week-number--clickable {
1835
+ cursor: pointer;
1836
+ }
1837
+ .react-datepicker__week-number.react-datepicker__week-number--clickable:not(.react-datepicker__week-number--selected):hover {
1838
+ border-radius: 0.3rem;
1839
+ background-color: #f0f0f0;
1840
+ }
1841
+ .react-datepicker__week-number--selected {
1842
+ border-radius: 0.3rem;
1843
+ background-color: #216ba5;
1844
+ color: #fff;
1845
+ }
1846
+ .react-datepicker__week-number--selected:hover {
1847
+ background-color: rgb(28.75, 93.2196969697, 143.75);
1848
+ }
1849
+
1850
+ .react-datepicker__day-names {
1851
+ white-space: nowrap;
1852
+ margin-bottom: -8px;
1853
+ }
1854
+
1855
+ .react-datepicker__week {
1856
+ white-space: nowrap;
1857
+ }
1858
+
1859
+ .react-datepicker__day-name,
1860
+ .react-datepicker__day,
1861
+ .react-datepicker__time-name {
1862
+ color: #000;
1863
+ display: inline-block;
1864
+ width: 1.7rem;
1865
+ line-height: 1.7rem;
1866
+ text-align: center;
1867
+ margin: 0.166rem;
1868
+ }
1869
+
1870
+ .react-datepicker__day,
1871
+ .react-datepicker__month-text,
1872
+ .react-datepicker__quarter-text,
1873
+ .react-datepicker__year-text {
1874
+ cursor: pointer;
1875
+ }
1876
+ .react-datepicker__day:not([aria-disabled=true]):hover,
1877
+ .react-datepicker__month-text:not([aria-disabled=true]):hover,
1878
+ .react-datepicker__quarter-text:not([aria-disabled=true]):hover,
1879
+ .react-datepicker__year-text:not([aria-disabled=true]):hover {
1880
+ border-radius: 0.3rem;
1881
+ background-color: #f0f0f0;
1882
+ }
1883
+ .react-datepicker__day--today,
1884
+ .react-datepicker__month-text--today,
1885
+ .react-datepicker__quarter-text--today,
1886
+ .react-datepicker__year-text--today {
1887
+ font-weight: bold;
1888
+ }
1889
+ .react-datepicker__day--highlighted,
1890
+ .react-datepicker__month-text--highlighted,
1891
+ .react-datepicker__quarter-text--highlighted,
1892
+ .react-datepicker__year-text--highlighted {
1893
+ border-radius: 0.3rem;
1894
+ background-color: #3dcc4a;
1895
+ color: #fff;
1896
+ }
1897
+ .react-datepicker__day--highlighted:not([aria-disabled=true]):hover,
1898
+ .react-datepicker__month-text--highlighted:not([aria-disabled=true]):hover,
1899
+ .react-datepicker__quarter-text--highlighted:not([aria-disabled=true]):hover,
1900
+ .react-datepicker__year-text--highlighted:not([aria-disabled=true]):hover {
1901
+ background-color: rgb(49.8551020408, 189.6448979592, 62.5632653061);
1902
+ }
1903
+ .react-datepicker__day--highlighted-custom-1,
1904
+ .react-datepicker__month-text--highlighted-custom-1,
1905
+ .react-datepicker__quarter-text--highlighted-custom-1,
1906
+ .react-datepicker__year-text--highlighted-custom-1 {
1907
+ color: magenta;
1908
+ }
1909
+ .react-datepicker__day--highlighted-custom-2,
1910
+ .react-datepicker__month-text--highlighted-custom-2,
1911
+ .react-datepicker__quarter-text--highlighted-custom-2,
1912
+ .react-datepicker__year-text--highlighted-custom-2 {
1913
+ color: green;
1914
+ }
1915
+ .react-datepicker__day--holidays,
1916
+ .react-datepicker__month-text--holidays,
1917
+ .react-datepicker__quarter-text--holidays,
1918
+ .react-datepicker__year-text--holidays {
1919
+ position: relative;
1920
+ border-radius: 0.3rem;
1921
+ background-color: #ff6803;
1922
+ color: #fff;
1923
+ }
1924
+ .react-datepicker__day--holidays .overlay,
1925
+ .react-datepicker__month-text--holidays .overlay,
1926
+ .react-datepicker__quarter-text--holidays .overlay,
1927
+ .react-datepicker__year-text--holidays .overlay {
1928
+ position: absolute;
1929
+ bottom: 100%;
1930
+ left: 50%;
1931
+ transform: translateX(-50%);
1932
+ background-color: #333;
1933
+ color: #fff;
1934
+ padding: 4px;
1935
+ border-radius: 4px;
1936
+ white-space: nowrap;
1937
+ visibility: hidden;
1938
+ opacity: 0;
1939
+ transition: visibility 0s, opacity 0.3s ease-in-out;
1940
+ }
1941
+ .react-datepicker__day--holidays:not([aria-disabled=true]):hover,
1942
+ .react-datepicker__month-text--holidays:not([aria-disabled=true]):hover,
1943
+ .react-datepicker__quarter-text--holidays:not([aria-disabled=true]):hover,
1944
+ .react-datepicker__year-text--holidays:not([aria-disabled=true]):hover {
1945
+ background-color: rgb(207, 82.9642857143, 0);
1946
+ }
1947
+ .react-datepicker__day--holidays:hover .overlay,
1948
+ .react-datepicker__month-text--holidays:hover .overlay,
1949
+ .react-datepicker__quarter-text--holidays:hover .overlay,
1950
+ .react-datepicker__year-text--holidays:hover .overlay {
1951
+ visibility: visible;
1952
+ opacity: 1;
1953
+ }
1954
+ .react-datepicker__day--selected, .react-datepicker__day--in-selecting-range, .react-datepicker__day--in-range,
1955
+ .react-datepicker__month-text--selected,
1956
+ .react-datepicker__month-text--in-selecting-range,
1957
+ .react-datepicker__month-text--in-range,
1958
+ .react-datepicker__quarter-text--selected,
1959
+ .react-datepicker__quarter-text--in-selecting-range,
1960
+ .react-datepicker__quarter-text--in-range,
1961
+ .react-datepicker__year-text--selected,
1962
+ .react-datepicker__year-text--in-selecting-range,
1963
+ .react-datepicker__year-text--in-range {
1964
+ border-radius: 0.3rem;
1965
+ background-color: #216ba5;
1966
+ color: #fff;
1967
+ }
1968
+ .react-datepicker__day--selected:not([aria-disabled=true]):hover, .react-datepicker__day--in-selecting-range:not([aria-disabled=true]):hover, .react-datepicker__day--in-range:not([aria-disabled=true]):hover,
1969
+ .react-datepicker__month-text--selected:not([aria-disabled=true]):hover,
1970
+ .react-datepicker__month-text--in-selecting-range:not([aria-disabled=true]):hover,
1971
+ .react-datepicker__month-text--in-range:not([aria-disabled=true]):hover,
1972
+ .react-datepicker__quarter-text--selected:not([aria-disabled=true]):hover,
1973
+ .react-datepicker__quarter-text--in-selecting-range:not([aria-disabled=true]):hover,
1974
+ .react-datepicker__quarter-text--in-range:not([aria-disabled=true]):hover,
1975
+ .react-datepicker__year-text--selected:not([aria-disabled=true]):hover,
1976
+ .react-datepicker__year-text--in-selecting-range:not([aria-disabled=true]):hover,
1977
+ .react-datepicker__year-text--in-range:not([aria-disabled=true]):hover {
1978
+ background-color: rgb(28.75, 93.2196969697, 143.75);
1979
+ }
1980
+ .react-datepicker__day--keyboard-selected,
1981
+ .react-datepicker__month-text--keyboard-selected,
1982
+ .react-datepicker__quarter-text--keyboard-selected,
1983
+ .react-datepicker__year-text--keyboard-selected {
1984
+ border-radius: 0.3rem;
1985
+ background-color: rgb(186.25, 217.0833333333, 241.25);
1986
+ color: rgb(0, 0, 0);
1987
+ }
1988
+ .react-datepicker__day--keyboard-selected:not([aria-disabled=true]):hover,
1989
+ .react-datepicker__month-text--keyboard-selected:not([aria-disabled=true]):hover,
1990
+ .react-datepicker__quarter-text--keyboard-selected:not([aria-disabled=true]):hover,
1991
+ .react-datepicker__year-text--keyboard-selected:not([aria-disabled=true]):hover {
1992
+ background-color: rgb(28.75, 93.2196969697, 143.75);
1993
+ }
1994
+ .react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range,
1995
+ .react-datepicker__month-text--in-range,
1996
+ .react-datepicker__quarter-text--in-range,
1997
+ .react-datepicker__year-text--in-range),
1998
+ .react-datepicker__month-text--in-selecting-range:not(.react-datepicker__day--in-range,
1999
+ .react-datepicker__month-text--in-range,
2000
+ .react-datepicker__quarter-text--in-range,
2001
+ .react-datepicker__year-text--in-range),
2002
+ .react-datepicker__quarter-text--in-selecting-range:not(.react-datepicker__day--in-range,
2003
+ .react-datepicker__month-text--in-range,
2004
+ .react-datepicker__quarter-text--in-range,
2005
+ .react-datepicker__year-text--in-range),
2006
+ .react-datepicker__year-text--in-selecting-range:not(.react-datepicker__day--in-range,
2007
+ .react-datepicker__month-text--in-range,
2008
+ .react-datepicker__quarter-text--in-range,
2009
+ .react-datepicker__year-text--in-range) {
2010
+ background-color: rgba(33, 107, 165, 0.5);
2011
+ }
2012
+ .react-datepicker__month--selecting-range .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range,
2013
+ .react-datepicker__month-text--in-selecting-range,
2014
+ .react-datepicker__quarter-text--in-selecting-range,
2015
+ .react-datepicker__year-text--in-selecting-range), .react-datepicker__year--selecting-range .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range,
2016
+ .react-datepicker__month-text--in-selecting-range,
2017
+ .react-datepicker__quarter-text--in-selecting-range,
2018
+ .react-datepicker__year-text--in-selecting-range),
2019
+ .react-datepicker__month--selecting-range .react-datepicker__month-text--in-range:not(.react-datepicker__day--in-selecting-range,
2020
+ .react-datepicker__month-text--in-selecting-range,
2021
+ .react-datepicker__quarter-text--in-selecting-range,
2022
+ .react-datepicker__year-text--in-selecting-range),
2023
+ .react-datepicker__year--selecting-range .react-datepicker__month-text--in-range:not(.react-datepicker__day--in-selecting-range,
2024
+ .react-datepicker__month-text--in-selecting-range,
2025
+ .react-datepicker__quarter-text--in-selecting-range,
2026
+ .react-datepicker__year-text--in-selecting-range),
2027
+ .react-datepicker__month--selecting-range .react-datepicker__quarter-text--in-range:not(.react-datepicker__day--in-selecting-range,
2028
+ .react-datepicker__month-text--in-selecting-range,
2029
+ .react-datepicker__quarter-text--in-selecting-range,
2030
+ .react-datepicker__year-text--in-selecting-range),
2031
+ .react-datepicker__year--selecting-range .react-datepicker__quarter-text--in-range:not(.react-datepicker__day--in-selecting-range,
2032
+ .react-datepicker__month-text--in-selecting-range,
2033
+ .react-datepicker__quarter-text--in-selecting-range,
2034
+ .react-datepicker__year-text--in-selecting-range),
2035
+ .react-datepicker__month--selecting-range .react-datepicker__year-text--in-range:not(.react-datepicker__day--in-selecting-range,
2036
+ .react-datepicker__month-text--in-selecting-range,
2037
+ .react-datepicker__quarter-text--in-selecting-range,
2038
+ .react-datepicker__year-text--in-selecting-range),
2039
+ .react-datepicker__year--selecting-range .react-datepicker__year-text--in-range:not(.react-datepicker__day--in-selecting-range,
2040
+ .react-datepicker__month-text--in-selecting-range,
2041
+ .react-datepicker__quarter-text--in-selecting-range,
2042
+ .react-datepicker__year-text--in-selecting-range) {
2043
+ background-color: #f0f0f0;
2044
+ color: #000;
2045
+ }
2046
+ .react-datepicker__day--disabled,
2047
+ .react-datepicker__month-text--disabled,
2048
+ .react-datepicker__quarter-text--disabled,
2049
+ .react-datepicker__year-text--disabled {
2050
+ cursor: default;
2051
+ color: #ccc;
2052
+ }
2053
+ .react-datepicker__day--disabled .overlay,
2054
+ .react-datepicker__month-text--disabled .overlay,
2055
+ .react-datepicker__quarter-text--disabled .overlay,
2056
+ .react-datepicker__year-text--disabled .overlay {
2057
+ position: absolute;
2058
+ bottom: 70%;
2059
+ left: 50%;
2060
+ transform: translateX(-50%);
2061
+ background-color: #333;
2062
+ color: #fff;
2063
+ padding: 4px;
2064
+ border-radius: 4px;
2065
+ white-space: nowrap;
2066
+ visibility: hidden;
2067
+ opacity: 0;
2068
+ transition: visibility 0s, opacity 0.3s ease-in-out;
2069
+ }
2070
+
2071
+ .react-datepicker__input-container {
2072
+ position: relative;
2073
+ display: inline-block;
2074
+ width: 100%;
2075
+ }
2076
+ .react-datepicker__input-container .react-datepicker__calendar-icon {
2077
+ position: absolute;
2078
+ padding: 0.5rem;
2079
+ box-sizing: content-box;
2080
+ }
2081
+
2082
+ .react-datepicker__view-calendar-icon input {
2083
+ padding: 6px 10px 5px 25px;
2084
+ }
2085
+
2086
+ .react-datepicker__year-read-view,
2087
+ .react-datepicker__month-read-view,
2088
+ .react-datepicker__month-year-read-view {
2089
+ border: 1px solid transparent;
2090
+ border-radius: 0.3rem;
2091
+ position: relative;
2092
+ }
2093
+ .react-datepicker__year-read-view:hover,
2094
+ .react-datepicker__month-read-view:hover,
2095
+ .react-datepicker__month-year-read-view:hover {
2096
+ cursor: pointer;
2097
+ }
2098
+ .react-datepicker__year-read-view:hover .react-datepicker__year-read-view--down-arrow,
2099
+ .react-datepicker__year-read-view:hover .react-datepicker__month-read-view--down-arrow,
2100
+ .react-datepicker__month-read-view:hover .react-datepicker__year-read-view--down-arrow,
2101
+ .react-datepicker__month-read-view:hover .react-datepicker__month-read-view--down-arrow,
2102
+ .react-datepicker__month-year-read-view:hover .react-datepicker__year-read-view--down-arrow,
2103
+ .react-datepicker__month-year-read-view:hover .react-datepicker__month-read-view--down-arrow {
2104
+ border-top-color: rgb(178.5, 178.5, 178.5);
2105
+ }
2106
+ .react-datepicker__year-read-view--down-arrow,
2107
+ .react-datepicker__month-read-view--down-arrow,
2108
+ .react-datepicker__month-year-read-view--down-arrow {
2109
+ transform: rotate(135deg);
2110
+ right: -16px;
2111
+ top: 0;
2112
+ }
2113
+
2114
+ .react-datepicker__year-dropdown,
2115
+ .react-datepicker__month-dropdown,
2116
+ .react-datepicker__month-year-dropdown {
2117
+ background-color: #f0f0f0;
2118
+ position: absolute;
2119
+ width: 50%;
2120
+ left: 25%;
2121
+ top: 30px;
2122
+ z-index: 1;
2123
+ text-align: center;
2124
+ border-radius: 0.3rem;
2125
+ border: 1px solid #aeaeae;
2126
+ }
2127
+ .react-datepicker__year-dropdown:hover,
2128
+ .react-datepicker__month-dropdown:hover,
2129
+ .react-datepicker__month-year-dropdown:hover {
2130
+ cursor: pointer;
2131
+ }
2132
+ .react-datepicker__year-dropdown--scrollable,
2133
+ .react-datepicker__month-dropdown--scrollable,
2134
+ .react-datepicker__month-year-dropdown--scrollable {
2135
+ height: 150px;
2136
+ overflow-y: scroll;
2137
+ }
2138
+
2139
+ .react-datepicker__year-option,
2140
+ .react-datepicker__month-option,
2141
+ .react-datepicker__month-year-option {
2142
+ line-height: 20px;
2143
+ width: 100%;
2144
+ display: block;
2145
+ margin-left: auto;
2146
+ margin-right: auto;
2147
+ }
2148
+ .react-datepicker__year-option:first-of-type,
2149
+ .react-datepicker__month-option:first-of-type,
2150
+ .react-datepicker__month-year-option:first-of-type {
2151
+ border-top-left-radius: 0.3rem;
2152
+ border-top-right-radius: 0.3rem;
2153
+ }
2154
+ .react-datepicker__year-option:last-of-type,
2155
+ .react-datepicker__month-option:last-of-type,
2156
+ .react-datepicker__month-year-option:last-of-type {
2157
+ -webkit-user-select: none;
2158
+ -moz-user-select: none;
2159
+ -ms-user-select: none;
2160
+ user-select: none;
2161
+ border-bottom-left-radius: 0.3rem;
2162
+ border-bottom-right-radius: 0.3rem;
2163
+ }
2164
+ .react-datepicker__year-option:hover,
2165
+ .react-datepicker__month-option:hover,
2166
+ .react-datepicker__month-year-option:hover {
2167
+ background-color: #ccc;
2168
+ }
2169
+ .react-datepicker__year-option:hover .react-datepicker__navigation--years-upcoming,
2170
+ .react-datepicker__month-option:hover .react-datepicker__navigation--years-upcoming,
2171
+ .react-datepicker__month-year-option:hover .react-datepicker__navigation--years-upcoming {
2172
+ border-bottom-color: rgb(178.5, 178.5, 178.5);
2173
+ }
2174
+ .react-datepicker__year-option:hover .react-datepicker__navigation--years-previous,
2175
+ .react-datepicker__month-option:hover .react-datepicker__navigation--years-previous,
2176
+ .react-datepicker__month-year-option:hover .react-datepicker__navigation--years-previous {
2177
+ border-top-color: rgb(178.5, 178.5, 178.5);
2178
+ }
2179
+ .react-datepicker__year-option--selected,
2180
+ .react-datepicker__month-option--selected,
2181
+ .react-datepicker__month-year-option--selected {
2182
+ position: absolute;
2183
+ left: 15px;
2184
+ }
2185
+
2186
+ .react-datepicker__close-icon {
2187
+ cursor: pointer;
2188
+ background-color: transparent;
2189
+ border: 0;
2190
+ outline: 0;
2191
+ padding: 0 6px 0 0;
2192
+ position: absolute;
2193
+ top: 0;
2194
+ right: 0;
2195
+ height: 100%;
2196
+ display: table-cell;
2197
+ vertical-align: middle;
2198
+ }
2199
+ .react-datepicker__close-icon::after {
2200
+ cursor: pointer;
2201
+ background-color: #216ba5;
2202
+ color: #fff;
2203
+ border-radius: 50%;
2204
+ height: 16px;
2205
+ width: 16px;
2206
+ padding: 2px;
2207
+ font-size: 12px;
2208
+ line-height: 1;
2209
+ text-align: center;
2210
+ display: table-cell;
2211
+ vertical-align: middle;
2212
+ content: "×";
2213
+ }
2214
+ .react-datepicker__close-icon--disabled {
2215
+ cursor: default;
2216
+ }
2217
+ .react-datepicker__close-icon--disabled::after {
2218
+ cursor: default;
2219
+ background-color: #ccc;
2220
+ }
2221
+
2222
+ .react-datepicker__today-button {
2223
+ background: #f0f0f0;
2224
+ border-top: 1px solid #aeaeae;
2225
+ cursor: pointer;
2226
+ text-align: center;
2227
+ font-weight: bold;
2228
+ padding: 5px 0;
2229
+ clear: left;
2230
+ }
2231
+
2232
+ .react-datepicker__portal {
2233
+ position: fixed;
2234
+ width: 100vw;
2235
+ height: 100vh;
2236
+ background-color: rgba(0, 0, 0, 0.8);
2237
+ left: 0;
2238
+ top: 0;
2239
+ justify-content: center;
2240
+ align-items: center;
2241
+ display: flex;
2242
+ z-index: 2147483647;
2243
+ }
2244
+ .react-datepicker__portal .react-datepicker__day-name,
2245
+ .react-datepicker__portal .react-datepicker__day,
2246
+ .react-datepicker__portal .react-datepicker__time-name {
2247
+ width: 3rem;
2248
+ line-height: 3rem;
2249
+ }
2250
+ @media (max-width: 400px), (max-height: 550px) {
2251
+ .react-datepicker__portal .react-datepicker__day-name,
2252
+ .react-datepicker__portal .react-datepicker__day,
2253
+ .react-datepicker__portal .react-datepicker__time-name {
2254
+ width: 2rem;
2255
+ line-height: 2rem;
2256
+ }
2257
+ }
2258
+ .react-datepicker__portal .react-datepicker__current-month,
2259
+ .react-datepicker__portal .react-datepicker-time__header {
2260
+ font-size: 1.44rem;
2261
+ }
2262
+
2263
+ .react-datepicker__children-container {
2264
+ width: 13.8rem;
2265
+ margin: 0.4rem;
2266
+ padding-right: 0.2rem;
2267
+ padding-left: 0.2rem;
2268
+ height: auto;
2269
+ }
2270
+
2271
+ .react-datepicker__aria-live {
2272
+ position: absolute;
2273
+ clip-path: circle(0);
2274
+ border: 0;
2275
+ height: 1px;
2276
+ margin: -1px;
2277
+ overflow: hidden;
2278
+ padding: 0;
2279
+ width: 1px;
2280
+ white-space: nowrap;
2281
+ }
2282
+
2283
+ .react-datepicker__calendar-icon {
2284
+ width: 1em;
2285
+ height: 1em;
2286
+ vertical-align: -0.125em;
2287
+ }
2288
+ ._datePicker_10sq9_1 {
2289
+ position: relative;
2290
+ width: 100%;
2291
+ transition: all 0.2s ease-in-out;
2292
+ border: none !important;
2293
+ }
2294
+
2295
+ ._inlinePicker_10sq9_8 {
2296
+ position: absolute;
2297
+ top: 100%;
2298
+ left: 0;
2299
+ z-index: 1000;
2300
+ background: var(--moz-cta-content-bg);
2301
+ border: 1px solid var(--moz-border);
2302
+ border-radius: 0.5rem;
2303
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
2304
+ margin-top: 1rem;
2305
+ opacity: 0;
2306
+ visibility: hidden;
2307
+ transform: translateY(-10px) scale(0.98);
2308
+ transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
2309
+ pointer-events: none;
2310
+ }
2311
+ ._inlinePicker_10sq9_8._visible_10sq9_24 {
2312
+ opacity: 1;
2313
+ visibility: visible;
2314
+ transform: translateY(0) scale(1);
2315
+ pointer-events: auto;
2316
+ }
2317
+ ._inlinePicker_10sq9_8._right_10sq9_30 {
2318
+ left: auto;
2319
+ right: 0;
2320
+ }
2321
+ @media only screen and (max-width: 768px) {
2322
+ ._inlinePicker_10sq9_8 {
2323
+ width: 260px !important;
2324
+ }
2325
+ ._inlinePicker_10sq9_8._left_10sq9_38 {
2326
+ left: 0;
2327
+ right: auto;
2328
+ }
2329
+ ._inlinePicker_10sq9_8._right_10sq9_30 {
2330
+ left: auto;
2331
+ right: 0;
2332
+ }
2333
+ }
2334
+
2335
+ ._datePickerShortcuts_10sq9_48 {
2336
+ display: flex;
2337
+ gap: 0.5rem;
2338
+ flex-wrap: wrap;
2339
+ padding: 0.5rem;
2340
+ justify-content: center;
2341
+ align-items: center;
1449
2342
  }
1450
- .litepicker .container__months .month-item-header div > .month-item-name,
1451
- .litepicker .container__months .month-item-header div > .month-item-year {
1452
- background-size: 15px;
1453
- background-position: center right 0.6rem;
1454
- background-color: transparent;
1455
- font-size: var(--moz-font-weight-input) var(--moz-font-size-input)/var(--moz-line-height-input) var(--moz-font-family-input);
1456
- border-width: 1px;
1457
- border-style: solid;
1458
- background-repeat: no-repeat;
1459
- padding-top: 0.5rem;
1460
- padding-bottom: 0.5rem;
1461
- padding-left: 0.5rem;
1462
- padding-right: 0.5rem;
1463
- border-radius: 0.75rem;
1464
- border-color: var(--moz-input-border);
1465
- color: var(--moz-text-input);
2343
+
2344
+ .react-datepicker {
2345
+ width: var(--picker-width, 540px) !important;
2346
+ display: flex !important;
2347
+ flex-wrap: wrap !important;
2348
+ background-color: var(--moz-cta-content-bg) !important;
2349
+ color: var(--moz-text-input) !important;
2350
+ padding: 0 !important;
2351
+ margin: 0 !important;
1466
2352
  }
1467
- .litepicker .container__months .month-item-header div > .month-item-name:focus,
1468
- .litepicker .container__months .month-item-header div > .month-item-year:focus {
1469
- outline: none;
1470
- border-color: var(--moz-text-input);
1471
- --tw-ring-color: transparent;
2353
+ @media only screen and (max-width: 768px) {
2354
+ .react-datepicker {
2355
+ width: var(--picker-mobile-width, 260px) !important;
2356
+ display: flex !important;
2357
+ flex-direction: column !important;
2358
+ }
1472
2359
  }
1473
- .litepicker .container__days .day-item {
1474
- color: var(--moz-text-input);
2360
+
2361
+ .react-datepicker__month-container {
2362
+ display: block !important;
2363
+ width: 260px !important;
2364
+ padding: 0 !important;
2365
+ margin: 0 !important;
2366
+ background-color: var(--moz-cta-content-bg) !important;
1475
2367
  }
1476
- .litepicker .container__days .day-item:hover {
1477
- box-shadow: none;
1478
- background-color: var(--moz-cta-content-sec-bg);
1479
- color: var(--moz-text-label);
2368
+ @media only screen and (max-width: 768px) {
2369
+ .react-datepicker__month-container {
2370
+ width: 260px !important;
2371
+ }
1480
2372
  }
1481
- .litepicker .container__days .day-item.is-today, .litepicker .container__days .day-item.is-today:hover {
1482
- color: var(--moz-text-primary);
2373
+
2374
+ .react-datepicker__children-container {
2375
+ width: 100% !important;
1483
2376
  }
1484
- .litepicker .container__days .day-item.is-start-date, .litepicker .container__days .day-item.is-start-date:hover, .litepicker .container__days .day-item.is-end-date, .litepicker .container__days .day-item.is-end-date:hover {
1485
- background-color: var(--moz-cta-content-sec-bg);
1486
- color: var(--moz-text-input);
2377
+
2378
+ @media (min-width: 768px) {
2379
+ .react-datepicker__month-container {
2380
+ display: inline-block !important;
2381
+ vertical-align: top !important;
2382
+ margin: 0 !important;
2383
+ padding: 0 !important;
2384
+ }
2385
+ .react-datepicker__month-container:last-child {
2386
+ margin-right: 0 !important;
2387
+ }
1487
2388
  }
1488
- .litepicker .container__days .day-item.is-in-range, .litepicker .container__days .day-item.is-in-range:hover {
1489
- background-color: var(--moz-cta-body-bg);
2389
+ .react-datepicker__month-container + .react-datepicker__month-container {
2390
+ margin-left: 0 !important;
1490
2391
  }
1491
- .litepicker .container__days .week-number {
1492
- color: var(--moz-text-label);
2392
+
2393
+ @media (min-width: 768px) {
2394
+ .react-datepicker__month-container + .react-datepicker__month-container {
2395
+ margin-left: 1rem !important;
2396
+ }
1493
2397
  }
1494
- .litepicker .litepicker-shortcuts {
1495
- display: flex;
1496
- justify-content: center;
1497
- align-items: center;
1498
- padding: 0 0 0.5rem 0;
1499
- border-bottom: 1px solid var(--moz-input-border);
1500
- background-color: var(--moz-cta-content-bg);
1501
- margin: 0 0 10px 0;
2398
+ .react-datepicker__header {
2399
+ border-bottom: 1px solid var(--moz-border) !important;
2400
+ color: var(--moz-text-title) !important;
2401
+ background-color: var(--moz-cta-content-bg) !important;
1502
2402
  }
1503
- .litepicker .litepicker-shortcuts .litepicker-shortcut-btn {
1504
- margin: 0 0.5rem;
1505
- padding: 0.5rem 0.5rem;
1506
- border: 1px solid var(--moz-input-border);
1507
- border-radius: 0.5rem;
1508
- background-color: transparent;
1509
- color: var(--moz-cta-tertiary-text);
1510
- cursor: pointer;
1511
- transition: background-color 0.2s ease;
2403
+
2404
+ .react-datepicker__month-container:nth-of-type(2) ._react-datepicker__header_10sq9_111 ._react-datepicker__day-names_10sq9_117 {
2405
+ margin-top: 40px !important;
1512
2406
  }
1513
- .litepicker .litepicker-shortcuts .litepicker-shortcut-btn:hover {
1514
- background-color: var(--moz-cta-content-sec-bg);
2407
+
2408
+ .react-datepicker__month-container:nth-of-type(2) .react-datepicker__header .react-datepicker__day-names {
2409
+ margin-top: 16px !important;
1515
2410
  }
1516
2411
 
1517
- @media (max-width: 1023px) {
1518
- :root {
1519
- --litepicker-day-width: 35px;
1520
- }
1521
- }._inputWrapper_c5acm_1 {
1522
- position: relative;
1523
- display: flex;
1524
- align-items: center;
1525
- width: 100%;
2412
+ .react-datepicker__current-month {
2413
+ color: var(--moz-text-title) !important;
2414
+ font-weight: 600 !important;
1526
2415
  }
1527
2416
 
1528
- ._input_c5acm_1 {
1529
- flex: 1;
1530
- font: var(--moz-font-weight-input) var(--moz-font-size-input)/var(--moz-line-height-input) var(--moz-font-family-input);
1531
- padding: 0.75rem 0.75rem;
1532
- background: transparent;
1533
- border: none;
1534
- border-bottom: 1px solid var(--moz-input-border);
1535
- color: var(--moz-text-input);
1536
- color-scheme: var(--moz-input-scheme);
1537
- border-radius: 0;
1538
- max-width: 100%;
1539
- width: auto;
1540
- box-sizing: border-box;
2417
+ .react-datepicker__day-name {
2418
+ color: var(--moz-text-secondary) !important;
2419
+ font-weight: 500 !important;
1541
2420
  }
1542
- ._input_c5acm_1:focus {
1543
- outline: none;
1544
- box-shadow: 0 0 5px var(--moz-input-border);
2421
+
2422
+ .react-datepicker__day {
2423
+ color: var(--moz-text-input) !important;
2424
+ background-color: transparent !important;
2425
+ border-radius: 0.25rem !important;
1545
2426
  }
1546
- ._input_c5acm_1:disabled {
1547
- color: var(--moz-bg-gray);
1548
- background: var(--moz-input-disabled);
2427
+ .react-datepicker__day:hover {
2428
+ background-color: var(--moz-bg-active) !important;
2429
+ color: var(--moz-text-primary) !important;
1549
2430
  }
1550
- ._input_c5acm_1[type=number] {
1551
- appearance: textfield;
2431
+ .react-datepicker__day._react-datepicker__day--selected_10sq9_144 {
2432
+ background-color: var(--moz-cta-body-bg) !important;
2433
+ color: var(--moz-text-input) !important;
1552
2434
  }
1553
- ._input_c5acm_1[type=number]::-webkit-outer-spin-button, ._input_c5acm_1[type=number]::-webkit-inner-spin-button {
1554
- margin: 0;
1555
- appearance: none;
2435
+ .react-datepicker__day._react-datepicker__day--selected_10sq9_144:hover {
2436
+ background-color: var(--moz-cta-body-bg) !important;
1556
2437
  }
1557
- ._input--r-md_c5acm_37 {
1558
- border-radius: 8px;
1559
- border-bottom-left-radius: 0;
1560
- border-bottom-right-radius: 0;
2438
+ .react-datepicker__day._react-datepicker__day--in-range_10sq9_151 {
2439
+ background-color: var(--moz-cta-body-bg) !important;
2440
+ color: var(--moz-text-input) !important;
2441
+ opacity: 0.8;
1561
2442
  }
1562
- ._input--r-sm_c5acm_42 {
1563
- border-radius: 2px;
1564
- border-bottom-left-radius: 0;
1565
- border-bottom-right-radius: 0;
2443
+ .react-datepicker__day._react-datepicker__day--in-range_10sq9_151:hover {
2444
+ background-color: var(--moz-cta-body-bg) !important;
2445
+ opacity: 1;
1566
2446
  }
1567
- ._input--with-icon-left_c5acm_47 {
1568
- padding-left: 2rem;
2447
+ .react-datepicker__day._react-datepicker__day--keyboard-selected_10sq9_160 {
2448
+ background-color: var(--moz-cta-body-bg) !important;
2449
+ color: var(--moz-text-input) !important;
1569
2450
  }
1570
- ._input--with-icon-right_c5acm_50 {
1571
- padding-right: 2rem;
2451
+ .react-datepicker__day._react-datepicker__day--disabled_10sq9_164 {
2452
+ color: var(--moz-state-disabled) !important;
2453
+ background-color: var(--moz-state-disabled-bg) !important;
2454
+ cursor: not-allowed !important;
1572
2455
  }
1573
- ._input--filled_c5acm_53 {
1574
- background: var(--moz-input-filled);
2456
+
2457
+ .react-datepicker__day--in-selecting-range {
2458
+ background-color: var(--moz-cta-body-bg) !important;
2459
+ color: var(--moz-text-input) !important;
2460
+ opacity: 0.6 !important;
1575
2461
  }
1576
- ._input--error_c5acm_56 {
1577
- border-color: rgb(220, 53, 69);
2462
+
2463
+ .react-datepicker__day--range-start {
2464
+ background-color: var(--moz-cta-content-bg) !important;
2465
+ color: var(--moz-text-input) !important;
2466
+ font-weight: bold !important;
2467
+ opacity: 1 !important;
1578
2468
  }
1579
- ._input--line-through_c5acm_59 {
1580
- text-decoration: line-through;
2469
+
2470
+ .react-datepicker__day--range-end {
2471
+ background-color: var(--moz-cta-content-bg) !important;
2472
+ color: var(--moz-text-input) !important;
2473
+ font-weight: bold !important;
2474
+ opacity: 1 !important;
1581
2475
  }
1582
- ._input--line-through_c5acm_59::-webkit-datetime-edit, ._input--line-through_c5acm_59::-webkit-calendar-picker-indicator {
1583
- text-decoration: line-through !important;
1584
- -webkit-text-decoration: line-through !important;
2476
+
2477
+ .react-datepicker__day--in-range {
2478
+ background-color: var(--moz-cta-body-bg) !important;
2479
+ color: var(--moz-text-input) !important;
2480
+ opacity: 0.8 !important;
1585
2481
  }
1586
- ._input--line-through_c5acm_59[type=date]::-webkit-datetime-edit, ._input--line-through_c5acm_59[type=date]::-webkit-datetime-edit-fields-wrapper, ._input--line-through_c5acm_59[type=date]::-webkit-datetime-edit-text, ._input--line-through_c5acm_59[type=date]::-webkit-datetime-edit-month-field, ._input--line-through_c5acm_59[type=date]::-webkit-datetime-edit-day-field, ._input--line-through_c5acm_59[type=date]::-webkit-datetime-edit-year-field {
1587
- text-decoration: line-through !important;
1588
- -webkit-text-decoration: line-through !important;
2482
+ .react-datepicker__day--in-range:hover {
2483
+ background-color: var(--moz-cta-body-bg) !important;
2484
+ opacity: 1 !important;
1589
2485
  }
1590
- ._input--borderless_c5acm_70 {
1591
- border: none;
1592
- border-bottom: none;
2486
+
2487
+ .react-datepicker__day--range-start.react-datepicker__day--in-range,
2488
+ .react-datepicker__day--range-end.react-datepicker__day--in-range {
2489
+ background-color: var(--moz-cta-content-sec-bg) !important;
2490
+ color: var(--moz-text-input) !important;
2491
+ opacity: 1 !important;
2492
+ font-weight: bold !important;
1593
2493
  }
1594
- ._input--rounded_c5acm_74 {
1595
- border-bottom-left-radius: 8px;
1596
- border-bottom-right-radius: 8px;
2494
+
2495
+ .react-datepicker__day--in-range:not(.react-datepicker__day--range-start):not(.react-datepicker__day--range-end) {
2496
+ background-color: var(--moz-cta-body-bg) !important;
2497
+ color: var(--moz-text-input) !important;
2498
+ opacity: 0.8 !important;
1597
2499
  }
1598
- ._input_c5acm_1::placeholder {
1599
- color: var(--moz-text-input);
1600
- opacity: 1;
2500
+
2501
+ .react-datepicker__navigation {
2502
+ color: var(--moz-text-secondary) !important;
1601
2503
  }
1602
- ._input_c5acm_1:-ms-input-placeholder {
1603
- color: var(--moz-text-input);
2504
+ .react-datepicker__navigation:hover {
2505
+ color: var(--moz-text-primary) !important;
1604
2506
  }
1605
- ._input_c5acm_1::-ms-input-placeholder {
1606
- color: var(--moz-text-input);
2507
+
2508
+ .react-datepicker__month-dropdown {
2509
+ background-color: var(--moz-cta-content-bg) !important;
2510
+ border: 1px solid var(--moz-border) !important;
2511
+ color: var(--moz-text-input) !important;
1607
2512
  }
1608
2513
 
1609
- ._inputIcon_c5acm_89 {
1610
- position: absolute;
1611
- pointer-events: none;
1612
- display: flex;
1613
- align-items: center;
1614
- justify-content: center;
1615
- top: 50%;
1616
- transform: translateY(-50%);
2514
+ .react-datepicker__year-dropdown {
2515
+ background-color: var(--moz-cta-content-bg) !important;
2516
+ border: 1px solid var(--moz-border) !important;
2517
+ color: var(--moz-text-input) !important;
1617
2518
  }
1618
- ._inputIcon--p-left_c5acm_98 {
1619
- left: 0.5rem;
2519
+
2520
+ .react-datepicker__month-option,
2521
+ .react-datepicker__year-option {
2522
+ color: var(--moz-text-input) !important;
1620
2523
  }
1621
- ._inputIcon--p-right_c5acm_101 {
1622
- right: 0.5rem;
1623
- }._filterButton_c0yjo_1 {
1624
- display: flex;
1625
- background: var(--moz-cta-content-bg);
1626
- color: var(--moz-text-label);
1627
- border: 1px solid var(--moz-border);
1628
- padding: 0.5rem;
1629
- border-radius: 2px;
1630
- justify-content: center;
1631
- align-items: center;
1632
- gap: 0.5rem;
1633
- cursor: pointer;
1634
- margin-left: auto;
1635
- margin-bottom: 1rem;
2524
+ .react-datepicker__month-option:hover,
2525
+ .react-datepicker__year-option:hover {
2526
+ background-color: var(--moz-bg-active) !important;
2527
+ color: var(--moz-text-primary) !important;
1636
2528
  }
1637
- @media (min-width: 768px) {
1638
- ._filterButton_c0yjo_1 {
1639
- display: none;
1640
- }
2529
+ .react-datepicker__month-option._react-datepicker__month-option--selected_10sq9_242, .react-datepicker__month-option._react-datepicker__year-option--selected_10sq9_242,
2530
+ .react-datepicker__year-option._react-datepicker__month-option--selected_10sq9_242,
2531
+ .react-datepicker__year-option._react-datepicker__year-option--selected_10sq9_242 {
2532
+ background-color: var(--moz-bg-active) !important;
2533
+ color: var(--moz-text-primary) !important;
1641
2534
  }
1642
2535
 
1643
- ._buttonClose_c0yjo_21 {
1644
- display: flex;
1645
- color: var(--moz-text-label);
1646
- justify-content: flex-end;
1647
- cursor: pointer;
1648
- flex: 1;
1649
- width: 100%;
1650
- }
1651
- ._buttonClose--hidden_c0yjo_29 {
1652
- display: none;
2536
+ .react-datepicker__day--outside-month {
2537
+ color: var(--moz-text-tertiary) !important;
1653
2538
  }
1654
- @media (min-width: 768px) {
1655
- ._buttonClose_c0yjo_21 {
1656
- display: none;
1657
- }
2539
+
2540
+ .react-datepicker__input-container input {
2541
+ all: unset !important;
2542
+ color: var(--moz-text-input) !important;
2543
+ background-color: #fff !important;
2544
+ border: 1px solid var(--moz-border) !important;
2545
+ border-radius: 0.25rem !important;
2546
+ padding: 0.75rem 1rem !important;
2547
+ font-size: var(--moz-font-weight-input) var(--moz-font-size-input)/var(--moz-line-height-input) var(--moz-font-family-input) !important;
2548
+ width: 100% !important;
2549
+ box-sizing: border-box !important;
2550
+ }
2551
+ .react-datepicker__input-container input:focus {
2552
+ border-color: var(--moz-cta-content-sec-bg) !important;
2553
+ box-shadow: 0 0 0 2px rgba(255, 155, 0, 0.2) !important;
2554
+ outline: none !important;
2555
+ }
2556
+ .react-datepicker__input-container input:disabled {
2557
+ background-color: var(--moz-input-disabled) !important;
2558
+ color: var(--moz-state-disabled) !important;
2559
+ border-color: var(--moz-state-disabled) !important;
2560
+ }
2561
+
2562
+ .react-datepicker-wrapper ._react-datepicker__input-container_10sq9_253 input {
2563
+ all: unset !important;
2564
+ color: var(--moz-text-input) !important;
2565
+ background-color: #fff !important;
2566
+ border: 1px solid var(--moz-border) !important;
2567
+ border-radius: 0.25rem !important;
2568
+ padding: 0.75rem 1rem !important;
2569
+ font-size: var(--moz-font-weight-input) var(--moz-font-size-input)/var(--moz-line-height-input) var(--moz-font-family-input) !important;
2570
+ width: 100% !important;
2571
+ box-sizing: border-box !important;
1658
2572
  }
1659
2573
 
1660
- ._toolbar_c0yjo_38 {
1661
- background-color: var(--moz-cta-content-bg);
1662
- box-shadow: var(--moz-input-border) 0px 10px 10px -10px;
1663
- position: absolute;
1664
- padding: 1rem;
1665
- left: 0;
1666
- right: 0;
1667
- z-index: 10;
2574
+ .react-datepicker__day.react-datepicker__day--selected {
2575
+ background-color: var(--moz-cta-content-sec-bg) !important;
2576
+ color: var(--moz-text-input) !important;
2577
+ font-weight: bold !important;
2578
+ border: 2px solid var(--moz-cta-content-sec-bg) !important;
1668
2579
  }
1669
- ._toolbar--hide_c0yjo_47 {
1670
- display: none;
2580
+ .react-datepicker__day.react-datepicker__day--selected:hover {
2581
+ background-color: var(--moz-cta-content-sec-bg) !important;
2582
+ color: var(--moz-text-input) !important;
1671
2583
  }
1672
- @media (min-width: 768px) {
1673
- ._toolbar--hide_c0yjo_47 {
1674
- display: block;
1675
- }
2584
+
2585
+ ._singleMode_10sq9_298 {
2586
+ --picker-width: 251px;
2587
+ --picker-mobile-width: 251px;
1676
2588
  }
1677
- @media (min-width: 768px) {
1678
- ._toolbar_c0yjo_38 {
1679
- background-color: transparent;
1680
- box-shadow: none;
1681
- padding: 1rem 0;
1682
- position: relative;
1683
- gap: 1rem;
1684
- }
1685
- ._toolbar--hidden_c0yjo_63 {
1686
- display: flex;
1687
- }
2589
+
2590
+ ._rangeMode_10sq9_303 {
2591
+ --picker-width: 540px;
2592
+ --picker-mobile-width: 260px;
1688
2593
  }@media (max-width: 768px) {
1689
2594
  ._content_6vryc_2 {
1690
2595
  padding: 0;
@@ -31064,6 +31969,10 @@ div.ant-typography-edit-content.ant-typography-rtl {
31064
31969
  ._divider_1k33v_1 hr {
31065
31970
  border: 0;
31066
31971
  border-top: 1px solid var(--moz-border) !important;
31972
+ }._infoText_1m2uc_1 {
31973
+ color: var(--moz-text-secondary);
31974
+ font: 0.75rem/1rem var(--moz-font-family);
31975
+ font-style: italic;
31067
31976
  }
31068
31977
  body {
31069
31978
  margin: 0 !important;