@import './element-variables.less';
@import './transition.less';

html,
body {
  padding: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  font-size: 12px;
  font-family: 'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', '微软雅黑', Arial,
  sans-serif;
  color: var(--color-text-primary)
}

*,
*:before,
*:after {
  box-sizing: border-box;
}

.orange-project .iconfont {
  font-size: 20px;
}

.must-input-color {
  color: #ff4141;
}

@header-height: 60px;

// 过滤组件长度
@filter-item-width: 250px;
// 范围选择过滤组件长度
@filter-item-range-width: 400px;
// 左侧过滤树组件每一项高度
@tree-node-height: 40px;
// 高级管理表单标题高度
@advanced-title-height: 50px;
@border-color: rgb(216, 220, 229);
@menuHover: rgba(255, 255, 255, 0.3);
@menu-background-color: transparent;
@tabs-header-margin-bottom: 25px;
@tab-header-background-color: #ebeef5;
@image-item-width: 65px;
@box-padding-size: 25px;
@left-menu-height: 47px;
@left-submenu-height: 43px;

.color1 {
  color: var(--color-primary);
}

.primary-color {
  color: var(--color-primary);
}

.error-color {
  color: var(--color-danger);
}

.warning-color {
  color: var(--color-warning);
}

.content-color {
  color: var(--color-text-primary);
}

.secondary-color {
  color: var(--color-text-secondary);
}

.regular-color {
  color: var(--color-text-regular);
}

.tip-color {
  color: var(--text-color-level3);
}

.ml-12px {
  margin-left: 12px;
}

.mb-12px {
  margin-bottom: 12px;
}

.mb-36px {
  margin-bottom: 36px;
}

.mt-24px {
  margin-bottom: 24px;
}

.mb-6px {
  margin-bottom: 6px;
}

.el-icon-question-helper {
  color: var(--color-primary);
  margin-left: 2px;
  font-size: 14px;
}

// 左侧菜单树样式覆盖 高度修改会引起item下移 去掉
//.el-menu-item{
//  height: @left-menu-height;
//  line-height: @left-menu-height;
//}
//
//.el-submenu .el-menu-item{
//  height: @left-submenu-height;
//  line-height: @left-submenu-height;
//}
//.el-submenu__title{
//  height: @left-menu-height;
//  line-height: @left-menu-height;
//}
//dialog 弹框样式重写
@media screen and (max-height: 768px) {
  .el-dialog__body {
    //max-height: 350px !important;
  }
}

// el-dialog__footer的高度是52px, 所以把border加到el-dialog__body上
.el-dialog__body {
  padding: 16px 20px 20px 20px;
  border-top: 1px solid var(--line-color-level1);
  border-bottom: 1px solid var(--line-color-level1);
  max-height: 497px;
  overflow: auto;
}

.el-dialog__wrapper[fullscreen='true'] .el-dialog__body {
  max-height: none;
}

/**
 * 弹窗样式，封装的layer的弹窗
 **/
body .layer-dialog .layui-layer-title {
  border-radius: 4px 4px 0px 0px;
  border: 1px solid #01000000;
}

body .layer-dialog .layui-layer-setwin {
  color: #fff;
}

body .layer-dialog {
  border-radius: 4px;
  border: 1px solid #01000000;
}

body .layer-dialog .layui-layer-content {
  padding: @box-padding-size;
}

/**
 * 左树右表弹窗样式
 */
body .layer-advance-dialog {
  border-radius: 4px;
  border: 1px solid #01000000;
  background-color: #f8f8f8;
}

body .layer-advance-dialog .layui-layer-title {
  border-radius: 4px 4px 0px 0px;
  border: 1px solid #01000000;
}

body .layer-advance-dialog .layui-layer-content {
  padding: 5px 15px;
}

.orange-project {
  overflow: hidden;
}

.el-main {
  padding: 16px;
}

.flex-box {
  flex-wrap: wrap;
}

.scrollbar_dropdown__wrap {
  overflow-x: hidden;
}

.icon-btn.el-button {
  font-size: 18px;
  padding: 5px 0px;
}

.default-padding-box {
  padding: @box-padding-size;
}

.padding-no-top {
  padding: 0px @box-padding-size @box-padding-size @box-padding-size;
}

.default-border {
  border: 1px solid var(--border-color-base);
}

.default-border-left {
  border-left: 1px solid var(--border-color-base);
}

.default-border-right {
  border-right: 1px solid var(--border-color-base);
}

.default-border-top {
  border-top: 1px solid var(--border-color-base);
}

.default-border-bottom {
  border-bottom: 1px solid var(--border-color-base);
}

.page-close-box {
  position: absolute;
  background: #0092ff;
  transform: rotate(45deg);
  height: 50px;
  width: 50px;
  right: -25px;
  top: -25px;
  text-align: center;

  .el-button {
    transform: rotate(-45deg);
    color: white;
    margin-top: 20px;
  }
}

.el-button + .btn-import {
  margin-left: 10px !important;
}

.dashboard-designer .el-button--primary {
  background: var(--color-primary);
  border-color: var(--color-primary);
  color: #fff;
}

.dashboard-designer .el-button--primary.is-disabled,
.dashboard-designer .el-button--primary.is-disabled:hover,
.dashboard-designer .el-button--primary.is-disabled:focus,
.dashboard-designer .el-button--primary.is-disabled:active {
  border-color: #bad7ff;
  background: #bad7ff;
}

.dashboard-designer .el-button--text {
  color: var(--color-primary);
}

.dashboard-designer .el-button.is-disabled.el-button--text {
  color: var(--disabled-primary-color);
}

.dashboard-designer .el-button--primary.is-plain {
  color: var(--color-primary);
  background: #ecf5ff;
  border-color: #b3d8ff;
}

.dashboard-designer .textarea-disabled-resize textarea {
  resize: none;
}

.dashboard-designer .is-process .el-step__icon.is-text {
  border-color: var(--color-primary);
  color: #fff;
  background-color: var(--color-primary);
}

/**
 * 过滤组件样式
 **/
.mask-box {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  top: 0;
  z-index: 10;
}

.filter-box {
  position: relative;
  background-color: white;
  padding: @box-padding-size @box-padding-size 0px @box-padding-size;
  z-index: 20;
}

.advance-filter-box {
  padding-bottom: 25px;
}

.filter-item {
  width: @filter-item-width;
}

.cascader-item {
  width: 160px !important;
}

.is-range,
.is-search {
  width: @filter-item-range-width;
}

.table-operation-box {
  align-self: flex-end;
  margin-bottom: 10px;
  overflow: hidden;
}

.table-check-box {
  margin-right: 7px;
}

/**
 * 左侧树状组件的样式，用户高级管理表单以及用户管理表单
 **/
.advanced-left-box {
  border-right: 1px solid @border-color;

  .el-tree-node__content {
    height: @tree-node-height;
  }

  .tree-node-item {
    height: @tree-node-height;
    line-height: @tree-node-height;
    width: 100%;

    .tree-node-menu {
      display: none;
      float: right;
      padding-right: 10px;
      color: var(--color-danger) !important;
    }

    &:hover .tree-node-menu {
      display: block;
    }
  }

  .el-tree-node .el-button + .el-button {
    margin-left: 5px;
  }
}

/**
 * form表单输入组件宽度
 **/
.full-width-input {
  .el-select {
    width: 100%;
  }

  .el-input {
    width: 100%;
  }

  .el-cascader {
    width: 100%;
  }

  .el-date-editor {
    width: 100%;
  }

  .el-input-number {
    width: 100%;
  }
}

.el-form-item.el-form-item--mini {
  min-height: 29px;
}

.el-form-item.el-form-item--small {
  min-height: 32px;
}

.el-form-item.el-form-item--medium {
  min-height: 36px;
}

.el-form-item.el-form-item--default {
  min-height: 40px;
}

.el-aside {
  overflow: visible;
}

.el-menu {
  border-right-width: 0px;
}

.sidebar-bg {
  // box-shadow: 0 1px 4px rgba(0,21,41,.08)!important;
}

.sidebar-title {
  display: flex;
  align-items: center;
  height: 58px;
  padding-left: 20px;
  white-space: nowrap;
}

.sidebar-title-text {
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
  color: @--color-sidebar-title-text;
  padding-left: 8px;
}

.el-menu:not(.el-menu--horizontal) .el-menu-item.is-active when (isdefined(@--color-menu-item-active-text-color)) {
  color: @--color-menu-item-active-text-color !important;
  font-weight: 700;
  border-right: 4px solid var(--color-primary);
}

//  //li.el-menu-item::after {
//  //  display:block;
//  //  content:attr(title);
//  //  font-weight:bold;
//  //  visibility:hidden;
//  //  height:1px;
//  //  color:transparent;
//  //  margin-bottom:-1px;
//  //  overflow:hidden;
//  //}
//
//  //.el-menu:not(.el-menu--horizontal) .el-submenu__title i {
//  //  color: @--color-menu-item-active-text-color;
//  //}
.el-scrollbar when (isdefined(@--color-menu-item-active-background)) {
  .el-menu:not(.el-menu--horizontal)
  .el-menu-item.is-active when (isdefined(@--color-menu-item-active-background-to)) {
    background: linear-gradient(to left,
    @--color-menu-item-active-background,
    @--color-menu-item-active-background-to);
  }
  .el-menu:not(.el-menu--horizontal)
  .el-menu-item.is-active when not(isdefined(@--color-menu-item-active-background-to)) {
    background: @--color-menu-item-active-background;
  }
  .el-menu:not(.el-menu--horizontal) .el-menu-item:hover when (isdefined(@--color-menu-item-active-background-to)) {
    background: linear-gradient(to left,
    @--color-menu-item-active-background,
    @--color-menu-item-active-background-to);
    color: @--color-menu-item-active-text-color;
  }
  .el-menu:not(.el-menu--horizontal)
  .el-menu-item:hover when not(isdefined(@--color-menu-item-active-background-to)) {
    background: @--color-menu-item-active-background;
    color: @--color-menu-item-active-text-color;
  }
}

/**
 * 多tab页表单，tab样式
 **/
 .dashboard-designer .el-tabs__header {
  margin: 8px 0 16px;
}

/**
 * 表格表头背景色
 **/
.table-header-gray,
.has-gutter .gutter {
  background-color: @tab-header-background-color;
}

/**
 * 操作按钮颜色
 **/
.table-btn.delete {
  color: #f56c6c;
}

.table-btn.delete:hover {
  color: #f78989;
}

.table-btn.delete:disabled {
  color: #dcdfe6;
}

.table-btn.success {
  color: #67c23a;
}

.table-btn.success:hover {
  color: #85ce61;
}

.table-btn.success:disabled {
  color: #dcdfe6;
}

.table-btn.warning {
  color: #e6a23c;
}

.table-btn.warning:hover {
  color: #ebb563;
}

.table-btn.success:disabled {
  color: #dcdfe6;
}

.el-table--group::after, .el-table--border::after {
  width: 0px;
}

/**
 * 图片上传以及显示样式
 **/
.upload-image-item {
  font-size: 28px;
  color: #8c939d;
  width: @image-item-width;
  height: @image-item-width;
  text-align: center;
  display: block;

  .el-upload i {
    line-height: @image-item-width;
  }
}

.upload-image-multi {
  display: inline;
}

.upload-image-item .el-upload {
  border: 1px dashed #d9d9d9;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}

.upload-image-item .el-upload:hover {
  border-color: var(bi-jz-primary-color);
}

.upload-image-show {
  width: @image-item-width;
  height: @image-item-width;
  display: inline;
}

.table-cell-image {
  width: @image-item-width;
  height: @image-item-width;
  line-height: @image-item-width;
  text-align: center;
  font-size: @image-item-width;
  color: #606266;
  margin: 0px 5px;
}

.upload-image-list .el-upload-list__item {
  width: @image-item-width;
  height: @image-item-width;
  line-height: @image-item-width;
}

.upload-image-item .el-upload-list--picture-card .el-upload-list__item {
  width: @image-item-width;
  height: @image-item-width;
}

.upload-image-item .el-upload.el-upload--text {
  width: @image-item-width;
  height: @image-item-width;
}

.upload-image-item .el-upload--picture-card {
  width: @image-item-width;
  height: @image-item-width;
  line-height: @image-item-width;
}

/**
 *
 **/
@header-menu-height: 32px;

.sidebar {
  height: 100%;
  background-color: var(--color-menu-background);
  // overflow: hidden;
  box-shadow: 0px 1px 4px rgba(0, 21, 41, 0.08);
}

.header {
  display: flex;
  align-items: center;
  height: @header-height;
  background-color: white;
}

.header .menu-column {
  margin-right: 20px;

  .el-menu-item.is-active {
    border-left: 0 solid #47ba5a;
  }
}

.header-menu {
  float: right;
  height: @header-menu-height;
  line-height: @header-menu-height;
  display: flex;
  justify-content: flex-end;
  flex-grow: 1;

  .circle {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: #ff4141;
    position: absolute;
    right: -3px;
    top: -2px;
  }
}

.header-img {
  width: @header-menu-height;
  height: @header-menu-height;
  border-radius: 50%;
  margin-left: 10px;
  float: right;
}

.el-menu--horizontal.el-menu {
  background-color: white;
}

.el-menu--horizontal > .el-menu-item {
  height: 40px;
  line-height: 40px;
  padding: 0;
  margin: 0 20px;
}

.el-menu.el-menu--horizontal {
  border-bottom: none;
}

.user-dropdown {
  color: @--color-text-secondary;
  cursor: pointer;
  font-size: 12px;
}

.user-dropdown-item {
  font-size: 12px;
  color: var(--color-primary);

  .el-badge {
    margin-top: -8px;
    margin-left: 10px;
    height: 20px;
  }
}

.hamburger-container {
  line-height: 70px;
  height: @header-height;
  float: left;
  padding: 0 10px;
}

.el-submenu__title {
  background: #00000000;
}

.tree-select {
  .el-tree-node__content {
    height: 34px;
    line-height: 34px;
    padding-right: 10px;
  }
}

.tree-select.single-select-tree {
  .el-tree-node.is-current > .el-tree-node__content > .el-tree-node__label {
    color: var(--color-primary);
    font-weight: 700;
  }
}

.cell {
  .operation-cell {
    color: #006cdc;
    cursor: pointer;
    text-decoration: underline;
  }
}

.single-select-tree {
  min-width: 200px !important;
}

.base-card-header {
  display: flex;
  align-items: center;
  height: 50px;
  line-height: 50px;
}

.base-card-operation {
  //flex-grow: 1;
  display: flex;
  justify-content: flex-end;

  .el-button i {
    font-size: 16px !important;
  }
}

.el-card__header {
  margin: 0 var(--block-gap-pro);
  padding: 0;
}

.el-card__body {
  padding: 12px 16px;
}

.custom-cascader {
  width: 200px !important;
}

.no-scroll {
  overflow: hidden;
}

.custom-scroll .el-scrollbar__view {
  overflow-x: hidden !important;
}

.upload-img-del {
  position: absolute;
  height: 20px;
  width: 20px;
  line-height: 20px;
  font-size: 16px;
  top: 2px;
  right: 2px;
  color: #c0c4cc;
}

.upload-img-del:hover {
  color: #ef5e1c;
}

.input-label {
  display: inline-block;
  height: 29px;
  line-height: 28px;
}

.input-progress {
  height: 29px;
  display: flex;
  align-items: center;
}

.input-item {
  width: 100% !important;
}

.table-header-gray {
  background: #fafafa;
}

.table-header-custom {
  background: #f6f9fb;
}

.card-header {
  display: flex;
  justify-content: space-between;
  padding: 10px 0px;
  line-height: 28px;
}

.delete-confirm .el-message-box__btns .el-button--primary {
  color: #fff;
  background: #f53f3f;
  border-color: #f53f3f;
}

.multi-text .el-message-box__content .el-message-box__container .el-message-box__status {
  top: 14%;
}

.multi-text-top .el-message-box__content .el-message-box__container .el-message-box__status {
  top: 30%;
}

.multi-text-tip .el-message-box__content .el-message-box__container .el-message-box__status {
  top: 19%;
}

.multi-two-lines-text-tip .el-message-box__content .el-message-box__container .el-message-box__status {
  top: 12px;
}

.display-right {
  margin-left: auto;
}

.filter-item-date {
  width: 330px;
}

.form-online .el-dialog .el-dialog__body {
  max-height: 450px;
  overflow: hidden;
  overflow-y: auto;
}

::-webkit-scrollbar {
  width: 4px;
  height: 4px;
  background: none;
  margin-right: 4px;
}

::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.15);;
  border-radius: 2px;
}

::-webkit-scrollbar-thumb:hover {
  background: #a8a8a8;
}

.ml20 {
  margin-left: 20px;
}

.mr20 {
  margin-right: 20px;
}

.mt20 {
  margin-top: 20px;
}

.mt12 {
  margin-top: 12px;
}

.mt6 {
  margin-top: 6px;
}

.mb20 {
  margin-bottom: 20px;
}

.pl20 {
  padding-left: 20px;
}

.pr20 {
  padding-right: 20px;
}

.pt20 {
  padding-top: 20px;
}

.pb20 {
  padding-bottom: 20px;
}

.gutter-left {
  padding-left: 20px;
}

.gutter-right {
  padding-right: 20px;
}

.gutter-top {
  padding-top: 20px;
}

.gutter-bottom {
  padding-bottom: 20px;
}

.page_box {
  margin-top: 15px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.list-header {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #ebeef5;
  margin: -14px -20px 16px -20px;
  height: 50px;

  .text {
    font-size: 14px;
    font-weight: 700;
    color: var(--color-text-primary);
  }
}

.el-message-box__wrapper {
  .message_box {
    .el-message-box__content {
      .el-message-box__input {
        width: 280px;
        margin: -50px 0 0 100px;
      }
    }
  }
}

.el-table .cell,
.planList .tb-flex .text,
.ty_flex .nameLabel,
.el-table .cell > div:first-child,
.vxe-table--render-wrapper .vxe-cell,
.el-table .cell .el-button--text {
  overflow: hidden;
  white-space: nowrap !important;
  text-overflow: ellipsis;
  vertical-align: middle;
}

//.el-table .cell > div:first-child {
//  display: flex;
//  align-items: center;
//}
//.el-table .cell div:first-child, .el-table .cell span:first-child {
//  overflow: hidden;
//  text-overflow: ellipsis;
//}

.el-table .cell img {
  vertical-align: middle;
}

.base-conf-dialog .el-dialog__body {
  //min-height: 400px;
  max-height: 500px;
  overflow: auto;
}

.el-checkbox__inner {
  border: 1px solid #999;
}

.el-radio__inner {
  border: 1px solid #999;
}

.el-textarea__inner {
  font-family: 'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', '微软雅黑', Arial,
  sans-serif;
}

.stopUsing {
  color: #aaaaaa;
}

.defaultBox {
  background: #fbfbfb;
  border: 1px solid #d9d9d9;
  color: #000;
}

.greyBox {
  background: var(--bg-info-color);
  border: 1px solid var(--text-color-level4);
  color: var(--text-color-level4);
}

.greenBox {
  background: var(--success-color-level1);
  border: 1px solid var(--color-success);
  color: var(--color-success);
}

.redBox {
  background: var(--error-color-level1);
  border: 1px solid var(--color-danger);
  color: var(--color-danger);
}

.yellowBox {
  background: var(--warning-color-level1);
  border: 1px solid var(--color-warning);
  color: var(--color-warning);
}

.blueBox {
  background: var(--primary-color-level1);
  border: 1px solid var(--color-primary);
  color: var(--color-primary);
}

.purpleBox {
  background: #F9F0FF;
  border: 1px solid #EDD6FF;
  color: #9D57F2;
}

.tableTagMargin {
  margin-right: 4px;
}

.detail-card {
  margin-bottom: 20px;

  .detail-title {
    position: relative;
    padding-left: 8px;
    font-weight: bold;
    color: rgb(40, 40, 40);
    font-size: 14px;
    margin-bottom: 16px;

    &:after {
      position: absolute;
      content: '';
      height: 90%;
      top: 5%;
      left: 0;
      width: 3px;
      background-color: var(--color-primary);
    }
  }
}

.text-overflow {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.self-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;

  tr {
    height: 40px;
  }

  td,
  th {
    border: 1px solid var(--line-color-level1);
    padding: 10px;
    text-align: left;
    color: #262626;
    font-weight: normal;
  }

  thead {
    th {
      background: var(--bg-info-color);
    }
  }
}

.center {
  text-align: center !important;
}

.pb60 {
  padding-bottom: 60px !important;
}

.color-common {
  color: var(--color-primary);
}

.dataEl {
  padding: 0 5px;
  background-color: rgb(240, 250, 255);
  border: 1px solid rgb(171, 220, 255);
  border-radius: 4px;
  height: 30px;
  line-height: 30px;
  width: 100%;
  box-sizing: border-box;
  color: rgb(46, 140, 240);

  span {
    max-width: 160px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }

  .deleteIcon {
    line-height: 30px;
    cursor: pointer;
  }
}

.add-sec {
  width: 100%;
  line-height: 30px;
  color: var(--color-primary);
  background-color: rgb(249, 250, 252);
  border: 1px solid #ebeef5;
  padding: 5px 20px 5px 30px;
  cursor: pointer;
}

.un-select-control {
  .el-drawer,
  * {
    user-select: none;
  }
}

.cursor-pointer {
  cursor: pointer;
}

.number-color {
  color: var(--color-primary)
}

.text_danger {
  color: var(--color-danger);
  font-weight: normal;
  font-size: 12px;
}

.w-100 {
  width: 100%;
}

.el-dialog__wrapper .el-dialog .el-dialog__body .el-form-item--mini .el-form-item {
  margin-right: inherit;
}

.el-dialog__wrapper .el-dialog .el-dialog__body .el-form--inline .el-form-item--mini .el-form-item {
  //margin-right: 23px;
}

.el-popper {
  .el-cascader-node__label {
    max-width: 300px;
  }

  .el-select-dropdown__item {
    //max-width: 700px;
  }
}

.height-auto {
  height: 100%;
}

.tableSortHeader {
  display: flex;

  .arrow_box {
    justify-content: center;
    height: 14px;
    width: 14px;
    margin-left: 5px;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
    overflow: initial;

    .top {
      width: 0;
      height: 0;
      border: 4px solid transparent;
      left: 7px;
      border-bottom-color: #c0c4cc;
      margin-bottom: 3px;
    }

    .top:hover {
      border-bottom-color: var(--color-primary);
    }

    .bottom {
      width: 0;
      height: 0;
      border: 4px solid transparent;
      left: 7px;
      border-top-color: #c0c4cc;
    }

    .bottom:hover {
      border-top-color: var(--color-primary);
    }
  }
}

.isActiveTop {
  border-radius: 2px;
  border-bottom-color: var(--color-primary) !important;
}

.isActiveBottom {
  border-radius: 2px;
  border-top-color: var(--color-primary) !important;
}

.el-step__head.is-success {
  color: var(--color-primary);
  border-color: var(--color-primary);
}

.el-step__description.is-success,
.el-step__title.is-success {
  color: var(--color-primary);
}

.el-loading-mask.is-fullscreen {
  z-index: 3000 !important;
}

.question-icon {
  color: var(--color-primary);
  font-size: 14px;
  cursor: pointer;
}

.common-divider {
  margin: 6px 0;
}

.dashboard-designer .el-table__empty-block {
  position: relative;
  min-height: 164px;
  width: 100% !important;
  border-bottom: 1px solid #ebeef5;

  &:before {
    content: '';
    display: block;
    width: 184px;
    height: 102px;
    position: absolute;
    background-image: url('../img/empty.png');
    background-repeat: no-repeat;
    background-size: 100% 100%;
    top: 20px;
    left: calc(50% - 92px);
  }

  &:after {
    position: absolute;
    content: '';
    height: 4px;
    width: 100%;
    bottom: 0;
    background: #fff;
    z-index: 99;
  }

  .el-table__empty-text {
    position: absolute;
    top: 122px;
    line-height: 22px;
    color: var(--text-color-level4);
  }
}

.dashboard-designer .el-empty {
  .el-empty__description {
    margin-top: 0px;
    line-height: 20px;
  }

  .el-empty__bottom {
    margin-top: 4px;
    line-height: 20px;
  }
}

// .el-tooltip__popper.is-dark {
//   background-color: var(--color-text-primary);
//   max-width: 500px;
// }

// .el-tooltip__popper .el-popper[x-placement^='bottom'] .popper__arrow::after {
//   border-bottom-color: #595959 !important;
// }

// .el-tooltip__popper .el-popper[x-placement^='top'] .popper__arrow::after {
//   border-top-color: #595959 !important;
// }

// .el-tooltip__popper.is-dark[x-placement^='bottom'] .popper__arrow::after {
//   border-bottom-color: var(--color-text-primary) !important;
// }

// .el-tooltip__popper.is-dark[x-placement^='top'] .popper__arrow::after {
//   border-top-color: var(--color-text-primary) !important;
// }

*[w-title] {
  position: relative;
}

*[w-title]:after {
  content: attr(w-title);
  position: absolute;
  width: 160px;
  top: 20px;
  left: 0;
  z-index: 9999;
  background: #ffffff;
  padding: 4px 8px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0px 0px 6px rgba(0, 0, 0, 0.04);
  border-radius: 2px;
}

.sticky-select .el-select-dropdown,
.sticky-select .el-date-picker {
  position: absolute !important;
  top: 30px !important;
  left: 0 !important;
}

.layout-offset-button {
  position: absolute;
  right: 1%;
  transform: translateY(51px);
}

.tabs_box {
  // border-bottom: 1px solid #EBEEF5;
  overflow-y: hidden;
}

//.el-form-item .el-input,.el-form-item .el-select,.el-form-item .el-cascader{
//  width: 180px;
//}
//
//.el-form-item .el-select .el-input{
//  width: 100%
//}
//.el-form-item .el-cascader .el-input{
//  width: 100%
//}
//.el-form-item .el-input-number .el-input{
//  width: 100%
//}

.cell .table-cell-flex {
  display: flex;
}

.cell .table-cell-flex > div:first-child,
.cell .table-cell-flex > span:first-child {
  text-overflow: ellipsis;
  overflow: hidden;
}

.item-divider {
  width: 3px;
  height: 12px;
  margin-right: 4px;
  background: var(--color-primary);
}

.g6-grid-container {
  z-index: 10;
}

.dashboard-designer .el-checkbox__label {
  padding-left: 6px;
}

.dashboard-designer .el-checkbox {
  color: var(--color-text-primary);
}

.el-select-dropdown__list {
  .my-input-search {
    padding: 0 10px;
  }
}

.el-select-dropdown__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

@media screen and (max-height: 768px) {
  .layui-dialog-warp .el-dialog__body {
    max-height: none !important;
  }
}

.dashboard-designer .layui-dialog-warp {
  .el-dialog__body {
    //max-height: none !important;
  }

  .el-dialog__footer {
    border-top: none;
    padding: 0;
  }
}

.dashboard-designer .el-cascader__suggestion-list {
  .hover {
    background-color: #f5f7fa;
  }
}


.dashboard-designer .el-table th.table-header-gray {
  background-color: var(--bg-info-color);
  color: var(--color-text-regular);
}

.dashboard-designer .el-table--border th {
  :not(:last-child):not(.el-checkbox__inner) {
    &:after {
      content: "";
      display: none;
      width: 1px;
      height: 16px;
      position: absolute;
      background: #dfe2e8;
      right: 0;
      top: 5px;
    }
  }
}

.dashboard-designer .el-table--border th.is-leaf .cell {
  &:after {
    content: "";
    display: block;
    width: 1px;
    height: 16px;
    position: absolute;
    background: #dfe2e8;
    right: 0;
    top: 5px;
  }
}

.dashboard-designer .el-table th:nth-last-child(2) .cell {
  &:after {
    display: none;
  }
}

.dashboard-designer .el-table th:last-child .cell {
  &:after {
    display: none;
  }
}

.dashboard-designer .el-table-column--selection .cell {
  &:after {
    display: none !important;
  }
}

.dashboard-designer .el-table td,.dashboard-designer .el-table th.is-leaf {
  border-color: transparent;
}

.dashboard-designer .el-table--border .el-table__cell {
  border-right: none;
  color: var(--text-color-level6);
}

.dashboard-designer .el-table--border, .dashboard-designer .el-table--group {
  border: none;
}

.el-message {
  z-index: 99999 !important;
  padding: 10px 20px 10px 10px !important;
}

.el-message__closeBtn {
  right: 5px;
}

.el-message__content {
  padding-right: 25px !important;
}

.el-tag.render-tag-warp {
  border-color: transparent;
}

.text-overflow-hidden {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  white-space: normal;
}

.el-scrollbar {
  width: 100%;
}

.el-button--small + .el-button--small {
  margin-left: 12px;
}

.el-message-box__btns .el-button--small {
  padding: var(--padding-gap-mini) var(--block-gap-primary);
  font-size: 12px;
}

.el-dialog__footer .el-button--mini + .el-button--mini {
  margin-left: 12px;
}

.info-toast-custom {
  .el-icon-info {
    font-size: 14px !important;
    margin-top: -26px !important;
  }
}

.custom-alert-info-detail {
  background-color: rgba(239, 247, 255, 1);
  padding: 10px 12px;
  margin-bottom: 12px;
  font-size: 12px;
  color: var(--text-color-level6);

  .tip-title {
    font-size: 12px;
    line-height: 20px;
  }

  .tip-icon {
    font-size: 16px;
    color: var(--color-primary);
    margin-right: 6px;
    line-height: 20px;
  }
}

.disable_maker {
  width: 6px;
  height: 6px;
  display: inline-block;
  border-radius: 50%;
  margin-right: 6px;
  background: var(--text-color-level4);
}

.enable_maker {
  width: 6px;
  height: 6px;
  display: inline-block;
  border-radius: 50%;
  margin-right: 6px;
  background: var(--color-success);
}

.custom-alert-info-detail {
  background-color: rgba(239, 247, 255, 1);
  padding: 10px 12px;
  margin-bottom: 12px;
  font-size: 12px;
  color: var(--text-color-level6);

  .tip-title {
    font-size: 12px;
    line-height: 20px;
  }

  .tip-icon {
    font-size: 16px;
    color: var(--color-primary);
    margin-right: 6px;
    line-height: 20px;
  }
}

.no-footer-dialog .el-dialog__footer {
  display: none;
}


.icon-sec {
  width: 60px;
  cursor: pointer;
  z-index: 9;
  top: 67px;
  display: flex;
  margin-right: 6px;

  .icon-sec-left,
  .icon-sec-right {
    width: 30px;
    height: 28px;
    border: 1px solid #f0f0f0;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .icon-sec-left {
    border-radius: 4px 0px 0px 4px;
  }

  .icon-sec-right {
    border-radius: 0px 4px 4px 0px;
  }

  .icon {
    font-size: 18px;
    line-height: 28px;
    color: rgb(219, 219, 219);
  }

  &:hover {
    cursor: pointer;
  }

  .active {
    color: rgb(50, 152, 255);
  }

  .active-div {
    background: rgba(62, 123, 250, 0.1);
    border: 1px solid var(--color-primary);
  }
}

.el-select-dropdown.el-popper.rule-config-popper {
  display: none;
}

input {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.customKnowMessage .el-icon-close:before {
  content: '我知道了';
  font-size: 14px;
  line-height: 20px;
  color: var(--color-primary)
}

.customKnowMessage .el-message__content {
  padding-right: 50px !important
}

.el-message {
  max-width: 60%;
  max-height: 40%;
  word-break: break-all;
  overflow-y: auto;
}

.el-notification.centerNotify.right {
  left: 50%;
  transform: translate(-50%, 0);
  width: 420px;
}

.centerNotify .el-notification__title {
  font-size: 14px;
  color: #1d2129;
  line-height: 22px;
}

.centerNotify .el-notification__content {
  font-size: 12px;
  color: #4e5969;
  line-height: 20px;
}

.centerNotify .el-notification__icon {
  height: 14px;
  width: 14px;
  font-size: 16px;
  line-height: 22px;
}

.centerNotify .el-notification__group {
  margin-left: 8px;
}


.svgIcon {
  width: 24px;
  height: 24px;
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden;
}


.vnode-radio .el-radio__label {
  display: none
}

.db-form-item .el-form-item__label {
  line-height: 1.2;
}
