.drop-down-enter-active {
  transition: transform 0.2s ease, opacity 0.2s ease;
}
.drop-down-enter {
  opacity: 0;
  transform: translateY(-20px);
}
.top-slide-enter-active,
.top-slide-leave-active {
  transition: transform 0.2s ease;
}
.top-slide-enter,
.top-slide-leave-to {
  transform: translateY(-100%);
}
.bottom-slide-enter-active,
.bottom-slide-leave-active {
  transition: transform 0.2s ease;
}
.bottom-slide-enter,
.bottom-slide-leave-to {
  transform: translateY(100%);
}
.right-slide-enter-active,
.right-slide-leave-active {
  transition: transform 0.2s ease;
}
.right-slide-enter,
.right-slide-leave-to {
  transform: translateX(100%);
}
.left-slide-enter-active,
.left-slide-leave-active {
  transition: transform 0.2s ease;
}
.left-slide-enter,
.left-slide-leave-to {
  transform: translateX(-100%);
}
.uif-opacity-enter-active,
.uif-opacity-leave-active {
  transition: opacity 0.3s ease;
}
.uif-opacity-enter,
.uif-opacity-leave-to {
  opacity: 0;
}
.uif-modal-enter-active,
.uif-modal-leave-active {
  transition: all 0.2s ease;
}
.uif-modal-enter {
  opacity: 0;
  transform: scale(0.5, 0.5);
}
.uif-modal-leave-to {
  opacity: 0;
  transform: translateY(-100px);
}
@-moz-keyframes s-rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@-webkit-keyframes s-rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@-o-keyframes s-rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes s-rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
*,
:after,
:before {
  box-sizing: border-box;
}
button,
input,
select,
textarea {
  font-family: inherit;
}
.uif-btn {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  outline: 0;
  user-select: none;
  background-image: none;
  touch-action: manipulation;
  display: inline-block;
  text-align: center;
  cursor: pointer;
  border: 1px solid transparent;
  transition: color 0.2s linear, background-color 0.2s linear, border 0.2s linear;
  font-weight: normal;
  font-size: 12px;
  line-height: 20px;
}
.uif-btn > span {
  margin: 0 4px;
  display: inline-block;
}
.uif-btn-radius {
  border-radius: 4px;
}
.uif-btn-small {
  padding: 1px 7px;
}
.uif-btn-small.uif-btn-circle {
  border-radius: 12px;
}
.uif-btn-small .uif-i {
  line-height: 12px;
  font-size: 16px;
  width: 16px;
  transform: translateY(2px);
}
.uif-btn-small .uif-i.uif-loading {
  margin-top: -6px;
  margin-left: -8px;
}
.uif-btn-middle {
  padding: 3px 11px;
}
.uif-btn-middle.uif-btn-circle {
  border-radius: 14px;
}
.uif-btn-middle .uif-i {
  line-height: 12px;
  font-size: 16px;
  width: 16px;
  transform: translateY(2px);
}
.uif-btn-middle .uif-i.uif-loading {
  margin-top: -6px;
  margin-left: -8px;
}
.uif-btn-large {
  padding: 7px 15px;
}
.uif-btn-large.uif-btn-circle {
  border-radius: 18px;
}
.uif-btn-large .uif-i {
  line-height: 12px;
  font-size: 20px;
  width: 20px;
  transform: translateY(3px);
}
.uif-btn-large .uif-i.uif-loading {
  margin-top: -6px;
  margin-left: -10px;
}
.uif-btn-large > span {
  display: inline-block;
  margin: 0 8px;
}
.uif-btn-large > .uif-btn-icon + span {
  margin-left: 4px;
}
.uif-btn-large > span + .uif-btn-icon {
  margin-left: -4px;
}
.uif-btn-default {
  color: #142133;
  background-color: #e6e7eb;
  border-color: #e6e7eb;
}
.uif-btn-default.uif-btn-outline {
  color: #142133;
  background-color: transparent;
  border-color: #e6e7eb;
}
.uif-btn-default.hover,
.uif-btn-default:hover {
  color: #006ce1;
  background-color: #d8eefc;
  border-color: #006ce1;
}
.uif-btn-default.active,
.uif-btn-default:active {
  color: #006ce1;
  background-color: #abddfc;
  border-color: #006ce1;
}
.uif-btn-normal {
  color: #142133;
  background-color: #cdd1d8;
  border-color: #cdd1d8;
}
.uif-btn-normal.uif-btn-outline {
  color: #142133;
  background-color: transparent;
  border-color: #cdd1d8;
}
.uif-btn-normal.hover,
.uif-btn-normal:hover {
  color: #006ce1;
  background-color: #d8eefc;
  border-color: #006ce1;
}
.uif-btn-normal.active,
.uif-btn-normal:active {
  color: #006ce1;
  background-color: #abddfc;
  border-color: #006ce1;
}
.uif-btn-primary {
  color: #fff;
  background-color: #006ce1;
  border-color: #006ce1;
}
.uif-btn-primary.uif-btn-outline {
  color: #006ce1;
  background-color: transparent;
  border-color: #006ce1;
}
.uif-btn-primary.hover,
.uif-btn-primary:hover {
  color: #fff;
  background-color: #005bbf;
  border-color: #005bbf;
}
.uif-btn-primary.active,
.uif-btn-primary:active {
  color: #fff;
  background-color: #004b9d;
  border-color: #004b9d;
}
.uif-btn-danger {
  color: #fff;
  background-color: #ec3751;
  border-color: #ec3751;
}
.uif-btn-danger.uif-btn-outline {
  color: #ec3751;
  background-color: transparent;
  border-color: #ec3751;
}
.uif-btn-danger.hover,
.uif-btn-danger:hover {
  color: #fff;
  background-color: #c82e44;
  border-color: #c82e44;
}
.uif-btn-danger.active,
.uif-btn-danger:active {
  color: #fff;
  background-color: #a52638;
  border-color: #a52638;
}
.uif-btn-success {
  color: #fff;
  background-color: #279a28;
  border-color: #279a28;
}
.uif-btn-success.uif-btn-outline {
  color: #279a28;
  background-color: transparent;
  border-color: #279a28;
}
.uif-btn-success.hover,
.uif-btn-success:hover {
  color: #fff;
  background-color: #218222;
  border-color: #218222;
}
.uif-btn-success.active,
.uif-btn-success:active {
  color: #fff;
  background-color: #1b6b1c;
  border-color: #1b6b1c;
}
.uif-btn-dark {
  color: #fff;
  background-color: #3c3c46;
  border-color: #3c3c46;
}
.uif-btn-dark.uif-btn-outline {
  color: #3c3c46;
  background-color: transparent;
  border-color: #3c3c46;
}
.uif-btn-dark.hover,
.uif-btn-dark:hover {
  color: #fff;
  background-color: #33333b;
  border-color: #33333b;
}
.uif-btn-dark.active,
.uif-btn-dark:active {
  color: #fff;
  background-color: #2a2a31;
  border-color: #2a2a31;
}
.uif-btn-text {
  color: #142133;
  background-color: transparent;
  border-color: transparent;
}
.uif-btn-text.hover,
.uif-btn-text:hover {
  color: #006ce1;
}
.uif-btn-text.active,
.uif-btn-text:active {
  color: #004b9d;
}
.uif-btn[disabled] {
  pointer-events: none;
  opacity: 0.4;
}
.uif-btn-long {
  width: 100%;
}
.uif-btn-loading {
  pointer-events: none;
  position: relative;
}
.uif-btn-loading > :not(.uif-loading) {
  visibility: hidden;
}
.uif-btn > .uif-loading {
  position: absolute;
  top: 50%;
  left: 50%;
  text-indent: 0;
  transform-origin: center center;
  animation: s-rotate 0.6s linear infinite;
  text-align: center;
}
.uif-btn.uif-btn-feedback {
  position: relative;
  overflow: hidden;
}
.uif-btn.uif-btn-feedback:before {
  transition: transform 0.2s ease;
  font-size: 16px;
  font-family: 'uifont' !important;
  content: "\e6cd";
  display: block;
  text-align: center;
  position: absolute;
  left: 0;
  right: 0;
  transform: translateY(-150%);
}
.uif-btn.uif-btn-feedback span {
  transition: transform 0.2s ease;
}
.uif-btn.uif-btn-feedback-ok:before {
  transform: translateY(0);
}
.uif-btn.uif-btn-feedback-ok span {
  transform: translateY(150%);
}
.uif-circle {
  display: inline-block;
  position: relative;
}
.uif-circle-inner {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.uif-color-box {
  border-radius: 4px;
  border: 1px solid transparent;
}
.uif-color-box-default {
  border-color: rgba(109,120,128,0.08);
  background-color: rgba(109,120,128,0.16);
}
.uif-color-box-info {
  border-color: rgba(0,161,230,0.08);
  background-color: rgba(0,161,230,0.16);
}
.uif-color-box-success {
  border-color: rgba(41,153,41,0.08);
  background-color: rgba(41,153,41,0.16);
}
.uif-color-box-warning {
  border-color: rgba(230,154,4,0.08);
  background-color: rgba(230,154,4,0.16);
}
.uif-color-box-error {
  border-color: rgba(236,55,81,0.08);
  background-color: rgba(236,55,81,0.16);
}
.uif-color-box > .uif-description-list:only-child {
  margin: 4px 16px;
}
.uif-description {
  display: inline-block;
  color: #191919;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 12px;
  line-height: 20px;
}
.uif-description-label {
  font-weight: bold;
}
.uif-description-label:after {
  content: ':';
  padding-left: 2px;
  padding-right: 2px;
}
.uif-description-flex {
  display: flex;
  align-items: center;
}
.uif-description-flex .uif-description-value {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  width: 0;
  flex: auto;
}
.uif-description-list {
  flex: auto;
  display: flex;
}
.uif-description-list-horizontal {
  align-items: center;
  flex-direction: row;
}
.uif-description-list-vertical {
  align-items: stretch;
  flex-direction: column;
}
.uif-description-list-space-middle .uif-description {
  padding-top: 4px;
  padding-bottom: 4px;
  min-height: 28px;
}
.uif-dropdown {
  z-index: 2;
}
.uif-drop-menu {
  display: inline-block;
}
.uif-drop-menu .uif-popper-reference {
  display: inline-block;
  position: relative;
  cursor: pointer;
}
.uif-dm-items-wrapper {
  padding: 4px 0;
  background-color: #f1f3f5;
  border-radius: 4px;
  border: 1px solid #caccd4;
  box-shadow: 4px 4px 16px rgba(0,0,0,0.16);
  min-width: 124px;
}
.uif-dm-items-wrapper-icon > .uif-dm-item .uif-dm-item-text {
  padding-left: 24px;
}
.uif-dm-items-wrapper-icon > .uif-dm-item-icon .uif-dm-item-text {
  padding-left: 8px;
}
.uif-dm-item {
  display: flex;
  align-items: center;
  padding: 4px 11px;
  font-size: 12px;
  line-height: 20px;
  position: relative;
}
.uif-dm-item-line {
  margin: 4px 6px;
  border-bottom: 1px solid #dbe2ea;
}
.uif-dm-item-disabled {
  cursor: not-allowed;
  color: #d9dfe5;
}
.uif-dm-item-skip {
  color: #191919;
}
.uif-dm-item-available {
  color: #191919;
}
.uif-dm-item-available > .uif-dm-item-text {
  cursor: pointer;
}
.uif-dm-item-available:hover {
  background-color: #e1edfa;
}
.uif-dm-item-available:hover > .uif-dm-items-wrapper,
.uif-dm-item-skip:hover > .uif-dm-items-wrapper {
  display: block;
}
.uif-dm-item-active,
.uif-dm-item-active:hover {
  color: #006ce1;
}
.uif-dm-item > .uif-dm-item-text {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  width: 0;
  flex: auto;
}
.uif-dm-item > .uif-dm-items-wrapper {
  display: none;
  position: absolute;
  left: calc(100% - 4px);
  top: -4px;
}
.uif-dm-item > .uif-dm-items-wrapper-invert {
  left: unset;
  right: calc(100% - 4px);
}
[class^="uicon-"],
[class*=" uicon-"] {
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
/* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
[class^="uicon-"]:before,
[class*=" uicon-"]:before {
/* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'uifont' !important;
}
.uif-i {
  display: inline-block;
  text-align: center;
}
.uif-i-action {
  cursor: pointer;
  width: 16px;
  font-size: 16px;
  line-height: 16px;
  color: #8288ab;
}
.uif-i-action.uif-i-disabled {
  color: #d9dee2;
  cursor: default;
}
.uif-i-action.uif-i-available:hover,
.uif-i-action.uif-i-available.uif-i-hover,
.uif-i-action.uif-i-available:active,
.uif-i-action.uif-i-available.uif-i-active {
  color: #006ce1;
}
.uif-i-none {
  width: 16px;
  font-size: 16px;
  line-height: 16px;
}
.uif-layout {
  display: flex;
  flex-direction: column;
  flex: auto;
}
.uif-layout-has-sider {
  flex-direction: row;
}
.uif-layout-header,
.uif-layout-footer {
  height: 64px;
  flex: 0 0 auto;
}
.uif-layout-content {
  flex: auto;
}
.uif-layout-sider {
  transition: all 0.2s ease-in-out;
  position: relative;
}
.uif-layout-sider-children {
  height: 100%;
}
.uif-menu {
  list-style: none;
  user-select: none;
}
.uif-menu-item {
  text-decoration: none;
  padding: 14px 20px;
  font-size: 14px;
  line-height: 22px;
  display: block;
  transition: all 0.2s ease;
  cursor: pointer;
  color: #191919;
}
.uif-menu-item-disabled {
  opacity: 0.25;
  cursor: not-allowed;
  background: none !important;
}
.uif-menu-item-active {
  color: #006ce1;
}
.uif-menu-item:hover {
  background-color: #ecf5ff;
}
.uif-menu-group-title {
  color: #999;
  cursor: default;
  padding: 14px 20px;
  font-size: 14px;
  line-height: 22px;
}
.uif-menu-group-content {
  list-style: none;
}
.uif-sub-menu-title {
  padding: 14px 10px;
  line-height: 20px;
  font-size: 14px;
  position: relative;
  cursor: pointer;
}
.uif-sub-menu-icon {
  position: absolute;
  right: 10px;
  line-height: 20px;
  font-size: 14px;
  transition: all 0.2s ease;
}
.uif-sub-menu-active .uif-sub-menu-icon {
  transform: rotate(180deg);
}
.uif-notice-wrap {
  position: fixed;
  top: 14px;
  right: 24px;
  z-index: 1010;
}
.uif-notice {
  border-radius: 4px;
  box-shadow: 0 1px 6px rgba(0,0,0,0.2);
  padding: 20px 0;
  background-color: #fff;
  line-height: 1;
  position: relative;
  margin-top: 10px;
  width: 340px;
  border-left: 8px solid transparent;
  margin-left: auto;
}
.uif-notice-long {
  width: 560px;
}
.uif-notice-info {
  border-left-color: #209bff;
}
.uif-notice-info .uif-notice-icon {
  color: #209bff;
}
.uif-notice-success {
  border-left-color: #53c093;
}
.uif-notice-success .uif-notice-icon {
  color: #53c093;
}
.uif-notice-warning {
  border-left-color: #ffb24d;
}
.uif-notice-warning .uif-notice-icon {
  color: #ffb24d;
}
.uif-notice-error {
  border-left-color: #ef7d67;
}
.uif-notice-error .uif-notice-icon {
  color: #ef7d67;
}
.uif-notice-header {
  display: flex;
  align-items: center;
  margin: 0 20px;
}
.uif-notice-header + .uif-notice-confirm {
  margin-top: 10px;
}
.uif-notice-title {
  flex: auto;
  color: #191919;
  font-weight: bold;
  font-size: 16px;
  line-height: 26px;
}
.uif-notice-icon {
  margin-right: 16px;
  width: 24px;
  font-size: 24px;
  line-height: 24px;
}
.uif-notice-close .uif-i {
  width: 29px;
  height: 29px;
  line-height: 29px;
  border-radius: 50%;
  transition: all 0.2s ease;
}
.uif-notice-close .uif-i:hover {
  background-color: #eee;
}
.uif-notice-desc {
  font-size: 12px;
  line-height: 20px;
  color: #191919;
  white-space: pre-wrap;
  margin-top: 10px;
  padding: 0 20px;
  max-height: 70vh;
  overflow: auto;
}
.uif-notice-confirm {
  padding: 0 20px;
  text-align: right;
}
.uif-notice-enter-active,
.uif-notice-leave-active {
  overflow: hidden;
  transition: all 0.3s linear;
}
.uif-notice-enter {
  opacity: 0.5;
  transform-origin: 0 0;
  transform: translateX(100%);
}
.uif-notice-leave-to {
  opacity: 0.5;
  height: 0 !important;
}
.uif-paginate-wrap {
  display: inline-block;
}
.uif-paginate {
  border: 1px solid #caccd4;
  background-color: #f1f3f5;
  height: 28px;
  display: flex;
  align-items: center;
  border-radius: 4px;
  padding-left: 8px;
  padding-right: 8px;
  cursor: default;
}
.uif-paginate-text,
.uif-paginate-total {
  white-space: nowrap;
  line-height: 16px;
  color: #6d7880;
  margin-left: 4px;
}
.uif-paginate-total {
  padding-right: 12px;
  border-right: 1px solid #caccd4;
}
.uif-paginate .uif-i {
  margin-left: 4px;
}
.uif-popper-popper {
  position: absolute;
  z-index: 10;
}
.popper-arrow[data-popper-arrow] {
  width: 10px;
  height: 10px;
  position: absolute;
  transform: rotate(45deg);
  background-color: #e8e9ed;
  z-index: -1;
}
[data-popper-placement^=right] > .popper-arrow[data-popper-arrow] {
  left: -4px;
}
[data-popper-placement^=left] > .popper-arrow[data-popper-arrow] {
  right: -4px;
}
[data-popper-placement^=top] > .popper-arrow[data-popper-arrow] {
  bottom: -4px;
}
[data-popper-placement^=bottom] > .popper-arrow[data-popper-arrow] {
  top: -4px;
}
.uif-popper-popper[data-max-height] > .uif-dm-items-wrapper {
  max-height: inherit;
  overflow: auto;
}
.uif-poptip {
  display: inline-block;
}
.uif-poptip-popper {
  min-width: 150px;
  filter: drop-shadow(0 1px 4px rgba(44,81,56,0.35));
  position: relative;
  font-size: 12px;
  line-height: 20px;
  background-color: #e8e9ed;
  border-radius: 6px;
  padding: 10px;
}
.uif-poptip-popper-text {
  text-align: left;
  padding: 0 4px;
  white-space: pre-wrap;
}
.uif-poptip-popper-invert {
  color: #fff;
  background-color: #2b3240;
}
.uif-poptip-popper-invert > .popper-arrow {
  background-color: #2b3240;
}
.uif-popup-enter-active,
.uif-popup-leave-active {
  transition: all 0.2s ease;
}
.uif-popup-enter {
  opacity: 0;
  transform: scale(0.5, 0.5);
}
.uif-popup-leave-to {
  opacity: 0;
  transform: translateY(-100px);
}
.uif-popup-wrap {
  position: fixed;
  top: 0;
  left: 0;
  height: 0;
  width: 100%;
  z-index: 1000;
  display: flex;
  justify-content: center;
}
.uif-popup-mask {
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: rgba(0,0,0,0.4);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.uif-popup-mask-loading {
  width: 120px;
  height: 120px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  margin: auto;
}
.uif-popup-mask-close {
  margin-bottom: 56px;
  color: #bfbfbf;
}
.uif-popup-mask-close:hover {
  color: #8288ab;
}
.uif-popup-mask-destroy {
  position: absolute;
  right: 20px;
  top: 20px;
  color: #bfbfbf;
  width: 32px;
  font-size: 32px;
  line-height: 32px;
}
.uif-popup-navigation {
  position: absolute;
  left: 100%;
  transform: translate(8px, 12px);
}
.uif-popup-container {
  position: absolute;
  background-color: #e6e7eb;
  border-radius: 6px;
  min-width: 480px;
  box-shadow: 0px 8px 24px rgba(0,0,0,0.24);
}
.uif-popup-container.height-large {
  top: 8vh;
}
.uif-popup-container.height-middle {
  top: 16vh;
}
.uif-popup-container.maximize {
  top: 0 !important;
  left: 0 !important;
}
.uif-popup-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 48px;
  padding-left: 20px;
  padding-right: 20px;
  background-color: #d7dade;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
}
.uif-popup-header .title {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 14px;
  line-height: 20px;
  color: #191919;
  margin-right: auto;
}
.uif-popup-header > .uif-i {
  margin-left: 12px;
}
.uif-popup-header > .uif-i-action:not(:hover) {
  color: #142133;
}
.uif-popup-footer {
  height: 56px;
  padding-left: 20px;
  padding-right: 20px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.uif-popup-footer > .uif-btn:not(:first-child) {
  margin-left: 12px;
}
.uif-popup-content {
  overflow: auto;
}
.uif-popup-content.height-large {
  max-height: calc(84vh - 104px);
}
.uif-popup-content.height-large-flex {
  height: calc(84vh - 104px);
}
.uif-popup-content.height-middle {
  max-height: calc(68vh - 104px);
}
.uif-popup-content.height-middle-flex {
  height: calc(68vh - 104px);
}
.uif-popup-content.width-small {
  width: 480px;
}
.uif-popup-content.width-middle {
  width: 800px;
}
.uif-popup-content.width-large {
  width: 1040px;
}
.uif-popup-content.flex {
  display: flex;
  flex-direction: column;
}
.uif-popup-content.maximize {
  max-height: calc(100vh - 104px);
  height: calc(100vh - 104px);
  width: 100vw;
}
.uif-popup-content .uif-slide-block {
  padding: 12px 20px 0;
}
.uif-popup-content .uif-slide-block:last-child {
  padding-bottom: 24px;
}
@media screen and (max-height: 800px) {
  .uif-popup-container.height-large {
    top: 2vh;
  }
  .uif-popup-container.height-middle {
    top: 8vh;
  }
  .uif-popup-content.height-large {
    max-height: calc(96vh - 104px);
  }
  .uif-popup-content.height-large-flex {
    height: calc(96vh - 104px);
  }
  .uif-popup-content.height--middle {
    max-height: calc(84vh - 104px);
  }
  .uif-popup-content.height--middle-flex {
    height: calc(84vh - 104px);
  }
}
.uif-progress-desc {
  margin-bottom: 4px;
  display: flex;
  align-items: center;
}
.uif-progress-desc-text {
  font-size: 12px;
  line-height: 20px;
  color: #191919;
  width: 0;
  flex: auto;
}
.uif-progress-desc-percent {
  font-size: 12px;
  line-height: 20px;
  color: #006ce1;
}
.uif-progress-outer {
  overflow: hidden;
}
.uif-progress-outer-color {
  background-color: #f2f5fc;
}
.uif-progress-inner {
  transition: width 0.2s linear;
  background-color: #006ce1;
}
.uif-loading-bar {
  height: 0;
  overflow: visible;
  position: relative;
  z-index: 1;
}
.u-slide-down-enter-active,
.u-slide-down-leave-active {
  transition: height 0.2s;
  overflow: hidden;
}
.u-slide-down-enter,
.u-slide-down-leave-to {
  height: 0 !important;
}
.uif-slide-block-header {
  display: flex;
  align-items: center;
  height: 40px;
}
.uif-slide-block-header .uif-loading {
  color: #a4aecf;
  margin-left: 8px;
  transform-origin: center center;
  animation: s-rotate 0.6s linear infinite;
}
.uif-slide-block-title {
  color: #191919;
  font-size: 14px;
  line-height: 20px;
  display: flex;
  align-items: center;
  cursor: pointer;
}
.uif-slide-block-title .trigger {
  margin-right: 8px;
  transition: transform 0.2s ease;
}
.uif-slide-block-title.visible .trigger {
  transform: rotate(90deg);
}
.uif-slide-block-normal {
  background-color: #e6e7eb;
  border-radius: 6px;
}
.uif-slide-navigation {
  width: 126px;
  padding: 12px 0 12px 12px;
}
.uif-slide-navigation.dark {
  color: #fff;
  border-radius: 4px;
  background-color: rgba(20,33,51,0.8);
  box-shadow: 4px 4px 16px rgba(0,0,0,0.16);
}
.uif-slide-navigation.normal {
  color: #142133;
}
.uif-slide-nav {
  border-left: 2px solid;
  font-size: 12px;
  line-height: 20px;
  padding: 6px 0 6px 16px;
  cursor: pointer;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.uif-slide-nav:not(.active) {
  opacity: 0.5;
}
@import '~gemini-scrollbar/gemini-scrollbar.css';
.uif-tag {
  display: inline-block;
  cursor: default;
}
.uif-tag-inner {
  display: flex;
  align-items: center;
}
.uif-tag-svg {
  fill: #cdd1d8;
  transition: fill 0.2s ease;
}
.uif-tag-text {
  color: #191919;
  background-color: #cdd1d8;
  transition: background-color 0.2s ease;
  line-height: 20px;
  padding-right: 8px;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}
.uif-tag.checkable {
  cursor: pointer;
}
.uif-tag-info.active .uif-tag-svg {
  fill: #209bff;
}
.uif-tag-info.active .uif-tag-text {
  color: #fff;
  background-color: #209bff;
}
.uif-tag-info.checkable:hover .uif-tag-svg {
  fill: #1b83d8;
}
.uif-tag-info.checkable:hover .uif-tag-text {
  color: #fff;
  background-color: #1b83d8;
}
.uif-tag-success.active .uif-tag-svg {
  fill: #53c093;
}
.uif-tag-success.active .uif-tag-text {
  color: #fff;
  background-color: #53c093;
}
.uif-tag-success.checkable:hover .uif-tag-svg {
  fill: #46a37c;
}
.uif-tag-success.checkable:hover .uif-tag-text {
  color: #fff;
  background-color: #46a37c;
}
.uif-tag-warning.active .uif-tag-svg {
  fill: #ffb24d;
}
.uif-tag-warning.active .uif-tag-text {
  color: #fff;
  background-color: #ffb24d;
}
.uif-tag-warning.checkable:hover .uif-tag-svg {
  fill: #d89741;
}
.uif-tag-warning.checkable:hover .uif-tag-text {
  color: #fff;
  background-color: #d89741;
}
.uif-tag-error.active .uif-tag-svg {
  fill: #ef7d67;
}
.uif-tag-error.active .uif-tag-text {
  color: #fff;
  background-color: #ef7d67;
}
.uif-tag-error.checkable:hover .uif-tag-svg {
  fill: #cb6a57;
}
.uif-tag-error.checkable:hover .uif-tag-text {
  color: #fff;
  background-color: #cb6a57;
}
.uif-tree-line {
  font-size: 12px;
  line-height: 20px;
  color: #191919;
  display: flex;
  align-items: center;
  background-color: #f1f3f5;
  transition: background-color 0.2s ease;
  border-radius: 4px;
  margin-bottom: 2px;
  height: 32px;
}
.uif-tree-line:hover {
  background-color: #e1edfa;
}
.uif-tree-line-icon {
  width: 28px;
  text-align: center;
}
.uif-tree-line .uif-i-action {
  width: 28px;
  line-height: 28px;
  transition: transform 0.2s ease;
}
.uif-tree-line .uif-i-action.loading {
  transform-origin: center center;
  animation: s-rotate 0.6s linear infinite;
}
.uif-tree-line-expand .uif-i-action.expand {
  transform: rotate(90deg);
}
.uif-tree-line-label {
  line-height: 32px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  cursor: pointer;
  flex: auto;
}
.uif-tree-line.uif-tree-line-active {
  background-color: #0e76e6;
  color: #fff;
}
.uif-tree-line.uif-tree-line-active .uif-i-action {
  color: inherit;
}
.uif-upload {
  display: inline-block;
}
.uif-upload-input {
  display: none;
}
body.no-select {
  user-select: none;
}
body.e-resize {
  cursor: e-resize;
}
body.s-resize {
  cursor: s-resize;
}
[data-draggable] {
  cursor: move;
}