amis 2.0.0-rc.10 → 2.0.0-rc.16

package/lib/themes/default.css

@@ -1467,7 +1467,6 @@ button::-moz-focus-inner {
   -webkit-touch-callout: none;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
 .tox .tox-collection__item {
@@ -1478,7 +1477,6 @@ button::-moz-focus-inner {
   -webkit-touch-callout: none;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
 .tox .tox-collection--list .tox-collection__item {
@@ -1641,8 +1639,7 @@ button::-moz-focus-inner {
   margin-top: auto;
 }
 .tox .tox-collection__item-container--column {
-  -ms-grid-row-align: center;
-      align-self: center;
+  align-self: center;
   flex: 1 1 auto;
   flex-direction: column;
 }
@@ -1656,8 +1653,7 @@ button::-moz-focus-inner {
   align-self: flex-start;
 }
 .tox .tox-collection__item-container--column.tox-collection__item-container--valign-middle {
-  -ms-grid-row-align: center;
-      align-self: center;
+  align-self: center;
 }
 .tox .tox-collection__item-container--column.tox-collection__item-container--valign-bottom {
   align-self: flex-end;
@@ -2864,8 +2860,7 @@ body.tox-dialog__disable-scroll {
   height: 100%;
   margin: 0;
   overflow: hidden;
-  -ms-scroll-chaining: none;
-      overscroll-behavior: none;
+  overscroll-behavior: none;
   padding: 0;
   touch-action: pinch-zoom;
   width: 100%;
@@ -3137,12 +3132,10 @@ body.tox-dialog__disable-scroll {
   border-width: 1px;
   box-shadow: none;
   box-sizing: border-box;
-  display: -ms-grid;
   display: grid;
   font-size: 14px;
   font-weight: normal;
-  -ms-grid-columns: minmax(40px, 1fr) auto minmax(40px, 1fr);
-      grid-template-columns: minmax(40px, 1fr) auto minmax(40px, 1fr);
+  grid-template-columns: minmax(40px, 1fr) auto minmax(40px, 1fr);
   margin-top: 4px;
   opacity: 0;
   padding: 4px;
@@ -3220,18 +3213,15 @@ body.tox-dialog__disable-scroll {
   fill: #222f3e;
 }
 .tox .tox-notification__body {
-  -ms-grid-row-align: center;
-      align-self: center;
+  align-self: center;
   color: #222f3e;
   font-size: 14px;
   -ms-grid-column-span: 1;
   grid-column-end: 3;
-  -ms-grid-column: 2;
-      grid-column-start: 2;
+  grid-column-start: 2;
   -ms-grid-row-span: 1;
   grid-row-end: 2;
-  -ms-grid-row: 1;
-      grid-row-start: 1;
+  grid-row-start: 1;
   text-align: center;
   white-space: normal;
   word-break: break-all;
@@ -3244,47 +3234,36 @@ body.tox-dialog__disable-scroll {
   margin-top: 1rem;
 }
 .tox .tox-notification__icon {
-  -ms-grid-row-align: center;
-      align-self: center;
+  align-self: center;
   -ms-grid-column-span: 1;
   grid-column-end: 2;
-  -ms-grid-column: 1;
-      grid-column-start: 1;
+  grid-column-start: 1;
   -ms-grid-row-span: 1;
   grid-row-end: 2;
-  -ms-grid-row: 1;
-      grid-row-start: 1;
-  -ms-grid-column-align: end;
-      justify-self: end;
+  grid-row-start: 1;
+  justify-self: end;
 }
 .tox .tox-notification__icon svg {
   display: block;
 }
 .tox .tox-notification__dismiss {
-  -ms-grid-row-align: start;
-      align-self: start;
+  align-self: start;
   -ms-grid-column-span: 1;
   grid-column-end: 4;
-  -ms-grid-column: 3;
-      grid-column-start: 3;
+  grid-column-start: 3;
   -ms-grid-row-span: 1;
   grid-row-end: 2;
-  -ms-grid-row: 1;
-      grid-row-start: 1;
-  -ms-grid-column-align: end;
-      justify-self: end;
+  grid-row-start: 1;
+  justify-self: end;
 }
 .tox .tox-notification .tox-progress-bar {
   -ms-grid-column-span: 3;
   grid-column-end: 4;
-  -ms-grid-column: 1;
-      grid-column-start: 1;
+  grid-column-start: 1;
   -ms-grid-row-span: 1;
   grid-row-end: 3;
-  -ms-grid-row: 2;
-      grid-row-start: 2;
-  -ms-grid-column-align: center;
-      justify-self: center;
+  grid-row-start: 2;
+  justify-self: center;
 }
 .tox .tox-pop {
   display: inline-block;
@@ -3736,8 +3715,7 @@ body.tox-dialog__disable-scroll {
   width: 68px;
 }
 .tox .tox-tbtn--return {
-  -ms-grid-row-align: stretch;
-      align-self: stretch;
+  align-self: stretch;
   height: unset;
   width: 16px;
 }
@@ -4150,7 +4128,6 @@ body.tox-dialog__disable-scroll {
   font-family: serif, Times, "Times New Roman";
   -webkit-user-select: none;
   -moz-user-select: none;
-  -ms-user-select: none;
   user-select: none;
 }
 .video-react:-moz-full-screen {
@@ -4908,7 +4885,6 @@ body.video-react-full-window .video-react-fullscreen {
   touch-action: none;
   -webkit-user-select: none;
   -moz-user-select: none;
-  -ms-user-select: none;
   user-select: none;
 }
 .cropper-container img {
@@ -5463,6 +5439,7 @@ body.video-react-full-window .video-react-fullscreen {
   --Button-onDisabled-bg: #f2f3f3;
   --Button-onFocus-boxShadow: none;
   --Button-paddingX: 0.75rem;
+  --Button-icon-rightMargin: 0.25rem;
   --Button-paddingX-right: 0.625rem;
   --Button-paddingY: calc(
     (
@@ -6325,8 +6302,27 @@ body.video-react-full-window .video-react-fullscreen {
   --Switch-onDisabled-bgColor: #ccc;
   --Switch-onDisabled-circle-BackgroundColor: var(--white);
   --Switch-onDisabled-color: #fff;
+  --Switch-onHover-bgColor: var(--Switch-bgColor);
   --Switch-valueColor: var(--white);
   --Switch-width: 3.125rem;
+  --Switch-slider-margin: 0.0625rem;
+  --Switch-slider-width: calc(
+    var(--Switch-height) - var(--Switch-slider-margin) * 2
+  );
+  --Switch-slider-transition: margin-left var(--animation-duration);
+  --Switch-text-marginRight: 0.5rem;
+  --Switch-text-marginLeft: 1.5625rem;
+  --Switch-width--sm: 1.75rem;
+  --Switch-height--sm: 1rem;
+  --Switch-slider-width--sm: calc(
+    var(--Switch-height--sm) - var(--Switch-slider-margin) * 2
+  );
+  --Switch-text-marginRight--sm: calc(
+    var(--Switch-slider-margin) * 2 + var(--Switch-text-marginRight) / 2
+  );
+  --Switch-text-marginLeft--sm: calc(
+    var(--Switch-slider-margin) * 2 + var(--Switch-text-marginLeft) / 2
+  );
   --Table--unsaved-heading-bg: #e8f0fe;
   --Table--unsaved-heading-color: #4285f4;
   --Table-bg: var(--background);
@@ -6843,8 +6839,8 @@ body.video-react-full-window .video-react-fullscreen {
   --Number-handler--up-content: "";
   --Number-handler--up-transform: rotate(180deg);
   --Number-handler--down-content: "";
-  --Checkbox-onDisabled-bg: #F7F7F9;
-  --Checkbox-onDisabled-color: #B8BABF;
+  --Checkbox-onDisabled-bg: #f7f7f9;
+  --Checkbox-onDisabled-color: #b8babf;
   --Checkbox-inner-size: 0.5rem;
   --Checkbox--full-inner-size: 0.5rem;
   --Checkbox--sm-size: 0.875rem;
@@ -6856,13 +6852,18 @@ body.video-react-full-window .video-react-fullscreen {
   --Switch-width: 2.75rem;
   --Switch-valueColor: #ffffff;
   --Switch-bgColor: #d4d6d9;
-  --Switch-onActive-bgColor: #b8babf;
+  --Switch-onActive-bgColor: var(--primary);
   --Switch-onHover-bgColor: #b8babf;
-  --Switch-checked-bgColor: var(--primary);
   --Switch-checked-onHover-bgColor: #144bcc;
   --Switch-checked-onActive-bgColor: #144bcc;
   --Switch-onDisabled-bgColor: #d4e5ff;
   --Switch-onDisabled-color: #ffffff;
+  --Switch-slider-margin: 0.125rem;
+  --Switch-slider-width: calc(
+    var(--Switch-height) - var(--Switch-slider-margin) * 2
+  );
+  --Switch-slider-transition: all 0.5s ease;
+  --Switch-text-margin: 0 px2rem(8px) 0 px2rem(25px);
   --Calendar-icon-bottom: -0.25rem;
   --Calendar-icon-width: 0.625rem;
   --Calendar-icon-height: 0.625rem;
@@ -6916,6 +6917,7 @@ body.video-react-full-window .video-react-fullscreen {
   --Button-onActive-boxShadow: none;
   --Button-borderRadius: 0.25rem;
   --Button-paddingX: 0.75rem;
+  --Button-icon-rightMargin: 0.25rem;
   --Button--lg-height: 2.5rem;
   --Button--lg-fontSize: 0.875rem;
   --Button--lg-lineHeight: 30 / 20;
@@ -7343,7 +7345,6 @@ body.video-react-full-window .video-react-fullscreen {
   /* Konqueror */
   -moz-user-select: none;
   /* Firefox */
-  -ms-user-select: none;
   /* Internet Explorer/Edge */
   user-select: none;
 }
@@ -7420,7 +7421,6 @@ td.rdtQuarter:hover {
   /* Konqueror */
   -moz-user-select: none;
   /* Firefox */
-  -ms-user-select: none;
   /* Internet Explorer/Edge */
   user-select: none;
 }
@@ -8804,7 +8804,6 @@ body {
   text-decoration: none;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
 .cxd-AsideNav-item a:hover {
@@ -9104,7 +9103,6 @@ img.cxd-AsideNav-itemIcon {
   vertical-align: middle;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   background: transparent;
   border: var(--Button-borderWidth) solid transparent;
@@ -9327,7 +9325,7 @@ img.cxd-AsideNav-itemIcon {
 .cxd-Button--xs .cxd-Button-icon:first-child:not(:last-child):not(.pull-right),
 .cxd-Button--xs > svg.icon:not(:last-child):not(.pull-right),
 .cxd-Button--xs > .pull-left {
-  margin-right: var(--Button--xs-paddingX);
+  margin-right: var(--Button-icon-rightMargin);
 }
 .cxd-Button--xs .cxd-Button-icon:last-child:not(:first-child):not(.pull-left),
 .cxd-Button--xs > .pull-right {
@@ -9336,7 +9334,7 @@ img.cxd-AsideNav-itemIcon {
 .cxd-Button--xs .cxd-Button--loading:first-child:not(:last-child):not(.pull-right),
 .cxd-Button--xs > svg.icon:not(:last-child):not(.pull-right),
 .cxd-Button--xs > .pull-left {
-  margin-right: var(--Button--xs-paddingX);
+  margin-right: var(--Button-icon-rightMargin);
 }
 .cxd-Button--xs .cxd-Button--loading:last-child:not(:first-child):not(.pull-left),
 .cxd-Button--xs > .pull-right {
@@ -9359,7 +9357,7 @@ img.cxd-AsideNav-itemIcon {
 .cxd-Button--sm .cxd-Button-icon:first-child:not(:last-child):not(.pull-right),
 .cxd-Button--sm > svg.icon:not(:last-child):not(.pull-right),
 .cxd-Button--sm > .pull-left {
-  margin-right: var(--Button--sm-paddingX);
+  margin-right: var(--Button-icon-rightMargin);
 }
 .cxd-Button--sm .cxd-Button-icon:last-child:not(:first-child):not(.pull-left),
 .cxd-Button--sm > .pull-right {
@@ -9368,7 +9366,7 @@ img.cxd-AsideNav-itemIcon {
 .cxd-Button--sm .cxd-Button--loading:first-child:not(:last-child):not(.pull-right),
 .cxd-Button--sm > svg.icon:not(:last-child):not(.pull-right),
 .cxd-Button--sm > .pull-left {
-  margin-right: var(--Button--sm-paddingX);
+  margin-right: var(--Button-icon-rightMargin);
 }
 .cxd-Button--sm .cxd-Button--loading:last-child:not(:first-child):not(.pull-left),
 .cxd-Button--sm > .pull-right {
@@ -9391,7 +9389,7 @@ img.cxd-AsideNav-itemIcon {
 .cxd-Button--md .cxd-Button-icon:first-child:not(:last-child):not(.pull-right),
 .cxd-Button--md > svg.icon:not(:last-child):not(.pull-right),
 .cxd-Button--md > .pull-left {
-  margin-right: var(--Button--md-paddingX);
+  margin-right: var(--Button-icon-rightMargin);
 }
 .cxd-Button--md .cxd-Button-icon:last-child:not(:first-child):not(.pull-left),
 .cxd-Button--md > .pull-right {
@@ -9400,7 +9398,7 @@ img.cxd-AsideNav-itemIcon {
 .cxd-Button--md .cxd-Button--loading:first-child:not(:last-child):not(.pull-right),
 .cxd-Button--md > svg.icon:not(:last-child):not(.pull-right),
 .cxd-Button--md > .pull-left {
-  margin-right: var(--Button--md-paddingX);
+  margin-right: var(--Button-icon-rightMargin);
 }
 .cxd-Button--md .cxd-Button--loading:last-child:not(:first-child):not(.pull-left),
 .cxd-Button--md > .pull-right {
@@ -9423,7 +9421,7 @@ img.cxd-AsideNav-itemIcon {
 .cxd-Button--lg .cxd-Button-icon:first-child:not(:last-child):not(.pull-right),
 .cxd-Button--lg > svg.icon:not(:last-child):not(.pull-right),
 .cxd-Button--lg > .pull-left {
-  margin-right: var(--Button--lg-paddingX);
+  margin-right: var(--Button-icon-rightMargin);
 }
 .cxd-Button--lg .cxd-Button-icon:last-child:not(:first-child):not(.pull-left),
 .cxd-Button--lg > .pull-right {
@@ -9432,7 +9430,7 @@ img.cxd-AsideNav-itemIcon {
 .cxd-Button--lg .cxd-Button--loading:first-child:not(:last-child):not(.pull-right),
 .cxd-Button--lg > svg.icon:not(:last-child):not(.pull-right),
 .cxd-Button--lg > .pull-left {
-  margin-right: var(--Button--lg-paddingX);
+  margin-right: var(--Button-icon-rightMargin);
 }
 .cxd-Button--lg .cxd-Button--loading:last-child:not(:first-child):not(.pull-left),
 .cxd-Button--lg > .pull-right {
@@ -9471,7 +9469,7 @@ img.cxd-AsideNav-itemIcon {
 .cxd-Button .cxd-Button-icon:first-child:not(:last-child):not(.pull-right),
 .cxd-Button > svg.icon:not(:last-child):not(.pull-right),
 .cxd-Button > .pull-left {
-  margin-right: var(--Button-paddingX);
+  margin-right: var(--Button-icon-rightMargin);
 }
 .cxd-Button .cxd-Button-icon:last-child:not(:first-child):not(.pull-left),
 .cxd-Button > .pull-right {
@@ -9480,7 +9478,7 @@ img.cxd-AsideNav-itemIcon {
 .cxd-Button .cxd-Button--loading:first-child:not(:last-child):not(.pull-right),
 .cxd-Button > svg.icon:not(:last-child):not(.pull-right),
 .cxd-Button > .pull-left {
-  margin-right: var(--Button-paddingX);
+  margin-right: var(--Button-icon-rightMargin);
 }
 .cxd-Button .cxd-Button--loading:last-child:not(:first-child):not(.pull-left),
 .cxd-Button > .pull-right {
@@ -9520,6 +9518,7 @@ img.cxd-AsideNav-itemIcon {
           text-decoration: var(--link-decoration);
   border: none;
   height: auto;
+  padding: 0;
 }
 .cxd-Button--link:hover:focus {
   color: var(--Button--link-onHover-color);
@@ -9684,7 +9683,6 @@ input[type=button].cxd-Button--block {
 .cxd-Breadcrumb-separator {
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   margin: 0 var(--gap-sm);
   text-align: center;
@@ -9714,7 +9712,6 @@ input[type=button].cxd-Button--block {
   vertical-align: middle;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   color: var(--BreadcrumbDropdown-item-default-color);
   background-color: var(--BreadcrumbDropdown-item-default-bg);
@@ -10216,7 +10213,6 @@ input[type=button].cxd-Button--block {
   text-align: center;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
 @media (min-width: 576px) {
@@ -10317,8 +10313,7 @@ input[type=button].cxd-Button--block {
   left: -0.375rem;
   top: 50%;
   cursor: ew-resize;
-  -ms-writing-mode: tb-lr;
-      writing-mode: vertical-lr;
+  writing-mode: vertical-lr;
   width: 0.75rem;
   height: 1.5rem;
 }
@@ -10367,8 +10362,7 @@ input[type=button].cxd-Button--block {
   right: -0.375rem;
   top: 50%;
   cursor: ew-resize;
-  -ms-writing-mode: tb-lr;
-      writing-mode: vertical-lr;
+  writing-mode: vertical-lr;
   width: 0.75rem;
   height: 1.5rem;
 }
@@ -10867,7 +10861,6 @@ input[type=button].cxd-Button--block {
   background-color: var(--PickerColumns-bg);
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   flex: 1;
   overflow: hidden;
@@ -11371,7 +11364,7 @@ input[type=button].cxd-Button--block {
 .cxd-ArrayInput-addBtn .cxd-Button-icon:first-child:not(:last-child):not(.pull-right),
 .cxd-ArrayInput-addBtn > svg.icon:not(:last-child):not(.pull-right),
 .cxd-ArrayInput-addBtn > .pull-left {
-  margin-right: var(--Combo-addBtn-paddingX);
+  margin-right: var(--Button-icon-rightMargin);
 }
 .cxd-ArrayInput-addBtn .cxd-Button-icon:last-child:not(:first-child):not(.pull-left),
 .cxd-ArrayInput-addBtn > .pull-right {
@@ -11380,7 +11373,7 @@ input[type=button].cxd-Button--block {
 .cxd-ArrayInput-addBtn .cxd-Button--loading:first-child:not(:last-child):not(.pull-right),
 .cxd-ArrayInput-addBtn > svg.icon:not(:last-child):not(.pull-right),
 .cxd-ArrayInput-addBtn > .pull-left {
-  margin-right: var(--Combo-addBtn-paddingX);
+  margin-right: var(--Button-icon-rightMargin);
 }
 .cxd-ArrayInput-addBtn .cxd-Button--loading:last-child:not(:first-child):not(.pull-left),
 .cxd-ArrayInput-addBtn > .pull-right {
@@ -11555,7 +11548,6 @@ input[type=button].cxd-Button--block {
   list-style: none;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
 .cxd-Tabs-links::before, .cxd-Tabs-links::after {
@@ -12263,7 +12255,6 @@ input[type=button].cxd-Button--block {
   list-style: none;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   margin: 0;
   padding: 0;
@@ -12302,7 +12293,6 @@ input[type=button].cxd-Button--block {
   white-space: nowrap;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
 .cxd-Nav .cxd-Nav-list--tabs {
@@ -12602,8 +12592,7 @@ input[type=button].cxd-Button--block {
   right: -0.375rem;
   top: 50%;
   cursor: ew-resize;
-  -ms-writing-mode: tb-lr;
-      writing-mode: vertical-lr;
+  writing-mode: vertical-lr;
   width: 0.75rem;
   height: 1.5rem;
   margin-top: -0.75rem;
@@ -12615,7 +12604,6 @@ input[type=button].cxd-Button--block {
   text-align: center;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   color: #666;
 }
@@ -12654,7 +12642,8 @@ input[type=button].cxd-Button--block {
     flex-direction: row;
     align-items: stretch;
   }
-  .cxd-Page--withSidebar > .cxd-Page-content {
+  .cxd-Page--withSidebar > .cxd-Page-content,
+.cxd-Page--withSidebar .cxd-PullRefresh {
     width: 0;
     flex-grow: 1;
   }
@@ -12686,7 +12675,6 @@ input[type=button].cxd-Button--block {
   font-size: var(--fontSizeSm);
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
 .cxd-Remark-icon > svg {
@@ -13412,7 +13400,6 @@ input[type=button].cxd-Button--block {
   border: none;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
 .cxd-DropDown-menu-root {
@@ -13441,7 +13428,6 @@ input[type=button].cxd-Button--block {
   vertical-align: middle;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   color: var(--DropDown-menuItem-color);
   -webkit-text-decoration: var(--link-decoration);
@@ -13911,7 +13897,6 @@ input[type=button].cxd-Button--block {
   cursor: not-allowed;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   color: var(--text--muted-color);
 }
@@ -14224,7 +14209,6 @@ input[type=button].cxd-Button--block {
   border-radius: 5px;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
 .cxd-CBSeprator {
@@ -14233,9 +14217,17 @@ input[type=button].cxd-Button--block {
   display: inline-block;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
+.cxd-CBPicker-trigger {
+  cursor: pointer;
+  transition: transform var(--animation-duration) ease-out;
+  display: flex;
+  color: var(--Form-select-caret-iconColor);
+}
+.cxd-CBPicker-trigger:hover {
+  color: var(--primary);
+}
 @-webkit-keyframes contextMenuInSpecial {
   from {
     transform: scale3d(1, 1, 1);
@@ -14651,7 +14643,6 @@ input[type=button].cxd-Button--block {
   vertical-align: middle;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   line-height: calc( var(--Form-input-lineHeight) * var(--Form-input-fontSize) - 0.125rem );
   display: inline-block;
@@ -14686,14 +14677,12 @@ input[type=button].cxd-Button--block {
   cursor: pointer;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   margin-left: var(--gap-xs);
   margin-top: var(--gap-xs);
   vertical-align: middle;
 }
 .cxd-Crud-toolbar-item {
-  margin-left: var(--Crud-toolbar-gap);
   margin-top: var(--Crud-toolbar-gap);
   line-height: var(--Crud-toolbar-lineHeight);
   height: var(--Crud-toolbar-height);
@@ -14701,6 +14690,9 @@ input[type=button].cxd-Button--block {
   display: inline-flex;
   align-items: center;
 }
+.cxd-Crud-toolbar-item:not(:first-child) {
+  margin-left: var(--Crud-toolbar-gap);
+}
 .cxd-Crud-toolbar-item--left {
   float: left;
 }
@@ -14732,7 +14724,6 @@ input[type=button].cxd-Button--block {
 }
 @media (min-width: 576px) {
   .cxd-Crud-toolbar {
-    margin-left: calc(var(--Crud-toolbar-gap) * -1);
     margin-top: calc(var(--Crud-toolbar-gap) * -1);
     flex-basis: 0;
     flex-grow: 1;
@@ -14745,11 +14736,135 @@ input[type=button].cxd-Button--block {
     clear: both;
   }
   .cxd-Crud-toolbar-item {
+    line-height: var(--Crud-toolbar-lineHeight);
+    height: var(--Crud-toolbar-height);
+    vertical-align: middle;
+  }
+  .cxd-Crud-toolbar-item:not(:first-child) {
     margin-left: var(--Crud-toolbar-gap);
+  }
+  .cxd-Crud-toolbar-item--left {
+    float: left;
+  }
+  .cxd-Crud-toolbar-item--right {
+    float: right;
+  }
+  .cxd-Crud-actions > * + .cxd-Button,
+.cxd-Crud-actions > * + .cxd-Button--disabled-wrap {
+    margin-left: var(--Crud-toolbar-gap);
+  }
+}
+.cxd-Crud2 {
+  position: relative;
+}
+.cxd-Crud2-selection, .cxd-Crud2-toolbar, .cxd-Crud2-body {
+  margin-bottom: var(--gap-base);
+}
+.cxd-Crud2-selectionLabel {
+  display: inline-block;
+  vertical-align: top;
+  margin-top: var(--gap-xs);
+}
+.cxd-Crud2-value {
+  cursor: pointer;
+  vertical-align: middle;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+  line-height: calc( var(--Form-input-lineHeight) * var(--Form-input-fontSize) - 0.125rem );
+  display: inline-block;
+  font-size: var(--Form-selectValue-fontSize);
+  color: var(--Form-selectValue-color);
+  background: var(--Form-selectValue-bg);
+  border: 0.0625rem solid var(--Form-selectValue-borderColor);
+  border-radius: 2px;
+  margin-right: var(--gap-xs);
+  margin-top: var(--gap-xs);
+}
+.cxd-Crud2-value:hover {
+  background: var(--Form-selectValue-onHover-bg);
+}
+.cxd-Crud2-value.is-disabled {
+  pointer-events: none;
+  opacity: var(--Button-onDisabled-opacity);
+}
+.cxd-Crud2-valueIcon {
+  cursor: pointer;
+  border-right: 0.0625rem solid var(--Form-selectValue-borderColor);
+  padding: 1px 5px;
+}
+.cxd-Crud2-valueIcon:hover {
+  background: var(--Form-selectValue-onHover-bg);
+}
+.cxd-Crud2-valueLabel {
+  padding: 0 var(--gap-xs);
+}
+.cxd-Crud2-selectionClear {
+  display: inline-block;
+  cursor: pointer;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+  margin-left: var(--gap-xs);
+  margin-top: var(--gap-xs);
+  vertical-align: middle;
+}
+.cxd-Crud2-toolbar-item {
+  margin-top: var(--Crud-toolbar-gap);
+  line-height: var(--Crud-toolbar-lineHeight);
+  height: var(--Crud-toolbar-height);
+  vertical-align: middle;
+  display: inline-flex;
+  align-items: center;
+}
+.cxd-Crud2-toolbar-item:not(:first-child) {
+  margin-left: var(--Crud-toolbar-gap);
+}
+.cxd-Crud2-toolbar-item--left {
+  float: left;
+}
+.cxd-Crud2-toolbar-item--right {
+  float: right;
+}
+.cxd-Crud2-actions > * + .cxd-Button,
+.cxd-Crud2-actions > * + .cxd-ButtonGroup,
+.cxd-Crud2-actions > * + .cxd-ButtonToolbar {
+  margin-left: var(--Crud-toolbar-gap);
+}
+.cxd-Crud2-statistics {
+  line-height: var(--Crud-toolbar-height);
+  vertical-align: middle;
+}
+.cxd-Crud2-pageSwitch .cxd-Select {
+  margin-left: var(--Crud-toolbar-gap);
+}
+.cxd-Crud2-pager {
+  align-self: flex-start;
+}
+.cxd-Crud2-filter {
+  margin-bottom: var(--gap-base);
+}
+@media (min-width: 576px) {
+  .cxd-Crud-toolbar {
+    margin-top: calc(var(--Crud-toolbar-gap) * -1);
+    flex-basis: 0;
+    flex-grow: 1;
+  }
+  .cxd-Crud-toolbar::before, .cxd-Crud-toolbar::after {
+    display: table;
+    content: "";
+  }
+  .cxd-Crud-toolbar::after {
+    clear: both;
+  }
+  .cxd-Crud-toolbar-item {
     line-height: var(--Crud-toolbar-lineHeight);
     height: var(--Crud-toolbar-height);
     vertical-align: middle;
   }
+  .cxd-Crud-toolbar-item:not(:first-child) {
+    margin-left: var(--Crud-toolbar-gap);
+  }
   .cxd-Crud-toolbar-item--left {
     float: left;
   }
@@ -14922,7 +15037,6 @@ input[type=button].cxd-Button--block {
   cursor: col-resize;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   opacity: 0.5;
   z-index: 3000;
@@ -16035,7 +16149,6 @@ input[type=button].cxd-Button--block {
 .cxd-Table-v2 {
   position: relative;
   border-radius: var(--Table-borderRadius);
-  margin-bottom: var(--gap-md);
 }
 .cxd-Table-v2.cxd-Table-bordered {
   border-width: var(--Table-borderWidth) var(--Table-borderWidth) 0 var(--Table-borderWidth);
@@ -17028,7 +17141,7 @@ input[type=button].cxd-Button--block {
   border-right: none;
 }
 .cxd-Table-v2.cxd-Table-ping-left .cxd-Table-table > tbody > tr:not(.cxd-Table-row-disabled) > td.cxd-Table-cell-fix-left:not(.cxd-Table-cell-row-hover) {
-  background: #FFF;
+  background: #fff;
 }
 .cxd-Table-v2.cxd-Table-ping-left .cxd-Table-table > tfoot > tr > td:not(:last-child).cxd-Table-cell-fix-left-last {
   border-right: none;
@@ -17045,7 +17158,7 @@ input[type=button].cxd-Button--block {
   border-right: none;
 }
 .cxd-Table-v2.cxd-Table-ping-right .cxd-Table-table > tbody > tr:not(.cxd-Table-row-disabled) > td.cxd-Table-cell-fix-right:not(.cxd-Table-cell-row-hover) {
-  background: #FFF;
+  background: #fff;
 }
 .cxd-Table-v2.cxd-Table-ping-right:not(.cxd-Table-bordered) .cxd-Table-table > thead > tr > th.cxd-Table-cell-fix-right-first-prev {
   border-right: none;
@@ -17058,11 +17171,15 @@ input[type=button].cxd-Button--block {
 }
 .cxd-Table-v2.cxd-Table-resizable .cxd-Table-table > thead > tr > th .cxd-Table-thead-resizable {
   position: absolute;
-  width: 1px;
-  right: 0;
+  width: 7px;
+  right: -4px;
   top: 0;
   bottom: 0;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
   cursor: col-resize;
+  z-index: 3000;
 }
 .cxd-Table-v2 .cxd-Table-loading {
   padding: var(--Table-loading-padding);
@@ -17105,8 +17222,6 @@ input[type=button].cxd-Button--block {
 }
 .cxd-Table-v2 .cxd-TableCell-searchBtn {
   cursor: pointer;
-  position: static;
-  transform: translateY(-50%);
   color: var(--text--muted-color);
   margin-left: var(--TableCell-icon-gap);
 }
@@ -17319,7 +17434,6 @@ input[type=button].cxd-Button--block {
   vertical-align: middle;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   color: var(--link-color);
   -webkit-text-decoration: var(--link-decoration);
@@ -17424,7 +17538,6 @@ input[type=button].cxd-Button--block {
   overflow: hidden;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
 .cxd-ColumnToggler-modal-content .cxd-ColumnToggler-menuItem label > i {
@@ -18506,7 +18619,6 @@ input[type=button].cxd-Button--block {
 .cxd-Pagination > li > span {
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   cursor: pointer;
   position: relative;
@@ -19010,7 +19122,6 @@ input[type=button].cxd-Button--block {
   align-items: center;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
 .cxd-ImageGallery-main > img {
@@ -19066,7 +19177,6 @@ input[type=button].cxd-Button--block {
   flex-direction: row;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
 .cxd-ImageGallery-prevList, .cxd-ImageGallery-nextList {
@@ -19328,7 +19438,7 @@ input[type=button].cxd-Button--block {
   justify-content: flex-start;
 }
 .cxd-InputBox input {
-  flex-basis: 5rem;
+  flex-basis: 1.875rem;
   flex-grow: 1;
   outline: none;
   background: transparent;
@@ -19342,16 +19452,10 @@ input[type=button].cxd-Button--block {
   -moz-user-select: none;
        user-select: none;
 }
-.cxd-InputBox input:-ms-input-placeholder {
-  color: var(--Form-input-placeholderColor);
-  -ms-user-select: none;
-      user-select: none;
-}
 .cxd-InputBox input::placeholder {
   color: var(--Form-input-placeholderColor);
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
 .cxd-InputBox:hover {
@@ -19655,7 +19759,7 @@ input[type=button].cxd-Button--block {
   font-size: var(--Form-input-fontSize);
   flex-wrap: wrap;
   justify-content: flex-start;
-  flex-wrap: wrap;
+  flex-wrap: nowrap;
   padding: 0 0.3125rem;
   min-height: var(--Form-input-height);
   align-items: center;
@@ -19663,7 +19767,7 @@ input[type=button].cxd-Button--block {
   position: relative;
 }
 .cxd-ResultBox input {
-  flex-basis: 5rem;
+  flex-basis: 1.875rem;
   flex-grow: 1;
   outline: none;
   background: transparent;
@@ -19677,16 +19781,10 @@ input[type=button].cxd-Button--block {
   -moz-user-select: none;
        user-select: none;
 }
-.cxd-ResultBox input:-ms-input-placeholder {
-  color: var(--Form-input-placeholderColor);
-  -ms-user-select: none;
-      user-select: none;
-}
 .cxd-ResultBox input::placeholder {
   color: var(--Form-input-placeholderColor);
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
 .cxd-ResultBox:hover {
@@ -19700,9 +19798,6 @@ input[type=button].cxd-Button--block {
 .cxd-ResultBox--borderNone {
   border-color: transparent !important;
 }
-.cxd-ResultBox.is-clearable {
-  padding-right: 3.4375rem;
-}
 .cxd-ResultBox.is-error {
   border-color: var(--Form-input-onError-borderColor);
   background: var(--Form-input-onError-bg);
@@ -19740,7 +19835,26 @@ input[type=button].cxd-Button--block {
 .cxd-ResultBox.cxd-NestedSelect {
   padding-left: var(--gap-base);
 }
+.cxd-ResultBox-value-wrap {
+  flex-grow: 1;
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+}
+.cxd-ResultBox-actions {
+  display: flex;
+  align-items: center;
+  flex-shrink: 0;
+}
+.cxd-ResultBox-actions > *:first-child {
+  margin-left: 0.3125rem;
+}
+.cxd-ResultBox-actions > *:not(:last-child) {
+  margin-right: 0.3125rem;
+}
 .cxd-ResultBox-singleValue {
+  padding: 0 calc(var(--Form-input-paddingX) - 0.1875rem);
+  flex-grow: 1;
   display: inline-block;
   max-width: 100%;
   overflow: hidden;
@@ -19774,10 +19888,7 @@ input[type=button].cxd-Button--block {
   margin-left: auto;
   text-decoration: none;
   height: 100%;
-  padding: 0.25rem;
   margin: auto 0;
-  position: absolute;
-  right: 10px;
   background-color: unset;
 }
 .cxd-ResultBox-clear svg {
@@ -19824,7 +19935,6 @@ input[type=button].cxd-Button--block {
   margin-bottom: var(--ResultBox-tag-marginBottom);
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   border-radius: 0.125rem;
 }
@@ -19855,9 +19965,9 @@ input[type=button].cxd-Button--block {
 }
 .cxd-ResultBox-placeholder {
   color: var(--Form-input-placeholderColor);
+  flex-grow: 1;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
 .cxd-ResultBox > input {
@@ -20039,16 +20149,10 @@ input[type=button].cxd-Button--block {
   -moz-user-select: none;
        user-select: none;
 }
-.cxd-SearchBox > input:-ms-input-placeholder {
-  color: var(--Form-input-placeholderColor);
-  -ms-user-select: none;
-      user-select: none;
-}
 .cxd-SearchBox > input::placeholder {
   color: var(--Form-input-placeholderColor);
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
 .cxd-SearchBox-clearable {
@@ -21079,7 +21183,7 @@ fieldset.cxd-Collapse--lg:after {
   justify-content: flex-start;
 }
 .cxd-TextControl-input input {
-  flex-basis: 5rem;
+  flex-basis: 1.875rem;
   flex-grow: 1;
   outline: none;
   background: transparent;
@@ -21093,16 +21197,10 @@ fieldset.cxd-Collapse--lg:after {
   -moz-user-select: none;
        user-select: none;
 }
-.cxd-TextControl-input input:-ms-input-placeholder {
-  color: var(--Form-input-placeholderColor);
-  -ms-user-select: none;
-      user-select: none;
-}
 .cxd-TextControl-input input::placeholder {
   color: var(--Form-input-placeholderColor);
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
 .cxd-TextControl-input:hover {
@@ -21174,7 +21272,6 @@ fieldset.cxd-Collapse--lg:after {
   color: var(--Form-input-placeholderColor);
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   position: absolute;
   left: var(--Form-input-paddingX);
@@ -21308,7 +21405,6 @@ fieldset.cxd-Collapse--lg:after {
 .cxd-TextControl-value {
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   line-height: calc( var(--Form-input-lineHeight) * var(--Form-input-fontSize) );
   vertical-align: middle;
@@ -21405,7 +21501,7 @@ input.cxd-TextControl-input-password {
   justify-content: flex-start;
 }
 .cxd-TextareaControl-input input {
-  flex-basis: 5rem;
+  flex-basis: 1.875rem;
   flex-grow: 1;
   outline: none;
   background: transparent;
@@ -21419,16 +21515,10 @@ input.cxd-TextControl-input-password {
   -moz-user-select: none;
        user-select: none;
 }
-.cxd-TextareaControl-input input:-ms-input-placeholder {
-  color: var(--Form-input-placeholderColor);
-  -ms-user-select: none;
-      user-select: none;
-}
 .cxd-TextareaControl-input input::placeholder {
   color: var(--Form-input-placeholderColor);
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
 .cxd-TextareaControl-input:hover {
@@ -21519,9 +21609,6 @@ input.cxd-TextControl-input-password {
 .cxd-TextareaControl > textarea::-moz-placeholder {
   color: var(--Form-input-placeholderColor);
 }
-.cxd-TextareaControl > textarea:-ms-input-placeholder {
-  color: var(--Form-input-placeholderColor);
-}
 .cxd-TextareaControl > textarea::placeholder {
   color: var(--Form-input-placeholderColor);
 }
@@ -21575,7 +21662,6 @@ input.cxd-TextControl-input-password {
   font-weight: var(--fontWeightNormal);
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   pointer-events: none;
 }
@@ -22006,7 +22092,6 @@ input.cxd-TextControl-input-password {
   overflow: auto;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   padding: var(--gap-xs) 0;
 }
@@ -22023,7 +22108,6 @@ input.cxd-TextControl-input-password {
   cursor: pointer;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
 .cxd-GroupedSelection-item > .cxd-Checkbox {
@@ -22124,7 +22208,6 @@ input.cxd-TextControl-input-password {
   cursor: pointer;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
 .cxd-TreeSelection-itemInner > .cxd-Checkbox {
@@ -22182,7 +22265,6 @@ input.cxd-TextControl-input-password {
   cursor: pointer;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
 .cxd-ChainedSelection-item > .cxd-Checkbox {
@@ -22281,16 +22363,10 @@ input.cxd-TextControl-input-password {
   -moz-user-select: none;
        user-select: none;
 }
-.cxd-CityPicker-input:-ms-input-placeholder {
-  color: var(--Form-input-placeholderColor);
-  -ms-user-select: none;
-      user-select: none;
-}
 .cxd-CityPicker-input::placeholder {
   color: var(--Form-input-placeholderColor);
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
 .cxd-CityPicker-input:focus {
@@ -22323,16 +22399,10 @@ input.cxd-TextControl-input-password {
   -moz-user-select: none;
        user-select: none;
 }
-.cxd-CityArea-Input:-ms-input-placeholder {
-  color: var(--Form-input-placeholderColor);
-  -ms-user-select: none;
-      user-select: none;
-}
 .cxd-CityArea-Input::placeholder {
   color: var(--Form-input-placeholderColor);
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
 .cxd-CityArea-Input:focus {
@@ -22359,12 +22429,13 @@ input.cxd-TextControl-input-password {
   opacity: 0.4;
 }
 .cxd-Switch .text {
-  margin: 0 0.4375rem 0 1.5625rem;
+  margin: 0 var(--Switch-text-marginRight) 0 var(--Switch-text-marginLeft);
   color: var(--Switch-valueColor);
   text-indent: var(--gap-xs);
   text-transform: uppercase;
   font-size: var(--fontSizeSm);
   line-height: var(--Switch-height);
+  vertical-align: super;
   font-style: normal;
   font-weight: bold;
   transition: all var(--animation-duration);
@@ -22378,24 +22449,27 @@ input.cxd-TextControl-input-password {
   content: "";
   position: absolute;
   background: var(--white);
-  width: calc(var(--Switch-height) - 0.125rem);
-  top: 0.0625rem;
-  bottom: 0.0625rem;
-  left: 0.0625rem;
+  width: var(--Switch-slider-width);
+  top: var(--Switch-slider-margin);
+  bottom: var(--Switch-slider-margin);
+  left: var(--Switch-slider-margin);
   border-radius: 50%;
-  transition: margin-left var(--animation-duration);
+  transition: var(--Switch-slider-transition);
+}
+.cxd-Switch:hover {
+  background: var(--Switch-onHover-bgColor);
 }
 .cxd-Switch.is-checked {
   background: var(--Switch-onActive-bgColor);
 }
 .cxd-Switch.is-checked .slider::before {
   left: auto;
-  right: 0.0625rem;
+  right: var(--Switch-slider-margin);
   border-width: 0;
 }
 .cxd-Switch.is-checked .text {
   color: var(--white);
-  margin: 0 1.5625rem 0 0.4375rem;
+  margin: 0 var(--Switch-text-marginLeft) 0 var(--Switch-text-marginRight);
 }
 .cxd-Switch.is-checked.is-disabled .slider:before {
   color: var(--Switch-onDisabled-color);
@@ -22407,6 +22481,26 @@ input.cxd-TextControl-input-password {
   position: absolute;
   opacity: 0;
 }
+.cxd-Switch--sm {
+  height: var(--Switch-height--sm);
+  min-width: var(--Switch-width--sm);
+}
+.cxd-Switch--sm .text {
+  line-height: var(--Switch-height--sm);
+  margin: 0 var(--Switch-text-marginRight--sm) 0 var(--Switch-text-marginLeft--sm);
+}
+.cxd-Switch--sm .text > svg {
+  margin-top: calc((var(--Switch-height--sm) - var(--fontSizeSm)) / 2);
+}
+.cxd-Switch--sm .slider::before {
+  width: var(--Switch-slider-width--sm);
+}
+.cxd-Switch--sm.is-checked .slider::before {
+  right: var(--Switch-slider-margin);
+}
+.cxd-Switch--sm.is-checked .text {
+  margin: 0 var(--Switch-text-marginLeft--sm) 0 var(--Switch-text-marginRight--sm);
+}
 .cxd-Switch-option {
   vertical-align: middle;
   margin-left: var(--Switch-gap);
@@ -22463,7 +22557,6 @@ input.cxd-TextControl-input-password {
 }
 .cxd-Number-handler-up-inner, .cxd-Number-handler-down-inner {
   -moz-user-select: none;
-   -ms-user-select: none;
        user-select: none;
   -webkit-user-select: none;
   display: inline-block;
@@ -22718,6 +22811,9 @@ input.cxd-TextControl-input-password {
 .cxd-Select:focus {
   box-shadow: var(--Form-select-onFocus-boxShadow);
 }
+.cxd-Select .cxd-PopOver.cxd-Select-popover .cxd-Select-menu {
+  overflow-x: hidden;
+}
 .cxd-Select .cxd-PopOver.cxd-Select-popover .cxd-Select-menu .cxd-Select-option {
   height: 2rem;
   line-height: 1.375rem;
@@ -22737,7 +22833,6 @@ input.cxd-TextControl-input-password {
 .cxd-Select-valueWrap {
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   position: relative;
   flex-grow: 1;
@@ -22755,7 +22850,6 @@ input.cxd-TextControl-input-password {
   line-height: var(--Form-input-lineHeight);
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   white-space: nowrap;
   color: var(--Form-select-placeholderColor);
@@ -22794,7 +22888,6 @@ input.cxd-TextControl-input-password {
   white-space: normal;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   line-height: calc( var(--Form-input-lineHeight) * var(--Form-input-fontSize) - 0.125rem );
   display: inline-block;
@@ -22877,7 +22970,6 @@ input.cxd-TextControl-input-password {
   overflow: auto;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
 .cxd-Select-menu .cxd-Checkbox--sm > i {
@@ -22966,7 +23058,6 @@ input.cxd-TextControl-input-password {
   font-size: var(--Form-select-input-fontSize);
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   padding: calc( ( var(--Form-select-menu-height) - var(--Form-input-lineHeight) * var(--Form-input-fontSize) ) / 2 ) var(--Form-select-paddingX);
 }
@@ -23028,7 +23119,6 @@ input.cxd-TextControl-input-password {
   white-space: normal;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   line-height: calc( var(--Form-input-lineHeight) * var(--Form-input-fontSize) - 0.125rem );
   display: inline-block;
@@ -23175,7 +23265,6 @@ input.cxd-TextControl-input-password {
   position: relative;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   font-size: var(--ListControl-fontSize);
   display: inline-block;
@@ -23302,7 +23391,6 @@ input.cxd-TextControl-input-password {
   color: var(--DatePicker-placeholderColor);
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   margin-right: var(--gap-base);
   flex-basis: 0;
@@ -23432,9 +23520,6 @@ input.cxd-TextControl-input-password {
 .cxd-ColorPicker-input::-moz-placeholder {
   color: var(--ColorPicker-placeholderColor);
 }
-.cxd-ColorPicker-input:-ms-input-placeholder {
-  color: var(--ColorPicker-placeholderColor);
-}
 .cxd-ColorPicker-input::placeholder {
   color: var(--ColorPicker-placeholderColor);
 }
@@ -23453,9 +23538,6 @@ input.cxd-TextControl-input-password {
 .cxd-ColorPicker.is-disabled > .cxd-ColorPicker-input::-moz-placeholder {
   color: var(--ColorPicker-onDisabled-color);
 }
-.cxd-ColorPicker.is-disabled > .cxd-ColorPicker-input:-ms-input-placeholder {
-  color: var(--ColorPicker-onDisabled-color);
-}
 .cxd-ColorPicker.is-disabled > .cxd-ColorPicker-input::placeholder {
   color: var(--ColorPicker-onDisabled-color);
 }
@@ -23589,7 +23671,6 @@ input.cxd-TextControl-input-password {
   color: var(--DatePicker-placeholderColor);
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   margin-right: var(--gap-base);
   min-width: 3.125rem;
@@ -23718,7 +23799,6 @@ input.cxd-TextControl-input-password {
 .rdt {
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   font-size: var(--Calendar-fontSize);
   color: var(--Calendar-color);
@@ -23949,7 +24029,6 @@ input.cxd-TextControl-input-password {
   text-align: center;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   cursor: pointer;
   text-decoration: none;
@@ -24178,7 +24257,6 @@ td.rdtQuarter.rdtDisabled:hover {
   color: var(--DatePicker-placeholderColor);
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   margin-right: var(--gap-base);
   flex-basis: 0;
@@ -25276,7 +25354,6 @@ td.rdtQuarter.rdtDisabled:hover {
   position: relative;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   margin-bottom: 0.25rem;
   padding-left: var(--Tree-icon-gap);
@@ -25358,16 +25435,10 @@ td.rdtQuarter.rdtDisabled:hover {
   -moz-user-select: none;
        user-select: none;
 }
-.cxd-Tree-itemInput > input:-ms-input-placeholder {
-  color: var(--Form-input-placeholderColor);
-  -ms-user-select: none;
-      user-select: none;
-}
 .cxd-Tree-itemInput > input::placeholder {
   color: var(--Form-input-placeholderColor);
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
 .cxd-Tree-itemInput > input:focus {
@@ -25494,7 +25565,7 @@ td.rdtQuarter.rdtDisabled:hover {
   justify-content: flex-start;
 }
 .cxd-TreeSelect-input input {
-  flex-basis: 5rem;
+  flex-basis: 1.875rem;
   flex-grow: 1;
   outline: none;
   background: transparent;
@@ -25508,16 +25579,10 @@ td.rdtQuarter.rdtDisabled:hover {
   -moz-user-select: none;
        user-select: none;
 }
-.cxd-TreeSelect-input input:-ms-input-placeholder {
-  color: var(--Form-input-placeholderColor);
-  -ms-user-select: none;
-      user-select: none;
-}
 .cxd-TreeSelect-input input::placeholder {
   color: var(--Form-input-placeholderColor);
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
 .cxd-TreeSelect-input:hover {
@@ -25645,7 +25710,7 @@ td.rdtQuarter.rdtDisabled:hover {
 .cxd-Combo-addBtn .cxd-Button-icon:first-child:not(:last-child):not(.pull-right),
 .cxd-Combo-addBtn > svg.icon:not(:last-child):not(.pull-right),
 .cxd-Combo-addBtn > .pull-left {
-  margin-right: var(--Combo-addBtn-paddingX);
+  margin-right: var(--Button-icon-rightMargin);
 }
 .cxd-Combo-addBtn .cxd-Button-icon:last-child:not(:first-child):not(.pull-left),
 .cxd-Combo-addBtn > .pull-right {
@@ -25654,7 +25719,7 @@ td.rdtQuarter.rdtDisabled:hover {
 .cxd-Combo-addBtn .cxd-Button--loading:first-child:not(:last-child):not(.pull-right),
 .cxd-Combo-addBtn > svg.icon:not(:last-child):not(.pull-right),
 .cxd-Combo-addBtn > .pull-left {
-  margin-right: var(--Combo-addBtn-paddingX);
+  margin-right: var(--Button-icon-rightMargin);
 }
 .cxd-Combo-addBtn .cxd-Button--loading:last-child:not(:first-child):not(.pull-left),
 .cxd-Combo-addBtn > .pull-right {
@@ -25899,7 +25964,6 @@ td.rdtQuarter.rdtDisabled:hover {
   margin: 2px 3px;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
 .cxd-SubForm-valueLabel {
@@ -25982,7 +26046,6 @@ td.rdtQuarter.rdtDisabled:hover {
   color: var(--Form-input-placeholderColor);
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   padding: 4px;
 }
@@ -26010,7 +26073,7 @@ td.rdtQuarter.rdtDisabled:hover {
   justify-content: flex-start;
 }
 .cxd-Picker-input input {
-  flex-basis: 5rem;
+  flex-basis: 1.875rem;
   flex-grow: 1;
   outline: none;
   background: transparent;
@@ -26024,16 +26087,10 @@ td.rdtQuarter.rdtDisabled:hover {
   -moz-user-select: none;
        user-select: none;
 }
-.cxd-Picker-input input:-ms-input-placeholder {
-  color: var(--Form-input-placeholderColor);
-  -ms-user-select: none;
-      user-select: none;
-}
 .cxd-Picker-input input::placeholder {
   color: var(--Form-input-placeholderColor);
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
 .cxd-Picker-input:hover {
@@ -26114,7 +26171,6 @@ td.rdtQuarter.rdtDisabled:hover {
   color: var(--Form-input-placeholderColor);
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   position: absolute;
   line-height: var(--Form-input-lineHeight);
@@ -26142,7 +26198,6 @@ td.rdtQuarter.rdtDisabled:hover {
   cursor: pointer;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   white-space: nowrap;
   vertical-align: middle;
@@ -26246,7 +26301,6 @@ td.rdtQuarter.rdtDisabled:hover {
   cursor: pointer;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   border: var(--TagControl-sugBtn-borderWidth) solid transparent;
   padding: var(--TagControl-sugBtn-paddingY) var(--TagControl-sugBtn-paddingX);
@@ -26263,7 +26317,7 @@ td.rdtQuarter.rdtDisabled:hover {
 .cxd-TagControl-sugItem .cxd-Button-icon:first-child:not(:last-child):not(.pull-right),
 .cxd-TagControl-sugItem > svg.icon:not(:last-child):not(.pull-right),
 .cxd-TagControl-sugItem > .pull-left {
-  margin-right: var(--TagControl-sugBtn-paddingX);
+  margin-right: var(--Button-icon-rightMargin);
 }
 .cxd-TagControl-sugItem .cxd-Button-icon:last-child:not(:first-child):not(.pull-left),
 .cxd-TagControl-sugItem > .pull-right {
@@ -26272,7 +26326,7 @@ td.rdtQuarter.rdtDisabled:hover {
 .cxd-TagControl-sugItem .cxd-Button--loading:first-child:not(:last-child):not(.pull-right),
 .cxd-TagControl-sugItem > svg.icon:not(:last-child):not(.pull-right),
 .cxd-TagControl-sugItem > .pull-left {
-  margin-right: var(--TagControl-sugBtn-paddingX);
+  margin-right: var(--Button-icon-rightMargin);
 }
 .cxd-TagControl-sugItem .cxd-Button--loading:last-child:not(:first-child):not(.pull-left),
 .cxd-TagControl-sugItem > .pull-right {
@@ -26332,7 +26386,6 @@ td.rdtQuarter.rdtDisabled:hover {
   cursor: pointer;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   color: var(--Rating-inactive-color);
 }
@@ -26482,7 +26535,6 @@ td.rdtQuarter.rdtDisabled:hover {
 .cxd-Transfer-checkAll, .cxd-Transfer-clearAll {
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   cursor: pointer;
 }
@@ -26666,7 +26718,6 @@ td.rdtQuarter.rdtDisabled:hover {
   font-size: var(--Form-select-input-fontSize);
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   padding: calc( ( var(--Form-select-menu-height) - var(--Form-input-lineHeight) * var(--Form-input-fontSize) ) / 2 ) var(--Form-select-paddingX);
 }
@@ -26763,7 +26814,6 @@ td.rdtQuarter.rdtDisabled:hover {
   cursor: pointer;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   padding: 0 0.375rem;
 }
@@ -26804,7 +26854,6 @@ td.rdtQuarter.rdtDisabled:hover {
   text-overflow: ellipsis;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
 .cxd-Cascader-option-selectedNum {
@@ -26851,7 +26900,7 @@ td.rdtQuarter.rdtDisabled:hover {
   justify-content: flex-start;
 }
 .cxd-IconPickerControl-input input {
-  flex-basis: 5rem;
+  flex-basis: 1.875rem;
   flex-grow: 1;
   outline: none;
   background: transparent;
@@ -26865,16 +26914,10 @@ td.rdtQuarter.rdtDisabled:hover {
   -moz-user-select: none;
        user-select: none;
 }
-.cxd-IconPickerControl-input input:-ms-input-placeholder {
-  color: var(--Form-input-placeholderColor);
-  -ms-user-select: none;
-      user-select: none;
-}
 .cxd-IconPickerControl-input input::placeholder {
   color: var(--Form-input-placeholderColor);
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
 .cxd-IconPickerControl-input:hover {
@@ -26946,7 +26989,6 @@ td.rdtQuarter.rdtDisabled:hover {
   color: var(--Form-input-placeholderColor);
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   line-height: var(--Form-input-lineHeight);
   position: absolute;
@@ -26999,7 +27041,6 @@ td.rdtQuarter.rdtDisabled:hover {
   font-size: var(--fontSizeSm);
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
 }
 .cxd-IconPickerControl-tab.active {
@@ -27029,7 +27070,6 @@ td.rdtQuarter.rdtDisabled:hover {
 .cxd-IconPickerControl-value {
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   line-height: calc( var(--Form-input-lineHeight) * var(--Form-input-fontSize) );
   vertical-align: middle;
@@ -27707,7 +27747,6 @@ td.rdtQuarter.rdtDisabled:hover {
   cursor: pointer;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   padding: 0 1rem;
   border-bottom: 0.0625rem solid var(--UserSelect--border-color);
@@ -27728,7 +27767,6 @@ td.rdtQuarter.rdtDisabled:hover {
   text-align: left;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   display: flex;
   align-items: center;
@@ -27994,7 +28032,6 @@ td.rdtQuarter.rdtDisabled:hover {
 .cxd-AnchorNav--horizontal .cxd-AnchorNav-link-wrap {
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   margin: 0px;
   padding: 0px;
@@ -28043,6 +28080,7 @@ td.rdtQuarter.rdtDisabled:hover {
   overflow: auto;
   scroll-behavior: smooth;
   background: var(--Tabs-content-bg);
+  position: relative;
 }
 .cxd-AnchorNav-section-wrap > .cxd-AnchorNav-section {
   display: block;
@@ -29180,34 +29218,13 @@ td.rdtQuarter.rdtDisabled:hover {
 .AMISDebug-inspect {
   padding: var(--gap-sm);
 }
-.cxd-Switch .text {
-  margin: 0 0.5rem 0 1.5625rem;
-  vertical-align: super;
-}
-.cxd-Switch .slider:before {
-  width: calc(var(--Switch-height) - 0.25rem);
-  top: 0.125rem;
-  bottom: 0.125rem;
-  left: 0.125rem;
-  transition: all 0.5s ease;
+.AMISDebug-logLine {
+  overflow-x: hidden;
 }
 .cxd-Switch:active .slider::before {
-  width: calc(var(--Switch-height) + 0.125rem);
+  width: calc(var(--Switch-slider-width) + var(--Switch-slider-margin) * 2);
   border-radius: 10px;
 }
-.cxd-Switch:hover {
-  background: var(--Switch-onHover-bgColor);
-}
-.cxd-Switch.is-checked {
-  background: var(--Switch-checked-bgColor);
-}
-.cxd-Switch.is-checked .slider::before {
-  right: auto;
-  left: calc( 100% - (var(--Switch-height) - 0.25rem) - 0.125rem );
-}
-.cxd-Switch.is-checked .text {
-  margin: 0 1.5625rem 0 0.5rem;
-}
 .cxd-Switch.is-checked:hover {
   background: var(--Switch-checked-onHover-bgColor);
 }
@@ -29215,7 +29232,11 @@ td.rdtQuarter.rdtDisabled:hover {
   background: var(--Switch-checked-onActive-bgColor);
 }
 .cxd-Switch.is-checked:active .slider::before {
-  left: calc( 100% - (var(--Switch-height) + 0.125rem) - 0.125rem );
+  right: calc(var(--Switch-slider-margin) * 2);
+}
+.cxd-Switch--sm:active .slider::before {
+  width: calc( var(--Switch-slider-width--sm) + var(--Switch-slider-margin) * 2 );
+  border-radius: 10px;
 }
 .cxd-TextControl-sugs {
   border-radius: 0.1875rem;