@wavemaker/app-runtime-wm-build 12.0.0-next.45030 → 12.0.0-next.45032

app-runtime-wm-build/wmapp/styles/foundation/foundation.css

@@ -437,65 +437,28 @@ ex: color-mix(in srgb, color1 50%, color2 30%)
 =========*/
 :root {
   /*--shadows(elevations)--*/
-  --wm-elevation-shadow-1: 0px 1px 2px 0px rgba(0, 0, 0, 0.3), 0px 1px 3px 1px rgba(0, 0, 0, 0.15);
-  --wm-elevation-shadow-2: 0px 1px 2px 0px rgba(0, 0, 0, 0.3), 0px 2px 6px 2px rgba(0, 0, 0, 0.15);
-  --wm-elevation-shadow-3: 0px 4px 8px 3px rgba(0, 0, 0, 0.15), 0px 1px 3px 0px rgba(0, 0, 0, 0.30);
-  --wm-elevation-shadow-4: 0px 6px 10px 4px rgba(0, 0, 0, 0.15), 0px 2px 3px 0px rgba(0, 0, 0, 0.30);
-  --wm-elevation-shadow-5: 0px 8px 12px 6px rgba(0, 0, 0, 0.15), 0px 4px 4px 0px rgba(0, 0, 0, 0.30);
-  /*headings*/
-  --wm-headings-color: var(--wm-color-on-surface);
-  /*page content*/
-  --wm-page-content-padding: 0;
-  --wm-page-content-background: var(--wm-color-surface-container-lowest);
+  --wm-elevation-shadow-1: 0px 1px 2px 0px color-mix(in srgb, var(--wm-color-shadow), transparent calc(100% - 30%)), 0px 1px 3px 1px ~"color-mix(in srgb, var(--wm-color-shadow), transparent calc(100% - 15%))";
+  --wm-elevation-shadow-2: 0px 1px 2px 0px color-mix(in srgb, var(--wm-color-shadow), transparent calc(100% - 30%)), 0px 2px 6px 2px ~"color-mix(in srgb, var(--wm-color-shadow), transparent calc(100% - 15%))";
+  --wm-elevation-shadow-3: 0px 4px 8px 3px color-mix(in srgb, var(--wm-color-shadow), transparent calc(100% - 15%)), 0px 1px 3px 0px ~"color-mix(in srgb, var(--wm-color-shadow), transparent calc(100% - 30%))";
+  --wm-elevation-shadow-4: 0px 6px 10px 4px color-mix(in srgb, var(--wm-color-shadow), transparent calc(100% - 15%)), 0px 2px 3px 0px ~"color-mix(in srgb, var(--wm-color-shadow), transparent calc(100% - 30%))";
+  --wm-elevation-shadow-5: 0px 8px 12px 6px color-mix(in srgb, var(--wm-color-shadow), transparent calc(100% - 15%)), 0px 4px 4px 0px ~"color-mix(in srgb, var(--wm-color-shadow), transparent calc(100% - 30%))";
   /**--Components--**/
-  /*--form field--*/
-  --wm-caption-font-size: var(--wm-body-large-font-size);
-  --wm-caption-font-weight: var(--wm-body-large-font-weight);
-  --wm-caption-line-height: var(--wm-body-large-line-height);
-  --wm-caption-letter-spacing: var(--wm-body-large-letter-spacing);
-  --wm-caption-color: var(--wm-color-on-surface-variant);
-  --wm-caption-margin: 0;
-  --wm-caption-padding: 0;
-  --wm-form-control-color: var(--wm-color-on-surface);
-  --wm-form-control-background: transparent;
-  --wm-form-control-border-width: var(--wm-border-width);
-  --wm-form-control-border-color: var(--wm-color-outline);
-  --wm-form-control-border-color-hover: var(--wm-color-on-surface);
-  --wm-form-control-border-color-focus: var(--wm-color-primary);
-  --wm-form-control-border-color-error: var(--wm-color-error);
-  --wm-form-control-radius: var(--wm-radius-xs);
-  --wm-form-control-height: 56px;
-  --wm-form-control-padding: 16px;
-  --wm-form-control-font-size: var(--wm-body-large-font-size);
-  --wm-form-control-font-weight: var(--wm-body-large-font-weight);
-  --wm-form-control-line-height: var(--wm-body-large-line-height);
-  --wm-form-control-color-place-holder: var(--wm-color-on-surface-variant);
-  --wm-help-block-color: var(--wm-color-on-surface);
-  --wm-help-block-font-size: var(--wm-body-small-font-size);
-  --wm-help-block-font-weight: var(--wm-body-small-font-weight);
-  --wm-help-block-line-height: var(--wm-body-small-line-height);
-  --wm-checkbox-background: transparent;
-  --wm-checkbox-border-width: 2px;
-  --wm-checkbox-border-color: var(--wm-color-on-surface-variant);
-  --wm-checkbox-border-radius: var(--wm-radius-xxs);
-  --wm-checkbox-background-selected: var(--wm-color-primary);
-  --wm-checkbox-icon-color-selected: var(--wm-color-on-primary);
-  --wm-checkbox-border-color-selected: var(--wm-color-primary);
-  --wm-checkbox-state-hover: var(--wm-color-on-surface-hover);
-  --wm-checkbox-state-focus: var(--wm-color-on-surface-focus);
-  --wm-checkbox-selected-state-hover: var(--wm-color-primary-hover);
-  --wm-checkbox-selected-state-focus: var(--wm-color-primary-focus);
-  --wm-radiobutton-background: transparent;
-  --wm-radiobutton-border-width: 2px;
-  --wm-radiobutton-border-color: var(--wm-color-on-surface-variant);
-  --wm-radiobutton-border-radius: var(--wm-radius-circle);
-  --wm-radiobutton-background-selected: var(--wm-color-primary);
-  --wm-radiobutton-icon-color-selected: var(--wm-color-on-primary);
-  --wm-radiobutton-border-color-selected: var(--wm-color-primary);
-  --wm-radiobutton-state-hover: var(--wm-color-on-surface-hover);
-  --wm-radiobutton-state-focus: var(--wm-color-on-surface-focus);
-  --wm-radiobutton-selected-state-hover: var(--wm-color-primary-hover);
-  --wm-radiobutton-selected-state-focus: var(--wm-color-primary-focus);
+  /*--Anchor--*/
+  --wm-anchor-font-size: var(--wm-body-medium-font-size);
+  --wm-anchor-font-family: var(--wm-body-medium-font-family);
+  --wm-anchor-font-weight: var(--wm-body-medium-font-weight);
+  --wm-anchor-line-height: var(--wm-body-medium-line-height);
+  --wm-anchor-letter-spacing: var(--wm-body-medium-letter-spacing);
+  --wm-anchor-text-transform: none;
+  --wm-anchor-text-decoration: none;
+  --wm-anchor-color: var(--wm-color-primary);
+  --wm-anchor-color-hover: color-mix(in srgb, var(--wm-color-primary), var(--wm-color-black) var(--wm-opacity-hover));
+  --wm-anchor-color-focus: color-mix(in srgb, var(--wm-color-primary), var(--wm-color-black) var(--wm-opacity-focus));
+  --wm-anchor-color-active: color-mix(in srgb, var(--wm-color-primary), var(--wm-color-black) var(--wm-opacity-active));
+  --wm-anchor-gap: var(--wm-space-2);
+  /*--Button Group--*/
+  --wm-button-group-horizontal-radius: var(--wm-radius-pill);
+  --wm-button-group-vertical-radius: var(--wm-radius-xs);
   /*--button--*/
   --wm-btn-font-size: var(--wm-label-large-font-size);
   --wm-btn-font-family: var(--wm-label-large-font-family);
@@ -607,63 +570,86 @@ ex: color-mix(in srgb, color1 50%, color2 30%)
   --wm-btn-lg-min-width: auto;
   --wm-btn-lg-height: 44px;
   --wm-btn-lg-gap: var(--wm-space-2);
-  /*--Anchor--*/
-  --wm-anchor-font-size: var(--wm-body-medium-font-size);
-  --wm-anchor-font-family: var(--wm-body-medium-font-family);
-  --wm-anchor-font-weight: var(--wm-body-medium-font-weight);
-  --wm-anchor-line-height: var(--wm-body-medium-line-height);
-  --wm-anchor-letter-spacing: var(--wm-body-medium-letter-spacing);
-  --wm-anchor-text-transform: none;
-  --wm-anchor-text-decoration: none;
-  --wm-anchor-color: var(--wm-color-primary);
-  --wm-anchor-color-hover: color-mix(in srgb, var(--wm-color-primary), var(--wm-color-black) var(--wm-opacity-hover));
-  --wm-anchor-color-focus: color-mix(in srgb, var(--wm-color-primary), var(--wm-color-black) var(--wm-opacity-focus));
-  --wm-anchor-color-active: color-mix(in srgb, var(--wm-color-primary), var(--wm-color-black) var(--wm-opacity-active));
-  --wm-anchor-gap: var(--wm-space-2);
-  /*--Icon--*/
-  --wm-icon-gap: var(--wm-space-1);
-  /*--Grid Layout--*/
-  --wm-grid-layout-column-padding: var(--wm-space-2);
-  /*--Picture--*/
-  --wm-picture-radius-rounded: var(--wm-radius-xs);
-  --wm-picture-radius-circle: var(--wm-radius-circle);
-  --wm-picture-radius-thumbnail: var(--wm-radius-xs);
-  --wm-picture-thumbnail-padding: var(--wm-space-1);
-  --wm-picture-thumbnail-border-color: var(--wm-border-color);
-  --wm-picture-thumbnail-border-style: var(--wm-border-style);
-  --wm-picture-thumbnail-border-width: var(--wm-border-width);
-  --wm-picture-thumbnail-background: var(--wm-color-surface-container-low);
-  /*--Progress Bar--*/
-  --wm-progress-bar-background-inactive: var(--wm-color-surface-bright);
-  --wm-progress-bar-background-active: var(--wm-color-surface-tint);
-  --wm-progress-bar-radius: var(--wm-radius-lg);
-  --wm-progress-bar-height: var(--wm-space-2);
-  --wm-progress-bar-width: var(--wm-space-2);
-  --wm-progress-bar-striped: linear-gradient(45deg, var(--wm-color-white-active) 25%, transparent 25%, transparent 50%, var(--wm-color-white-active) 50%, var(--wm-color-white-active) 75%, transparent 75%, transparent);
-  --wm-progress-bar-striped-size: var(--wm-space-10) var(--wm-space-10);
-  --wm-progress-bar-margin: var(--wm-space-2) var(--wm-space-0);
-  --wm-progress-bar-stop-indicator-radius: var(--wm-radius-circle);
-  --wm-progress-bar-stop-indicator-height: var(--wm-space-2);
-  --wm-progress-bar-stop-indicator-width: var(--wm-space-2);
-  --wm-progress-bar-stop-indicator-background: var(--wm-color-surface-tint);
-  --wm-progress-bar-success-background-active: var(--wm-color-success);
-  --wm-progress-bar-success-stop-indicator-background: var(--wm-color-success);
-  --wm-progress-bar-success-background-inactive: var(--wm-color-success-hover);
-  --wm-progress-bar-info-background-active: var(--wm-color-info);
-  --wm-progress-bar-info-stop-indicator-background: var(--wm-color-info);
-  --wm-progress-bar-info-background-inactive: var(--wm-color-info-hover);
-  --wm-progress-bar-warning-background-active: var(--wm-color-warning);
-  --wm-progress-bar-warning-stop-indicator-background: var(--wm-color-warning);
-  --wm-progress-bar-warning-background-inactive: var(--wm-color-warning-hover);
-  --wm-progress-bar-danger-background-active: var(--wm-color-error);
-  --wm-progress-bar-danger-stop-indicator-background: var(--wm-color-error);
-  --wm-progress-bar-danger-background-inactive: var(--wm-color-error-hover);
+  /*--checkbox--*/
+  --wm-checkbox-background: transparent;
+  --wm-checkbox-border-width: 2px;
+  --wm-checkbox-border-color: var(--wm-color-on-surface-variant);
+  --wm-checkbox-border-radius: var(--wm-radius-xxs);
+  --wm-checkbox-background-selected: var(--wm-color-primary);
+  --wm-checkbox-icon-color-selected: var(--wm-color-on-primary);
+  --wm-checkbox-border-color-selected: var(--wm-color-primary);
+  --wm-checkbox-state-hover: var(--wm-color-on-surface-hover);
+  --wm-checkbox-state-focus: var(--wm-color-on-surface-focus);
+  --wm-checkbox-selected-state-hover: var(--wm-color-primary-hover);
+  --wm-checkbox-selected-state-focus: var(--wm-color-primary-focus);
+  /*--form field/composite--*/
+  --wm-caption-font-size: var(--wm-body-large-font-size);
+  --wm-caption-font-weight: var(--wm-body-large-font-weight);
+  --wm-caption-line-height: var(--wm-body-large-line-height);
+  --wm-caption-letter-spacing: var(--wm-body-large-letter-spacing);
+  --wm-caption-color: var(--wm-color-on-surface-variant);
+  --wm-caption-margin: 0;
+  --wm-caption-padding: 0;
+  --wm-form-control-color: var(--wm-color-on-surface);
+  --wm-form-control-background: transparent;
+  --wm-form-control-border-width: var(--wm-border-width);
+  --wm-form-control-border-color: var(--wm-color-outline);
+  --wm-form-control-border-color-hover: var(--wm-color-on-surface);
+  --wm-form-control-border-color-focus: var(--wm-color-primary);
+  --wm-form-control-border-color-error: var(--wm-color-error);
+  --wm-form-control-radius: var(--wm-radius-xs);
+  --wm-form-control-height: 56px;
+  --wm-form-control-padding: 16px;
+  --wm-form-control-font-size: var(--wm-body-large-font-size);
+  --wm-form-control-font-weight: var(--wm-body-large-font-weight);
+  --wm-form-control-line-height: var(--wm-body-large-line-height);
+  --wm-form-control-color-place-holder: var(--wm-color-on-surface-variant);
+  --wm-help-block-color: var(--wm-color-on-surface);
+  --wm-help-block-font-size: var(--wm-body-small-font-size);
+  --wm-help-block-font-weight: var(--wm-body-small-font-weight);
+  --wm-help-block-line-height: var(--wm-body-small-line-height);
   /*--Container--*/
   --wm-container-outlined-border-color: var(--wm-color-outline-variant);
   --wm-container-outlined-border-width: var(--wm-border-width);
   --wm-container-outlined-border-style: var(--wm-border-style);
   --wm-container-elevation-border-radius: var(--wm-radius-sm);
   --wm-container-elevation-shadow: var(--wm-elevation-shadow-1);
+  /*--file upload--*/
+  --wm-file-upload-status-padding: var(--wm-space-2);
+  --wm-file-upload-status-border-color: var(--wm-border-color);
+  --wm-file-upload-status-border-width: var(--wm-border-width);
+  --wm-file-upload-status-border-style: var(--wm-border-style);
+  --wm-file-upload-status-background: var(--wm-color-surface-container-low);
+  --wm-file-upload-status-radius: var(--wm-radius-xs);
+  --wm-file-upload-status-bottom-space: var(--wm-space-1);
+  --wm-file-upload-bottom-space: var(--wm-space-1);
+  --wm-file-upload-title-color: var(--wm-color-black);
+  --wm-file-upload-title-font-size: var(--wm-body-medium-font-size);
+  --wm-file-upload-title-font-family: var(--wm-font-family-brand);
+  --wm-file-upload-title-font-weight: var(--wm-font-weight-regular);
+  --wm-file-upload-title-line-height: var(--wm-body-medium-line-height);
+  --wm-file-upload-size-color: var(--wm-color-black);
+  --wm-file-upload-size-font-size: var(--wm-body-small-font-size);
+  --wm-file-upload-size-font-family: var(--wm-font-family-brand);
+  --wm-file-upload-size-font-weight: var(--wm-font-weight-regular);
+  --wm-file-upload-size-line-height: var(--wm-body-small-line-height);
+  --wm-file-upload-gap: var(--wm-space-3);
+  --wm-file-upload-drop-box-gap: var(--wm-space-3);
+  --wm-file-upload-drop-box-bottom-space: var(--wm-space-2);
+  --wm-file-upload-multi-file-radius: var(--wm-radius-sm);
+  --wm-file-upload-drop-box-background: var(--wm-btn-background);
+  --wm-file-upload-message-caption-color: var(--wm-color-black);
+  --wm-file-upload-message-caption-font-size: var(--wm-body-large-font-size);
+  --wm-file-upload-message-caption-font-family: var(--wm-font-family-brand);
+  --wm-file-upload-message-caption-font-weight: var(--wm-font-weight-regular);
+  --wm-file-upload-message-caption-line-height: var(--wm-body-large-line-height);
+  --wm-file-upload-message-anchor-color: var(--wm-color-black);
+  --wm-file-upload-message-anchor-font-size: var(--wm-body-medium-font-size);
+  --wm-file-upload-message-anchor-font-family: var(--wm-font-family-brand);
+  --wm-file-upload-message-anchor-font-weight: var(--wm-font-weight-regular);
+  --wm-file-upload-message-anchor-line-height: var(--wm-body-medium-line-height);
+  --wm-file-upload-media-icon-size: var(--wm-icon-size);
+  --wm-file-upload-media-icon-padding: var(--wm-space-1);
   /*--Message--*/
   --wm-message-container-shadow: var(--wm-elevation-shadow-3);
   --wm-message-container-border-radius: var(--wm-radius-xs);
@@ -699,6 +685,122 @@ ex: color-mix(in srgb, color1 50%, color2 30%)
   --wm-message-container-loading-background: var(--wm-color-primary);
   --wm-message-container-loading-color: var(--wm-color-on-primary);
   --wm-message-container-loading-border-color: var(--wm-color-primary);
+  /*--Picture--*/
+  --wm-picture-radius-rounded: var(--wm-radius-xs);
+  --wm-picture-radius-circle: var(--wm-radius-circle);
+  --wm-picture-radius-thumbnail: var(--wm-radius-xs);
+  --wm-picture-thumbnail-padding: var(--wm-space-1);
+  --wm-picture-thumbnail-border-color: var(--wm-border-color);
+  --wm-picture-thumbnail-border-style: var(--wm-border-style);
+  --wm-picture-thumbnail-border-width: var(--wm-border-width);
+  --wm-picture-thumbnail-background: var(--wm-color-surface-container-low);
+  /*--Progress Bar--*/
+  --wm-progress-bar-background-inactive: var(--wm-color-surface-bright);
+  --wm-progress-bar-background-active: var(--wm-color-surface-tint);
+  --wm-progress-bar-radius: var(--wm-radius-lg);
+  --wm-progress-bar-height: var(--wm-space-2);
+  --wm-progress-bar-width: var(--wm-space-2);
+  --wm-progress-bar-striped: linear-gradient(45deg, var(--wm-color-white-active) 25%, transparent 25%, transparent 50%, var(--wm-color-white-active) 50%, var(--wm-color-white-active) 75%, transparent 75%, transparent);
+  --wm-progress-bar-striped-size: var(--wm-space-10) var(--wm-space-10);
+  --wm-progress-bar-margin: var(--wm-space-2) var(--wm-space-0);
+  --wm-progress-bar-stop-indicator-radius: var(--wm-radius-circle);
+  --wm-progress-bar-stop-indicator-height: var(--wm-space-2);
+  --wm-progress-bar-stop-indicator-width: var(--wm-space-2);
+  --wm-progress-bar-stop-indicator-background: var(--wm-color-surface-tint);
+  --wm-progress-bar-success-background-active: var(--wm-color-success);
+  --wm-progress-bar-success-stop-indicator-background: var(--wm-color-success);
+  --wm-progress-bar-success-background-inactive: var(--wm-color-success-hover);
+  --wm-progress-bar-info-background-active: var(--wm-color-info);
+  --wm-progress-bar-info-stop-indicator-background: var(--wm-color-info);
+  --wm-progress-bar-info-background-inactive: var(--wm-color-info-hover);
+  --wm-progress-bar-warning-background-active: var(--wm-color-warning);
+  --wm-progress-bar-warning-stop-indicator-background: var(--wm-color-warning);
+  --wm-progress-bar-warning-background-inactive: var(--wm-color-warning-hover);
+  --wm-progress-bar-danger-background-active: var(--wm-color-error);
+  --wm-progress-bar-danger-stop-indicator-background: var(--wm-color-error);
+  --wm-progress-bar-danger-background-inactive: var(--wm-color-error-hover);
+  /*--Progress Circle--*/
+  --wm-progress-circle-stroke-inactive: var(--wm-color-secondary-container);
+  --wm-progress-circle-stroke-active: var(--wm-color-primary);
+  --wm-progress-circle-success-stroke-inactive: var(--wm-color-success-focus);
+  --wm-progress-circle-success-stroke-active: var(--wm-color-success);
+  --wm-progress-circle-info-stroke-inactive: var(--wm-color-info-focus);
+  --wm-progress-circle-info-stroke-active: var(--wm-color-info);
+  --wm-progress-circle-warning-stroke-inactive: var(--wm-color-warning-focus);
+  --wm-progress-circle-warning-stroke-active: var(--wm-color-warning);
+  --wm-progress-circle-danger-stroke-inactive: var(--wm-color-error-focus);
+  --wm-progress-circle-danger-stroke-active: var(--wm-color-error);
+  /*--radiobutton--*/
+  --wm-radiobutton-background: transparent;
+  --wm-radiobutton-border-width: 2px;
+  --wm-radiobutton-border-color: var(--wm-color-on-surface-variant);
+  --wm-radiobutton-border-radius: var(--wm-radius-circle);
+  --wm-radiobutton-background-selected: var(--wm-color-primary);
+  --wm-radiobutton-icon-color-selected: var(--wm-color-on-primary);
+  --wm-radiobutton-border-color-selected: var(--wm-color-primary);
+  --wm-radiobutton-state-hover: var(--wm-color-on-surface-hover);
+  --wm-radiobutton-state-focus: var(--wm-color-on-surface-focus);
+  --wm-radiobutton-selected-state-hover: var(--wm-color-primary-hover);
+  --wm-radiobutton-selected-state-focus: var(--wm-color-primary-focus);
+  /*--Rating--*/
+  --wm-rating-gap: var(--wm-space-2);
+  --wm-rating-icon-gap: var(--wm-space-0);
+  --wm-rating-icon-color: var(--wm-color-on-surface);
+  --wm-rating-icon-color-active: var(--wm-color-warning);
+  --wm-rating-icon-size: var(--wm-icon-size);
+  --wm-rating-icon-opacity-inactive: 0.38;
+  --wm-rating-icon-opacity-active: 1;
+  --wm-rating-icon-opacity-readonly: 0.38;
+  /*--Toast--*/
+  --wm-toast-container-width: 344px;
+  --wm-toast-container-shadow: var(--wm-elevation-shadow-3);
+  --wm-toast-container-border-radius: var(--wm-radius-xs);
+  --wm-toast-container-border-width: var(--wm-border-width);
+  --wm-toast-container-border-style: var(--wm-border-style);
+  --wm-toast-container-padding: 14px var(--wm-space-4) 14px var(--wm-space-12);
+  --wm-toast-container-gap: var(--wm-space-1);
+  --wm-toast-font-family: var(--wm-label-large-font-family);
+  --wm-toast-font-weight: var(--wm-label-large-font-weight);
+  --wm-toast-font-size: var(--wm-label-large-font-size);
+  --wm-toast-line-height: var(--wm-label-large-line-height);
+  --wm-toast-letter-spacing: var(--wm-label-large-letter-spacing);
+  --wm-toast-container-background: var(--wm-color-info);
+  --wm-toast-container-color: var(--wm-color-on-info);
+  --wm-toast-container-border-color: var(--wm-color-info);
+  --wm-toast-icon: "\f2ff";
+  --wm-toast-position-top: var(--wm-space-3);
+  --wm-toast-position-left: var(--wm-space-3);
+  --wm-toast-position-right: var(--wm-space-3);
+  --wm-toast-position-bottom: var(--wm-space-3);
+  /* Success toast */
+  --wm-toast-container-success-background: var(--wm-color-success);
+  --wm-toast-container-success-color: var(--wm-color-on-success);
+  --wm-toast-container-success-border-color: var(--wm-color-success);
+  --wm-toast-success-icon: "\f1cf";
+  /* info toast */
+  --wm-toast-container-info-background: var(--wm-color-info);
+  --wm-toast-container-info-color: var(--wm-color-on-info);
+  --wm-toast-container-info-border-color: var(--wm-color-info);
+  --wm-toast-info-icon: "\f2ff";
+  /* Warning toast */
+  --wm-toast-container-warning-background: var(--wm-color-warning);
+  --wm-toast-container-warning-color: var(--wm-color-on-warning);
+  --wm-toast-container-warning-border-color: var(--wm-color-warning);
+  --wm-toast-warning-icon: "\f24c";
+  /* Error toast */
+  --wm-toast-container-error-background: var(--wm-color-error);
+  --wm-toast-container-error-color: var(--wm-color-on-error);
+  --wm-toast-container-error-border-color: var(--wm-color-error);
+  --wm-toast-error-icon: "\f24d";
+  /*headings*/
+  --wm-headings-color: var(--wm-color-on-surface);
+  /*page content*/
+  --wm-page-content-padding: 0;
+  --wm-page-content-background: var(--wm-color-surface-container-lowest);
+  /*--Icon--*/
+  --wm-icon-gap: var(--wm-space-1);
+  /*--Grid Layout--*/
+  --wm-grid-layout-column-padding: var(--wm-space-2);
   /**--Page Layout--**/
   /*--app header--*/
   --wm-header-bg-color: var(--wm-color-secondary);
@@ -805,8 +907,10 @@ ex: color-mix(in srgb, color1 50%, color2 30%)
   /* Track */
   /* Handle */
   /* Handle on hover */
+  /* .app-fileupload .file-upload */
   /**--Layout--**/
   /** Layout styles */
+  /* toast styles */
   /*--bootstrap 5 utilities start--*/
   /* rtl:begin:remove */
   /*--bootstrap 5 utilities end--*/
@@ -4474,7 +4578,6 @@ ex: color-mix(in srgb, color1 50%, color2 30%)
 .wm-app .fa-star:before {
   content: "\f005";
 }
-.wm-app .app-ratings .rating-style > label:before,
 .wm-app .fa-star-o:before {
   content: "\f006";
 }
@@ -10303,11 +10406,6 @@ ex: color-mix(in srgb, color1 50%, color2 30%)
   display: table;
   white-space: normal;
 }
-.wm-app .custom-toaster {
-  padding: 0 !important;
-  width: 100% !important;
-  color: #333;
-}
 .wm-app #wm-mobile-display {
   width: 1px;
   height: 1px;
@@ -11254,9 +11352,6 @@ ex: color-mix(in srgb, color1 50%, color2 30%)
   padding-left: 2px;
   display: inline-block;
 }
-.wm-app .app-composite-widget {
-  position: relative;
-}
 .wm-app .app-slider {
   width: auto;
   position: relative;
@@ -11819,31 +11914,6 @@ ex: color-mix(in srgb, color1 50%, color2 30%)
 .wm-app .app-required-input {
   color: red;
 }
-.wm-app .app-colorpicker.input-group {
-  width: 10em;
-  position: relative;
-}
-.wm-app .app-colorpicker.input-group .input-group-addon {
-  width: 30px;
-  position: absolute;
-  right: 0;
-  height: 100%;
-  z-index: 3;
-  pointer-events: none;
-  padding: 0;
-}
-.wm-app .app-colorpicker.input-group .input-group-addon .colored-box {
-  width: 100%;
-  height: 100%;
-  display: inline-block;
-  background-color: #fff;
-}
-.wm-app .app-colorpicker.input-group .dropdown {
-  position: absolute;
-}
-.wm-app .app-colorpicker.input-group .dropdown .dropdown-menu {
-  min-width: 129px;
-}
 .wm-app .app-grid .table,
 .wm-app .app-view,
 .wm-app .uib-day button,
@@ -11961,117 +12031,16 @@ ex: color-mix(in srgb, color1 50%, color2 30%)
   bottom: 0;
   position: fixed !important;
 }
-.wm-app .app-fileupload {
-  overflow: hidden;
-  position: relative;
-  margin: 0 0 8px;
-}
-.wm-app .app-fileupload[disabled="disabled"] .app-multi-file-upload .caption,
-.wm-app .app-fileupload[disabled="disabled"] .app-multi-file-upload .drop-box,
-.wm-app .app-fileupload[disabled="disabled"] .app-multi-file-upload .form-horizontal .file-input,
-.wm-app .app-fileupload[disabled="disabled"] .app-single-file-upload .caption,
-.wm-app .app-fileupload[disabled="disabled"] .app-single-file-upload .drop-box,
-.wm-app .app-fileupload[disabled="disabled"] .app-single-file-upload .form-horizontal .file-input {
-  cursor: not-allowed;
-}
-.wm-app .app-fileupload[disabled="disabled"] .app-multi-file-upload .app-button-wrapper .app-button,
-.wm-app .app-fileupload[disabled="disabled"] .app-single-file-upload .app-button-wrapper .app-button {
-  opacity: 0.65;
-}
-.wm-app .app-fileupload .app-multi-file-upload,
-.wm-app .app-fileupload .app-single-file-upload {
+.wm-app .app-list,
+.wm-app .app-livelist {
   position: relative;
-  min-height: 3em;
-  height: auto;
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  min-height: 2em;
 }
-.wm-app .app-fileupload .app-multi-file-upload .app-button-wrapper,
-.wm-app .app-fileupload .app-single-file-upload .app-button-wrapper {
-  position: relative;
-  display: inline-block;
-  margin-right: 4px;
-}
-.wm-app .app-fileupload .file-upload {
-  width: 100%;
-  overflow-y: auto;
-}
-.wm-app .app-fileupload .file-upload .file-upload-status .upload-file-list .file-icon {
-  font-size: 1.5em;
-}
-.wm-app .app-fileupload .file-upload .file-upload-status .upload-file-list .file-upload-stop {
-  margin-top: 30px;
-}
-.wm-app .app-fileupload .file-upload .file-upload-status .upload-file-list .media-right a i,
-.wm-app .app-fileupload .file-upload .file-upload-status .upload-file-list .media-right span {
-  font-size: 1.5em;
-  text-decoration: none;
-}
-.wm-app .app-fileupload .file-upload .file-upload-status .upload-file-list .file-details .file-detail .uploaddetails {
-  margin: 0;
-}
-.wm-app .app-fileupload .file-upload .file-upload-status .upload-file-list .file-details .file-detail .uploaddetails .filesize,
-.wm-app .app-fileupload .file-upload .file-upload-status .upload-file-list .file-details .file-detail .uploaddetails .upload-title {
-  vertical-align: middle;
-  margin: 0 5pt;
-}
-.wm-app .app-fileupload .file-upload .file-upload-status .upload-file-list .file-details .file-detail .uploaddetails .upload-title {
-  height: 1.3em;
-  text-overflow: ellipsis;
-  overflow: hidden;
-}
-.wm-app .app-fileupload .form-horizontal {
-  position: relative;
-}
-.wm-app .app-fileupload .form-horizontal .file-input {
-  position: absolute;
-  opacity: 0;
-  z-index: 2;
-  cursor: pointer;
-  width: 100%;
-  height: 100%;
-}
-.wm-app .app-fileupload .app-multi-file-upload {
-  width: 100%;
-  height: 100%;
-}
-.wm-app .app-fileupload .app-multi-file-upload .status {
-  border-bottom: 1px rgba(0, 0, 0, 0.05) solid;
-}
-.wm-app .app-fileupload .app-multi-file-upload .icon {
-  font-size: 2em;
-}
-.wm-app .app-fileupload .app-multi-file-upload .drop-box {
-  border: 1px dashed rgba(0, 0, 0, 0.05);
-  background-color: rgba(0, 0, 0, 0.05);
-  vertical-align: middle;
-  text-align: center;
-  cursor: pointer;
-}
-.wm-app .app-fileupload .app-multi-file-upload .drop-box.file-dragover {
-  background-color: rgba(0, 0, 0, 0.2);
-  color: #fff;
-}
-.wm-app .app-fileupload .app-multi-file-upload .app-anchor,
-.wm-app .app-list .app-list-item.active.list-group-item .app-anchor,
-.wm-app .app-list .app-list-item.active.list-group-item .app-label,
-.wm-app .app-livelist .app-list-item.active.list-group-item .app-anchor,
-.wm-app .app-livelist .app-list-item.active.list-group-item .app-label {
-  color: inherit;
-}
-.wm-app .app-fileupload .btn-default.highlight-drop-box,
-.wm-app .app-fileupload .drop-box.highlight-drop-box {
-  background-color: #eaf0f8;
-  border: 2px dashed #0c81b8;
-}
-.wm-app .app-list,
-.wm-app .app-livelist {
-  position: relative;
-  list-style: none;
-  margin: 0;
-  padding: 0;
-  min-height: 2em;
-}
-.wm-app .app-list.inline .app-list-item,
-.wm-app .app-livelist.inline .app-list-item {
+.wm-app .app-list.inline .app-list-item,
+.wm-app .app-livelist.inline .app-list-item {
   display: inline-block;
 }
 .wm-app .app-list.Inline > .panel-heading,
@@ -13335,58 +13304,6 @@ ex: color-mix(in srgb, color1 50%, color2 30%)
   z-index: 9999;
   display: none;
 }
-.wm-app #toast-container {
-  max-height: 80%;
-  overflow-y: auto;
-}
-.wm-app #toast-container .toast-message,
-.wm-app #toast-container .toast-title {
-  word-wrap: break-word;
-}
-.wm-app #toast-container > .toast-error,
-.wm-app #toast-container > .toast-info,
-.wm-app #toast-container > .toast-success,
-.wm-app #toast-container > .toast-wait,
-.wm-app #toast-container > .toast-warning {
-  background-position: 1em 1em;
-}
-.wm-app .toast-top-center {
-  right: 0;
-  width: 100%;
-}
-.wm-app .toast-top-center > div {
-  margin: auto;
-}
-.wm-app .toast-center-center {
-  left: 50%;
-  top: 50%;
-  margin-top: -30px;
-  margin-left: -150px;
-}
-.wm-app .toast-bottom-center > div,
-.wm-app .toast-center-center > div {
-  margin: auto;
-}
-.wm-app .toast-bottom-center {
-  right: 0;
-  width: 100%;
-}
-.wm-app .toast-center-left {
-  left: 12px;
-  top: 50%;
-  margin-top: -30px;
-}
-.wm-app .toast-center-left > div {
-  margin: auto;
-}
-.wm-app .toast-center-right {
-  right: 12px;
-  top: 50%;
-  margin-top: -30px;
-}
-.wm-app .toast-center-right > div {
-  margin: auto;
-}
 .wm-app .app-calendar {
   display: inline-block;
   position: relative;
@@ -13598,79 +13515,6 @@ ex: color-mix(in srgb, color1 50%, color2 30%)
   margin-top: 10px;
   display: inline-block;
 }
-.wm-app .app-ratings {
-  display: inline-block;
-  vertical-align: middle;
-  position: relative;
-  font-size: 1em;
-}
-.wm-app .app-ratings .ratings-wrapper > * {
-  vertical-align: middle;
-}
-.wm-app .app-ratings .active {
-  color: #f7dc6f;
-}
-.wm-app .app-ratings .disabled {
-  color: #d3d3d3;
-}
-.wm-app .app-ratings .ratings-wrapper > label.caption {
-  margin: auto 0.25em;
-  font-size: 120%;
-}
-.wm-app .app-ratings .rating-style {
-  display: inline-block;
-}
-.wm-app .app-ratings .rating-style .rating-label-hover:hover,
-.wm-app .app-ratings .rating-style .rating-label-hover:hover ~ label {
-  color: #dbc631;
-}
-.wm-app .app-ratings .rating-style > label {
-  position: relative;
-  float: right;
-  margin: 0;
-}
-.wm-app .app-ratings .rating-style > label:before {
-  margin: 1px;
-  font-family: FontAwesome;
-}
-.wm-app .app-ratings .rating-style > label.active:before {
-  content: "\f005";
-}
-.wm-app .app-ratings .ratings-container .ratings:before,
-.wm-app .app-ratings .ratings-container:before {
-  content: "\f005\f005\f005\f005\f005\f005\f005\f005\f005\f005";
-  font-family: FontAwesome;
-  top: 0;
-  left: 0;
-  white-space: nowrap;
-  overflow: hidden;
-}
-.wm-app .app-ratings .rating-style > label > input {
-  display: none;
-}
-.wm-app .app-ratings .ratings-container {
-  display: inline-block;
-  text-align: left;
-  position: relative;
-}
-.wm-app .app-ratings .ratings-container > * {
-  vertical-align: middle;
-}
-.wm-app .app-ratings .ratings-container:before {
-  position: absolute;
-  width: inherit;
-}
-.wm-app .app-ratings .ratings-container .ratings {
-  font-size: inherit;
-  left: 0;
-  width: 100%;
-  overflow: hidden;
-  display: inline-block;
-}
-.wm-app .app-ratings .ratings-container .ratings:before {
-  position: absolute;
-  width: inherit;
-}
 .wm-app .app-accordion-panel .panel-heading .panel-actions .panel-action i,
 .wm-app .app-card .panel-heading .panel-actions .panel-action i,
 .wm-app .app-panel .panel-heading .panel-actions .panel-action i {
@@ -15925,217 +15769,6 @@ ex: color-mix(in srgb, color1 50%, color2 30%)
 .wm-app typeahead-container.dropdown .app-search.dropdown-menu {
   position: relative;
 }
-.wm-app .toast-title {
-  font-weight: 700;
-}
-.wm-app .toast-message {
-  -ms-word-wrap: break-word;
-  word-wrap: break-word;
-}
-.wm-app .toast-message a,
-.wm-app .toast-message label {
-  color: #fff;
-}
-.wm-app .toast-message a:hover {
-  color: #ccc;
-  text-decoration: none;
-}
-.wm-app .toast-close-button {
-  position: relative;
-  right: -0.3em;
-  top: -0.3em;
-  float: right;
-  font-size: 20px;
-  font-weight: 700;
-  color: #fff;
-  -webkit-text-shadow: 0 1px 0 #fff;
-  text-shadow: 0 1px 0 #fff;
-  opacity: 0.8;
-  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
-  filter: alpha(opacity=80);
-}
-.wm-app .toast-close-button:focus,
-.wm-app .toast-close-button:hover {
-  color: #000;
-  text-decoration: none;
-  cursor: pointer;
-  opacity: 0.4;
-  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
-  filter: alpha(opacity=40);
-}
-.wm-app button.toast-close-button {
-  padding: 0;
-  cursor: pointer;
-  background: 0 0;
-  border: 0;
-  -webkit-appearance: none;
-}
-.wm-app .toast-top-full-width {
-  top: 0;
-  right: 0;
-  width: 100%;
-}
-.wm-app .toast-bottom-full-width {
-  bottom: 0;
-  right: 0;
-  width: 100%;
-}
-.wm-app .toast-top-left {
-  top: 12px;
-  left: 12px;
-}
-.wm-app .toast-top-center {
-  top: 12px;
-}
-.wm-app .toast-top-right {
-  top: 12px;
-  right: 12px;
-}
-.wm-app .toast-bottom-right {
-  right: 12px;
-  bottom: 12px;
-}
-.wm-app .toast-bottom-center {
-  bottom: 12px;
-}
-.wm-app .toast-bottom-left {
-  bottom: 12px;
-  left: 12px;
-}
-.wm-app .toast-center {
-  top: 45%;
-}
-.wm-app #toast-container {
-  position: fixed;
-  z-index: 999999;
-  pointer-events: auto;
-}
-.wm-app #toast-container.toast-bottom-center,
-.wm-app #toast-container.toast-center,
-.wm-app #toast-container.toast-top-center {
-  width: 100%;
-  pointer-events: none;
-}
-.wm-app #toast-container.toast-bottom-center > div,
-.wm-app #toast-container.toast-center > div,
-.wm-app #toast-container.toast-top-center > div {
-  margin: auto;
-  pointer-events: auto;
-}
-.wm-app #toast-container.toast-bottom-center > button,
-.wm-app #toast-container.toast-center > button,
-.wm-app #toast-container.toast-top-center > button {
-  pointer-events: auto;
-}
-.wm-app #toast-container * {
-  -moz-box-sizing: border-box;
-  -webkit-box-sizing: border-box;
-  box-sizing: border-box;
-}
-.wm-app #toast-container > div {
-  margin: 0 0 6px;
-  padding: 15px 15px 15px 50px;
-  width: 300px;
-  -moz-border-radius: 3px;
-  -webkit-border-radius: 3px 3px 3px 3px;
-  border-radius: 3px;
-  background-position: 15px center;
-  background-repeat: no-repeat;
-  -moz-box-shadow: 0 0 12px #999;
-  -webkit-box-shadow: 0 0 12px #999;
-  box-shadow: 0 0 12px #999;
-  color: #fff;
-  opacity: 0.8;
-  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
-  filter: alpha(opacity=80);
-}
-.wm-app #toast-container > :hover {
-  -moz-box-shadow: 0 0 12px #000;
-  -webkit-box-shadow: 0 0 12px #000;
-  box-shadow: 0 0 12px #000;
-  opacity: 1;
-  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
-  filter: alpha(opacity=100);
-  cursor: pointer;
-}
-.wm-app #toast-container > .toast-info {
-  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGwSURBVEhLtZa9SgNBEMc9sUxxRcoUKSzSWIhXpFMhhYWFhaBg4yPYiWCXZxBLERsLRS3EQkEfwCKdjWJAwSKCgoKCcudv4O5YLrt7EzgXhiU3/4+b2ckmwVjJSpKkQ6wAi4gwhT+z3wRBcEz0yjSseUTrcRyfsHsXmD0AmbHOC9Ii8VImnuXBPglHpQ5wwSVM7sNnTG7Za4JwDdCjxyAiH3nyA2mtaTJufiDZ5dCaqlItILh1NHatfN5skvjx9Z38m69CgzuXmZgVrPIGE763Jx9qKsRozWYw6xOHdER+nn2KkO+Bb+UV5CBN6WC6QtBgbRVozrahAbmm6HtUsgtPC19tFdxXZYBOfkbmFJ1VaHA1VAHjd0pp70oTZzvR+EVrx2Ygfdsq6eu55BHYR8hlcki+n+kERUFG8BrA0BwjeAv2M8WLQBtcy+SD6fNsmnB3AlBLrgTtVW1c2QN4bVWLATaIS60J2Du5y1TiJgjSBvFVZgTmwCU+dAZFoPxGEEs8nyHC9Bwe2GvEJv2WXZb0vjdyFT4Cxk3e/kIqlOGoVLwwPevpYHT+00T+hWwXDf4AJAOUqWcDhbwAAAAASUVORK5CYII=) !important;
-}
-.wm-app #toast-container > .toast-wait {
-  background-image: url(data:image/gif;base64,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) !important;
-}
-.wm-app #toast-container > .toast-error {
-  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAHOSURBVEhLrZa/SgNBEMZzh0WKCClSCKaIYOED+AAKeQQLG8HWztLCImBrYadgIdY+gIKNYkBFSwu7CAoqCgkkoGBI/E28PdbLZmeDLgzZzcx83/zZ2SSXC1j9fr+I1Hq93g2yxH4iwM1vkoBWAdxCmpzTxfkN2RcyZNaHFIkSo10+8kgxkXIURV5HGxTmFuc75B2RfQkpxHG8aAgaAFa0tAHqYFfQ7Iwe2yhODk8+J4C7yAoRTWI3w/4klGRgR4lO7Rpn9+gvMyWp+uxFh8+H+ARlgN1nJuJuQAYvNkEnwGFck18Er4q3egEc/oO+mhLdKgRyhdNFiacC0rlOCbhNVz4H9FnAYgDBvU3QIioZlJFLJtsoHYRDfiZoUyIxqCtRpVlANq0EU4dApjrtgezPFad5S19Wgjkc0hNVnuF4HjVA6C7QrSIbylB+oZe3aHgBsqlNqKYH48jXyJKMuAbiyVJ8KzaB3eRc0pg9VwQ4niFryI68qiOi3AbjwdsfnAtk0bCjTLJKr6mrD9g8iq/S/B81hguOMlQTnVyG40wAcjnmgsCNESDrjme7wfftP4P7SP4N3CJZdvzoNyGq2c/HWOXJGsvVg+RA/k2MC/wN6I2YA2Pt8GkAAAAASUVORK5CYII=) !important;
-}
-.wm-app #toast-container > .toast-success {
-  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAADsSURBVEhLY2AYBfQMgf///3P8+/evAIgvA/FsIF+BavYDDWMBGroaSMMBiE8VC7AZDrIFaMFnii3AZTjUgsUUWUDA8OdAH6iQbQEhw4HyGsPEcKBXBIC4ARhex4G4BsjmweU1soIFaGg/WtoFZRIZdEvIMhxkCCjXIVsATV6gFGACs4Rsw0EGgIIH3QJYJgHSARQZDrWAB+jawzgs+Q2UO49D7jnRSRGoEFRILcdmEMWGI0cm0JJ2QpYA1RDvcmzJEWhABhD/pqrL0S0CWuABKgnRki9lLseS7g2AlqwHWQSKH4oKLrILpRGhEQCw2LiRUIa4lwAAAABJRU5ErkJggg==) !important;
-}
-.wm-app #toast-container > .toast-warning {
-  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGYSURBVEhL5ZSvTsNQFMbXZGICMYGYmJhAQIJAICYQPAACiSDB8AiICQQJT4CqQEwgJvYASAQCiZiYmJhAIBATCARJy+9rTsldd8sKu1M0+dLb057v6/lbq/2rK0mS/TRNj9cWNAKPYIJII7gIxCcQ51cvqID+GIEX8ASG4B1bK5gIZFeQfoJdEXOfgX4QAQg7kH2A65yQ87lyxb27sggkAzAuFhbbg1K2kgCkB1bVwyIR9m2L7PRPIhDUIXgGtyKw575yz3lTNs6X4JXnjV+LKM/m3MydnTbtOKIjtz6VhCBq4vSm3ncdrD2lk0VgUXSVKjVDJXJzijW1RQdsU7F77He8u68koNZTz8Oz5yGa6J3H3lZ0xYgXBK2QymlWWA+RWnYhskLBv2vmE+hBMCtbA7KX5drWyRT/2JsqZ2IvfB9Y4bWDNMFbJRFmC9E74SoS0CqulwjkC0+5bpcV1CZ8NMej4pjy0U+doDQsGyo1hzVJttIjhQ7GnBtRFN1UarUlH8F3xict+HY07rEzoUGPlWcjRFRr4/gChZgc3ZL2d8oAAAAASUVORK5CYII=) !important;
-}
-.wm-app #toast-container.toast-bottom-full-width > div,
-.wm-app #toast-container.toast-top-full-width > div {
-  width: 96%;
-  margin: auto;
-}
-.wm-app .toast {
-  background-color: #030303;
-}
-.wm-app .toast-success {
-  background-color: #51a351;
-}
-.wm-app .toast-error {
-  background-color: #bd362f;
-}
-.wm-app .toast-info,
-.wm-app .toast-wait {
-  background-color: #2f96b4;
-}
-.wm-app .toast-warning {
-  background-color: #f89406;
-}
-@media all and (max-width: 240px) {
-  .wm-app #toast-container > div {
-    padding: 8px 8px 8px 50px;
-    width: 11em;
-  }
-  .wm-app #toast-container .toast-close-button {
-    right: -0.2em;
-    top: -0.2em;
-  }
-}
-@media all and (min-width: 241px) and (max-width: 480px) {
-  .wm-app #toast-container > div {
-    padding: 8px 8px 8px 50px;
-    width: 18em;
-  }
-  .wm-app #toast-container .toast-close-button {
-    right: -0.2em;
-    top: -0.2em;
-  }
-}
-@media all and (min-width: 481px) and (max-width: 768px) {
-  .wm-app #toast-container > div {
-    padding: 15px 15px 15px 50px;
-    width: 25em;
-  }
-}
-.wm-app :not(.no-enter)#toast-container > div.ng-enter,
-.wm-app :not(.no-leave)#toast-container > div.ng-leave {
-  -webkit-transition: 1s cubic-bezier(0.25, 0.25, 0.75, 0.75) all;
-  -moz-transition: 1s cubic-bezier(0.25, 0.25, 0.75, 0.75) all;
-  -ms-transition: 1s cubic-bezier(0.25, 0.25, 0.75, 0.75) all;
-  -o-transition: 1s cubic-bezier(0.25, 0.25, 0.75, 0.75) all;
-  transition: 1s cubic-bezier(0.25, 0.25, 0.75, 0.75) all;
-}
-.wm-app :not(.no-enter)#toast-container > div.ng-enter.ng-enter-active,
-.wm-app :not(.no-leave)#toast-container > div.ng-leave {
-  opacity: 0.8;
-}
-.wm-app :not(.no-enter)#toast-container > div.ng-enter,
-.wm-app :not(.no-leave)#toast-container > div.ng-leave.ng-leave-active {
-  opacity: 0;
-}
 @keyframes wm-page-fadeInDown {
   0% {
     opacity: 0;
@@ -17237,44 +16870,6 @@ ex: color-mix(in srgb, color1 50%, color2 30%)
 .wm-app [captionposition="top"] .control-label {
   width: 100%;
 }
-.wm-app .app-composite-widget.caption-right .app-blob-upload,
-.wm-app .app-composite-widget.caption-right .app-button-wrapper,
-.wm-app .app-composite-widget.caption-right .app-checkbox,
-.wm-app .app-composite-widget.caption-right .app-checkboxset,
-.wm-app .app-composite-widget.caption-right .app-fileupload,
-.wm-app .app-composite-widget.caption-right .app-radioset,
-.wm-app .app-composite-widget.caption-right .app-ratings,
-.wm-app .app-composite-widget.caption-right .app-switch,
-.wm-app .app-composite-widget.caption-right .app-toggle,
-.wm-app .app-composite-widget.caption-right .control-label,
-.wm-app .app-composite-widget.caption-right .form-control,
-.wm-app .app-composite-widget.caption-right .input-group {
-  float: right;
-}
-.wm-app .app-composite-widget.caption-right .app-checkboxset .app-checkbox,
-.wm-app .app-composite-widget.caption-right .app-radioset .app-radio {
-  float: none;
-}
-.wm-app .app-composite-widget.caption-right .app-checkboxset .app-checkbox label,
-.wm-app .app-composite-widget.caption-right .app-radioset .app-radio label {
-  text-align: left;
-}
-.wm-app .app-composite-widget.caption-right .app-date .dropdown-menu,
-.wm-app .app-composite-widget.caption-right .app-datetime .dropdown-menu,
-.wm-app .app-composite-widget.caption-right .app-timeinput .dropdown-menu {
-  left: 0 !important;
-  white-space: normal;
-}
-.wm-app .app-composite-widget.caption-right .app-slider,
-.wm-app .app-composite-widget.caption-right .app-tabs .nav.nav-tabs {
-  text-align: right;
-}
-.wm-app .app-composite-widget.caption-right .app-slider .range-input {
-  margin-top: 0.5em;
-}
-.wm-app .app-composite-widget.caption-top .control-label {
-  width: 100%;
-}
 .wm-app .app-search .app-textbox.ng-hide-animate {
   display: none !important;
 }
@@ -18006,6 +17601,39 @@ ex: color-mix(in srgb, color1 50%, color2 30%)
 .wm-app audio {
   display: inline-block;
 }
+.wm-app .app-button-group {
+  position: relative;
+  display: inline-flex;
+}
+.wm-app .app-button-group .btn {
+  border-radius: 0;
+  margin: 0;
+}
+.wm-app .app-button-group .btn + .btn {
+  margin: 0;
+}
+.wm-app .app-button-group .btn:first-of-type {
+  border-top-left-radius: var(--wm-button-group-horizontal-radius);
+  border-bottom-left-radius: var(--wm-button-group-horizontal-radius);
+}
+.wm-app .app-button-group .btn:last-of-type {
+  border-top-right-radius: var(--wm-button-group-horizontal-radius);
+  border-bottom-right-radius: var(--wm-button-group-horizontal-radius);
+}
+.wm-app .app-button-group.btn-group-vertical {
+  flex-direction: column;
+}
+.wm-app .app-button-group.btn-group-vertical .btn {
+  border-radius: 0;
+}
+.wm-app .app-button-group.btn-group-vertical .btn:first-of-type {
+  border-top-left-radius: var(--wm-button-group-vertical-radius);
+  border-top-right-radius: var(--wm-button-group-vertical-radius);
+}
+.wm-app .app-button-group.btn-group-vertical .btn:last-of-type {
+  border-bottom-left-radius: var(--wm-button-group-vertical-radius);
+  border-bottom-right-radius: var(--wm-button-group-vertical-radius);
+}
 .wm-app .btn {
   font-size: var(--wm-btn-font-size);
   font-family: var(--wm-btn-font-family);
@@ -18217,13 +17845,11 @@ ex: color-mix(in srgb, color1 50%, color2 30%)
   --wm-btn-state-layer-color: var(--wm-btn-danger-outlined-state-layer-color);
 }
 .wm-app .btn-text {
+  --wm-btn-color: var(--wm-btn-background);
   background: none !important;
   border: none !important;
   --wm-btn-state-layer-color: var(--wm-btn-background);
 }
-.wm-app .btn-text .btn-caption {
-  color: var(--wm-btn-background);
-}
 .wm-app .btn-elevated {
   box-shadow: var(--wm-btn-elevated);
 }
@@ -18415,18 +18041,37 @@ ex: color-mix(in srgb, color1 50%, color2 30%)
 .wm-app .app-checkboxset.list-group.inline > li + li {
   margin: 0;
 }
-.wm-app .app-container {
+.wm-app .app-colorpicker.input-group {
+  width: 100%;
   position: relative;
 }
-.wm-app .app-outlined-container {
-  border: var(--wm-container-outlined-border-width) var(--wm-container-outlined-border-style) var(--wm-container-outlined-border-color);
+.wm-app .app-colorpicker.input-group .input-group-addon.colorpicker-container {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 48px;
+  height: 48px;
+  position: absolute;
+  top: 50%;
+  right: 1px;
+  transform: translateY(-50%);
+  pointer-events: none;
 }
-.wm-app .app-elevation-container {
-  border-radius: var(--wm-container-elevation-border-radius);
-  box-shadow: var(--wm-container-elevation-shadow);
+.wm-app .app-colorpicker.input-group .input-group-addon.colorpicker-container .colored-box {
+  font-size: var(--wm-icon-size);
+  height: 50%;
+  width: 50%;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: var(--wm-form-control-radius);
+  overflow: hidden;
 }
-.wm-app .app-currency {
+.wm-app .app-colorpicker.input-group .input-group-addon.colorpicker-container .colored-box:before {
+  content: "\f1ef";
+  font-family: wavicon;
   position: relative;
+  z-index: -1;
 }
 .wm-app .app-composite-widget {
   position: relative;
@@ -18568,6 +18213,124 @@ ex: color-mix(in srgb, color1 50%, color2 30%)
   font-weight: var(--wm-help-block-font-weight);
   line-height: var(--wm-help-block-line-height);
 }
+.wm-app .app-container {
+  position: relative;
+}
+.wm-app .app-outlined-container {
+  border: var(--wm-container-outlined-border-width) var(--wm-container-outlined-border-style) var(--wm-container-outlined-border-color);
+}
+.wm-app .app-elevation-container {
+  border-radius: var(--wm-container-elevation-border-radius);
+  box-shadow: var(--wm-container-elevation-shadow);
+}
+.wm-app .app-currency {
+  position: relative;
+}
+.wm-app .wm-app .app-fileupload {
+  position: relative;
+  overflow: hidden;
+}
+.wm-app .app-fileupload .file-upload {
+  width: 100%;
+  overflow-y: auto;
+}
+.wm-app .app-fileupload .app-single-file-upload {
+  position: relative;
+  display: inline-flex;
+  height: auto;
+  min-height: 3em;
+  margin-bottom: var(--wm-file-upload-bottom-space);
+}
+.wm-app .app-fileupload .app-single-file-upload .app-button-wrapper {
+  position: relative;
+  display: inline-flex;
+}
+.wm-app .app-fileupload .app-single-file-upload .app-button-wrapper .form-horizontal,
+.wm-app .app-fileupload .app-multi-file-upload .drop-box .form-horizontal {
+  position: relative;
+}
+.wm-app .app-fileupload .app-single-file-upload .app-button-wrapper .form-horizontal input,
+.wm-app .app-fileupload .app-multi-file-upload .drop-box .form-horizontal input {
+  position: absolute;
+  z-index: 2;
+  width: 100%;
+  height: 100%;
+  cursor: pointer;
+  opacity: 0;
+}
+.wm-app .wm-app .app-fileupload > .file-upload .file-upload-status {
+  padding: var(--wm-file-upload-status-padding);
+  background: var(--wm-file-upload-status-background);
+  border: var(--wm-file-upload-status-border-width) var(--wm-file-upload-status-border-style) var(--wm-file-upload-status-border-color);
+  border-radius: var(--wm-file-upload-status-radius);
+  margin-bottom: var(--wm-file-upload-status-bottom-space);
+}
+.wm-app .wm-app .app-fileupload > .file-upload .file-upload-status .upload-file-list {
+  display: flex;
+  align-items: center;
+  gap: var(--wm-file-upload-gap);
+}
+.wm-app .wm-app .app-fileupload > .file-upload .file-upload-status .upload-file-list .file-details {
+  flex-grow: 1;
+}
+.wm-app .wm-app .app-fileupload .app-multi-file-upload {
+  width: 100%;
+  height: 100%;
+  margin-bottom: var(--wm-file-upload-drop-box-bottom-space);
+}
+.wm-app .app-fileupload .app-multi-file-upload .drop-box {
+  border: var(--wm-file-upload-status-border-width) dashed var(--wm-file-upload-status-border-color);
+  background-color: var(--wm-file-upload-drop-box-background);
+  cursor: pointer;
+  height: 100px;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  gap: var(--wm-file-upload-drop-box-gap);
+  border-radius: var(--wm-file-upload-multi-file-radius);
+}
+.wm-app .app-fileupload .app-multi-file-upload .drop-box .message {
+  text-align: center;
+  cursor: pointer;
+}
+.wm-app .app-fileupload .app-multi-file-upload .drop-box .message .caption {
+  color: var(--wm-file-upload-message-caption-color);
+  font-size: var(--wm-file-upload-message-caption-font-size);
+  font-weight: var(--wm-file-upload-message-caption-font-weight);
+  line-height: var(--wm-file-upload-message-caption-line-height);
+}
+.wm-app .app-fileupload .app-multi-file-upload .drop-box .message .app-anchor {
+  color: var(--wm-file-upload-message-anchor-color);
+  font-size: var(--wm-file-upload-message-anchor-font-size);
+  font-weight: var(--wm-file-upload-message-anchor-font-weight);
+  line-height: var(--wm-file-upload-message-anchor-line-height);
+}
+.wm-app .wm-app .app-fileupload > .file-upload .file-upload-status .upload-file-list .file-details .uploaddetails {
+  word-wrap: break-word;
+  display: block;
+}
+.wm-app .wm-app .app-fileupload > .file-upload .file-upload-status .upload-file-list .file-details .uploaddetails .upload-title {
+  width: auto;
+  color: var(--wm-file-upload-title-color);
+  font-size: var(--wm-file-upload-title-font-size);
+  font-weight: var(--wm-file-upload-title-font-weight);
+  line-height: var(--wm-file-upload-title-line-height);
+}
+.wm-app .wm-app .app-fileupload > .file-upload .file-upload-status .upload-file-list .file-details .uploaddetails .filesize {
+  color: var(--wm-file-upload-size-color);
+  font-size: var(--wm-file-upload-size-font-size);
+  font-weight: var(--wm-file-upload-size-font-weight);
+  line-height: var(--wm-file-upload-size-line-height);
+}
+.wm-app .wm-app .app-fileupload .file-upload .file-upload-status .upload-file-list .media-right span.status-icon,
+.wm-app .wm-app .app-fileupload .file-upload .file-upload-status .upload-file-list .media-right a.btn > i {
+  font-size: var(--wm-file-upload-media-icon-size);
+}
+.wm-app .wm-app .app-fileupload .file-upload .file-upload-status .upload-file-list .media-right a.btn {
+  min-height: unset;
+  padding: var(--wm-file-upload-media-icon-padding);
+}
 .wm-app .app-grid-layout {
   display: flex;
   flex-direction: column;
@@ -20439,15 +20202,256 @@ ex: color-mix(in srgb, color1 50%, color2 30%)
   background-image: var(--wm-progress-bar-striped);
   background-size: var(--wm-progress-bar-striped-size);
 }
+.wm-app .app-progress.circle {
+  background: unset;
+  margin: unset;
+  display: inline-flex;
+}
+.wm-app .app-progress.circle:before {
+  display: none;
+}
+.wm-app .app-progress.circle svg text tspan {
+  font-size: 1.5em;
+  fill: inherit;
+}
+.wm-app .app-progress.circle svg text tspan + tspan {
+  font-size: 1em;
+  opacity: 0.75;
+}
+.wm-app .app-progress.circle svg circle {
+  stroke: var(--wm-progress-circle-stroke-inactive);
+}
+.wm-app .app-progress.circle svg path {
+  stroke: var(--wm-progress-circle-stroke-active);
+}
+.wm-app .app-progress.circle.progress-circle-success svg circle {
+  --wm-progress-circle-stroke-inactive: var(--wm-progress-circle-success-stroke-inactive);
+}
+.wm-app .app-progress.circle.progress-circle-success svg path {
+  --wm-progress-circle-stroke-active: var(--wm-progress-circle-success-stroke-active);
+}
+.wm-app .app-progress.circle.progress-circle-info svg circle {
+  --wm-progress-circle-stroke-inactive: var(--wm-progress-circle-info-stroke-inactive);
+}
+.wm-app .app-progress.circle.progress-circle-info svg path {
+  --wm-progress-circle-stroke-active: var(--wm-progress-circle-info-stroke-active);
+}
+.wm-app .app-progress.circle.progress-circle-warning svg circle {
+  --wm-progress-circle-stroke-inactive: var(--wm-progress-circle-warning-stroke-inactive);
+}
+.wm-app .app-progress.circle.progress-circle-warning svg path {
+  --wm-progress-circle-stroke-active: var(--wm-progress-circle-warning-stroke-active);
+}
+.wm-app .app-progress.circle.progress-circle-danger svg circle {
+  --wm-progress-circle-stroke-inactive: var(--wm-progress-circle-danger-stroke-inactive);
+}
+.wm-app .app-progress.circle.progress-circle-danger svg path {
+  --wm-progress-circle-stroke-active: var(--wm-progress-circle-danger-stroke-active);
+}
 .wm-app .app-radio {
   position: relative;
 }
 .wm-app .app-radioset {
   position: relative;
 }
+.wm-app .app-ratings {
+  display: inline-flex;
+  position: relative;
+}
+.wm-app .app-ratings .ratings-wrapper {
+  position: relative;
+  display: flex;
+  align-items: center;
+  gap: var(--wm-rating-gap);
+}
+.wm-app .app-ratings .ratings-wrapper .rating-style {
+  position: relative;
+  display: inline-flex;
+  flex-direction: row-reverse;
+  gap: var(--wm-rating-icon-gap);
+}
+.wm-app .app-ratings .ratings-wrapper .rating-style input {
+  display: none;
+}
+.wm-app .app-ratings .ratings-wrapper .rating-style label {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  color: var(--wm-rating-icon-color);
+  font-size: var(--wm-rating-icon-size);
+  width: var(--wm-rating-icon-size);
+  height: var(--wm-rating-icon-size);
+  opacity: var(--wm-rating-icon-opacity-inactive);
+  transition: all 0.05s ease-in-out;
+  cursor: pointer;
+}
+.wm-app .app-ratings .ratings-wrapper .rating-style label:before {
+  content: "\f4c1";
+  font-family: wavicon;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  font-size: inherit;
+  height: 100%;
+  width: 100%;
+}
+.wm-app .app-ratings .ratings-wrapper .rating-style label:hover,
+.wm-app .app-ratings .ratings-wrapper .rating-style label:hover ~ label,
+.wm-app .app-ratings .ratings-wrapper .rating-style label.active {
+  opacity: var(--wm-rating-icon-opacity-active);
+  color: var(--wm-rating-icon-color-active);
+}
+.wm-app .app-ratings .ratings-wrapper .rating-style label:hover:before,
+.wm-app .app-ratings .ratings-wrapper .rating-style label:hover ~ label:before,
+.wm-app .app-ratings .ratings-wrapper .rating-style label.active:before {
+  content: "\f4c3";
+}
+.wm-app .app-ratings .ratings-wrapper .rating-style label:hover {
+  transform: scale(1.2);
+}
+.wm-app .app-ratings .ratings-container {
+  font-size: var(--wm-rating-icon-size);
+  overflow: hidden;
+}
+.wm-app .app-ratings .ratings-container:before {
+  content: "\f4c1\f4c1\f4c1\f4c1\f4c1\f4c1\f4c1\f4c1\f4c1\f4c1\f4c1\f4c1\f4c1\f4c1";
+  font-family: wavicon;
+  top: 0;
+  left: 0;
+  white-space: nowrap;
+  overflow: hidden;
+  opacity: var(--wm-rating-icon-opacity-inactive);
+}
+.wm-app .app-ratings .ratings-container .ratings.active {
+  color: var(--wm-rating-icon-color-active);
+  position: absolute;
+  top: 0;
+  overflow: hidden;
+}
+.wm-app .app-ratings .ratings-container .ratings.active:before {
+  content: "\f4c3\f4c3\f4c3\f4c3\f4c3\f4c3\f4c3\f4c3\f4c3\f4c3\f4c3\f4c3\f4c3\f4c3";
+  font-family: wavicon;
+  top: 0;
+  left: 0;
+  white-space: nowrap;
+  overflow: hidden;
+  opacity: var(--wm-rating-icon-opacity-active);
+}
+.wm-app .app-ratings[readonly="true"] {
+  opacity: var(--wm-rating-icon-opacity-readonly);
+}
 .wm-app .app-textarea {
   position: relative;
 }
+.wm-app .toast-container {
+  position: fixed;
+  z-index: 999999;
+  pointer-events: auto;
+  max-height: 80%;
+  overflow: unset;
+}
+.wm-app .toast-container .toast {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  gap: var(--wm-toast-container-gap);
+  flex-shrink: 0;
+  width: var(--wm-toast-container-width);
+  margin: auto;
+  padding: var(--wm-toast-container-padding);
+  border: var(--wm-toast-container-border-width) var(--wm-toast-container-border-style) var(--wm-toast-container-border-color);
+  border-radius: var(--wm-toast-container-border-radius);
+  background: var(--wm-toast-container-background);
+  color: var(--wm-toast-container-color);
+  box-shadow: var(--wm-toast-container-shadow);
+  cursor: pointer;
+}
+.wm-app .toast-container .toast:before {
+  position: absolute;
+  content: var(--wm-toast-icon);
+  font-family: wavicon;
+  top: 14px;
+  left: 12px;
+  font-size: var(--wm-icon-size-md);
+  min-width: var(--wm-icon-size-md);
+  height: var(--wm-icon-size-md);
+}
+.wm-app .toast-container .toast .toast-message {
+  font-family: var(--wm-toast-font-famil);
+  font-size: var(--wm-toast-font-size);
+  font-weight: var(--wm-toast-font-weight);
+  line-height: var(--wm-toast-line-height);
+  letter-spacing: var(--wm-toast-letter-spacing);
+  word-wrap: break-word;
+}
+.wm-app .toast-container .toast.toast-success {
+  --wm-toast-container-color: var(--wm-toast-container-success-color);
+  --wm-toast-container-background: var(--wm-toast-container-success-background);
+  --wm-toast-container-border-color: var(--wm-toast-container-success-border-color);
+  --wm-toast-icon: var(--wm-toast-success-icon);
+}
+.wm-app .toast-container .toast.toast-info {
+  --wm-toast-container-color: var(--wm-toast-container-info-color);
+  --wm-toast-container-background: var(--wm-toast-container-info-background);
+  --wm-toast-container-border-color: var(--wm-toast-container-info-border-color);
+  --wm-toast-icon: var(--wm-toast-info-icon);
+}
+.wm-app .toast-container .toast.toast-warning {
+  --wm-toast-container-color: var(--wm-toast-container-warning-color);
+  --wm-toast-container-background: var(--wm-toast-container-warning-background);
+  --wm-toast-container-border-color: var(--wm-toast-container-warning-border-color);
+  --wm-toast-icon: var(--wm-toast-warning-icon);
+}
+.wm-app .toast-container .toast.toast-error {
+  --wm-toast-container-color: var(--wm-toast-container-error-color);
+  --wm-toast-container-background: var(--wm-toast-container-error-background);
+  --wm-toast-container-border-color: var(--wm-toast-container-error-border-color);
+  --wm-toast-icon: var(--wm-toast-error-icon);
+}
+.wm-app .toast-top-left {
+  top: var(--wm-toast-position-top);
+  left: var(--wm-toast-position-left);
+}
+.wm-app .toast-top-center {
+  top: var(--wm-toast-position-top);
+}
+.wm-app .toast-top-right {
+  top: var(--wm-toast-position-top);
+  right: var(--wm-toast-position-right);
+}
+.wm-app .toast-center-left {
+  left: var(--wm-toast-position-left);
+  top: 50%;
+  margin-top: -30px;
+}
+.wm-app .toast-center-center {
+  left: 50%;
+  top: 50%;
+  margin-top: -30px;
+  margin-left: -150px;
+}
+.wm-app .toast-center-right {
+  right: var(--wm-toast-position-right);
+  top: 50%;
+  margin-top: -30px;
+}
+.wm-app .toast-bottom-left {
+  bottom: var(--wm-toast-position-bottom);
+  left: var(--wm-toast-position-left);
+}
+.wm-app .toast-bottom-center {
+  bottom: var(--wm-toast-position-bottom);
+}
+.wm-app .toast-bottom-right {
+  right: var(--wm-toast-position-right);
+  bottom: var(--wm-toast-position-bottom);
+}
+.wm-app .toast-bottom-center,
+.wm-app .toast-center,
+.wm-app .toast-top-center {
+  width: auto;
+  margin: 0 calc(50% - calc(var(--wm-toast-container-width)/2));
+}
 .wm-app .app-video {
   position: relative;
   height: 150px;
@@ -25042,7 +25046,8 @@ ex: color-mix(in srgb, color1 50%, color2 30%)
   z-index: 3 !important;
 }
 .wm-app [hidden],
-.wm-app [hidden="true"] {
+.wm-app [hidden="true"],
+.wm-app .hidden {
   display: none !important;
 }
 .wm-app .pointer {