@syncfusion/ej2-base 32.1.23 → 32.1.24

package/styles/bootstrap5.3-lite.css

@@ -2447,6 +2447,690 @@
   --color-sf-shadow-color1: #000;
 }
 
+/* Font Family */
+/* Font Sizes */
+/* Radius */
+/* 1px */
+/* 2px */
+/* 3px */
+/* 4px */
+/* 5px */
+/* 6px */
+/* 7px */
+/* 8px */
+/* 9px */
+/* 10px */
+/* 11px */
+/* 12px */
+/* 13px */
+/* 14px */
+/* 15px */
+/* 16px */
+/* 17px */
+/* 18px */
+/* 19px */
+/* 20px */
+/* 21px */
+/* 22px */
+/* 23px */
+/* 24px */
+/* 25px */
+/* 26px */
+/* 27px */
+/* 28px */
+/* 29px */
+/* 30px */
+/* 31px */
+/* 32px */
+/* 33px */
+/* 34px */
+/* 35px */
+/* 36px */
+/* 37px */
+/* 38px */
+/* 39px */
+/* 40px */
+/* 41px */
+/* 42px */
+/* 43px */
+/* 44px */
+/* 45px */
+/* 46px */
+/* 47px */
+/* 48px */
+/* 49px */
+/* 50px */
+/* 5em */
+/* 65% */
+/* border */
+/* 0px */
+/* 1px */
+/* 1.5px */
+/* 2px */
+/* 3px */
+/* 4px */
+/* 5px */
+/* 6px */
+/* 7px */
+/* 8px */
+/* 9px */
+/* 10px */
+/* 11px */
+/* 12px */
+/* 13px */
+/* 14px */
+/* 15px */
+/* 16px */
+:root {
+  --color-sf-black: 0, 0, 0;
+  --color-sf-white: 255, 255, 255;
+  --color-sf-content-bg-color: #fff;
+  --color-sf-content-bg-color-alt1: #f8f9fa;
+  --color-sf-content-bg-color-alt2: #e9ecef;
+  --color-sf-content-bg-color-alt3: #dee2e6;
+  --color-sf-content-bg-color-alt4: #ced4da;
+  --color-sf-content-bg-color-alt5: #adb5bd;
+  --color-sf-content-bg-color-hover: #f8f9fa;
+  --color-sf-content-bg-color-pressed: #e9ecef;
+  --color-sf-content-bg-color-focus: #e9ecef;
+  --color-sf-content-bg-color-selected: #0d6efd;
+  --color-sf-content-bg-color-dragged: #ced4da;
+  --color-sf-content-bg-color-disabled: #e9ecef;
+  --color-sf-flyout-bg-color: #fff;
+  --color-sf-flyout-bg-color-hover: #f8f9fa;
+  --color-sf-flyout-bg-color-pressed: #0d6efd;
+  --color-sf-flyout-bg-color-focus: #f8f9fa;
+  --color-sf-overlay-bg-color: 0, 0, 0;
+  --color-sf-table-bg-color-hover: rgba(0, 0, 0, .07);
+  --color-sf-table-bg-color-pressed: #dee2e6;
+  --color-sf-table-bg-color-selected: rgba(0, 0, 0, .1);
+  --color-sf-content-text-color: #212529;
+  --color-sf-content-text-color-alt1: rgba(33, 37, 41, .75);
+  --color-sf-content-text-color-alt2: rgba(33, 37, 41, .5);
+  --color-sf-content-text-color-alt3: rgba(33, 37, 41, .25);
+  --color-sf-content-text-color-hover: #000;
+  --color-sf-content-text-color-pressed: var(--color-sf-content-text-color);
+  --color-sf-content-text-color-focus: #000;
+  --color-sf-content-text-color-selected: #fff;
+  --color-sf-content-text-color-dragged: var(--color-sf-content-text-color);
+  --color-sf-content-text-color-disabled: rgba(33, 37, 41, .75);
+  --color-sf-placeholder-text-color: #6c757d;
+  --color-sf-flyout-text-color: var(--color-sf-content-text-color);
+  --color-sf-flyout-text-color-hover: var(--color-sf-content-text-color);
+  --color-sf-flyout-text-color-pressed: #fff;
+  --color-sf-flyout-text-color-focus: var(--color-sf-content-text-color);
+  --color-sf-flyout-text-color-disabled: rgba(33, 37, 41, .5);
+  --color-sf-table-text-color-hover: var(--color-sf-content-text-color);
+  --color-sf-table-text-color-pressed: var(--color-sf-content-text-color);
+  --color-sf-table-text-color-selected: var(--color-sf-content-text-color);
+  --color-sf-icon-color: #6c757d;
+  --color-sf-icon-color-hover: #343a40;
+  --color-sf-icon-color-pressed: #212529;
+  --color-sf-icon-color-disabled: #adb5bd;
+  --color-sf-close-icon-color: rgba(0, 0, 0, .5);
+  --color-sf-close-icon-color-hover: rgba(0, 0, 0, .75);
+  --color-sf-close-icon-color-pressed: rgba(0, 0, 0, 1);
+  --color-sf-close-icon-color-disabled: rgba(0, 0, 0, .25);
+  --color-sf-border-light: #dee2e6;
+  --color-sf-border: #dee2e6;
+  --color-sf-border-dark: #adb5bd;
+  --color-sf-border-hover: #dee2e6;
+  --color-sf-border-pressed: #dee2e6;
+  --color-sf-border-focus: #86b7fe;
+  --color-sf-border-selected: #86b7fe;
+  --color-sf-border-dragged: #dee2e6;
+  --color-sf-border-disabled: #dee2e6;
+  --color-sf-border-warning: #ffc107;
+  --color-sf-border-error: #dc3545;
+  --color-sf-border-success: #198754;
+  --color-sf-spreadsheet-gridline: #dee2e6;
+  --color-sf-flyout-border: rgba(0, 0, 0, .175);
+  --color-sf-primary: rgba(13, 110, 253, 1);
+  --color-sf-primary-text-color: #fff;
+  --color-sf-primary-light: #86b7fe;
+  --color-sf-primary-lighter: #cfe2ff;
+  --color-sf-primary-dark: #3367d1;
+  --color-sf-primary-darker: #052c65;
+  --color-sf-secondary: rgba(108, 117, 125, 1);
+  --color-sf-success: rgba(25, 135, 84, 1);
+  --color-sf-info: rgba(13, 202, 240, 1);
+  --color-sf-warning: rgba(255, 193, 7, 1);
+  --color-sf-danger: rgba(220, 53, 69, 1);
+  --color-sf-success-light: #d1e7dd;
+  --color-sf-info-light: #cff4fc;
+  --color-sf-warning-light: #fff3cd;
+  --color-sf-danger-light: #f8d7da;
+  --color-sf-success-dark: #0a3622;
+  --color-sf-info-dark: #055160;
+  --color-sf-warning-dark: #664d03;
+  --color-sf-danger-dark: #58151c;
+  --color-sf-success-light-alt: #d1e7dd;
+  --color-sf-info-light-alt: #cff4fc;
+  --color-sf-warning-light-alt: #fff3cd;
+  --color-sf-danger-light-alt: #f8d7da;
+  --color-sf-primary-shadow: 13, 110, 253;
+  --color-sf-secondary-shadow: 108, 117, 125;
+  --color-sf-success-shadow: 25, 135, 84;
+  --color-sf-info-shadow: 13, 202, 240;
+  --color-sf-warning-shadow: 255, 193, 7;
+  --color-sf-danger-shadow: 220, 53, 69;
+  --color-sf-primary-bg-color: var(--color-sf-primary);
+  --color-sf-primary-border-color: var(--color-sf-primary);
+  --color-sf-primary-text: var(--color-sf-primary-text-color);
+  --color-sf-primary-bg-color-hover: #0b5ed7;
+  --color-sf-primary-border-color-hover: #0a58ca;
+  --color-sf-primary-text-hover: var(--color-sf-primary-text-color);
+  --color-sf-primary-bg-color-pressed: #0a58ca;
+  --color-sf-primary-border-color-pressed: #0a58ca;
+  --color-sf-primary-text-pressed: var(--color-sf-primary-text-color);
+  --color-sf-primary-bg-color-focus: var(--color-sf-primary-bg-color-hover);
+  --color-sf-primary-border-color-focus: var(--color-sf-primary-border-color-hover);
+  --color-sf-primary-text-focus: var(--color-sf-primary-text-hover);
+  --color-sf-primary-bg-color-disabled: rgba(13, 110, 253, .65);
+  --color-sf-primary-border-color-disabled: var(--color-sf-primary-bg-color-disabled);
+  --color-sf-primary-text-disabled: rgba(255, 255, 255, .65);
+  --color-sf-secondary-bg-color: var(--color-sf-secondary);
+  --color-sf-secondary-border-color: var(--color-sf-secondary-bg-color);
+  --color-sf-secondary-text-color: #fff;
+  --color-sf-secondary-bg-color-hover: #5c636a;
+  --color-sf-secondary-border-color-hover: #565e64;
+  --color-sf-secondary-text-color-hover: var(--color-sf-secondary-text-color);
+  --color-sf-secondary-bg-color-pressed: #565e64;
+  --color-sf-secondary-border-color-pressed: #51585e;
+  --color-sf-secondary-text-color-pressed: var(--color-sf-secondary-text-color);
+  --color-sf-secondary-bg-color-focus: var(--color-sf-secondary-bg-color-hover);
+  --color-sf-secondary-border-color-focus: var(--color-sf-secondary-border-color-hover);
+  --color-sf-secondary-text-color-focus: var(--color-sf-secondary-text-color-hover);
+  --color-sf-secondary-bg-color-disabled: rgba(108, 117, 125, .65);
+  --color-sf-secondary-border-color-disabled: var(--color-sf-secondary-bg-color-disabled);
+  --color-sf-secondary-text-color-disabled: rgba(255, 255, 255, .65);
+  --color-sf-success-bg-color: var(--color-sf-success);
+  --color-sf-success-border-color: var(--color-sf-success-bg-color);
+  --color-sf-success-text: #fff;
+  --color-sf-success-bg-color-hover: #157347;
+  --color-sf-success-border-color-hover: #146c43;
+  --color-sf-success-text-hover: var(--color-sf-success-text);
+  --color-sf-success-bg-color-pressed: #146c43;
+  --color-sf-success-border-color-pressed: #13653f;
+  --color-sf-success-text-pressed: var(--color-sf-success-text);
+  --color-sf-success-bg-color-focus: var(--color-sf-success-bg-color-hover);
+  --color-sf-success-border-color-focus: var(--color-sf-success-bg-color-focus);
+  --color-sf-success-text-focus: var(--color-sf-success-text);
+  --color-sf-success-bg-color-disabled: rgba(25, 135, 84, .65);
+  --color-sf-success-border-color-disabled: var(--color-sf-success-bg-color-disabled);
+  --color-sf-success-text-disabled: rgba(255, 255, 255, .65);
+  --color-sf-warning-bg-color: var(--color-sf-warning);
+  --color-sf-warning-border-color: var(--color-sf-warning-bg-color);
+  --color-sf-warning-text: #000;
+  --color-sf-warning-bg-color-hover: #ffca2c;
+  --color-sf-warning-border-color-hover: #ffc720;
+  --color-sf-warning-text-hover: var(--color-sf-warning-text);
+  --color-sf-warning-bg-color-pressed: #ffcd39;
+  --color-sf-warning-border-color-pressed: #ffc720;
+  --color-sf-warning-text-pressed: var(--color-sf-warning-text);
+  --color-sf-warning-bg-color-focus: var(--color-sf-warning-bg-color-hover);
+  --color-sf-warning-border-color-focus: var(--color-sf-warning-bg-color-focus);
+  --color-sf-warning-text-focus: var(--color-sf-warning-text);
+  --color-sf-warning-bg-color-disabled: rgba(255, 193, 7, .65);
+  --color-sf-warning-border-color-disabled: var(--color-sf-warning-bg-color-disabled);
+  --color-sf-warning-text-disabled: rgba(0, 0, 0, .65);
+  --color-sf-info-bg-color: var(--color-sf-info);
+  --color-sf-info-border-color: var(--color-sf-info-bg-color);
+  --color-sf-info-text: #000;
+  --color-sf-info-bg-color-hover: #31d2f2;
+  --color-sf-info-border-color-hover: #25cff2;
+  --color-sf-info-text-hover: var(--color-sf-info-text);
+  --color-sf-info-bg-color-pressed: #3dd5f3;
+  --color-sf-info-border-color-pressed: #25cff2;
+  --color-sf-info-text-pressed: var(--color-sf-info-text);
+  --color-sf-info-bg-color-focus: var(--color-sf-info-bg-color-hover);
+  --color-sf-info-border-color-focus: var(--color-sf-info-bg-color-focus);
+  --color-sf-info-text-focus: var(--color-sf-info-text-hover);
+  --color-sf-info-bg-color-disabled: rgba(13, 202, 240, .65);
+  --color-sf-info-border-color-disabled: var(--color-sf-info-bg-color-disabled);
+  --color-sf-info-text-disabled: rgba(0, 0, 0, .65);
+  --color-sf-danger-bg-color: var(--color-sf-danger);
+  --color-sf-danger-border-color: var(--color-sf-danger-bg-color);
+  --color-sf-danger-text: #fff;
+  --color-sf-danger-bg-color-hover: #bb2d3b;
+  --color-sf-danger-border-color-hover: #b02a37;
+  --color-sf-danger-text-hover: var(--color-sf-danger-text);
+  --color-sf-danger-bg-color-pressed: #b02a37;
+  --color-sf-danger-border-color-pressed: #a52834;
+  --color-sf-danger-text-pressed: var(--color-sf-danger-text);
+  --color-sf-danger-bg-color-focus: var(--color-sf-danger-bg-color-hover);
+  --color-sf-danger-border-color-focus: var(--color-sf-danger-bg-color-focus);
+  --color-sf-danger-text-focus: var(--color-sf-danger-text-hover);
+  --color-sf-danger-bg-color-disabled: rgba(220, 53, 69, .65);
+  --color-sf-danger-border-color-disabled: var(--color-sf-danger-bg-color-disabled);
+  --color-sf-danger-text-disabled: rgba(255, 255, 255, .65);
+  --color-sf-primary-outline: var(--color-sf-primary-bg-color);
+  --color-sf-secondary-outline: var(--color-sf-secondary-bg-color);
+  --color-sf-warning-outline: var(--color-sf-warning-bg-color);
+  --color-sf-danger-outline: var(--color-sf-danger-bg-color);
+  --color-sf-success-outline: var(--color-sf-success-bg-color);
+  --color-sf-info-outline: var(--color-sf-info-bg-color);
+  --color-sf-tooltip-bg-color: rgba(0, 0, 0, .9);
+  --color-sf-tooltip-border: var(--color-sf-tooltip-bg-color);
+  --color-sf-tooltip-text-color: #fff;
+  --color-sf-appbar-bg-color-alt1: var(--color-sf-content-bg-color-alt1);
+  --color-sf-appbar-color-alt1: var(--color-sf-content-text-color);
+  --color-sf-appbar-border-color-alt1: var(--color-sf-appbar-bg-color-alt1);
+  --color-sf-appbar-hover-bg-color-alt1: transparent;
+  --color-sf-appbar-bg-color-alt2: #212529;
+  --color-sf-appbar-color-alt2: #fff;
+  --color-sf-appbar-border-color-alt2: var(--color-sf-appbar-bg-color-alt2);
+  --color-sf-appbar-hover-bg-color-alt2: transparent;
+  --color-sf-diagram-palette-background: #fff;
+  --color-sf-diagram-palette-hover-background: var(--color-sf-content-bg-color-hover);
+  --color-sf-diagram-palette-selected-color: #e9ecef;
+  --color-sf-rating-selected-color: var(--color-sf-primary);
+  --color-sf-rating-unrated-color: #6c757d;
+  --color-sf-rating-selected-disabled-color: #adb5bd;
+  --color-sf-rating-unrated-disabled-color: #ced4da;
+  --color-sf-rating-selected-hover-color: #63757d;
+  --color-sf-rating-unrated-hover-color: var(--color-sf-primary);
+  --color-sf-rating-pressed-color: #599bfe;
+  --color-sf-msg-color: #2b2f32;
+  --color-sf-msg-bg-color: #e2e3e5;
+  --color-sf-msg-border-color: #c4c8cb;
+  --color-sf-msg-color-alt1: var(--color-sf-msg-color);
+  --color-sf-msg-bg-color-alt1: transparent;
+  --color-sf-msg-border-color-alt1: var(--color-sf-msg-border-color);
+  --color-sf-msg-color-alt2: #fff;
+  --color-sf-msg-bg-color-alt2: #6c757d;
+  --color-sf-msg-border-color-alt2: var(--color-sf-msg-bg-color-alt2);
+  --color-sf-msg-icon-color: var(--color-sf-msg-color);
+  --color-sf-msg-icon-color-alt1: var(--color-sf-msg-color);
+  --color-sf-msg-icon-color-alt2: #fff;
+  --color-sf-msg-close-icon-color: var(--color-sf-close-icon-color);
+  --color-sf-msg-close-icon-color-alt1: var(--color-sf-close-icon-color);
+  --color-sf-msg-close-icon-color-alt2: #fff;
+  --color-sf-msg-danger-color: #58151c;
+  --color-sf-msg-danger-bg-color: #f8d7da;
+  --color-sf-msg-danger-border-color: #f1aeb5;
+  --color-sf-msg-danger-color-alt1: var(--color-sf-msg-danger-color);
+  --color-sf-msg-danger-bg-color-alt1: transparent;
+  --color-sf-msg-danger-border-color-alt1: var(--color-sf-msg-danger-border-color);
+  --color-sf-msg-danger-color-alt2: #fff;
+  --color-sf-msg-danger-bg-color-alt2: #dc3545;
+  --color-sf-msg-danger-border-color-alt2: var(--color-sf-msg-danger-bg-color-alt2);
+  --color-sf-msg-danger-icon-color: var(--color-sf-msg-danger-color);
+  --color-sf-msg-danger-icon-color-alt1: var(--color-sf-msg-danger-color);
+  --color-sf-msg-danger-icon-color-alt2: #fff;
+  --color-sf-msg-danger-close-icon-color: var(--color-sf-close-icon-color);
+  --color-sf-msg-danger-close-icon-color-alt1: var(--color-sf-close-icon-color);
+  --color-sf-msg-danger-close-icon-color-alt2: #fff;
+  --color-sf-msg-success-color: #0a3622;
+  --color-sf-msg-success-bg-color: #d1e7dd;
+  --color-sf-msg-success-border-color: #a3cfbb;
+  --color-sf-msg-success-color-alt1: var(--color-sf-msg-success-color);
+  --color-sf-msg-success-bg-color-alt1: transparent;
+  --color-sf-msg-success-border-color-alt1: var(--color-sf-msg-success-border-color);
+  --color-sf-msg-success-color-alt2: #fff;
+  --color-sf-msg-success-bg-color-alt2: #198754;
+  --color-sf-msg-success-border-color-alt2: var(--color-sf-msg-success-bg-color-alt2);
+  --color-sf-msg-success-icon-color: var(--color-sf-msg-success-color);
+  --color-sf-msg-success-icon-color-alt1: var(--color-sf-msg-success-color);
+  --color-sf-msg-success-icon-color-alt2: #fff;
+  --color-sf-msg-success-close-icon-color: var(--color-sf-close-icon-color);
+  --color-sf-msg-success-close-icon-color-alt1: var(--color-sf-close-icon-color);
+  --color-sf-msg-success-close-icon-color-alt2: #fff;
+  --color-sf-msg-warning-color: #664d03;
+  --color-sf-msg-warning-bg-color: #fff3cd;
+  --color-sf-msg-warning-border-color: #ffe69c;
+  --color-sf-msg-warning-color-alt1: var(--color-sf-msg-warning-color);
+  --color-sf-msg-warning-bg-color-alt1: transparent;
+  --color-sf-msg-warning-border-color-alt1: var(--color-sf-msg-warning-border-color);
+  --color-sf-msg-warning-color-alt2: #212529;
+  --color-sf-msg-warning-bg-color-alt2: #ffc107;
+  --color-sf-msg-warning-border-color-alt2: var(--color-sf-msg-warning-bg-color-alt2);
+  --color-sf-msg-warning-icon-color: var(--color-sf-msg-warning-color);
+  --color-sf-msg-warning-icon-color-alt1: var(--color-sf-msg-warning-color);
+  --color-sf-msg-warning-icon-color-alt2: #212529;
+  --color-sf-msg-warning-close-icon-color: var(--color-sf-close-icon-color);
+  --color-sf-msg-warning-close-icon-color-alt1: var(--color-sf-close-icon-color);
+  --color-sf-msg-warning-close-icon-color-alt2: #212529;
+  --color-sf-msg-info-color: #055160;
+  --color-sf-msg-info-bg-color: #cff4fc;
+  --color-sf-msg-info-border-color: #9eeaf9;
+  --color-sf-msg-info-color-alt1: var(--color-sf-msg-info-color);
+  --color-sf-msg-info-bg-color-alt1: transparent;
+  --color-sf-msg-info-border-color-alt1: var(--color-sf-msg-info-border-color);
+  --color-sf-msg-info-color-alt2: #212529;
+  --color-sf-msg-info-bg-color-alt2: #0dcaf0;
+  --color-sf-msg-info-border-color-alt2: var(--color-sf-msg-info-bg-color-alt2);
+  --color-sf-msg-info-icon-color: var(--color-sf-msg-info-color);
+  --color-sf-msg-info-icon-color-alt1: var(--color-sf-msg-info-color);
+  --color-sf-msg-info-icon-color-alt2: #212529;
+  --color-sf-msg-info-close-icon-color: var(--color-sf-close-icon-color);
+  --color-sf-msg-info-close-icon-color-alt1: var(--color-sf-close-icon-color);
+  --color-sf-msg-info-close-icon-color-alt2: #212529;
+  --color-sf-badge-light-bg-color: #faf9fa;
+  --color-sf-badge-light-border-color: #faf9fa;
+  --color-sf-badge-light-text-color: #000;
+  --color-sf-badge-dark-bg-color: #212529;
+  --color-sf-badge-dark-border-color: #212529;
+  --color-sf-badge-dark-text-color: #fff;
+  --color-sf-tab-border: #e9ecef;
+  --color-sf-stepper: #fff;
+  --color-sf-shadow-color: #000;
+  --color-sf-shadow-color1: #fff;
+}
+
+:root,
+.e-dark-mode {
+  --e-font-name: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
+  --e-serif-font-name: "Helvetica Neue";
+  --e-mono-font-name: "Helvetica Neue Mono";
+  --e-radius: 1rem;
+  --e-border: 1rem;
+  --e-font-sans: sans-serif;
+  --e-font-serif: serif;
+  --e-font-mono: monospace;
+}
+
+:root,
+.e-dark-mode {
+  --e-font-family: var(--e-font-name), var(--e-font-sans);
+}
+
+.e-dark-mode {
+  --color-sf-content-bg-color: #212529;
+  --color-sf-content-bg-color-alt1: #2b3035;
+  --color-sf-content-bg-color-alt2: #343a40;
+  --color-sf-content-bg-color-alt3: #495057;
+  --color-sf-content-bg-color-alt4: #1a1d20;
+  --color-sf-content-bg-color-alt5: #adb5bd;
+  --color-sf-content-bg-color-hover: #2b3035;
+  --color-sf-content-bg-color-pressed: var(--color-sf-content-bg-color-alt2);
+  --color-sf-content-bg-color-focus: var(--color-sf-content-bg-color-hover);
+  --color-sf-content-bg-color-selected: #0d6efd;
+  --color-sf-content-bg-color-dragged: #343a40;
+  --color-sf-content-bg-color-disabled: var(--color-sf-content-bg-color-alt2);
+  --color-sf-flyout-bg-color: #212529;
+  --color-sf-flyout-bg-color-hover: #2b3035;
+  --color-sf-flyout-bg-color-pressed: #0d6efd;
+  --color-sf-flyout-bg-color-focus: #2b3035;
+  --color-sf-overlay-bg-color: rgba(0, 0, 0, .4);
+  --color-sf-table-bg-color-hover: rgba(255, 255, 255, .07);
+  --color-sf-table-bg-color-pressed: var(--color-sf-content-bg-color-alt3);
+  --color-sf-table-bg-color-selected: rgba(255, 255, 255, .1);
+  --color-sf-content-text-color: #dee2e6;
+  --color-sf-content-text-color-alt1: rgba(222, 226, 230, .75);
+  --color-sf-content-text-color-alt2: rgba(222, 226, 230, .5);
+  --color-sf-content-text-color-alt3: rgba(222, 226, 230, .25);
+  --color-sf-content-text-color-hover: #fff;
+  --color-sf-content-text-color-pressed: var(--color-sf-content-text-color);
+  --color-sf-content-text-color-focus: #fff;
+  --color-sf-content-text-color-selected: var(--color-sf-primary-text-color);
+  --color-sf-content-text-color-dragged: #fff;
+  --color-sf-content-text-color-disabled: rgba(222, 226, 230, .75);
+  --color-sf-placeholder-text-color: #6c757d;
+  --color-sf-flyout-text-color: var(--color-sf-content-text-color);
+  --color-sf-flyout-text-color-hover: var(--color-sf-content-text-color);
+  --color-sf-flyout-text-color-pressed: var(--color-sf-primary-text-color);
+  --color-sf-flyout-text-color-focus: var(--color-sf-content-text-color);
+  --color-sf-flyout-text-color-disabled: rgba(222, 226, 230, .5);
+  --color-sf-table-text-color-hover: var(--color-sf-content-text-color);
+  --color-sf-table-text-color-pressed: var(--color-sf-content-text-color);
+  --color-sf-table-text-color-selected: var(--color-sf-content-text-color);
+  --color-sf-icon-color: #adb5bd;
+  --color-sf-icon-color-hover: #dee2e6;
+  --color-sf-icon-color-pressed: #f8f9fa;
+  --color-sf-icon-color-disabled: #adb5bd;
+  --color-sf-close-icon-color: rgba(255, 255, 255, .5);
+  --color-sf-close-icon-color-hover: rgba(255, 255, 255, .75);
+  --color-sf-close-icon-color-pressed: rgba(255, 255, 255, 1);
+  --color-sf-close-icon-color-disabled: rgba(255, 255, 255, .25);
+  --color-sf-border-light: #495057;
+  --color-sf-border: #495057;
+  --color-sf-border-dark: #6c757d;
+  --color-sf-border-hover: #495057;
+  --color-sf-border-pressed: #495057;
+  --color-sf-border-focus: #86d7fe;
+  --color-sf-border-selected: #86d7fe;
+  --color-sf-border-dragged: #495057;
+  --color-sf-border-disabled: #495057;
+  --color-sf-border-warning: #ffda6a;
+  --color-sf-border-error: #ea868f;
+  --color-sf-border-success: #75b798;
+  --color-sf-spreadsheet-gridline: #dee2e6;
+  --color-sf-flyout-border: rgba(255, 255, 255, .15);
+  --color-sf-primary: rgba(13, 110, 253, 1);
+  --color-sf-primary-text-color: #fff;
+  --color-sf-primary-light: #86b7fe;
+  --color-sf-primary-lighter: #031633;
+  --color-sf-primary-dark: #073ba6;
+  --color-sf-primary-darker: #6ea8fe;
+  --color-sf-secondary: rgba(108, 117, 125, 1);
+  --color-sf-success: rgba(25, 135, 84, 1);
+  --color-sf-info: rgba(13, 202, 240, 1);
+  --color-sf-warning: rgba(255, 193, 7, 1);
+  --color-sf-danger: rgba(220, 53, 69, 1);
+  --color-sf-success-light: #75b798;
+  --color-sf-info-light: #6edff6;
+  --color-sf-warning-light: #ffda6a;
+  --color-sf-danger-light: #ea868f;
+  --color-sf-success-dark: #75b798;
+  --color-sf-info-dark: #6edff6;
+  --color-sf-warning-dark: #ffda6a;
+  --color-sf-danger-dark: #ea868f;
+  --color-sf-success-light-alt: #051b11;
+  --color-sf-info-light-alt: #032830;
+  --color-sf-warning-light-alt: #332701;
+  --color-sf-danger-light-alt: #2c0b0e;
+  --color-sf-primary-shadow: 13, 110, 253;
+  --color-sf-secondary-shadow: 108, 117, 125;
+  --color-sf-success-shadow: 25, 135, 84;
+  --color-sf-info-shadow: 13, 202, 240;
+  --color-sf-warning-shadow: 255, 193, 7;
+  --color-sf-danger-shadow: 220, 53, 69;
+  --color-sf-black: 0, 0, 0;
+  --color-sf-white: 255, 255, 255;
+  --color-sf-primary-bg-color: var(--color-sf-primary);
+  --color-sf-primary-border-color: var(--color-sf-primary);
+  --color-sf-primary-text: var(--color-sf-primary-text-color);
+  --color-sf-primary-bg-color-hover: #0b5ed7;
+  --color-sf-primary-border-color-hover: #0a58ca;
+  --color-sf-primary-text-hover: var(--color-sf-primary-text-color);
+  --color-sf-primary-bg-color-pressed: #0a58ca;
+  --color-sf-primary-border-color-pressed: #0a58ca;
+  --color-sf-primary-text-pressed: var(--color-sf-primary-text-color);
+  --color-sf-primary-bg-color-focus: var(--color-sf-primary-bg-color-hover);
+  --color-sf-primary-border-color-focus: var(--color-sf-primary-border-color-hover);
+  --color-sf-primary-text-focus: var(--color-sf-primary-text-hover);
+  --color-sf-primary-bg-color-disabled: rgba(13, 110, 253, .65);
+  --color-sf-primary-border-color-disabled: var(--color-sf-primary-bg-color-disabled);
+  --color-sf-primary-text-disabled: rgba(255, 255, 255, .65);
+  --color-sf-secondary-bg-color: var(--color-sf-secondary);
+  --color-sf-secondary-border-color: var(--color-sf-secondary-bg-color);
+  --color-sf-secondary-text-color: #fff;
+  --color-sf-secondary-bg-color-hover: #5c636a;
+  --color-sf-secondary-border-color-hover: #565e64;
+  --color-sf-secondary-text-color-hover: var(--color-sf-secondary-text-color);
+  --color-sf-secondary-bg-color-pressed: #565e64;
+  --color-sf-secondary-border-color-pressed: #51585e;
+  --color-sf-secondary-text-color-pressed: var(--color-sf-secondary-text-color);
+  --color-sf-secondary-bg-color-focus: var(--color-sf-secondary-bg-color-hover);
+  --color-sf-secondary-border-color-focus: var(--color-sf-secondary-border-color-hover);
+  --color-sf-secondary-text-color-focus: var(--color-sf-secondary-text-color-hover);
+  --color-sf-secondary-bg-color-disabled: rgba(108, 117, 125, .65);
+  --color-sf-secondary-border-color-disabled: var(--color-sf-secondary-bg-color-disabled);
+  --color-sf-secondary-text-color-disabled: rgba(255, 255, 255, .65);
+  --color-sf-success-bg-color: var(--color-sf-success);
+  --color-sf-success-border-color: var(--color-sf-success-bg-color);
+  --color-sf-success-text: #fff;
+  --color-sf-success-bg-color-hover: #157347;
+  --color-sf-success-border-color-hover: #146c43;
+  --color-sf-success-text-hover: var(--color-sf-success-text);
+  --color-sf-success-bg-color-pressed: #146c43;
+  --color-sf-success-border-color-pressed: #15803d;
+  --color-sf-success-text-pressed: var(--color-sf-success-text);
+  --color-sf-success-bg-color-focus: var(--color-sf-success-bg-color-hover);
+  --color-sf-success-border-color-focus: var(--color-sf-success-bg-color-focus);
+  --color-sf-success-text-focus: var(--color-sf-success-text);
+  --color-sf-success-bg-color-disabled: rgba(25, 135, 84, .65);
+  --color-sf-success-border-color-disabled: var(--color-sf-success-bg-color-disabled);
+  --color-sf-success-text-disabled: rgba(255, 255, 255, .65);
+  --color-sf-warning-bg-color: var(--color-sf-warning);
+  --color-sf-warning-border-color: var(--color-sf-warning-bg-color);
+  --color-sf-warning-text: #000;
+  --color-sf-warning-bg-color-hover: #ffca2c;
+  --color-sf-warning-border-color-hover: #ffc720;
+  --color-sf-warning-text-hover: var(--color-sf-warning-text);
+  --color-sf-warning-bg-color-pressed: #ffcd39;
+  --color-sf-warning-border-color-pressed: #ffc720;
+  --color-sf-warning-text-pressed: var(--color-sf-warning-text);
+  --color-sf-warning-bg-color-focus: var(--color-sf-warning-bg-color-hover);
+  --color-sf-warning-border-color-focus: var(--color-sf-warning-bg-color-focus);
+  --color-sf-warning-text-focus: var(--color-sf-warning-text);
+  --color-sf-warning-bg-color-disabled: rgba(255, 193, 7, .65);
+  --color-sf-warning-border-color-disabled: var(--color-sf-warning-bg-color-disabled);
+  --color-sf-warning-text-disabled: rgba(0, 0, 0, .65);
+  --color-sf-info-bg-color: var(--color-sf-info);
+  --color-sf-info-border-color: var(--color-sf-info-bg-color);
+  --color-sf-info-text: #000;
+  --color-sf-info-bg-color-hover: #31d2f2;
+  --color-sf-info-border-color-hover: #25cff2;
+  --color-sf-info-text-hover: var(--color-sf-info-text);
+  --color-sf-info-bg-color-pressed: #3dd5f3;
+  --color-sf-info-border-color-pressed: #25cff2;
+  --color-sf-info-text-pressed: var(--color-sf-info-text);
+  --color-sf-info-bg-color-focus: var(--color-sf-info-bg-color-hover);
+  --color-sf-info-border-color-focus: var(--color-sf-info-bg-color-focus);
+  --color-sf-info-text-focus: var(--color-sf-info-text-hover);
+  --color-sf-info-bg-color-disabled: rgba(13, 202, 240, .65);
+  --color-sf-info-border-color-disabled: var(--color-sf-info-bg-color-disabled);
+  --color-sf-info-text-disabled: rgba(0, 0, 0, .65);
+  --color-sf-danger-bg-color: var(--color-sf-danger);
+  --color-sf-danger-border-color: var(--color-sf-danger-bg-color);
+  --color-sf-danger-text: #fff;
+  --color-sf-danger-bg-color-hover: #bb2d3b;
+  --color-sf-danger-border-color-hover: #b02a37;
+  --color-sf-danger-text-hover: var(--color-sf-danger-text);
+  --color-sf-danger-bg-color-pressed: #b02a37;
+  --color-sf-danger-border-color-pressed: #a52834;
+  --color-sf-danger-text-pressed: var(--color-sf-danger-text);
+  --color-sf-danger-bg-color-focus: var(--color-sf-danger-bg-color-hover);
+  --color-sf-danger-border-color-focus: var(--color-sf-danger-bg-color-focus);
+  --color-sf-danger-text-focus: var(--color-sf-danger-text-hover);
+  --color-sf-danger-bg-color-disabled: rgba(220, 53, 69, .65);
+  --color-sf-danger-border-color-disabled: var(--color-sf-danger-bg-color-disabled);
+  --color-sf-danger-text-disabled: rgba(255, 255, 255, .65);
+  --color-sf-primary-outline: var(--color-sf-primary-bg-color);
+  --color-sf-secondary-outline: var(--color-sf-secondary-bg-color);
+  --color-sf-warning-outline: var(--color-sf-warning-bg-color);
+  --color-sf-danger-outline: var(--color-sf-danger-bg-color);
+  --color-sf-success-outline: var(--color-sf-success-bg-color);
+  --color-sf-info-outline: var(--color-sf-info-bg-color);
+  --color-sf-tooltip-bg-color: rgba(255, 255, 255, .9);
+  --color-sf-tooltip-border: var(--color-sf-tooltip-bg-color);
+  --color-sf-tooltip-text-color: #212529;
+  --color-sf-appbar-bg-color-alt1: var(--color-sf-content-bg-color-alt1);
+  --color-sf-appbar-color-alt1: var(--color-sf-content-text-color);
+  --color-sf-appbar-border-color-alt1: var(--color-sf-appbar-bg-color-alt1);
+  --color-sf-appbar-hover-bg-color-alt1: transparent;
+  --color-sf-appbar-bg-color-alt2: #dee2e6;
+  --color-sf-appbar-color-alt2: #212529;
+  --color-sf-appbar-border-color-alt2: var(--color-sf-appbar-bg-color-alt2);
+  --color-sf-appbar-hover-bg-color-alt2: transparent;
+  --color-sf-diagram-palette-background: #dee2e6;
+  --color-sf-diagram-palette-hover-background: #ced4da;
+  --color-sf-rating-selected-color: var(--color-sf-primary);
+  --color-sf-rating-unrated-color: #adb5bd;
+  --color-sf-rating-selected-disabled-color: #6c757d;
+  --color-sf-rating-unrated-disabled-color: #495057;
+  --color-sf-rating-selected-hover-color: #adb5bd;
+  --color-sf-rating-unrated-hover-color: var(--color-sf-primary);
+  --color-sf-rating-pressed-color: #599bfe;
+  --color-sf-msg-color: #a7acb1;
+  --color-sf-msg-bg-color: #161719;
+  --color-sf-msg-border-color: #41464b;
+  --color-sf-msg-color-alt1: var(--color-sf-msg-color);
+  --color-sf-msg-bg-color-alt1: transparent;
+  --color-sf-msg-border-color-alt1: var(--color-sf-msg-border-color);
+  --color-sf-msg-color-alt2: #fff;
+  --color-sf-msg-bg-color-alt2: #6c757d;
+  --color-sf-msg-border-color-alt2: var(--color-sf-msg-bg-color-alt2);
+  --color-sf-msg-icon-color: var(--color-sf-msg-color);
+  --color-sf-msg-icon-color-alt1: var(--color-sf-msg-color);
+  --color-sf-msg-icon-color-alt2: #fff;
+  --color-sf-msg-close-icon-color: var(--color-sf-close-icon-color);
+  --color-sf-msg-close-icon-color-alt1: var(--color-sf-close-icon-color);
+  --color-sf-msg-close-icon-color-alt2: #fff;
+  --color-sf-msg-danger-color: #ea868f;
+  --color-sf-msg-danger-bg-color: #2c0b0e;
+  --color-sf-msg-danger-border-color: #842029;
+  --color-sf-msg-danger-color-alt1: var(--color-sf-msg-danger-color);
+  --color-sf-msg-danger-bg-color-alt1: transparent;
+  --color-sf-msg-danger-border-color-alt1: var(--color-sf-msg-danger-border-color);
+  --color-sf-msg-danger-color-alt2: #fff;
+  --color-sf-msg-danger-bg-color-alt2: #dc3545;
+  --color-sf-msg-danger-border-color-alt2: var(--color-sf-msg-danger-bg-color-alt2);
+  --color-sf-msg-danger-icon-color: var(--color-sf-msg-danger-color);
+  --color-sf-msg-danger-icon-color-alt1: var(--color-sf-msg-danger-color);
+  --color-sf-msg-danger-icon-color-alt2: #fff;
+  --color-sf-msg-danger-close-icon-color: var(--color-sf-close-icon-color);
+  --color-sf-msg-danger-close-icon-color-alt1: var(--color-sf-close-icon-color);
+  --color-sf-msg-danger-close-icon-color-alt2: #fff;
+  --color-sf-msg-success-color: #75b798;
+  --color-sf-msg-success-bg-color: #051b11;
+  --color-sf-msg-success-border-color: #0f5132;
+  --color-sf-msg-success-color-alt1: var(--color-sf-msg-success-color);
+  --color-sf-msg-success-bg-color-alt1: transparent;
+  --color-sf-msg-success-border-color-alt1: var(--color-sf-msg-success-border-color);
+  --color-sf-msg-success-color-alt2: #fff;
+  --color-sf-msg-success-bg-color-alt2: #198754;
+  --color-sf-msg-success-border-color-alt2: var(--color-sf-msg-success-bg-color-alt2);
+  --color-sf-msg-success-icon-color: var(--color-sf-msg-success-color);
+  --color-sf-msg-success-icon-color-alt1: var(--color-sf-msg-success-color);
+  --color-sf-msg-success-icon-color-alt2: #fff;
+  --color-sf-msg-success-close-icon-color: var(--color-sf-close-icon-color);
+  --color-sf-msg-success-close-icon-color-alt1: var(--color-sf-close-icon-color);
+  --color-sf-msg-success-close-icon-color-alt2: #fff;
+  --color-sf-msg-warning-color: #ffda6a;
+  --color-sf-msg-warning-bg-color: #332701;
+  --color-sf-msg-warning-border-color: #997404;
+  --color-sf-msg-warning-color-alt1: var(--color-sf-msg-warning-color);
+  --color-sf-msg-warning-bg-color-alt1: transparent;
+  --color-sf-msg-warning-border-color-alt1: var(--color-sf-msg-warning-border-color);
+  --color-sf-msg-warning-color-alt2: #212529;
+  --color-sf-msg-warning-bg-color-alt2: #ffc107;
+  --color-sf-msg-warning-border-color-alt2: var(--color-sf-msg-warning-bg-color-alt2);
+  --color-sf-msg-warning-icon-color: var(--color-sf-msg-warning-color);
+  --color-sf-msg-warning-icon-color-alt1: var(--color-sf-msg-warning-color);
+  --color-sf-msg-warning-icon-color-alt2: #212529;
+  --color-sf-msg-warning-close-icon-color: var(--color-sf-close-icon-color);
+  --color-sf-msg-warning-close-icon-color-alt1: var(--color-sf-close-icon-color);
+  --color-sf-msg-warning-close-icon-color-alt2: #212529;
+  --color-sf-msg-info-color: #6edff6;
+  --color-sf-msg-info-bg-color: #032830;
+  --color-sf-msg-info-border-color: #087990;
+  --color-sf-msg-info-color-alt1: var(--color-sf-msg-info-color);
+  --color-sf-msg-info-bg-color-alt1: transparent;
+  --color-sf-msg-info-border-color-alt1: var(--color-sf-msg-info-border-color);
+  --color-sf-msg-info-color-alt2: #212529;
+  --color-sf-msg-info-bg-color-alt2: #0dcaf0;
+  --color-sf-msg-info-border-color-alt2: var(--color-sf-msg-info-bg-color-alt2);
+  --color-sf-msg-info-icon-color: var(--color-sf-msg-info-color);
+  --color-sf-msg-info-icon-color-alt1: var(--color-sf-msg-info-color);
+  --color-sf-msg-info-icon-color-alt2: #212529;
+  --color-sf-msg-info-close-icon-color: var(--color-sf-close-icon-color);
+  --color-sf-msg-info-close-icon-color-alt1: var(--color-sf-close-icon-color);
+  --color-sf-msg-info-close-icon-color-alt2: #212529;
+  --color-sf-badge-light-bg-color: #faf9fa;
+  --color-sf-badge-light-border-color: #faf9fa;
+  --color-sf-badge-light-text-color: #000;
+  --color-sf-badge-dark-bg-color: #212529;
+  --color-sf-badge-dark-border-color: #212529;
+  --color-sf-badge-dark-text-color: #fff;
+  --color-sf-tab-border: #343a40;
+  --color-sf-stepper: #212529;
+  --color-sf-shadow-color: #fff;
+  --color-sf-shadow-color1: #000;
+}
+
 /* Font Family */
 /* Font Sizes */
 /* Radius */
@@ -2597,23 +3281,707 @@
   color: #0dcaf0;
 }
 
-.e-block-touch {
-  -ms-touch-action: pinch-zoom;
-      touch-action: pinch-zoom;
+.e-block-touch {
+  -ms-touch-action: pinch-zoom;
+      touch-action: pinch-zoom;
+}
+
+.e-license {
+  color: #ff0;
+  text-decoration: none;
+}
+
+.e-license-banner {
+  position: absolute;
+  right: 10px;
+  top: 27%;
+  cursor: pointer;
+}
+
+:root {
+  --color-sf-black: 0, 0, 0;
+  --color-sf-white: 255, 255, 255;
+  --color-sf-content-bg-color: #fff;
+  --color-sf-content-bg-color-alt1: #f8f9fa;
+  --color-sf-content-bg-color-alt2: #e9ecef;
+  --color-sf-content-bg-color-alt3: #dee2e6;
+  --color-sf-content-bg-color-alt4: #ced4da;
+  --color-sf-content-bg-color-alt5: #adb5bd;
+  --color-sf-content-bg-color-hover: #f8f9fa;
+  --color-sf-content-bg-color-pressed: #e9ecef;
+  --color-sf-content-bg-color-focus: #e9ecef;
+  --color-sf-content-bg-color-selected: #0d6efd;
+  --color-sf-content-bg-color-dragged: #ced4da;
+  --color-sf-content-bg-color-disabled: #e9ecef;
+  --color-sf-flyout-bg-color: #fff;
+  --color-sf-flyout-bg-color-hover: #f8f9fa;
+  --color-sf-flyout-bg-color-pressed: #0d6efd;
+  --color-sf-flyout-bg-color-focus: #f8f9fa;
+  --color-sf-overlay-bg-color: 0, 0, 0;
+  --color-sf-table-bg-color-hover: rgba(0, 0, 0, .07);
+  --color-sf-table-bg-color-pressed: #dee2e6;
+  --color-sf-table-bg-color-selected: rgba(0, 0, 0, .1);
+  --color-sf-content-text-color: #212529;
+  --color-sf-content-text-color-alt1: rgba(33, 37, 41, .75);
+  --color-sf-content-text-color-alt2: rgba(33, 37, 41, .5);
+  --color-sf-content-text-color-alt3: rgba(33, 37, 41, .25);
+  --color-sf-content-text-color-hover: #000;
+  --color-sf-content-text-color-pressed: var(--color-sf-content-text-color);
+  --color-sf-content-text-color-focus: #000;
+  --color-sf-content-text-color-selected: #fff;
+  --color-sf-content-text-color-dragged: var(--color-sf-content-text-color);
+  --color-sf-content-text-color-disabled: rgba(33, 37, 41, .75);
+  --color-sf-placeholder-text-color: #6c757d;
+  --color-sf-flyout-text-color: var(--color-sf-content-text-color);
+  --color-sf-flyout-text-color-hover: var(--color-sf-content-text-color);
+  --color-sf-flyout-text-color-pressed: #fff;
+  --color-sf-flyout-text-color-focus: var(--color-sf-content-text-color);
+  --color-sf-flyout-text-color-disabled: rgba(33, 37, 41, .5);
+  --color-sf-table-text-color-hover: var(--color-sf-content-text-color);
+  --color-sf-table-text-color-pressed: var(--color-sf-content-text-color);
+  --color-sf-table-text-color-selected: var(--color-sf-content-text-color);
+  --color-sf-icon-color: #6c757d;
+  --color-sf-icon-color-hover: #343a40;
+  --color-sf-icon-color-pressed: #212529;
+  --color-sf-icon-color-disabled: #adb5bd;
+  --color-sf-close-icon-color: rgba(0, 0, 0, .5);
+  --color-sf-close-icon-color-hover: rgba(0, 0, 0, .75);
+  --color-sf-close-icon-color-pressed: rgba(0, 0, 0, 1);
+  --color-sf-close-icon-color-disabled: rgba(0, 0, 0, .25);
+  --color-sf-border-light: #dee2e6;
+  --color-sf-border: #dee2e6;
+  --color-sf-border-dark: #adb5bd;
+  --color-sf-border-hover: #dee2e6;
+  --color-sf-border-pressed: #dee2e6;
+  --color-sf-border-focus: #86b7fe;
+  --color-sf-border-selected: #86b7fe;
+  --color-sf-border-dragged: #dee2e6;
+  --color-sf-border-disabled: #dee2e6;
+  --color-sf-border-warning: #ffc107;
+  --color-sf-border-error: #dc3545;
+  --color-sf-border-success: #198754;
+  --color-sf-spreadsheet-gridline: #dee2e6;
+  --color-sf-flyout-border: rgba(0, 0, 0, .175);
+  --color-sf-primary: rgba(13, 110, 253, 1);
+  --color-sf-primary-text-color: #fff;
+  --color-sf-primary-light: #86b7fe;
+  --color-sf-primary-lighter: #cfe2ff;
+  --color-sf-primary-dark: #3367d1;
+  --color-sf-primary-darker: #052c65;
+  --color-sf-secondary: rgba(108, 117, 125, 1);
+  --color-sf-success: rgba(25, 135, 84, 1);
+  --color-sf-info: rgba(13, 202, 240, 1);
+  --color-sf-warning: rgba(255, 193, 7, 1);
+  --color-sf-danger: rgba(220, 53, 69, 1);
+  --color-sf-success-light: #d1e7dd;
+  --color-sf-info-light: #cff4fc;
+  --color-sf-warning-light: #fff3cd;
+  --color-sf-danger-light: #f8d7da;
+  --color-sf-success-dark: #0a3622;
+  --color-sf-info-dark: #055160;
+  --color-sf-warning-dark: #664d03;
+  --color-sf-danger-dark: #58151c;
+  --color-sf-success-light-alt: #d1e7dd;
+  --color-sf-info-light-alt: #cff4fc;
+  --color-sf-warning-light-alt: #fff3cd;
+  --color-sf-danger-light-alt: #f8d7da;
+  --color-sf-primary-shadow: 13, 110, 253;
+  --color-sf-secondary-shadow: 108, 117, 125;
+  --color-sf-success-shadow: 25, 135, 84;
+  --color-sf-info-shadow: 13, 202, 240;
+  --color-sf-warning-shadow: 255, 193, 7;
+  --color-sf-danger-shadow: 220, 53, 69;
+  --color-sf-primary-bg-color: var(--color-sf-primary);
+  --color-sf-primary-border-color: var(--color-sf-primary);
+  --color-sf-primary-text: var(--color-sf-primary-text-color);
+  --color-sf-primary-bg-color-hover: #0b5ed7;
+  --color-sf-primary-border-color-hover: #0a58ca;
+  --color-sf-primary-text-hover: var(--color-sf-primary-text-color);
+  --color-sf-primary-bg-color-pressed: #0a58ca;
+  --color-sf-primary-border-color-pressed: #0a58ca;
+  --color-sf-primary-text-pressed: var(--color-sf-primary-text-color);
+  --color-sf-primary-bg-color-focus: var(--color-sf-primary-bg-color-hover);
+  --color-sf-primary-border-color-focus: var(--color-sf-primary-border-color-hover);
+  --color-sf-primary-text-focus: var(--color-sf-primary-text-hover);
+  --color-sf-primary-bg-color-disabled: rgba(13, 110, 253, .65);
+  --color-sf-primary-border-color-disabled: var(--color-sf-primary-bg-color-disabled);
+  --color-sf-primary-text-disabled: rgba(255, 255, 255, .65);
+  --color-sf-secondary-bg-color: var(--color-sf-secondary);
+  --color-sf-secondary-border-color: var(--color-sf-secondary-bg-color);
+  --color-sf-secondary-text-color: #fff;
+  --color-sf-secondary-bg-color-hover: #5c636a;
+  --color-sf-secondary-border-color-hover: #565e64;
+  --color-sf-secondary-text-color-hover: var(--color-sf-secondary-text-color);
+  --color-sf-secondary-bg-color-pressed: #565e64;
+  --color-sf-secondary-border-color-pressed: #51585e;
+  --color-sf-secondary-text-color-pressed: var(--color-sf-secondary-text-color);
+  --color-sf-secondary-bg-color-focus: var(--color-sf-secondary-bg-color-hover);
+  --color-sf-secondary-border-color-focus: var(--color-sf-secondary-border-color-hover);
+  --color-sf-secondary-text-color-focus: var(--color-sf-secondary-text-color-hover);
+  --color-sf-secondary-bg-color-disabled: rgba(108, 117, 125, .65);
+  --color-sf-secondary-border-color-disabled: var(--color-sf-secondary-bg-color-disabled);
+  --color-sf-secondary-text-color-disabled: rgba(255, 255, 255, .65);
+  --color-sf-success-bg-color: var(--color-sf-success);
+  --color-sf-success-border-color: var(--color-sf-success-bg-color);
+  --color-sf-success-text: #fff;
+  --color-sf-success-bg-color-hover: #157347;
+  --color-sf-success-border-color-hover: #146c43;
+  --color-sf-success-text-hover: var(--color-sf-success-text);
+  --color-sf-success-bg-color-pressed: #146c43;
+  --color-sf-success-border-color-pressed: #13653f;
+  --color-sf-success-text-pressed: var(--color-sf-success-text);
+  --color-sf-success-bg-color-focus: var(--color-sf-success-bg-color-hover);
+  --color-sf-success-border-color-focus: var(--color-sf-success-bg-color-focus);
+  --color-sf-success-text-focus: var(--color-sf-success-text);
+  --color-sf-success-bg-color-disabled: rgba(25, 135, 84, .65);
+  --color-sf-success-border-color-disabled: var(--color-sf-success-bg-color-disabled);
+  --color-sf-success-text-disabled: rgba(255, 255, 255, .65);
+  --color-sf-warning-bg-color: var(--color-sf-warning);
+  --color-sf-warning-border-color: var(--color-sf-warning-bg-color);
+  --color-sf-warning-text: #000;
+  --color-sf-warning-bg-color-hover: #ffca2c;
+  --color-sf-warning-border-color-hover: #ffc720;
+  --color-sf-warning-text-hover: var(--color-sf-warning-text);
+  --color-sf-warning-bg-color-pressed: #ffcd39;
+  --color-sf-warning-border-color-pressed: #ffc720;
+  --color-sf-warning-text-pressed: var(--color-sf-warning-text);
+  --color-sf-warning-bg-color-focus: var(--color-sf-warning-bg-color-hover);
+  --color-sf-warning-border-color-focus: var(--color-sf-warning-bg-color-focus);
+  --color-sf-warning-text-focus: var(--color-sf-warning-text);
+  --color-sf-warning-bg-color-disabled: rgba(255, 193, 7, .65);
+  --color-sf-warning-border-color-disabled: var(--color-sf-warning-bg-color-disabled);
+  --color-sf-warning-text-disabled: rgba(0, 0, 0, .65);
+  --color-sf-info-bg-color: var(--color-sf-info);
+  --color-sf-info-border-color: var(--color-sf-info-bg-color);
+  --color-sf-info-text: #000;
+  --color-sf-info-bg-color-hover: #31d2f2;
+  --color-sf-info-border-color-hover: #25cff2;
+  --color-sf-info-text-hover: var(--color-sf-info-text);
+  --color-sf-info-bg-color-pressed: #3dd5f3;
+  --color-sf-info-border-color-pressed: #25cff2;
+  --color-sf-info-text-pressed: var(--color-sf-info-text);
+  --color-sf-info-bg-color-focus: var(--color-sf-info-bg-color-hover);
+  --color-sf-info-border-color-focus: var(--color-sf-info-bg-color-focus);
+  --color-sf-info-text-focus: var(--color-sf-info-text-hover);
+  --color-sf-info-bg-color-disabled: rgba(13, 202, 240, .65);
+  --color-sf-info-border-color-disabled: var(--color-sf-info-bg-color-disabled);
+  --color-sf-info-text-disabled: rgba(0, 0, 0, .65);
+  --color-sf-danger-bg-color: var(--color-sf-danger);
+  --color-sf-danger-border-color: var(--color-sf-danger-bg-color);
+  --color-sf-danger-text: #fff;
+  --color-sf-danger-bg-color-hover: #bb2d3b;
+  --color-sf-danger-border-color-hover: #b02a37;
+  --color-sf-danger-text-hover: var(--color-sf-danger-text);
+  --color-sf-danger-bg-color-pressed: #b02a37;
+  --color-sf-danger-border-color-pressed: #a52834;
+  --color-sf-danger-text-pressed: var(--color-sf-danger-text);
+  --color-sf-danger-bg-color-focus: var(--color-sf-danger-bg-color-hover);
+  --color-sf-danger-border-color-focus: var(--color-sf-danger-bg-color-focus);
+  --color-sf-danger-text-focus: var(--color-sf-danger-text-hover);
+  --color-sf-danger-bg-color-disabled: rgba(220, 53, 69, .65);
+  --color-sf-danger-border-color-disabled: var(--color-sf-danger-bg-color-disabled);
+  --color-sf-danger-text-disabled: rgba(255, 255, 255, .65);
+  --color-sf-primary-outline: var(--color-sf-primary-bg-color);
+  --color-sf-secondary-outline: var(--color-sf-secondary-bg-color);
+  --color-sf-warning-outline: var(--color-sf-warning-bg-color);
+  --color-sf-danger-outline: var(--color-sf-danger-bg-color);
+  --color-sf-success-outline: var(--color-sf-success-bg-color);
+  --color-sf-info-outline: var(--color-sf-info-bg-color);
+  --color-sf-tooltip-bg-color: rgba(0, 0, 0, .9);
+  --color-sf-tooltip-border: var(--color-sf-tooltip-bg-color);
+  --color-sf-tooltip-text-color: #fff;
+  --color-sf-appbar-bg-color-alt1: var(--color-sf-content-bg-color-alt1);
+  --color-sf-appbar-color-alt1: var(--color-sf-content-text-color);
+  --color-sf-appbar-border-color-alt1: var(--color-sf-appbar-bg-color-alt1);
+  --color-sf-appbar-hover-bg-color-alt1: transparent;
+  --color-sf-appbar-bg-color-alt2: #212529;
+  --color-sf-appbar-color-alt2: #fff;
+  --color-sf-appbar-border-color-alt2: var(--color-sf-appbar-bg-color-alt2);
+  --color-sf-appbar-hover-bg-color-alt2: transparent;
+  --color-sf-diagram-palette-background: #fff;
+  --color-sf-diagram-palette-hover-background: var(--color-sf-content-bg-color-hover);
+  --color-sf-diagram-palette-selected-color: #e9ecef;
+  --color-sf-rating-selected-color: var(--color-sf-primary);
+  --color-sf-rating-unrated-color: #6c757d;
+  --color-sf-rating-selected-disabled-color: #adb5bd;
+  --color-sf-rating-unrated-disabled-color: #ced4da;
+  --color-sf-rating-selected-hover-color: #63757d;
+  --color-sf-rating-unrated-hover-color: var(--color-sf-primary);
+  --color-sf-rating-pressed-color: #599bfe;
+  --color-sf-msg-color: #2b2f32;
+  --color-sf-msg-bg-color: #e2e3e5;
+  --color-sf-msg-border-color: #c4c8cb;
+  --color-sf-msg-color-alt1: var(--color-sf-msg-color);
+  --color-sf-msg-bg-color-alt1: transparent;
+  --color-sf-msg-border-color-alt1: var(--color-sf-msg-border-color);
+  --color-sf-msg-color-alt2: #fff;
+  --color-sf-msg-bg-color-alt2: #6c757d;
+  --color-sf-msg-border-color-alt2: var(--color-sf-msg-bg-color-alt2);
+  --color-sf-msg-icon-color: var(--color-sf-msg-color);
+  --color-sf-msg-icon-color-alt1: var(--color-sf-msg-color);
+  --color-sf-msg-icon-color-alt2: #fff;
+  --color-sf-msg-close-icon-color: var(--color-sf-close-icon-color);
+  --color-sf-msg-close-icon-color-alt1: var(--color-sf-close-icon-color);
+  --color-sf-msg-close-icon-color-alt2: #fff;
+  --color-sf-msg-danger-color: #58151c;
+  --color-sf-msg-danger-bg-color: #f8d7da;
+  --color-sf-msg-danger-border-color: #f1aeb5;
+  --color-sf-msg-danger-color-alt1: var(--color-sf-msg-danger-color);
+  --color-sf-msg-danger-bg-color-alt1: transparent;
+  --color-sf-msg-danger-border-color-alt1: var(--color-sf-msg-danger-border-color);
+  --color-sf-msg-danger-color-alt2: #fff;
+  --color-sf-msg-danger-bg-color-alt2: #dc3545;
+  --color-sf-msg-danger-border-color-alt2: var(--color-sf-msg-danger-bg-color-alt2);
+  --color-sf-msg-danger-icon-color: var(--color-sf-msg-danger-color);
+  --color-sf-msg-danger-icon-color-alt1: var(--color-sf-msg-danger-color);
+  --color-sf-msg-danger-icon-color-alt2: #fff;
+  --color-sf-msg-danger-close-icon-color: var(--color-sf-close-icon-color);
+  --color-sf-msg-danger-close-icon-color-alt1: var(--color-sf-close-icon-color);
+  --color-sf-msg-danger-close-icon-color-alt2: #fff;
+  --color-sf-msg-success-color: #0a3622;
+  --color-sf-msg-success-bg-color: #d1e7dd;
+  --color-sf-msg-success-border-color: #a3cfbb;
+  --color-sf-msg-success-color-alt1: var(--color-sf-msg-success-color);
+  --color-sf-msg-success-bg-color-alt1: transparent;
+  --color-sf-msg-success-border-color-alt1: var(--color-sf-msg-success-border-color);
+  --color-sf-msg-success-color-alt2: #fff;
+  --color-sf-msg-success-bg-color-alt2: #198754;
+  --color-sf-msg-success-border-color-alt2: var(--color-sf-msg-success-bg-color-alt2);
+  --color-sf-msg-success-icon-color: var(--color-sf-msg-success-color);
+  --color-sf-msg-success-icon-color-alt1: var(--color-sf-msg-success-color);
+  --color-sf-msg-success-icon-color-alt2: #fff;
+  --color-sf-msg-success-close-icon-color: var(--color-sf-close-icon-color);
+  --color-sf-msg-success-close-icon-color-alt1: var(--color-sf-close-icon-color);
+  --color-sf-msg-success-close-icon-color-alt2: #fff;
+  --color-sf-msg-warning-color: #664d03;
+  --color-sf-msg-warning-bg-color: #fff3cd;
+  --color-sf-msg-warning-border-color: #ffe69c;
+  --color-sf-msg-warning-color-alt1: var(--color-sf-msg-warning-color);
+  --color-sf-msg-warning-bg-color-alt1: transparent;
+  --color-sf-msg-warning-border-color-alt1: var(--color-sf-msg-warning-border-color);
+  --color-sf-msg-warning-color-alt2: #212529;
+  --color-sf-msg-warning-bg-color-alt2: #ffc107;
+  --color-sf-msg-warning-border-color-alt2: var(--color-sf-msg-warning-bg-color-alt2);
+  --color-sf-msg-warning-icon-color: var(--color-sf-msg-warning-color);
+  --color-sf-msg-warning-icon-color-alt1: var(--color-sf-msg-warning-color);
+  --color-sf-msg-warning-icon-color-alt2: #212529;
+  --color-sf-msg-warning-close-icon-color: var(--color-sf-close-icon-color);
+  --color-sf-msg-warning-close-icon-color-alt1: var(--color-sf-close-icon-color);
+  --color-sf-msg-warning-close-icon-color-alt2: #212529;
+  --color-sf-msg-info-color: #055160;
+  --color-sf-msg-info-bg-color: #cff4fc;
+  --color-sf-msg-info-border-color: #9eeaf9;
+  --color-sf-msg-info-color-alt1: var(--color-sf-msg-info-color);
+  --color-sf-msg-info-bg-color-alt1: transparent;
+  --color-sf-msg-info-border-color-alt1: var(--color-sf-msg-info-border-color);
+  --color-sf-msg-info-color-alt2: #212529;
+  --color-sf-msg-info-bg-color-alt2: #0dcaf0;
+  --color-sf-msg-info-border-color-alt2: var(--color-sf-msg-info-bg-color-alt2);
+  --color-sf-msg-info-icon-color: var(--color-sf-msg-info-color);
+  --color-sf-msg-info-icon-color-alt1: var(--color-sf-msg-info-color);
+  --color-sf-msg-info-icon-color-alt2: #212529;
+  --color-sf-msg-info-close-icon-color: var(--color-sf-close-icon-color);
+  --color-sf-msg-info-close-icon-color-alt1: var(--color-sf-close-icon-color);
+  --color-sf-msg-info-close-icon-color-alt2: #212529;
+  --color-sf-badge-light-bg-color: #faf9fa;
+  --color-sf-badge-light-border-color: #faf9fa;
+  --color-sf-badge-light-text-color: #000;
+  --color-sf-badge-dark-bg-color: #212529;
+  --color-sf-badge-dark-border-color: #212529;
+  --color-sf-badge-dark-text-color: #fff;
+  --color-sf-tab-border: #e9ecef;
+  --color-sf-stepper: #fff;
+  --color-sf-shadow-color: #000;
+  --color-sf-shadow-color1: #fff;
+}
+
+:root,
+.e-dark-mode {
+  --e-font-name: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", arial, "Noto Sans", "Liberation Sans", sans-serif, "apple color emoji", "Segoe UI emoji", "Segoe UI Symbol", "Noto color emoji";
+  --e-serif-font-name: "Helvetica Neue";
+  --e-mono-font-name: "Helvetica Neue Mono";
+  --e-radius: 1rem;
+  --e-border: 1rem;
+  --e-font-sans: sans-serif;
+  --e-font-serif: serif;
+  --e-font-mono: monospace;
 }
 
-.e-license {
-  color: #ff0;
-  text-decoration: none;
+:root,
+.e-dark-mode {
+  --e-font-family: var(--e-font-name), var(--e-font-sans);
 }
 
-.e-license-banner {
-  position: absolute;
-  right: 10px;
-  top: 27%;
-  cursor: pointer;
+.e-dark-mode {
+  --color-sf-content-bg-color: #212529;
+  --color-sf-content-bg-color-alt1: #2b3035;
+  --color-sf-content-bg-color-alt2: #343a40;
+  --color-sf-content-bg-color-alt3: #495057;
+  --color-sf-content-bg-color-alt4: #1a1d20;
+  --color-sf-content-bg-color-alt5: #adb5bd;
+  --color-sf-content-bg-color-hover: #2b3035;
+  --color-sf-content-bg-color-pressed: var(--color-sf-content-bg-color-alt2);
+  --color-sf-content-bg-color-focus: var(--color-sf-content-bg-color-hover);
+  --color-sf-content-bg-color-selected: #0d6efd;
+  --color-sf-content-bg-color-dragged: #343a40;
+  --color-sf-content-bg-color-disabled: var(--color-sf-content-bg-color-alt2);
+  --color-sf-flyout-bg-color: #212529;
+  --color-sf-flyout-bg-color-hover: #2b3035;
+  --color-sf-flyout-bg-color-pressed: #0d6efd;
+  --color-sf-flyout-bg-color-focus: #2b3035;
+  --color-sf-overlay-bg-color: rgba(0, 0, 0, .4);
+  --color-sf-table-bg-color-hover: rgba(255, 255, 255, .07);
+  --color-sf-table-bg-color-pressed: var(--color-sf-content-bg-color-alt3);
+  --color-sf-table-bg-color-selected: rgba(255, 255, 255, .1);
+  --color-sf-content-text-color: #dee2e6;
+  --color-sf-content-text-color-alt1: rgba(222, 226, 230, .75);
+  --color-sf-content-text-color-alt2: rgba(222, 226, 230, .5);
+  --color-sf-content-text-color-alt3: rgba(222, 226, 230, .25);
+  --color-sf-content-text-color-hover: #fff;
+  --color-sf-content-text-color-pressed: var(--color-sf-content-text-color);
+  --color-sf-content-text-color-focus: #fff;
+  --color-sf-content-text-color-selected: var(--color-sf-primary-text-color);
+  --color-sf-content-text-color-dragged: #fff;
+  --color-sf-content-text-color-disabled: rgba(222, 226, 230, .75);
+  --color-sf-placeholder-text-color: #6c757d;
+  --color-sf-flyout-text-color: var(--color-sf-content-text-color);
+  --color-sf-flyout-text-color-hover: var(--color-sf-content-text-color);
+  --color-sf-flyout-text-color-pressed: var(--color-sf-primary-text-color);
+  --color-sf-flyout-text-color-focus: var(--color-sf-content-text-color);
+  --color-sf-flyout-text-color-disabled: rgba(222, 226, 230, .5);
+  --color-sf-table-text-color-hover: var(--color-sf-content-text-color);
+  --color-sf-table-text-color-pressed: var(--color-sf-content-text-color);
+  --color-sf-table-text-color-selected: var(--color-sf-content-text-color);
+  --color-sf-icon-color: #adb5bd;
+  --color-sf-icon-color-hover: #dee2e6;
+  --color-sf-icon-color-pressed: #f8f9fa;
+  --color-sf-icon-color-disabled: #adb5bd;
+  --color-sf-close-icon-color: rgba(255, 255, 255, .5);
+  --color-sf-close-icon-color-hover: rgba(255, 255, 255, .75);
+  --color-sf-close-icon-color-pressed: rgba(255, 255, 255, 1);
+  --color-sf-close-icon-color-disabled: rgba(255, 255, 255, .25);
+  --color-sf-border-light: #495057;
+  --color-sf-border: #495057;
+  --color-sf-border-dark: #6c757d;
+  --color-sf-border-hover: #495057;
+  --color-sf-border-pressed: #495057;
+  --color-sf-border-focus: #86d7fe;
+  --color-sf-border-selected: #86d7fe;
+  --color-sf-border-dragged: #495057;
+  --color-sf-border-disabled: #495057;
+  --color-sf-border-warning: #ffda6a;
+  --color-sf-border-error: #ea868f;
+  --color-sf-border-success: #75b798;
+  --color-sf-spreadsheet-gridline: #dee2e6;
+  --color-sf-flyout-border: rgba(255, 255, 255, .15);
+  --color-sf-primary: rgba(13, 110, 253, 1);
+  --color-sf-primary-text-color: #fff;
+  --color-sf-primary-light: #86b7fe;
+  --color-sf-primary-lighter: #031633;
+  --color-sf-primary-dark: #073ba6;
+  --color-sf-primary-darker: #6ea8fe;
+  --color-sf-secondary: rgba(108, 117, 125, 1);
+  --color-sf-success: rgba(25, 135, 84, 1);
+  --color-sf-info: rgba(13, 202, 240, 1);
+  --color-sf-warning: rgba(255, 193, 7, 1);
+  --color-sf-danger: rgba(220, 53, 69, 1);
+  --color-sf-success-light: #75b798;
+  --color-sf-info-light: #6edff6;
+  --color-sf-warning-light: #ffda6a;
+  --color-sf-danger-light: #ea868f;
+  --color-sf-success-dark: #75b798;
+  --color-sf-info-dark: #6edff6;
+  --color-sf-warning-dark: #ffda6a;
+  --color-sf-danger-dark: #ea868f;
+  --color-sf-success-light-alt: #051b11;
+  --color-sf-info-light-alt: #032830;
+  --color-sf-warning-light-alt: #332701;
+  --color-sf-danger-light-alt: #2c0b0e;
+  --color-sf-primary-shadow: 13, 110, 253;
+  --color-sf-secondary-shadow: 108, 117, 125;
+  --color-sf-success-shadow: 25, 135, 84;
+  --color-sf-info-shadow: 13, 202, 240;
+  --color-sf-warning-shadow: 255, 193, 7;
+  --color-sf-danger-shadow: 220, 53, 69;
+  --color-sf-black: 0, 0, 0;
+  --color-sf-white: 255, 255, 255;
+  --color-sf-primary-bg-color: var(--color-sf-primary);
+  --color-sf-primary-border-color: var(--color-sf-primary);
+  --color-sf-primary-text: var(--color-sf-primary-text-color);
+  --color-sf-primary-bg-color-hover: #0b5ed7;
+  --color-sf-primary-border-color-hover: #0a58ca;
+  --color-sf-primary-text-hover: var(--color-sf-primary-text-color);
+  --color-sf-primary-bg-color-pressed: #0a58ca;
+  --color-sf-primary-border-color-pressed: #0a58ca;
+  --color-sf-primary-text-pressed: var(--color-sf-primary-text-color);
+  --color-sf-primary-bg-color-focus: var(--color-sf-primary-bg-color-hover);
+  --color-sf-primary-border-color-focus: var(--color-sf-primary-border-color-hover);
+  --color-sf-primary-text-focus: var(--color-sf-primary-text-hover);
+  --color-sf-primary-bg-color-disabled: rgba(13, 110, 253, .65);
+  --color-sf-primary-border-color-disabled: var(--color-sf-primary-bg-color-disabled);
+  --color-sf-primary-text-disabled: rgba(255, 255, 255, .65);
+  --color-sf-secondary-bg-color: var(--color-sf-secondary);
+  --color-sf-secondary-border-color: var(--color-sf-secondary-bg-color);
+  --color-sf-secondary-text-color: #fff;
+  --color-sf-secondary-bg-color-hover: #5c636a;
+  --color-sf-secondary-border-color-hover: #565e64;
+  --color-sf-secondary-text-color-hover: var(--color-sf-secondary-text-color);
+  --color-sf-secondary-bg-color-pressed: #565e64;
+  --color-sf-secondary-border-color-pressed: #51585e;
+  --color-sf-secondary-text-color-pressed: var(--color-sf-secondary-text-color);
+  --color-sf-secondary-bg-color-focus: var(--color-sf-secondary-bg-color-hover);
+  --color-sf-secondary-border-color-focus: var(--color-sf-secondary-border-color-hover);
+  --color-sf-secondary-text-color-focus: var(--color-sf-secondary-text-color-hover);
+  --color-sf-secondary-bg-color-disabled: rgba(108, 117, 125, .65);
+  --color-sf-secondary-border-color-disabled: var(--color-sf-secondary-bg-color-disabled);
+  --color-sf-secondary-text-color-disabled: rgba(255, 255, 255, .65);
+  --color-sf-success-bg-color: var(--color-sf-success);
+  --color-sf-success-border-color: var(--color-sf-success-bg-color);
+  --color-sf-success-text: #fff;
+  --color-sf-success-bg-color-hover: #157347;
+  --color-sf-success-border-color-hover: #146c43;
+  --color-sf-success-text-hover: var(--color-sf-success-text);
+  --color-sf-success-bg-color-pressed: #146c43;
+  --color-sf-success-border-color-pressed: #15803d;
+  --color-sf-success-text-pressed: var(--color-sf-success-text);
+  --color-sf-success-bg-color-focus: var(--color-sf-success-bg-color-hover);
+  --color-sf-success-border-color-focus: var(--color-sf-success-bg-color-focus);
+  --color-sf-success-text-focus: var(--color-sf-success-text);
+  --color-sf-success-bg-color-disabled: rgba(25, 135, 84, .65);
+  --color-sf-success-border-color-disabled: var(--color-sf-success-bg-color-disabled);
+  --color-sf-success-text-disabled: rgba(255, 255, 255, .65);
+  --color-sf-warning-bg-color: var(--color-sf-warning);
+  --color-sf-warning-border-color: var(--color-sf-warning-bg-color);
+  --color-sf-warning-text: #000;
+  --color-sf-warning-bg-color-hover: #ffca2c;
+  --color-sf-warning-border-color-hover: #ffc720;
+  --color-sf-warning-text-hover: var(--color-sf-warning-text);
+  --color-sf-warning-bg-color-pressed: #ffcd39;
+  --color-sf-warning-border-color-pressed: #ffc720;
+  --color-sf-warning-text-pressed: var(--color-sf-warning-text);
+  --color-sf-warning-bg-color-focus: var(--color-sf-warning-bg-color-hover);
+  --color-sf-warning-border-color-focus: var(--color-sf-warning-bg-color-focus);
+  --color-sf-warning-text-focus: var(--color-sf-warning-text);
+  --color-sf-warning-bg-color-disabled: rgba(255, 193, 7, .65);
+  --color-sf-warning-border-color-disabled: var(--color-sf-warning-bg-color-disabled);
+  --color-sf-warning-text-disabled: rgba(0, 0, 0, .65);
+  --color-sf-info-bg-color: var(--color-sf-info);
+  --color-sf-info-border-color: var(--color-sf-info-bg-color);
+  --color-sf-info-text: #000;
+  --color-sf-info-bg-color-hover: #31d2f2;
+  --color-sf-info-border-color-hover: #25cff2;
+  --color-sf-info-text-hover: var(--color-sf-info-text);
+  --color-sf-info-bg-color-pressed: #3dd5f3;
+  --color-sf-info-border-color-pressed: #25cff2;
+  --color-sf-info-text-pressed: var(--color-sf-info-text);
+  --color-sf-info-bg-color-focus: var(--color-sf-info-bg-color-hover);
+  --color-sf-info-border-color-focus: var(--color-sf-info-bg-color-focus);
+  --color-sf-info-text-focus: var(--color-sf-info-text-hover);
+  --color-sf-info-bg-color-disabled: rgba(13, 202, 240, .65);
+  --color-sf-info-border-color-disabled: var(--color-sf-info-bg-color-disabled);
+  --color-sf-info-text-disabled: rgba(0, 0, 0, .65);
+  --color-sf-danger-bg-color: var(--color-sf-danger);
+  --color-sf-danger-border-color: var(--color-sf-danger-bg-color);
+  --color-sf-danger-text: #fff;
+  --color-sf-danger-bg-color-hover: #bb2d3b;
+  --color-sf-danger-border-color-hover: #b02a37;
+  --color-sf-danger-text-hover: var(--color-sf-danger-text);
+  --color-sf-danger-bg-color-pressed: #b02a37;
+  --color-sf-danger-border-color-pressed: #a52834;
+  --color-sf-danger-text-pressed: var(--color-sf-danger-text);
+  --color-sf-danger-bg-color-focus: var(--color-sf-danger-bg-color-hover);
+  --color-sf-danger-border-color-focus: var(--color-sf-danger-bg-color-focus);
+  --color-sf-danger-text-focus: var(--color-sf-danger-text-hover);
+  --color-sf-danger-bg-color-disabled: rgba(220, 53, 69, .65);
+  --color-sf-danger-border-color-disabled: var(--color-sf-danger-bg-color-disabled);
+  --color-sf-danger-text-disabled: rgba(255, 255, 255, .65);
+  --color-sf-primary-outline: var(--color-sf-primary-bg-color);
+  --color-sf-secondary-outline: var(--color-sf-secondary-bg-color);
+  --color-sf-warning-outline: var(--color-sf-warning-bg-color);
+  --color-sf-danger-outline: var(--color-sf-danger-bg-color);
+  --color-sf-success-outline: var(--color-sf-success-bg-color);
+  --color-sf-info-outline: var(--color-sf-info-bg-color);
+  --color-sf-tooltip-bg-color: rgba(255, 255, 255, .9);
+  --color-sf-tooltip-border: var(--color-sf-tooltip-bg-color);
+  --color-sf-tooltip-text-color: #212529;
+  --color-sf-appbar-bg-color-alt1: var(--color-sf-content-bg-color-alt1);
+  --color-sf-appbar-color-alt1: var(--color-sf-content-text-color);
+  --color-sf-appbar-border-color-alt1: var(--color-sf-appbar-bg-color-alt1);
+  --color-sf-appbar-hover-bg-color-alt1: transparent;
+  --color-sf-appbar-bg-color-alt2: #dee2e6;
+  --color-sf-appbar-color-alt2: #212529;
+  --color-sf-appbar-border-color-alt2: var(--color-sf-appbar-bg-color-alt2);
+  --color-sf-appbar-hover-bg-color-alt2: transparent;
+  --color-sf-diagram-palette-background: #dee2e6;
+  --color-sf-diagram-palette-hover-background: #ced4da;
+  --color-sf-rating-selected-color: var(--color-sf-primary);
+  --color-sf-rating-unrated-color: #adb5bd;
+  --color-sf-rating-selected-disabled-color: #6c757d;
+  --color-sf-rating-unrated-disabled-color: #495057;
+  --color-sf-rating-selected-hover-color: #adb5bd;
+  --color-sf-rating-unrated-hover-color: var(--color-sf-primary);
+  --color-sf-rating-pressed-color: #599bfe;
+  --color-sf-msg-color: #a7acb1;
+  --color-sf-msg-bg-color: #161719;
+  --color-sf-msg-border-color: #41464b;
+  --color-sf-msg-color-alt1: var(--color-sf-msg-color);
+  --color-sf-msg-bg-color-alt1: transparent;
+  --color-sf-msg-border-color-alt1: var(--color-sf-msg-border-color);
+  --color-sf-msg-color-alt2: #fff;
+  --color-sf-msg-bg-color-alt2: #6c757d;
+  --color-sf-msg-border-color-alt2: var(--color-sf-msg-bg-color-alt2);
+  --color-sf-msg-icon-color: var(--color-sf-msg-color);
+  --color-sf-msg-icon-color-alt1: var(--color-sf-msg-color);
+  --color-sf-msg-icon-color-alt2: #fff;
+  --color-sf-msg-close-icon-color: var(--color-sf-close-icon-color);
+  --color-sf-msg-close-icon-color-alt1: var(--color-sf-close-icon-color);
+  --color-sf-msg-close-icon-color-alt2: #fff;
+  --color-sf-msg-danger-color: #ea868f;
+  --color-sf-msg-danger-bg-color: #2c0b0e;
+  --color-sf-msg-danger-border-color: #842029;
+  --color-sf-msg-danger-color-alt1: var(--color-sf-msg-danger-color);
+  --color-sf-msg-danger-bg-color-alt1: transparent;
+  --color-sf-msg-danger-border-color-alt1: var(--color-sf-msg-danger-border-color);
+  --color-sf-msg-danger-color-alt2: #fff;
+  --color-sf-msg-danger-bg-color-alt2: #dc3545;
+  --color-sf-msg-danger-border-color-alt2: var(--color-sf-msg-danger-bg-color-alt2);
+  --color-sf-msg-danger-icon-color: var(--color-sf-msg-danger-color);
+  --color-sf-msg-danger-icon-color-alt1: var(--color-sf-msg-danger-color);
+  --color-sf-msg-danger-icon-color-alt2: #fff;
+  --color-sf-msg-danger-close-icon-color: var(--color-sf-close-icon-color);
+  --color-sf-msg-danger-close-icon-color-alt1: var(--color-sf-close-icon-color);
+  --color-sf-msg-danger-close-icon-color-alt2: #fff;
+  --color-sf-msg-success-color: #75b798;
+  --color-sf-msg-success-bg-color: #051b11;
+  --color-sf-msg-success-border-color: #0f5132;
+  --color-sf-msg-success-color-alt1: var(--color-sf-msg-success-color);
+  --color-sf-msg-success-bg-color-alt1: transparent;
+  --color-sf-msg-success-border-color-alt1: var(--color-sf-msg-success-border-color);
+  --color-sf-msg-success-color-alt2: #fff;
+  --color-sf-msg-success-bg-color-alt2: #198754;
+  --color-sf-msg-success-border-color-alt2: var(--color-sf-msg-success-bg-color-alt2);
+  --color-sf-msg-success-icon-color: var(--color-sf-msg-success-color);
+  --color-sf-msg-success-icon-color-alt1: var(--color-sf-msg-success-color);
+  --color-sf-msg-success-icon-color-alt2: #fff;
+  --color-sf-msg-success-close-icon-color: var(--color-sf-close-icon-color);
+  --color-sf-msg-success-close-icon-color-alt1: var(--color-sf-close-icon-color);
+  --color-sf-msg-success-close-icon-color-alt2: #fff;
+  --color-sf-msg-warning-color: #ffda6a;
+  --color-sf-msg-warning-bg-color: #332701;
+  --color-sf-msg-warning-border-color: #997404;
+  --color-sf-msg-warning-color-alt1: var(--color-sf-msg-warning-color);
+  --color-sf-msg-warning-bg-color-alt1: transparent;
+  --color-sf-msg-warning-border-color-alt1: var(--color-sf-msg-warning-border-color);
+  --color-sf-msg-warning-color-alt2: #212529;
+  --color-sf-msg-warning-bg-color-alt2: #ffc107;
+  --color-sf-msg-warning-border-color-alt2: var(--color-sf-msg-warning-bg-color-alt2);
+  --color-sf-msg-warning-icon-color: var(--color-sf-msg-warning-color);
+  --color-sf-msg-warning-icon-color-alt1: var(--color-sf-msg-warning-color);
+  --color-sf-msg-warning-icon-color-alt2: #212529;
+  --color-sf-msg-warning-close-icon-color: var(--color-sf-close-icon-color);
+  --color-sf-msg-warning-close-icon-color-alt1: var(--color-sf-close-icon-color);
+  --color-sf-msg-warning-close-icon-color-alt2: #212529;
+  --color-sf-msg-info-color: #6edff6;
+  --color-sf-msg-info-bg-color: #032830;
+  --color-sf-msg-info-border-color: #087990;
+  --color-sf-msg-info-color-alt1: var(--color-sf-msg-info-color);
+  --color-sf-msg-info-bg-color-alt1: transparent;
+  --color-sf-msg-info-border-color-alt1: var(--color-sf-msg-info-border-color);
+  --color-sf-msg-info-color-alt2: #212529;
+  --color-sf-msg-info-bg-color-alt2: #0dcaf0;
+  --color-sf-msg-info-border-color-alt2: var(--color-sf-msg-info-bg-color-alt2);
+  --color-sf-msg-info-icon-color: var(--color-sf-msg-info-color);
+  --color-sf-msg-info-icon-color-alt1: var(--color-sf-msg-info-color);
+  --color-sf-msg-info-icon-color-alt2: #212529;
+  --color-sf-msg-info-close-icon-color: var(--color-sf-close-icon-color);
+  --color-sf-msg-info-close-icon-color-alt1: var(--color-sf-close-icon-color);
+  --color-sf-msg-info-close-icon-color-alt2: #212529;
+  --color-sf-badge-light-bg-color: #faf9fa;
+  --color-sf-badge-light-border-color: #faf9fa;
+  --color-sf-badge-light-text-color: #000;
+  --color-sf-badge-dark-bg-color: #212529;
+  --color-sf-badge-dark-border-color: #212529;
+  --color-sf-badge-dark-text-color: #fff;
+  --color-sf-tab-border: #343a40;
+  --color-sf-stepper: #212529;
+  --color-sf-shadow-color: #fff;
+  --color-sf-shadow-color1: #000;
 }
 
+/* Font Family */
+/* Font Sizes */
+/* Radius */
+/* 1px */
+/* 2px */
+/* 3px */
+/* 4px */
+/* 5px */
+/* 6px */
+/* 7px */
+/* 8px */
+/* 9px */
+/* 10px */
+/* 11px */
+/* 12px */
+/* 13px */
+/* 14px */
+/* 15px */
+/* 16px */
+/* 17px */
+/* 18px */
+/* 19px */
+/* 20px */
+/* 21px */
+/* 22px */
+/* 23px */
+/* 24px */
+/* 25px */
+/* 26px */
+/* 27px */
+/* 28px */
+/* 29px */
+/* 30px */
+/* 31px */
+/* 32px */
+/* 33px */
+/* 34px */
+/* 35px */
+/* 36px */
+/* 37px */
+/* 38px */
+/* 39px */
+/* 40px */
+/* 41px */
+/* 42px */
+/* 43px */
+/* 44px */
+/* 45px */
+/* 46px */
+/* 47px */
+/* 48px */
+/* 49px */
+/* 50px */
+/* 5em */
+/* 65% */
+/* border */
+/* 0px */
+/* 1px */
+/* 1.5px */
+/* 2px */
+/* 3px */
+/* 4px */
+/* 5px */
+/* 6px */
+/* 7px */
+/* 8px */
+/* 9px */
+/* 10px */
+/* 11px */
+/* 12px */
+/* 13px */
+/* 14px */
+/* 15px */
+/* 16px */
 @-webkit-keyframes SlideLeftOut {
   from {
     -webkit-transform: translate(0, 0);
@@ -2624,7 +3992,6 @@
             transform: translate(-100%, 0);
   }
 }
-
 @keyframes SlideLeftOut {
   from {
     -webkit-transform: translate(0, 0);