diff --git a/calendar/templates/default/app.css b/calendar/templates/default/app.css
index 6c3d3f660b..d4fe6ba0e8 100644
--- a/calendar/templates/default/app.css
+++ b/calendar/templates/default/app.css
@@ -297,7 +297,7 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
 	color: #626161;
 }
 #calendar-view .calendar_calBirthday, #calendar-planner .calendar_plannerHeader .calendar_calBirthdayIcon {
-	background-image: url(../../../api/templates/default/images/cake.svg);
+	background-image: url(../../../node_modules/bootstrap-icons/icons/cake2.svg);
     background-repeat: no-repeat;
     background-size: 16px;
     background-position: 10px center;
diff --git a/calendar/templates/kdots/app.css b/calendar/templates/kdots/app.css
index 6679944a5b..dce560b2ff 100644
--- a/calendar/templates/kdots/app.css
+++ b/calendar/templates/kdots/app.css
@@ -67,15 +67,19 @@
 #calendar-et2_target > div {
   position: relative;
 }
-#calendar-sidebox_cat_id {
-  margin-bottom: 5px;
-}
 #calendar-sidebox_cat_id ~ * {
   vertical-align: top;
   display: inline-block;
   border: none;
   box-shadow: none;
 }
+.flatpickr-current-month .numInputWrapper {
+  color: inherit;
+}
+/*overrides above for disabled et2-box*/
+#calendar-sidebox_cat_id ~ et2-box[disabled] {
+  display: none;
+}
 #calendar-sidebox_weekend {
   /* Special css styling goes here */
 }
@@ -114,14 +118,22 @@
 }
 /* Toolbar */
 #calendar-toolbar {
-  height: 3.6em;
-  margin-top: 0.3em;
+  height: auto;
 }
 #calendar-toolbar > div {
   display: flex;
+  align-items: center;
+}
+#calendar-toolbar #calendar-toolbar_add::part(base) {
+  border-style: hidden;
+}
+#calendar-toolbar #calendar-toolbar_add:hover::part(base) {
+  border-style: solid;
+  background-color: var(--sl-input-background-color);
 }
 #calendar-toolbar .et2_toolbar {
   background: inherit;
+  border: none;
 }
 #calendar-toolbar .egw_fw_ui_app_header_container {
   border: none;
@@ -271,7 +283,7 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
 }
 #calendar-view .calendar_calBirthday,
 #calendar-planner .calendar_plannerHeader .calendar_calBirthdayIcon {
-  background-image: url(../../../api/templates/default/images/cake.svg);
+  background-image: url(../../../node_modules/bootstrap-icons/icons/cake2.svg);
   background-repeat: no-repeat;
   background-size: 16px;
   background-position: 10px center;
@@ -1305,8 +1317,12 @@ Hide subsequent headers in week view with non-consolidated owners
 }
 /**
  * Calendar Drag and Drop
- * Class for div to show forbiden drop
  */
+.calendar_d-n-d_helper {
+  position: absolute;
+  z-index: initial;
+}
+/* Class for div to show forbiden drop */
 .calendar_d-n-d_timeCounter > span {
   position: absolute;
   background-color: #808080;
@@ -1340,6 +1356,7 @@ Hide subsequent headers in week view with non-consolidated owners
   font-size: 1.1em;
   font-weight: bold;
   text-align: center;
+  min-width: 10em;
 }
 .calendar_d-n-d_timeCounter .loading {
   width: 16px;
@@ -1359,10 +1376,12 @@ Hide subsequent headers in week view with non-consolidated owners
 .calendar_freetime_timeframe {
   position: relative;
 }
-img.calendar_print_button,
-img.calendar_print_appicon {
+et2-image.calendar_print_button,
+et2-appicon.calendar_print_appicon,
+et2-appicon.calendar_print_appicon img {
   height: 24px;
-  width: 24px;
+  width: 26px;
+  font-size: 24px;
 }
 /*Sortable views*/
 .srotable_cal_wk_ph {
@@ -1412,7 +1431,7 @@ img.calendar_print_appicon {
   height: 1.6em;
   padding: 4px 3px 3px;
   background: #b4cee773;
-  border-radius: 3px;
+  border-radius: var(--sl-border-radius-medium, 3px);
   min-width: fit-content;
   border: 1px solid #d4d4d8;
   text-align: center;
@@ -1480,8 +1499,7 @@ et2-switch#calendar-toolbar_toolbar-weekend::part(label) {
 #calendar-toolbar_toolbar et2-switch {
   display: inline-block;
   vertical-align: top;
-  border: 1px solid var(--sl-color-neutral-300);
-  border-radius: 3px;
+  border-radius: var(--sl-border-radius-medium, 3px);
 }
 .ui-toolbar-menulist et2-switch,
 .ui-toolbar-menulist et2-switch::part(base),
diff --git a/calendar/templates/mobile/app.css b/calendar/templates/mobile/app.css
index d8fc14b37d..f770852b0c 100644
--- a/calendar/templates/mobile/app.css
+++ b/calendar/templates/mobile/app.css
@@ -8,7 +8,6 @@
  * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
  * @author Hadi Nategh <hn@stylite.de>
  * @package calendar
- * @version $Id: app.less 55033 2016-02-16 18:49:17Z hnategh $
  */
 /**
  * EGroupware: CSS with less preprocessor
@@ -91,15 +90,19 @@
 #calendar-et2_target > div {
   position: relative;
 }
-#calendar-sidebox_cat_id {
-  margin-bottom: 5px;
-}
 #calendar-sidebox_cat_id ~ * {
   vertical-align: top;
   display: inline-block;
   border: none;
   box-shadow: none;
 }
+.flatpickr-current-month .numInputWrapper {
+  color: inherit;
+}
+/*overrides above for disabled et2-box*/
+#calendar-sidebox_cat_id ~ et2-box[disabled] {
+  display: none;
+}
 #calendar-sidebox_weekend {
   /* Special css styling goes here */
 }
@@ -303,7 +306,7 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
 }
 #calendar-view .calendar_calBirthday,
 #calendar-planner .calendar_plannerHeader .calendar_calBirthdayIcon {
-  background-image: url(../../../api/templates/default/images/cake.svg);
+  background-image: url(../../../node_modules/bootstrap-icons/icons/cake2.svg);
   background-repeat: no-repeat;
   background-size: 16px;
   background-position: 10px center;
@@ -1396,10 +1399,12 @@ Hide subsequent headers in week view with non-consolidated owners
 .calendar_freetime_timeframe {
   position: relative;
 }
-img.calendar_print_button,
-img.calendar_print_appicon {
+et2-image.calendar_print_button,
+et2-appicon.calendar_print_appicon,
+et2-appicon.calendar_print_appicon img {
   height: 24px;
-  width: 24px;
+  width: 26px;
+  font-size: 24px;
 }
 /*Sortable views*/
 .srotable_cal_wk_ph {
@@ -1445,7 +1450,7 @@ img.calendar_print_appicon {
 /*weekend slideSwitch in toolbar*/
 #calendar-toolbar_app_header {
   color: #000;
-  font-size: var(--sl-font-size-large);
+  font-size: 14px;
   height: 1.6em;
   padding: 4px 3px 3px;
   background: #b4cee773;
@@ -1652,7 +1657,20 @@ et2-button#calendar-toolbar_toolbar-today::part(label) {
   height: calc(100% - 78px);
 }
 #calendar_sidebox_content .egw_fw_ui_category_content {
-  padding-left: 0px !important;
+  padding-right: 0px !important;
+}
+div.flatpickr-calendar .flatpickr-months {
+  gap: 0;
+}
+div.flatpickr-calendar .flatpickr-current-month .flatpickr-monthDropdown-months {
+  width: 65%;
+  padding-right: 0 !important;
+}
+div.flatpickr-calendar .flatpickr-prev-month {
+  padding-right: 0;
+}
+div.flatpickr-calendar .flatpickr-next-month {
+  padding-left: 0;
 }
 img.sideboxstar {
   width: 12px;
@@ -2499,7 +2517,7 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
 /*ui-widget*/
 /*edit series*/
 button#series {
-  background-image: url('../../../api/templates/default/images/edit.svg') !important;
+  background-image: url('../../../node_modules/bootstrap-icons/icons/pencil-square.svg') !important;
   /*.border_normal;*/
   /*.box_shadow_standard_light;*/
   /*.rounded (3px);*/
@@ -2544,7 +2562,7 @@ button#series:hover {
   box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
 }
 button#series:hover {
-  background-image: url('../../../api/templates/default/images/edit.svg') !important;
+  background-image: url('../../../node_modules/bootstrap-icons/icons/pencil-square.svg') !important;
   background-color: #b3e4a6 !important;
 }
 button#series:active {
@@ -2552,7 +2570,7 @@ button#series:active {
 }
 /*edit exception*/
 button#exception {
-  background-image: url('../../../api/templates/default/images/edit.svg') !important;
+  background-image: url('../../../node_modules/bootstrap-icons/icons/pencil-square.svg') !important;
   /*.border_normal;*/
   /*.box_shadow_standard_light;*/
   /*.rounded (3px);*/
@@ -2597,7 +2615,7 @@ button#exception:hover {
   box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
 }
 button#exception:hover {
-  background-image: url('../../../api/templates/default/images/edit.svg') !important;
+  background-image: url('../../../node_modules/bootstrap-icons/icons/pencil-square.svg') !important;
   background-color: #b3e4a6 !important;
 }
 button#exception:active {
diff --git a/calendar/templates/mobile/app.less b/calendar/templates/mobile/app.less
index 0d6589063c..822e5f5e29 100644
--- a/calendar/templates/mobile/app.less
+++ b/calendar/templates/mobile/app.less
@@ -8,7 +8,6 @@
  * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
  * @author Hadi Nategh <hn@stylite.de>
  * @package calendar
- * @version $Id: app.less 55033 2016-02-16 18:49:17Z hnategh $
  */
 @import (reference) "../../../pixelegg/less/definitions.less";
 @import (reference) "../../../pixelegg/less/app_colors.less";
@@ -129,4 +128,4 @@
 		font-size: 10pt;
 		color: #707070;
 	}
-}
+}
\ No newline at end of file
diff --git a/calendar/templates/pixelegg/app.css b/calendar/templates/pixelegg/app.css
index ffc7c726fe..b44825aa25 100755
--- a/calendar/templates/pixelegg/app.css
+++ b/calendar/templates/pixelegg/app.css
@@ -295,7 +295,7 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
 }
 #calendar-view .calendar_calBirthday,
 #calendar-planner .calendar_plannerHeader .calendar_calBirthdayIcon {
-  background-image: url(../../../api/templates/default/images/cake.svg);
+  background-image: url(../../../node_modules/bootstrap-icons/icons/cake2.svg);
   background-repeat: no-repeat;
   background-size: 16px;
   background-position: 10px center;
@@ -2506,7 +2506,7 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
 /*ui-widget*/
 /*edit series*/
 button#series {
-  background-image: url('../../../api/templates/default/images/edit.svg') !important;
+  background-image: url('../../../node_modules/bootstrap-icons/icons/pencil-square.svg') !important;
   /*.border_normal;*/
   /*.box_shadow_standard_light;*/
   /*.rounded (3px);*/
@@ -2551,7 +2551,7 @@ button#series:hover {
   box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
 }
 button#series:hover {
-  background-image: url('../../../api/templates/default/images/edit.svg') !important;
+  background-image: url('../../../node_modules/bootstrap-icons/icons/pencil-square.svg') !important;
   background-color: #b3e4a6 !important;
 }
 button#series:active {
@@ -2559,7 +2559,7 @@ button#series:active {
 }
 /*edit exception*/
 button#exception {
-  background-image: url('../../../api/templates/default/images/edit.svg') !important;
+  background-image: url('../../../node_modules/bootstrap-icons/icons/pencil-square.svg') !important;
   /*.border_normal;*/
   /*.box_shadow_standard_light;*/
   /*.rounded (3px);*/
@@ -2604,7 +2604,7 @@ button#exception:hover {
   box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
 }
 button#exception:hover {
-  background-image: url('../../../api/templates/default/images/edit.svg') !important;
+  background-image: url('../../../node_modules/bootstrap-icons/icons/pencil-square.svg') !important;
   background-color: #b3e4a6 !important;
 }
 button#exception:active {
diff --git a/calendar/templates/pixelegg/app.less b/calendar/templates/pixelegg/app.less
index 3f81ec5fe8..b2c3a0dd2a 100755
--- a/calendar/templates/pixelegg/app.less
+++ b/calendar/templates/pixelegg/app.less
@@ -1009,18 +1009,18 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
 /*ui-widget*/
  /*edit series*/
 button#series {
-    background-image:url('../../../api/templates/default/images/edit.svg') !important;
+    background-image:url('../../../node_modules/bootstrap-icons/icons/pencil-square.svg') !important;
     .Complete_Button_text_icon_before;
     .Complete_Button_save_apply_copy;
-    &:hover {background-image:url('../../../api/templates/default/images/edit.svg') !important; background-color: @color_positive_action_active !important;}
+    &:hover {background-image:url('../../../node_modules/bootstrap-icons/icons/pencil-square.svg') !important; background-color: @color_positive_action_active !important;}
     &:active {background-color: @color_positive_action_active !important;}
 }
 /*edit exception*/
 button#exception {
-        background-image:url('../../../api/templates/default/images/edit.svg') !important;
+        background-image:url('../../../node_modules/bootstrap-icons/icons/pencil-square.svg') !important;
     .Complete_Button_text_icon_before;
     .Complete_Button_save_apply_copy;
-    &:hover {background-image:url('../../../api/templates/default/images/edit.svg') !important;background-color: @color_positive_action_active !important;}
+    &:hover {background-image:url('../../../node_modules/bootstrap-icons/icons/pencil-square.svg') !important;background-color: @color_positive_action_active !important;}
     &:active {background-color: @color_positive_action_active !important;}
 }