cronapp-framework-js 2.9.1-SP.2 → 2.9.1-SP.3

package/css/themes/custom/aquamarine/button-aquamarine.css

@@ -129,12 +129,18 @@
 }
 
 /* Danger */
+.k-edit-form-container .k-edit-buttons .k-scheduler-canceltimezone,
+.k-edit-form-container .k-edit-buttons .k-scheduler-cancel,
 .k-button.k-danger,
 .btn.btn-danger {
     background: linear-gradient(90deg, var(--colorDanger40, #a82c2c) 40%, var(--colorDanger30, #c08181) 100%);
     color: var(--textColorDanger40, #ffffff);
 }
 
+.k-edit-form-container .k-edit-buttons .k-scheduler-canceltimezone:focus,
+.k-edit-form-container .k-edit-buttons .k-scheduler-cancel:focus,
+.k-edit-form-container .k-edit-buttons .k-scheduler-canceltimezone:hover,
+.k-edit-form-container .k-edit-buttons .k-scheduler-cancel:hover,
 .k-button.k-danger:focus,
 .k-button.k-danger:hover,
 .btn.btn-danger:focus,
@@ -144,6 +150,10 @@
     background: var(--colorDanger20, #d5b1b1);
 }
 
+.k-edit-form-container .k-edit-buttons .k-scheduler-canceltimezone:active,
+.k-edit-form-container .k-edit-buttons .k-scheduler-cancel:active,
+.k-edit-form-container .k-edit-buttons .k-scheduler-canceltimezone.active,
+.k-edit-form-container .k-edit-buttons .k-scheduler-cancel.active,
 .btn.btn-danger.active,
 .btn.btn-danger:active,
 .k-button.k-danger.active,
@@ -169,6 +179,11 @@
     background: transparent;
 }
 
+.btn.btn-info:focus .text-color-info,
+.btn.btn-info:hover .text-color-info {
+    color: var(--colorCalm20, #aee0f9);
+}
+
 .btn.btn-info.active,
 .btn.btn-info:active,
 .k-button.k-info.active,
@@ -193,6 +208,11 @@
     background: transparent;
 }
 
+.btn.btn-light:focus .text-color-light,
+.btn.btn-light:hover .text-color-light {
+    color: var(--textColorLight60, #b5b5b5);
+}
+
 .btn.btn-light.active,
 .btn.btn-light:active,
 .k-button.k-light.active,
@@ -252,25 +272,25 @@
 
 
 /* dark */
-.k-button.k-Dark,
-.btn.btn-Dark {
+.k-button.k-dark,
+.btn.btn-dark {
     background: linear-gradient(90deg, var(--colorDark40, #444444) 40%, var(--colorDark30, #898989) 100%);
     color: var(--textColorDark40, #ffffff);
 }
 
-.k-button.k-Dark:focus,
-.k-button.k-Dark:hover,
-.btn.btn-Dark:focus,
-.btn.btn-Dark:hover {
+.k-button.k-dark:focus,
+.k-button.k-dark:hover,
+.btn.btn-dark:focus,
+.btn.btn-dark:hover {
     color: var(--colorDark40, #444444);
     box-shadow: none;
     background: var(--colorDark20, #b5b5b5);
 }
 
-.btn.btn-Dark.active,
-.btn.btn-Dark:active,
-.k-button.k-Dark.active,
-.k-button.k-Dark:active {
+.btn.btn-dark.active,
+.btn.btn-dark:active,
+.k-button.k-dark.active,
+.k-button.k-dark:active {
     background: var(--colorDark40, #444444);
     color: var(--textColorDark40, #ffffff);
 }

package/css/themes/custom/aquamarine/custom-aquamarine.css

@@ -268,18 +268,19 @@
     --colorNeutral210: #090909;
     --colorNeutral220: #000000;
 
+    /* === Variables used exclusively in the color palette property === */
     /* Components - Button */
-    --btnLink: var(--colorPrimary40, #2c72a8);
-    --btnDefault: var(--colorDefault40, #2ca4a8);
-    --btnPrimary: var(--colorPrimary40, #2c72a8);
-    --btnSuccess: var(--colorSuccess40, #38a82c);
-    --btnCalm: var(--colorCalm40, #11c1f3);
-    --btnWarning: var(--colorWarning40, #daa31f);
-    --btnDanger: var(--colorDanger40, #a82c2c);
-    --btnLight: var(--textColorLight40, #444444);
-    --btnStable: var(--colorStable40, #b2b2b2);
-    --btnRoyal: var(--colorRoyal40, #7e5ee8);
-    --btnDark: var(--colorDark40, #444444);
+    --btnLink: transparent;
+    --btnDefault: linear-gradient(90deg, var(--colorDefault40, #2ca4a8) 40%, var(--colorDefault30, #81bdc0) 100%);
+    --btnPrimary: linear-gradient(90deg, var(--colorPrimary40, #2c72a8) 40%, var(--colorPrimary30, #819fc0) 100%);
+    --btnSuccess: linear-gradient(90deg, var(--colorSuccess40, #38a82c) 40%, var(--colorSuccess30, #85c081) 100%);
+    --btnCalm: transparent;
+    --btnWarning: linear-gradient(90deg, var(--colorWarning40, #daa31f) 40%, var(--colorWarning30, #e3bd7e) 100%);
+    --btnDanger: linear-gradient(90deg, var(--colorDanger40, #a82c2c) 40%, var(--colorDanger30, #c08181) 100%);
+    --btnLight: transparent;
+    --btnStable: linear-gradient(90deg, var(--colorStable40, #b2b2b2) 40%, var(--colorStable30, #c7c7c7) 100%);
+    --btnRoyal: linear-gradient(90deg, var(--colorRoyal40, #7e5ee8) 40%, var(--colorRoyal30, #a594ee) 100%);
+    --btnDark: linear-gradient(90deg, var(--colorDark40, #444444) 40%, var(--colorDark30, #898989) 100%);
 
     --textColorDefault: var(--textColorDefault40, #ffffff);
     --textColorPrimary: var(--textColorPrimary40, #ffffff);
@@ -287,70 +288,106 @@
     --textColorCalm: var(--colorCalm40, #11c1f3);
     --textColorWarning: var(--textColorWarning40, #ffffff);
     --textColorDanger: var(--textColorDanger40, #ffffff);
-    --textColorLight: var(--textColorLight40, #ffffff);
+    --textColorLight: var(--textColorLight40, #444444);
     --textColorStable: var(--textColorStable40, #444444);
     --textColorRoyal: var(--textColorRoyal40, #ffffff);
     --textColorDark: var(--textColorDark40, #ffffff);
 
+    --borderBtnLink: var(--colorPrimary40, #2c72a8);
+    --borderBtnDefault: transparent;
+    --borderBtnPrimary: transparent;
+    --borderBtnSuccess: transparent;
+    --borderBtnCalm: var(--colorCalm40, #11c1f3);
+    --borderBtnWarning: transparent;
+    --borderBtnDanger: transparent;
+    --borderBtnLight: var(--textColorLight40, #444444);
+    --borderBtnStable: transparent;
+    --borderBtnRoyal: transparent;
+    --borderBtnDark: transparent;
+
     /* Components - Text color */
-    --colorDefault: var(--colorDefault40, #3b448e);
-    --colorPrimary: var(--colorPrimary40, #5665be);
-    --colorSuccess: var(--colorSuccess40, #257d25);
-    --colorCalm: var(--colorDefault40, #3b448e);
-    --colorWarning: var(--colorWarning40, #f0ad4e);
+    --colorDefault: var(--colorDefault40, #2ca4a8);
+    --colorPrimary: var(--colorPrimary40, #2c72a8);
+    --colorSuccess: var(--colorSuccess40, #38a82c);
+    --colorCalm: var(--colorDefault40, #2ca4a8);
+    --colorWarning: var(--colorWarning40, #daa31f);
     --colorDanger: var(--colorDanger40, #ce3a36);
     --colorLight: var(--colorLight50, #c2c2c2);
-    --colorStable: var(--colorStable40, #ffc900);
-    --colorRoyal: var(--colorRoyal40, #886aea);
+    --colorStable: var(--colorStable40, #b2b2b2);
+    --colorRoyal: var(--colorRoyal40, #7e5ee8);
     --colorDark: var(--colorDark40, #444444);
 
     /* Components - Checkbox */
-    --checkboxDefault: var(--colorDefault40, #3b448e);
-    --checkboxPrimary: var(--colorPrimary40, #5665be);
-    --checkboxSuccess: var(--colorSuccess40, #257d25);
+    --checkboxDefault: var(--colorDefault40, #2ca4a8);
+    --checkboxPrimary: var(--colorPrimary40, #2c72a8);
+    --checkboxSuccess: var(--colorSuccess40, #38a82c);
     --checkboxCalm: var(--colorCalm40, #11c1f3);
-    --checkboxWarning: var(--colorWarning40, #f0ad4e);
+    --checkboxWarning: var(--colorWarning40, #daa31f);
     --checkboxDanger: var(--colorDanger40, #ce3a36);
     --checkboxLight: var(--colorLight40, #dddddd);
     --checkboxStable: var(--colorStable40, #b2b2b2);
-    --checkboxRoyal: var(--colorRoyal40, #886aea);
+    --checkboxRoyal: var(--colorRoyal40, #7e5ee8);
     --checkboxDark: var(--colorDark40, #444444);
 
     /* Components - Combobox */
-    --comboboxDefault: var(--colorDefault40, #3b448e);
-    --comboboxPrimary: var(--colorPrimary40, #5665be);
-    --comboboxSuccess: var(--colorSuccess40, #257d25);
+    --comboboxDefault: var(--colorDefault40, #2ca4a8);
+    --comboboxPrimary: var(--colorPrimary40, #2c72a8);
+    --comboboxSuccess: var(--colorSuccess40, #38a82c);
     --comboboxCalm: var(--colorCalm40, #11c1f3);
-    --comboboxWarning: var(--colorWarning40, #f0ad4e);
+    --comboboxWarning: var(--colorWarning40, #daa31f);
     --comboboxDanger: var(--colorDanger40, #ce3a36);
-    --comboboxLight: var(--colorLight40, #dddddd);
+    --comboboxLight: transparent;
     --comboboxStable: var(--colorStable40, #b2b2b2);
-    --comboboxRoyal: var(--colorRoyal40, #886aea);
+    --comboboxRoyal: var(--colorRoyal40, #7e5ee8);
     --comboboxDark: var(--colorDark40, #444444);
 
+    --borderComboboxDefault: var(--colorDefault50, #3b448e);
+    --borderComboboxPrimary: var(--colorPrimary50, #5665be);
+    --borderComboboxSuccess: var(--colorSuccess50, #257d25);
+    --borderComboboxCalm: var(--colorCalm50, #11c1f3);
+    --borderComboboxWarning: var(--colorWarning50, #f0ad4e);
+    --borderComboboxDanger: var(--colorDanger50, #ce3a36);
+    --borderComboboxLight: var(--textColorLight40, #444444);
+    --borderComboboxStable: var(--colorStable50, #b2b2b2);
+    --borderComboboxRoyal: var(--colorRoyal50, #886aea);
+    --borderComboboxDark: var(--colorDark50, #444444);
+
     /* Components - Radio input */
-    --optionDefault: var(--colorDefault40, #3b448e);
-    --optionPrimary: var(--colorPrimary40, #5665be);
-    --optionSuccess: var(--colorSuccess40, #257d25);
+    --optionDefault: var(--colorDefault40, #2ca4a8);
+    --optionPrimary: var(--colorPrimary40, #2c72a8);
+    --optionSuccess: var(--colorSuccess40, #38a82c);
     --optionCalm: var(--colorCalm40, #11c1f3);
-    --optionWarning: var(--colorWarning40, #f0ad4e);
+    --optionWarning: var(--colorWarning40, #daa31f);
     --optionDanger: var(--colorDanger40, #ce3a36);
-    --optionLight: var(--colorLight40, #ffffff);
-    --optionStable: var(--colorStable40, #f8f8f8);
-    --optionRoyal: var(--colorRoyal40, #886aea);
+    --optionLight: var(--colorLight40, #dddddd);
+    --optionStable: var(--colorStable40, #b2b2b2);
+    --optionRoyal: var(--colorRoyal40, #7e5ee8);
     --optionDark: var(--colorDark40, #444444);
 
     /* Components - Panel */
-    --panelDefault: var(--colorDefault40, #2ca4a8);
-    --panelPrimary: var(--colorPrimary40, #2c72a8);
-    --panelSuccess: var(--colorSuccess40, #38a82c);
+    --panelDefault: linear-gradient(90deg, var(--colorDefault70, #185a5c) 0%, var(--colorPrimary60, #20547b) 100%);
+    --panelPrimary: linear-gradient(90deg, var(--colorPrimary40, #2c72a8) 40%, var(--colorPrimary30, #819fc0) 100%);
+    --panelSuccess: linear-gradient(90deg, var(--colorSuccess40, #38a82c) 40%, var(--colorSuccess30, #85c081) 100%);
     --panelCalm: var(--colorCalm40, #11c1f3);
-    --panelWarning: var(--colorWarning40, #daa31f);
-    --panelDanger: var(--colorDanger40, #a82c2c);
-    --panelLight: var(--colorLight40, #dddddd);
-    --panelStable: var(--colorStable40, #b2b2b2);
-    --panelRoyal: var(--colorRoyal40, #7e5ee8);
-    --panelDark: var(--colorDark40, #444444);
+    --panelWarning: linear-gradient(90deg, var(--colorWarning40, #daa31f) 40%, var(--colorWarning30, #e3bd7e) 100%);
+    --panelDanger: linear-gradient(90deg, var(--colorDanger40, #a82c2c) 40%, var(--colorDanger30, #c08181) 100%);
+    --panelLight: transparent;
+    --panelStable: linear-gradient(90deg, var(--colorStable40, #b2b2b2) 40%, var(--colorStable30, #c7c7c7) 100%);
+    --panelRoyal: linear-gradient(90deg, var(--colorRoyal40, #7e5ee8) 40%, var(--colorRoyal30, #a594ee) 100%);
+    --panelDark: linear-gradient(90deg, var(--colorDark40, #444444) 40%, var(--colorDark30, #898989) 100%);
+
+    --borderPanelDefault: transparent;
+    --borderPanelPrimary: transparent;
+    --borderPanelSuccess: transparent;
+    --borderPanelCalm: transparent;
+    --borderPanelWarning: transparent;
+    --borderPanelDanger: transparent;
+    --borderPanelLight: transparent;
+    --borderPanelStable: transparent;
+    --borderPanelRoyal: transparent;
+    --borderPanelDark: transparent;
+
+    /* === End - Variables used exclusively in the color palette property === */
 }
 
 .text-color-info {
@@ -811,7 +848,7 @@ td.k-state-focused.k-state-selected,
 }
 
 /* Grid */
-.k-grid .k-grid-header .k-header .k-checkbox-label:before{
+.k-grid .k-grid-header .k-header .k-checkbox-label:before {
     border-color: var(--textColorDefault40, #ffffff);
     color: var(--textColorDefault40, #ffffff);
 }
@@ -979,7 +1016,7 @@ table.table thead th {
     display: inline-flex;
 }
 
-.k-grid table .k-button.k-custom-command{
+.k-grid table .k-button.k-custom-command {
     width: inherit;
     min-width: 64px;
 }
@@ -1320,6 +1357,10 @@ td.k-state-focused.k-state-selected {
     color: var(--colorDefault40, #2a9fd6);
 }
 
+.k-window-titlebar {
+    background: transparent;
+}
+
 /* Slider */
 .k-slider-buttons .k-slider-items {
     display: flex;

package/css/themes/custom/cerulean/button-cerulean.css

@@ -44,6 +44,8 @@
 }
 
 /* Primary */
+.k-scheduler-edit-form .k-edit-field .k-button,
+.k-edit-form-container .k-edit-buttons .k-primary,
 .k-dialog-buttongroup .k-button.k-primary,
 .k-button.k-primary,
 .btn.btn-primary {
@@ -52,6 +54,10 @@
     color: var(--textColorPrimary40, #ffffff);
 }
 
+.k-scheduler-edit-form .k-edit-field .k-button:focus,
+.k-edit-form-container .k-edit-buttons .k-primary:focus,
+.k-scheduler-edit-form .k-edit-field .k-button:hover,
+.k-edit-form-container .k-edit-buttons .k-primary:hover,
 .k-dialog-buttongroup .k-button.k-primary:focus,
 .k-dialog-buttongroup .k-button.k-primary:hover,
 .k-button.k-primary:focus,
@@ -63,6 +69,10 @@
     border-color: var(--colorPrimary40, #2fa4e7);
 }
 
+.k-scheduler-edit-form .k-edit-field .k-button:active,
+.k-edit-form-container .k-edit-buttons .k-primary:active,
+.k-scheduler-edit-form .k-edit-field .k-button.active,
+.k-edit-form-container .k-edit-buttons .k-primary.active,
 .k-dialog-buttongroup .k-button.k-primary.active,
 .k-dialog-buttongroup .k-button.k-primary:active,
 .k-button.k-primary.active,
@@ -130,6 +140,8 @@
 }
 
 /* Danger */
+.k-edit-form-container .k-edit-buttons .k-scheduler-canceltimezone,
+.k-edit-form-container .k-edit-buttons .k-scheduler-cancel,
 .k-button.k-danger,
 .btn.btn-danger {
     background: linear-gradient(var(--colorDanger30, #d57e7f), var(--colorDanger40, #c71c22) 60%, var(--colorDanger50, #ae191e));
@@ -137,6 +149,10 @@
     color: var(--textColorDanger40, #ffffff);
 }
 
+.k-edit-form-container .k-edit-buttons .k-scheduler-canceltimezone:focus,
+.k-edit-form-container .k-edit-buttons .k-scheduler-cancel:focus,
+.k-edit-form-container .k-edit-buttons .k-scheduler-canceltimezone:hover,
+.k-edit-form-container .k-edit-buttons .k-scheduler-cancel:hover,
 .k-button.k-danger:focus,
 .k-button.k-danger:hover,
 .btn.btn-danger:focus,
@@ -146,6 +162,10 @@
     border-color: var(--colorDanger40, #c71c22);
 }
 
+.k-edit-form-container .k-edit-buttons .k-scheduler-canceltimezone:active,
+.k-edit-form-container .k-edit-buttons .k-scheduler-cancel:active,
+.k-edit-form-container .k-edit-buttons .k-scheduler-canceltimezone.active,
+.k-edit-form-container .k-edit-buttons .k-scheduler-cancel.active,
 .k-button.k-danger.active,
 .k-button.k-danger:active,
 .btn.btn-danger.active,
@@ -287,7 +307,6 @@
     border-color: var(--colorRoyal70, #4a3a80);
 }
 
-
 /* Dark */
 .k-button.k-dark,
 .btn.btn-dark {

package/css/themes/custom/cerulean/custom-cerulean.css

@@ -266,23 +266,25 @@
     --colorNeutral210: #090909;
     --colorNeutral220: #000000;
 
+    /* === Variables used exclusively in the color palette property === */
+
     /* Components - Button */
     --btnLink: var(--colorPrimary40, #2fa4e7);
-    --btnDefault: var(--colorDefault40, #f5f5f5);
-    --btnPrimary: var(--colorPrimary40, #2fa4e7);
-    --btnSuccess: var(--colorSuccess40, #73a839);
-    --btnCalm: var(--colorCalm40, #033c73);
-    --btnWarning: var(--colorWarning40, #dd5600);
-    --btnDanger: var(--colorDanger40, #c71c22);
-    --btnLight: var(--colorLight40, #ffffff);
-    --btnStable: var(--colorStable40, #f8f8f8);
-    --btnRoyal: var(--colorRoyal40, #886aea);
-    --btnDark: var(--colorDark40, #444444);
+    --btnDefault: linear-gradient(var(--colorDefault10, #fcfcfc), var(--colorDefault10, #fcfcfc) 60%, var(--colorDefault40, #f5f5f5));
+    --btnPrimary: linear-gradient(var(--colorPrimary30, #82bded), var(--colorPrimary40, #2fa4e7) 60%, var(--colorPrimary50, #3c6088));
+    --btnSuccess: linear-gradient(var(--colorSuccess30, #9fc085), var(--colorSuccess40, #73a839) 60%, var(--colorSuccess50, #359e1d));
+    --btnCalm: linear-gradient(var(--colorCalm30, #7b869f), var(--colorCalm40, #033c73) 60%, var(--colorCalm50, #033565));
+    --btnWarning: linear-gradient(var(--colorWarning30, #e5907b), var(--colorWarning40, #dd5600) 60%, var(--colorWarning50, #c24b00));
+    --btnDanger: linear-gradient(var(--colorDanger30, #d57e7f), var(--colorDanger40, #c71c22) 60%, var(--colorDanger50, #ae191e));
+    --btnLight: linear-gradient(var(--colorLight30, #ffffff), var(--colorLight40, #ffffff) 60%, var(--colorLight50, #dfdfdf));
+    --btnStable: linear-gradient(var(--colorStable30, #fafafa), var(--colorStable40, #f8f8f8) 60%, var(--colorStable50, #d9d9d9));
+    --btnRoyal: linear-gradient(var(--colorRoyal30, #ab9aef), var(--colorRoyal40, #886aea) 60%, var(--colorRoyal50, #775dcd));
+    --btnDark: linear-gradient(var(--colorDark30, #898989), var(--colorDark40, #444444) 60%, var(--colorDark50, #3c3c3c));
 
     --textColorDefault: var(--textColorDefault40, #444444);
     --textColorPrimary: var(--textColorPrimary40, #ffffff);
     --textColorSuccess: var(--textColorSuccess40, #ffffff);
-    --textColorCalm: var(--textColorDefault40, #ffffff);
+    --textColorCalm: var(--textColorCalm40, #ffffff);
     --textColorWarning: var(--textColorWarning40, #ffffff);
     --textColorDanger: var(--textColorDanger40, #ffffff);
     --textColorLight: var(--textColorLight40, #444444);
@@ -290,6 +292,18 @@
     --textColorRoyal: var(--textColorRoyal40, #ffffff);
     --textColorDark: var(--textColorDark40, #ffffff);
 
+    --borderBtnLink: transparent;
+    --borderBtnDefault: var(--colorDefault50, #d7d7d7);
+    --borderBtnPrimary: var(--colorPrimary40, #2fa4e7);
+    --borderBtnSuccess: var(--colorSuccess40, #73a839);
+    --borderBtnCalm: var(--colorCalm40, #033c73);
+    --borderBtnWarning: var(--colorWarning40, #dd5600);
+    --borderBtnDanger: var(--colorDanger50, #ae191e);
+    --borderBtnLight: var(--colorLight40, #ffffff);
+    --borderBtnStable: var(--colorStable40, #f8f8f8);
+    --borderBtnRoyal: var(--colorRoyal40, #886aea);
+    --borderBtnDark: var(--colorDark40, #444444);
+
     /* Components - Text color */
     --colorDefault: var(--colorDefault50, #d7d7d7);
     --colorPrimary: var(--colorPrimary40, #2fa4e7);
@@ -326,6 +340,17 @@
     --comboboxRoyal: var(--colorRoyal40, #886aea);
     --comboboxDark: var(--colorDark40, #444444);
 
+    --borderComboboxDefault: var(--colorDefault50, #d7d7d7);
+    --borderComboboxPrimary: var(--colorPrimary50, #4b58a6);
+    --borderComboboxSuccess: var(--colorSuccess50, #73a839);
+    --borderComboboxCalm: var(--colorCalm50, #033c73);
+    --borderComboboxWarning: var(--colorWarning50, #dd5600);
+    --borderComboboxDanger: var(--colorDanger50, #ae191e);
+    --borderComboboxLight: var(--colorLight50, #dfdfdf);
+    --borderComboboxStable: var(--colorStable50, #f8f8f8);
+    --borderComboboxRoyal: var(--colorRoyal50, #775dcd);
+    --borderComboboxDark: var(--colorDark50, #3c3c3c);
+
     /* Components - Radio input */
     --optionDefault: var(--colorDefault50, #d7d7d7);
     --optionPrimary: var(--colorPrimary40, #2fa4e7);
@@ -339,7 +364,7 @@
     --optionDark: var(--colorDark40, #444444);
 
     /* Components - Panel */
-    --panelDefault: var(--colorPrimary40, #2ca4a8);
+    --panelDefault: var(--colorPrimary40, #2fa4e7);
     --panelPrimary: var(--colorDefault40, #f5f5f5);
     --panelSuccess: var(--colorSuccess40, #73a839);
     --panelCalm: var(--colorCalm40, #033c73);
@@ -349,6 +374,19 @@
     --panelStable: var(--colorStable50, #d9d9d9);
     --panelRoyal: var(--colorRoyal40, #886aea);
     --panelDark: var(--colorDark40, #444444);
+
+    --borderPanelDefault: var(--colorPrimary40, #2fa4e7);
+    --borderPanelPrimary: var(--colorDefault40, #f5f5f5);
+    --borderPanelSuccess: var(--colorSuccess40, #73a839);
+    --borderPanelCalm: var(--colorCalm40, #033c73);
+    --borderPanelWarning: var(--colorWarning40, #dd5600);
+    --borderPanelDanger: var(--colorDanger40, #c71c22);
+    --borderPanelLight: var(--colorLight50, #dfdfdf);
+    --borderPanelStable: var(--colorStable50, #d9d9d9);
+    --borderPanelRoyal: var(--colorRoyal40, #886aea);
+    --borderPanelDark: var(--colorDark40, #444444);
+
+    /* === End - Variables used exclusively in the color palette property === */
 }
 
 h1,
@@ -877,4 +915,8 @@ td.k-state-focused.k-state-selected {
 .k-scheduler-navigation .k-nav-next.k-state-hover .k-link span,
 .k-scheduler-navigation .k-nav-prev.k-state-hover .k-link span {
     color: var(--textColorPrimary40, #ffffff);
+}
+
+.k-window-titlebar {
+    background: transparent;
 }

package/css/themes/custom/dsgov/custom-dsgov.css

@@ -273,10 +273,11 @@
     --colorNeutral210: #090909;
     --colorNeutral220: #000000;
 
+        /* === Variables used exclusively in the color palette property === */
     /* Components - Button */
     --btnLink: var(--colorPrimary40, #1351b4);
     --btnDefault: var(--colorDefault40, #1351b4);
-    --btnPrimary: var(--colorPrimary40, #1351b4);
+    --btnPrimary: transparent;
     --btnSuccess: var(--colorSuccess40, #168821);
     --btnCalm: var(--colorCalm40, #3b448e);
     --btnWarning: var(--colorWarning40, #ffcd07);
@@ -297,6 +298,18 @@
     --textColorRoyal: var(--textColorRoyal40, #ffffff);
     --textColorDark: var(--textColorDark40, #ffffff);
 
+    --borderBtnLink: transparent;
+    --borderBtnDefault: transparent;
+    --borderBtnPrimary: var(--colorPrimary40, #1351b4);
+    --borderBtnSuccess: transparent;
+    --borderBtnCalm: transparent;
+    --borderBtnWarning: transparent;
+    --borderBtnDanger: transparent;
+    --borderBtnLight: transparent;
+    --borderBtnStable: transparent;
+    --borderBtnRoyal: transparent;
+    --borderBtnDark: transparent;
+
     /* Components - Text color */
     --colorDefault: var(--colorDefault40, #1351b4);
     --colorPrimary: var(--colorPrimary40, #1351b4);
@@ -333,6 +346,17 @@
     --comboboxRoyal: var(--colorRoyal40, #886aea);
     --comboboxDark: var(--colorDark40, #444444);
 
+    --borderComboboxDefault: var(--colorDefault50, #11479e);
+    --borderComboboxPrimary: var(--colorPrimary50, #11479e);
+    --borderComboboxSuccess: var(--colorSuccess50, #13771d);
+    --borderComboboxCalm: var(--colorCalm50, #343c7c);
+    --borderComboboxWarning: var(--colorWarning50, #dfb306);
+    --borderComboboxDanger: var(--colorDanger50, #c91e06);
+    --borderComboboxLight: var(--colorLight50, #dfdfdf);
+    --borderComboboxStable: var(--colorStable50, #d9d9d9);
+    --borderComboboxRoyal: var(--colorRoyal50, #775dcd);
+    --borderComboboxDark: var(--colorDark50, #3c3c3c);
+
     /* Components - Radio input */
     --optionDefault: var(--colorDefault40, #1351b4);
     --optionPrimary: var(--colorPrimary40, #1351b4);
@@ -356,6 +380,19 @@
     --panelStable: var(--colorStable50, #d9d9d9);
     --panelRoyal: var(--colorRoyal40, #886aea);
     --panelDark: var(--colorDark40, #444444);
+
+    --borderPanelDefault: transparent;
+    --borderPanelPrimary: transparent;
+    --borderPanelSuccess: transparent;
+    --borderPanelCalm: transparent;
+    --borderPanelWarning: transparent;
+    --borderPanelDanger: transparent;
+    --borderPanelLight: transparent;
+    --borderPanelStable: transparent;
+    --borderPanelRoyal: transparent;
+    --borderPanelDark: transparent;
+
+     /* === End - Variables used exclusively in the color palette property === */
 }
 
 body {

package/css/themes/custom/fuse/custom-fuse.css

@@ -266,12 +266,14 @@
     --colorNeutral210: #090909;
     --colorNeutral220: #000000;
 
+    /* === Variables used exclusively in the color palette property === */
+
     /* Components - Button */
     --btnLink: var(--colorPrimary40, #4f46e5);
     --btnDefault: var(--colorDefault40, #1e293b);
     --btnPrimary: var(--colorPrimary40, #4f46e5);
     --btnSuccess: var(--colorSuccess40, #22c55e);
-    --btnCalm: var(--textColor40, #383838);
+    --btnCalm: var(--colorLight40, #ffffff);
     --btnWarning: var(--colorWarning40, #f59e0b);
     --btnDanger: var(--colorDanger40, #ef4444);
     --btnLight: var(--colorLight50, #dfdfdf);
@@ -282,7 +284,7 @@
     --textColorDefault: var(--textColorDefault40, #ffffff);
     --textColorPrimary: var(--textColorPrimary40, #ffffff);
     --textColorSuccess: var(--textColorSuccess40, #ffffff);
-    --textColorCalm: var(--textColor40, #383838);
+    --textColorCalm: var(--colorLight40, #ffffff);
     --textColorWarning: var(--textColorWarning40, #ffffff);
     --textColorDanger: var(--textColorDanger40, #ffffff);
     --textColorLight: var(--textColor40, #383838);
@@ -290,11 +292,23 @@
     --textColorRoyal: var(--textColorRoyal40, #ffffff);
     --textColorDark: var(--textColorDark40, #000000);
 
+    --borderBtnLink: transparent;
+    --borderBtnDefault: transparent;
+    --borderBtnPrimary: transparent;
+    --borderBtnSuccess: transparent;
+    --borderBtnCalm: var(--textColor20, #b2b2b2);
+    --borderBtnWarning: transparent;
+    --borderBtnDanger: transparent;
+    --borderBtnLight: transparent;
+    --borderBtnStable: transparent;
+    --borderBtnRoyal: transparent;
+    --borderBtnDark: transparent;
+
     /* Components - Text color */
     --colorDefault: var(--colorDefault40, #1e293b);
     --colorPrimary: var(--colorPrimary40, #4f46e5);
     --colorSuccess: var(--colorSuccess40, #22c55e);
-    --colorCalm: var(--colorCalm40, #1e293b);
+    --colorCalm: var(--colorCalm40, #11c1f3);
     --colorWarning: var(--colorWarning40, #f59e0b);
     --colorDanger: var(--colorDanger40, #ef4444);
     --colorLight: var(--colorLight50, #dfdfdf);
@@ -315,7 +329,7 @@
     --checkboxDark: var(--colorDark40, #adafae);
 
     /* Components - Combobox */
-    --comboboxDefault: var(--colorDefault40, #3b448e);
+    --comboboxDefault: var(--colorDefault40, #1e293b);
     --comboboxPrimary: var(--colorPrimary40, #4f46e5);
     --comboboxSuccess: var(--colorSuccess40, #22c55e);
     --comboboxCalm: var(--colorCalm40, #11c1f3);
@@ -326,6 +340,17 @@
     --comboboxRoyal: var(--colorRoyal40, #9933cc);
     --comboboxDark: var(--colorDark40, #adafae);
 
+    --borderComboboxDefault: var(--colorDefault50, #161f2c);
+    --borderComboboxPrimary: var(--colorPrimary50, #453dc9);
+    --borderComboboxSuccess: var(--colorSuccess50, #1eac52);
+    --borderComboboxCalm: var(--colorCalm50, #0fa9d5);
+    --borderComboboxWarning: var(--colorWarning50, #d78a0a);
+    --borderComboboxDanger: var(--colorDanger50, #d13c3c);
+    --borderComboboxLight: var(--colorLight50, #dfdfdf);
+    --borderComboboxStable: var(--colorStable50, #d9d9d9);
+    --borderComboboxRoyal: var(--colorRoyal50, #862db3);
+    --borderComboboxDark: var(--colorDark50, #979998);
+
     /* Components - Radio input */
     --optionDefault: var(--colorDefault40, #1e293b);
     --optionPrimary: var(--colorPrimary40, #4f46e5);
@@ -333,7 +358,7 @@
     --optionCalm: var(--colorCalm40, #11c1f3);
     --optionWarning: var(--colorWarning40, #f59e0b);
     --optionDanger: var(--colorDanger40, #ef4444);
-    --optionLight: var(--colorLight60, #ffffff);
+    --optionLight: var(--colorLight60, #bbbbbb);
     --optionStable: var(--colorStable60, #b6b6b6);
     --optionRoyal: var(--colorRoyal40, #9933cc);
     --optionDark: var(--colorDark40, #adafae);
@@ -349,6 +374,19 @@
     --panelStable: var(--colorStable50, #d9d9d9);
     --panelRoyal: var(--colorRoyal40, #9933cc);
     --panelDark: var(--colorDark40, #adafae);
+
+    --borderPanelDefault: var(--colorDefault40, #1e293b);
+    --borderPanelPrimary: var(--colorPrimary40, #4f46e5);
+    --borderPanelSuccess: var(--colorSuccess40, #22c55e);
+    --borderPanelCalm: var(--colorCalm40, #11c1f3);
+    --borderPanelWarning: var(--colorWarning40, #f59e0b);
+    --borderPanelDanger: var(--colorDanger40, #ef4444);
+    --borderPanelLight: var(--colorLight50, #dfdfdf);
+    --borderPanelStable: var(--colorStable50, #d9d9d9);
+    --borderPanelRoyal: var(--colorRoyal40, #9933cc);
+    --borderPanelDark: var(--colorDark40, #adafae);
+
+    /* === End - Variables used exclusively in the color palette property === */
 }
 
 #main-view {
@@ -1102,4 +1140,8 @@ div[data-component="crn-grid"] .k-grid-header th.k-header {
 .k-scheduler-toolbar>ul.k-scheduler-views li:first-child+li,
 .k-scheduler-toolbar>ul.k-scheduler-views li:first-child+li .k-link {
     border-radius: var(--borderRadiusFull, 99999px);
+}
+
+.k-window-titlebar {
+    background: transparent;
 }