@syncfusion/ej2-calendars 28.2.11 → 29.1.33

package/styles/tailwind-dark.css

@@ -284,7 +284,7 @@ ejs-calendar {
   margin: 0 8px;
 }
 .e-calendar .e-footer-container {
-  background-color: #232e3e;
+  background-color: rgb(27.323255814, 36.1372093023, 48.476744186);
   border-top: none;
   text-align: center;
   cursor: default;
@@ -383,7 +383,7 @@ ejs-calendar {
 }
 
 .e-calendar .e-btn.e-today.e-flat.e-disabled, .e-calendar .e-btn.e-today.e-flat.e-disabled:hover, .e-calendar .e-btn.e-today.e-flat.e-disabled:active, .e-calendar .e-btn.e-today.e-flat.e-disabled:focus, .e-calendar .e-btn.e-today.e-flat.e-disabled:hover:active {
-  background: #232e3e;
+  background: rgb(27.323255814, 36.1372093023, 48.476744186);
   border-color: rgba(0, 0, 0, 0.65);
   -webkit-box-shadow: none;
           box-shadow: none;
@@ -430,8 +430,8 @@ ejs-calendar {
   text-decoration: none;
 }
 .e-calendar .e-header .e-title:focus {
-  -webkit-box-shadow: 0 0 0 1px #8b919e;
-          box-shadow: 0 0 0 1px #8b919e;
+  -webkit-box-shadow: 0 0 0 1px rgb(79.1344680851, 84.3114893617, 94.6655319149);
+          box-shadow: 0 0 0 1px rgb(79.1344680851, 84.3114893617, 94.6655319149);
   background: none;
   text-decoration: none;
 }
@@ -450,8 +450,8 @@ ejs-calendar {
   background: transparent;
 }
 .e-calendar .e-header .e-prev:focus, .e-calendar .e-header .e-next:focus {
-  -webkit-box-shadow: 0 0 0 1px #8b919e;
-          box-shadow: 0 0 0 1px #8b919e;
+  -webkit-box-shadow: 0 0 0 1px rgb(79.1344680851, 84.3114893617, 94.6655319149);
+          box-shadow: 0 0 0 1px rgb(79.1344680851, 84.3114893617, 94.6655319149);
 }
 .e-calendar .e-header .e-prev:active, .e-calendar .e-header .e-next:active {
   background: transparent;
@@ -483,7 +483,7 @@ ejs-calendar {
   color: #6b7280;
 }
 .e-calendar .e-content.e-year td.e-selected:hover span.e-day, .e-calendar .e-content.e-decade td.e-selected:hover span.e-day {
-  background-color: #10b4cd;
+  background-color: rgb(15.7857142857, 180.1428571429, 205.2142857143);
 }
 .e-calendar .e-content.e-year td > span.e-day, .e-calendar .e-content.e-decade td > span.e-day {
   background: none;
@@ -538,7 +538,7 @@ ejs-calendar {
   color: #000;
 }
 .e-calendar .e-content td.e-today.e-selected:hover span.e-day, .e-calendar .e-content td.e-selected:hover span.e-day, .e-calendar .e-content td.e-selected.e-focused-date span.e-day {
-  background: #10b4cd;
+  background: rgb(15.7857142857, 180.1428571429, 205.2142857143);
   color: #000;
 }
 .e-calendar .e-content span {
@@ -647,8 +647,8 @@ ejs-calendar {
   }
 }
 .e-calendar .e-calendar-content-table .e-cell.e-focused-cell span.e-day {
-  -webkit-box-shadow: 0 0 0 1px #8b919e;
-          box-shadow: 0 0 0 1px #8b919e;
+  -webkit-box-shadow: 0 0 0 1px rgb(79.1344680851, 84.3114893617, 94.6655319149);
+          box-shadow: 0 0 0 1px rgb(79.1344680851, 84.3114893617, 94.6655319149);
   border-radius: 4px;
 }
 
@@ -806,8 +806,8 @@ ejs-calendar {
   text-decoration: none;
 }
 .e-bigger.e-small .e-calendar .e-header .e-title:focus {
-  -webkit-box-shadow: 0 0 0 1px #8b919e;
-          box-shadow: 0 0 0 1px #8b919e;
+  -webkit-box-shadow: 0 0 0 1px rgb(79.1344680851, 84.3114893617, 94.6655319149);
+          box-shadow: 0 0 0 1px rgb(79.1344680851, 84.3114893617, 94.6655319149);
   background: none;
   text-decoration: none;
 }
@@ -826,8 +826,8 @@ ejs-calendar {
   background: transparent;
 }
 .e-bigger.e-small .e-calendar .e-header .e-prev:focus, .e-bigger.e-small .e-calendar .e-header .e-next:focus {
-  -webkit-box-shadow: 0 0 0 1px #8b919e;
-          box-shadow: 0 0 0 1px #8b919e;
+  -webkit-box-shadow: 0 0 0 1px rgb(79.1344680851, 84.3114893617, 94.6655319149);
+          box-shadow: 0 0 0 1px rgb(79.1344680851, 84.3114893617, 94.6655319149);
 }
 .e-bigger.e-small .e-calendar .e-header .e-prev:active, .e-bigger.e-small .e-calendar .e-header .e-next:active {
   background: transparent;
@@ -859,7 +859,7 @@ ejs-calendar {
   color: #6b7280;
 }
 .e-bigger.e-small .e-calendar .e-content.e-year td.e-selected:hover span.e-day, .e-bigger.e-small .e-calendar .e-content.e-decade td.e-selected:hover span.e-day {
-  background-color: #10b4cd;
+  background-color: rgb(15.7857142857, 180.1428571429, 205.2142857143);
 }
 .e-bigger.e-small .e-calendar .e-content.e-year td > span.e-day, .e-bigger.e-small .e-calendar .e-content.e-decade td > span.e-day {
   background: none;
@@ -914,7 +914,7 @@ ejs-calendar {
   color: #000;
 }
 .e-bigger.e-small .e-calendar .e-content td.e-today.e-selected:hover span.e-day, .e-bigger.e-small .e-calendar .e-content td.e-selected:hover span.e-day, .e-bigger.e-small .e-calendar .e-content td.e-selected.e-focused-date span.e-day {
-  background-color: #10b4cd;
+  background-color: rgb(15.7857142857, 180.1428571429, 205.2142857143);
   color: #000;
 }
 .e-bigger.e-small .e-calendar .e-content span {
@@ -1233,7 +1233,7 @@ ejs-calendar {
   margin: 0 8px;
 }
 .e-bigger.e-small .e-calendar .e-footer-container {
-  background-color: #232e3e;
+  background-color: rgb(27.323255814, 36.1372093023, 48.476744186);
   border-top: none;
   text-align: center;
   cursor: default;
@@ -1570,7 +1570,7 @@ ejs-calendar {
 
 .e-timepicker-mob-popup-wrap .e-timepicker.e-popup-expand .e-model-header,
 .e-datetimepicker.e-popup-expand .e-model-header {
-  background-color: #232e3e;
+  background-color: rgb(27.323255814, 36.1372093023, 48.476744186);
   color: #d1d5db;
 }
 .e-timepicker-mob-popup-wrap .e-timepicker.e-popup-expand .e-model-header .e-popup-close,
@@ -2171,7 +2171,7 @@ ejs-calendar {
   max-height: none;
 }
 .e-daterangepicker.e-popup .e-range-header {
-  background: #232e3e;
+  background: rgb(27.323255814, 36.1372093023, 48.476744186);
   padding: 8px 0;
   width: auto;
   border-radius: 6px 6px 0 0;
@@ -2267,7 +2267,7 @@ ejs-calendar {
   -webkit-box-align: center;
       -ms-flex-align: center;
           align-items: center;
-  border-top: 1px solid #232e3e;
+  border-top: 1px solid rgb(27.323255814, 36.1372093023, 48.476744186);
   clear: both;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -2294,7 +2294,7 @@ ejs-calendar {
   float: left;
 }
 .e-daterangepicker.e-popup .e-date-range-container.e-range-border {
-  border-right: 1px solid #232e3e;
+  border-right: 1px solid rgb(27.323255814, 36.1372093023, 48.476744186);
 }
 .e-daterangepicker.e-popup .e-calendar-container {
   display: -webkit-box;
@@ -2305,7 +2305,7 @@ ejs-calendar {
   float: left;
 }
 .e-daterangepicker.e-popup .e-calendar-container .e-left-container {
-  border-right: 1px solid #232e3e;
+  border-right: 1px solid rgb(27.323255814, 36.1372093023, 48.476744186);
   border-right: none;
 }
 .e-daterangepicker.e-popup .e-presets {
@@ -2342,11 +2342,11 @@ ejs-calendar {
   float: right;
 }
 .e-daterangepicker.e-rtl .e-date-range-container.e-range-border {
-  border-left: 1px solid #232e3e;
+  border-left: 1px solid rgb(27.323255814, 36.1372093023, 48.476744186);
   border-right: 0;
 }
 .e-daterangepicker.e-rtl .e-date-range-container .e-left-container {
-  border-left: 1px solid #232e3e;
+  border-left: 1px solid rgb(27.323255814, 36.1372093023, 48.476744186);
   border-right: 0;
   border-left: none;
 }
@@ -2487,12 +2487,6 @@ ejs-calendar {
 .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-range-header .e-start-end {
   margin: 3vh 0 0 0;
 }
-.e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-calendar {
-  min-width: 100%;
-  width: 100%;
-  padding: 0;
-  overflow: unset;
-}
 @media (max-height: 600px) {
   .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-calendar {
     min-height: 100%;
@@ -2505,6 +2499,12 @@ ejs-calendar {
     height: 80vh;
   }
 }
+.e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-calendar {
+  min-width: 100%;
+  width: 100%;
+  padding: 0;
+  overflow: unset;
+}
 .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-calendar .e-header.e-month, .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-calendar .e-header.e-year, .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-calendar .e-header.e-decade {
   height: 10vh;
   border-style: solid;
@@ -2843,13 +2843,13 @@ ejs-calendar {
   color: #d1d5db;
 }
 .e-daterangepicker.e-popup .e-day-span {
-  color: #8b919e;
+  color: rgb(79.1344680851, 84.3114893617, 94.6655319149);
 }
 .e-daterangepicker.e-popup .e-separator {
   background-color: #4b5563;
 }
 .e-daterangepicker.e-popup .e-footer {
-  background-color: #232e3e;
+  background-color: rgb(27.323255814, 36.1372093023, 48.476744186);
 }
 .e-daterangepicker.e-popup .e-footer .e-cancel.e-flat:not(:hover) {
   /* stylelint-disable property-no-vendor-prefix */
@@ -2868,7 +2868,7 @@ ejs-calendar {
 }
 
 .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-model-header {
-  background-color: #232e3e;
+  background-color: rgb(27.323255814, 36.1372093023, 48.476744186);
   color: #d1d5db;
 }
 .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-model-header .e-popup-close {
@@ -3183,7 +3183,7 @@ ejs-calendar {
   max-height: none;
 }
 .e-bigger.e-small .e-daterangepicker.e-popup .e-range-header {
-  background: #232e3e;
+  background: rgb(27.323255814, 36.1372093023, 48.476744186);
   padding: 8px 0;
   width: auto;
   border-radius: 6px 6px 0 0;
@@ -3279,7 +3279,7 @@ ejs-calendar {
   -webkit-box-align: center;
       -ms-flex-align: center;
           align-items: center;
-  border-top: 1px solid #232e3e;
+  border-top: 1px solid rgb(27.323255814, 36.1372093023, 48.476744186);
   clear: both;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -3306,7 +3306,7 @@ ejs-calendar {
   float: left;
 }
 .e-bigger.e-small .e-daterangepicker.e-popup .e-date-range-container.e-range-border {
-  border-right: 1px solid #232e3e;
+  border-right: 1px solid rgb(27.323255814, 36.1372093023, 48.476744186);
 }
 .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar-container {
   display: -webkit-box;
@@ -3317,7 +3317,7 @@ ejs-calendar {
   float: left;
 }
 .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar-container .e-left-container {
-  border-right: 1px solid #232e3e;
+  border-right: 1px solid rgb(27.323255814, 36.1372093023, 48.476744186);
   border-right: none;
 }
 .e-bigger.e-small .e-daterangepicker.e-popup .e-presets {
@@ -3354,11 +3354,11 @@ ejs-calendar {
   float: right;
 }
 .e-bigger.e-small .e-daterangepicker.e-rtl .e-date-range-container.e-range-border {
-  border-left: 1px solid #232e3e;
+  border-left: 1px solid rgb(27.323255814, 36.1372093023, 48.476744186);
   border-right: 0;
 }
 .e-bigger.e-small .e-daterangepicker.e-rtl .e-date-range-container .e-left-container {
-  border-left: 1px solid #232e3e;
+  border-left: 1px solid rgb(27.323255814, 36.1372093023, 48.476744186);
   border-right: 0;
   border-left: none;
 }
@@ -3481,7 +3481,7 @@ ejs-calendar {
 }
 .e-bigger.e-small .e-daterangepicker.e-popup .e-day-span,
 .e-bigger.e-small.e-daterangepicker.e-popup .e-day-span {
-  color: #8b919e;
+  color: rgb(79.1344680851, 84.3114893617, 94.6655319149);
 }
 .e-bigger.e-small .e-daterangepicker.e-popup .e-separator,
 .e-bigger.e-small.e-daterangepicker.e-popup .e-separator {
@@ -3489,7 +3489,7 @@ ejs-calendar {
 }
 .e-bigger.e-small .e-daterangepicker.e-popup .e-footer,
 .e-bigger.e-small.e-daterangepicker.e-popup .e-footer {
-  background-color: #232e3e;
+  background-color: rgb(27.323255814, 36.1372093023, 48.476744186);
 }
 .e-bigger.e-small .e-daterangepicker.e-popup .e-footer .e-cancel.e-flat:not(:hover),
 .e-bigger.e-small.e-daterangepicker.e-popup .e-footer .e-cancel.e-flat:not(:hover) {

package/styles/tailwind-lite.css

@@ -483,7 +483,7 @@ ejs-calendar {
   color: #9ca3af;
 }
 .e-calendar .e-content.e-year td.e-selected:hover span.e-day, .e-calendar .e-content.e-decade td.e-selected:hover span.e-day {
-  background-color: #291fd9;
+  background-color: rgb(41.1374407583, 30.5592417062, 217.4407582938);
 }
 .e-calendar .e-content.e-year td > span.e-day, .e-calendar .e-content.e-decade td > span.e-day {
   background: none;
@@ -538,7 +538,7 @@ ejs-calendar {
   color: #fff;
 }
 .e-calendar .e-content td.e-today.e-selected:hover span.e-day, .e-calendar .e-content td.e-selected:hover span.e-day, .e-calendar .e-content td.e-selected.e-focused-date span.e-day {
-  background: #291fd9;
+  background: rgb(41.1374407583, 30.5592417062, 217.4407582938);
   color: #fff;
 }
 .e-calendar .e-content span {
@@ -1758,12 +1758,6 @@ ejs-calendar {
 .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-range-header .e-start-end {
   margin: 3vh 0 0 0;
 }
-.e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-calendar {
-  min-width: 100%;
-  width: 100%;
-  padding: 0;
-  overflow: unset;
-}
 @media (max-height: 600px) {
   .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-calendar {
     min-height: 100%;
@@ -1776,6 +1770,12 @@ ejs-calendar {
     height: 80vh;
   }
 }
+.e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-calendar {
+  min-width: 100%;
+  width: 100%;
+  padding: 0;
+  overflow: unset;
+}
 .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-calendar .e-header.e-month, .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-calendar .e-header.e-year, .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-calendar .e-header.e-decade {
   height: 10vh;
   border-style: solid;

package/styles/tailwind.css

@@ -483,7 +483,7 @@ ejs-calendar {
   color: #9ca3af;
 }
 .e-calendar .e-content.e-year td.e-selected:hover span.e-day, .e-calendar .e-content.e-decade td.e-selected:hover span.e-day {
-  background-color: #291fd9;
+  background-color: rgb(41.1374407583, 30.5592417062, 217.4407582938);
 }
 .e-calendar .e-content.e-year td > span.e-day, .e-calendar .e-content.e-decade td > span.e-day {
   background: none;
@@ -538,7 +538,7 @@ ejs-calendar {
   color: #fff;
 }
 .e-calendar .e-content td.e-today.e-selected:hover span.e-day, .e-calendar .e-content td.e-selected:hover span.e-day, .e-calendar .e-content td.e-selected.e-focused-date span.e-day {
-  background: #291fd9;
+  background: rgb(41.1374407583, 30.5592417062, 217.4407582938);
   color: #fff;
 }
 .e-calendar .e-content span {
@@ -859,7 +859,7 @@ ejs-calendar {
   color: #9ca3af;
 }
 .e-bigger.e-small .e-calendar .e-content.e-year td.e-selected:hover span.e-day, .e-bigger.e-small .e-calendar .e-content.e-decade td.e-selected:hover span.e-day {
-  background-color: #291fd9;
+  background-color: rgb(41.1374407583, 30.5592417062, 217.4407582938);
 }
 .e-bigger.e-small .e-calendar .e-content.e-year td > span.e-day, .e-bigger.e-small .e-calendar .e-content.e-decade td > span.e-day {
   background: none;
@@ -914,7 +914,7 @@ ejs-calendar {
   color: #fff;
 }
 .e-bigger.e-small .e-calendar .e-content td.e-today.e-selected:hover span.e-day, .e-bigger.e-small .e-calendar .e-content td.e-selected:hover span.e-day, .e-bigger.e-small .e-calendar .e-content td.e-selected.e-focused-date span.e-day {
-  background-color: #291fd9;
+  background-color: rgb(41.1374407583, 30.5592417062, 217.4407582938);
   color: #fff;
 }
 .e-bigger.e-small .e-calendar .e-content span {
@@ -2487,12 +2487,6 @@ ejs-calendar {
 .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-range-header .e-start-end {
   margin: 3vh 0 0 0;
 }
-.e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-calendar {
-  min-width: 100%;
-  width: 100%;
-  padding: 0;
-  overflow: unset;
-}
 @media (max-height: 600px) {
   .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-calendar {
     min-height: 100%;
@@ -2505,6 +2499,12 @@ ejs-calendar {
     height: 80vh;
   }
 }
+.e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-calendar {
+  min-width: 100%;
+  width: 100%;
+  padding: 0;
+  overflow: unset;
+}
 .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-calendar .e-header.e-month, .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-calendar .e-header.e-year, .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-calendar .e-header.e-decade {
   height: 10vh;
   border-style: solid;

package/styles/tailwind3-lite.css

@@ -572,8 +572,8 @@ ejs-calendar {
   color: var(--color-sf-icon-color);
 }
 .e-calendar .e-content.e-month .e-selected.e-focused-date {
-  -webkit-box-shadow: inset 1px 0 var(--color-sf-primary-bg-color), inset 0 1px var(--color-sf-primary-bg-color), inset -1px 0 var(--color-sf-primary-bg-color), inset 0 -1px var(--color-sf-primary-bg-color);
-          box-shadow: inset 1px 0 var(--color-sf-primary-bg-color), inset 0 1px var(--color-sf-primary-bg-color), inset -1px 0 var(--color-sf-primary-bg-color), inset 0 -1px var(--color-sf-primary-bg-color);
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 
 .e-calendar .e-content.e-year td.e-selected span.e-day,
@@ -1788,12 +1788,6 @@ ejs-calendar {
 .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-range-header .e-start-end {
   margin: 3vh 0 0 0;
 }
-.e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-calendar {
-  min-width: 100%;
-  width: 100%;
-  padding: 0;
-  overflow: unset;
-}
 @media (max-height: 600px) {
   .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-calendar {
     min-height: 100%;
@@ -1806,6 +1800,12 @@ ejs-calendar {
     height: 80vh;
   }
 }
+.e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-calendar {
+  min-width: 100%;
+  width: 100%;
+  padding: 0;
+  overflow: unset;
+}
 .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-calendar .e-header.e-month, .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-calendar .e-header.e-year, .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-calendar .e-header.e-decade {
   height: 10vh;
   border-style: solid;

package/styles/tailwind3.css

@@ -572,8 +572,8 @@ ejs-calendar {
   color: var(--color-sf-icon-color);
 }
 .e-calendar .e-content.e-month .e-selected.e-focused-date {
-  -webkit-box-shadow: inset 1px 0 var(--color-sf-primary-bg-color), inset 0 1px var(--color-sf-primary-bg-color), inset -1px 0 var(--color-sf-primary-bg-color), inset 0 -1px var(--color-sf-primary-bg-color);
-          box-shadow: inset 1px 0 var(--color-sf-primary-bg-color), inset 0 1px var(--color-sf-primary-bg-color), inset -1px 0 var(--color-sf-primary-bg-color), inset 0 -1px var(--color-sf-primary-bg-color);
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 
 .e-calendar .e-content.e-year td.e-selected span.e-day,
@@ -2435,12 +2435,6 @@ ejs-calendar {
 .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-range-header .e-start-end {
   margin: 3vh 0 0 0;
 }
-.e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-calendar {
-  min-width: 100%;
-  width: 100%;
-  padding: 0;
-  overflow: unset;
-}
 @media (max-height: 600px) {
   .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-calendar {
     min-height: 100%;
@@ -2453,6 +2447,12 @@ ejs-calendar {
     height: 80vh;
   }
 }
+.e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-calendar {
+  min-width: 100%;
+  width: 100%;
+  padding: 0;
+  overflow: unset;
+}
 .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-calendar .e-header.e-month, .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-calendar .e-header.e-year, .e-daterangepick-mob-popup-wrap .e-daterangepicker.e-popup.e-popup-expand .e-date-range-container .e-calendar .e-header.e-decade {
   height: 10vh;
   border-style: solid;

package/styles/timepicker/_bootstrap4-definition.scss

@@ -1,3 +1,5 @@
+@use 'sass:color';
+
 $timepicker-skin-name: 'bootstrap4' !default;
 $timepicker-default-text-indent: 20px !default;
 $timepicker-list-bigger-line-height: 32px !default;
@@ -16,13 +18,13 @@ $timepicker-list-border-color: 1px solid rgba($black, .15) !default;
 $timepicker-list-bg-color: $content-popup-bg !default;
 $timepicker-list-active-bg-color: $primary !default;
 $timepicker-list-active-icon-color: $white !default;
-$timepicker-icon-active-bg-color: darken($gray-600, 10%) !default;
-$timepicker-active-border-color: darken($gray-600, 10%) !default;
+$timepicker-icon-active-bg-color: color.adjust($gray-600, $lightness: -10%) !default;
+$timepicker-active-border-color: color.adjust($gray-600, $lightness: -10%) !default;
 $timepicker-list-active-font-color: $primary-font !default;
-$timepicker-list-hover-bg-color: darken($gray-100, 2%) !default;
+$timepicker-list-hover-bg-color: color.adjust($gray-100, $lightness: -2%) !default;
 $timepicker-list-hover-font-color: $gray-900 !default;
 $timepicker-list-popup-icon-active-color: $white !default;
-$timepicker-list-active-hover-bg-color: darken($gray-100, 2%) !default;
+$timepicker-list-active-hover-bg-color: color.adjust($gray-100, $lightness: -2%) !default;
 $timepicker-list-active-hover-font-color: $gray-900 !default;
 $timepicker-list-normal-padding: 0 !default;
 $timepicker-list-bigger-padding: 0 !default;

package/styles/timepicker/_bootstrap5-definition.scss

@@ -1,3 +1,5 @@
+@use 'sass:color';
+
 // size variables
 $timepicker-skin-name: 'bootstrap5' !default;
 $timepicker-default-text-indent: 12px !default;
@@ -45,7 +47,7 @@ $timepicker-list-hover-border-color: none !default;
 $timepicker-list-bg-color: $flyout-bg-color !default;
 $timepicker-list-active-bg-color: $content-bg-color-selected !default;
 $timepicker-icon-active-bg-color: $secondary-bg-color-pressed;
-$timepicker-active-border-color: darken($gray-600, 10%) !default;
+$timepicker-active-border-color: color.adjust($gray-600, $lightness: -10%) !default;
 $timepicker-list-active-font-color: $flyout-text-color-pressed !default;
 $timepicker-list-active-icon-color: $content-text-color-selected !default;
 $timepicker-list-hover-bg-color: $flyout-bg-color-hover !default;

package/styles/timepicker/_fluent-definition.scss

@@ -1,3 +1,5 @@
+@use 'sass:color';
+
 // size variables
 $timepicker-skin-name: 'FluentUI' !default;
 $timepicker-default-text-indent: 12px !default;
@@ -45,7 +47,7 @@ $timepicker-list-hover-border-color: none !default;
 $timepicker-list-bg-color: $flyout-bg-color !default;
 $timepicker-list-active-bg-color: $flyout-bg-color-selected !default;
 $timepicker-icon-active-bg-color: $flyout-text-color-selected;
-$timepicker-active-border-color: darken($primary, 10%) !default;
+$timepicker-active-border-color: color.adjust($primary, $lightness: -10%) !default;
 $timepicker-list-active-font-color: $flyout-text-color-pressed !default;
 $timepicker-list-active-icon-color: $flyout-text-color-selected !default;
 $timepicker-list-hover-bg-color: $flyout-bg-color-hover !default;

package/styles/timepicker/bootstrap4.css

@@ -219,8 +219,8 @@
 }
 /* stylelint-enable */
 .e-time-wrapper .e-input-group-icon.e-icons.e-active {
-  background: #545b62;
-  border-color: #545b62;
+  background: rgb(84.3605150215, 91.3905579399, 97.6394849785);
+  border-color: rgb(84.3605150215, 91.3905579399, 97.6394849785);
   color: #fff;
 }
 .e-time-wrapper.e-input-group:not(.e-disabled) .e-input-group-icon.e-active:active {
@@ -249,7 +249,7 @@
       touch-action: none;
 }
 .e-timepicker.e-popup .e-list-parent.e-ul .e-list-item.e-hover, .e-timepicker.e-popup .e-list-parent.e-ul .e-list-item.e-navigation, .e-timepicker.e-popup .e-list-parent.e-ul .e-list-item:focus {
-  background-color: #f2f4f6;
+  background-color: rgb(242.05, 243.9, 245.75);
   border: none;
   color: #212529;
 }
@@ -258,7 +258,7 @@
   color: #fff;
 }
 .e-timepicker.e-popup .e-list-parent.e-ul .e-list-item.e-active.e-hover {
-  background-color: #f2f4f6;
+  background-color: rgb(242.05, 243.9, 245.75);
   color: #212529;
 }
 

package/styles/timepicker/bootstrap5-dark.css

@@ -150,7 +150,7 @@
       -ms-flex-align: center;
           align-items: center;
   font-size: 2vh;
-  border-bottom: 1px solid #444c54;
+  border-bottom: 1px solid rgb(68.0034482759, 75.85, 83.6965517241);
 }
 .e-timepicker-mob-popup-wrap .e-popup-expand .e-model-header .e-popup-close,
 .e-datetimepicker.e-popup-expand .e-model-header .e-popup-close {
@@ -220,8 +220,8 @@
 }
 /* stylelint-enable */
 .e-time-wrapper .e-input-group-icon.e-icons.e-active {
-  background: #565e64;
-  border-color: #545b62;
+  background: rgb(86.4, 93.6, 100);
+  border-color: rgb(84.3605150215, 91.3905579399, 97.6394849785);
   color: #fff;
 }
 .e-time-wrapper.e-input-group:not(.e-disabled) .e-input-group-icon.e-active:active {
@@ -230,7 +230,7 @@
 
 .e-timepicker.e-popup {
   background-color: #343a40;
-  border: 1px solid #444c54;
+  border: 1px solid rgb(68.0034482759, 75.85, 83.6965517241);
   border-radius: 6px;
   -webkit-box-shadow: none;
           box-shadow: none;
@@ -250,7 +250,7 @@
       touch-action: none;
 }
 .e-timepicker.e-popup .e-list-parent.e-ul .e-list-item.e-hover, .e-timepicker.e-popup .e-list-parent.e-ul .e-list-item.e-navigation, .e-timepicker.e-popup .e-list-parent.e-ul .e-list-item:focus {
-  background-color: #444c54;
+  background-color: rgb(68.0034482759, 75.85, 83.6965517241);
   border: none;
   color: #fff;
 }
@@ -259,7 +259,7 @@
   color: #fff;
 }
 .e-timepicker.e-popup .e-list-parent.e-ul .e-list-item.e-active.e-hover {
-  background-color: #444c54;
+  background-color: rgb(68.0034482759, 75.85, 83.6965517241);
   color: #fff;
 }
 

package/styles/timepicker/bootstrap5.css

@@ -220,8 +220,8 @@
 }
 /* stylelint-enable */
 .e-time-wrapper .e-input-group-icon.e-icons.e-active {
-  background: #565e64;
-  border-color: #545b62;
+  background: rgb(86.4, 93.6, 100);
+  border-color: rgb(84.3605150215, 91.3905579399, 97.6394849785);
   color: #fff;
 }
 .e-time-wrapper.e-input-group:not(.e-disabled) .e-input-group-icon.e-active:active {

package/styles/timepicker/tailwind-dark.css

@@ -268,7 +268,7 @@
 
 .e-timepicker-mob-popup-wrap .e-timepicker.e-popup-expand .e-model-header,
 .e-datetimepicker.e-popup-expand .e-model-header {
-  background-color: #232e3e;
+  background-color: rgb(27.323255814, 36.1372093023, 48.476744186);
   color: #d1d5db;
 }
 .e-timepicker-mob-popup-wrap .e-timepicker.e-popup-expand .e-model-header .e-popup-close,