.column-setting-container {
  padding: 24px 6%;
}

.phoenix-table {
  border-radius: var(--table-border-radius-top, 0) var(--table-border-radius-top, 0) 0 0;
  position: relative;
  display: flex;
  overflow: hidden;
  max-width: 100%;
  flex-direction: column;
  font-family: "PingFang SC", "Hiragino Sans GB", STHeitiSC, Helvetica, "Helvetica Neue", "Microsoft YaHei", Tahoma;
}

.phoenix-table th.white-th,
.phoenix-table th.setting-th {
  display: none;
}

.phoenix-table .white-th:hover {
  background: #FAFAFB !important;
}

.phoenix-table .white-th:hover .phoenix-table-resize-spanner {
  background: #FAFAFB !important;
}

.phoenix-table .setting-th {
  box-shadow: none !important;
  padding: 8px 0;
}

.phoenix-table .setting-th .phoenix-table-th-cell {
  padding: 0;
  cursor: pointer;
  max-width: 26px;
  min-width: 26px;
}

.phoenix-table .setting-th .phoenix-unmodeled-layer {
  position: relative;
  display: inline-block;
  width: 26px;
}

.phoenix-table .setting-th .phoenix-unmodeled-layer svg {
  width: 18px !important;
  height: 18px !important;
}

.phoenix-table .setting-region .phoenix-unmodeled-layer__content svg {
  position: relative;
  left: 5px;
  top: 8px;
}

.phoenix-table .action-btn .phoenix-unmodeled-layer__content svg {
  position: relative;
  left: 0px;
  top: 2px;
}

.phoenix-table .phoenix-avator--xxsm .phoenix-avator__nameWraper {
  white-space: normal;
}

.phoenix-table-tag-cell {
  padding-left: 0 !important;
}

.phoenix-table-no-data {
  text-align: center;
  position: relative;
  /* top: 69px; */
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  align-content: center;
}

.phoenix-table-no-data-text {
  color: #565e66;
  font-size: 14px;
  padding-top: 10px;
  line-height: 22px;
}

.phoenix-table-edit-cell:hover .phoenix-table-cell-wrapper-in-edit {
  background-color: transparent !important;
}

.phoenix-table-link-cell {
  padding: 0 8px !important;
}

.phoenix-table .phoenix-select,
.phoenix-table .phoenix-input,
.phoenix-table .phoenix-input-number {
  min-width: auto;
}

.phoenix-table .setting-region {
  position: absolute;
  z-index: 999;
  right: 0px;
  width: 26px;
  height: 40px;
  top: 0px;
  background: #FAFAFB;
  color: #565e66;
}

.phoenix-table .setting-region:hover {
  color: #1d86f0;
}

.phoenix-table .setting-region .phoenix-unmodeled-layer__content {
  position: relative;
  top: 2px;
}

.phoenix-table-edit-cell {
  min-height: 26px;
  line-height: 26px;
}

.phoenix-table-edit-cell .validateError {
  color: #FF475A;
  font-size: 12px;
  line-height: 20px;
  padding: 0 8px;
  display: inline-block;
}

.phoenix-table-edit-cell .phoenix-input__input--sizeSmall {
  line-height: 26px;
}

.phoenix-table-ellipsis .phoenix-table-cell-tooltip {
  display: block;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  max-width: 100%;
  color: #33383d;
  position: relative;
}

.phoenix-table-ellipsis-text {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  max-width: 100%;
}

.phoenix-table-cell-tooltip {
  line-height: 20px;
  max-width: 100%;
  position: relative;
  color: #33383d;
}

.phoenix-table-cell-wrapper {
  display: block;
  width: 100%;
  line-height: 20px;
  border: 1px solid transparent;
  color: #33383d;
  border-radius: 3px;
}

.phoenix-table-cell-wrapper:hover {
  border: 1px solid #85c2ff;
  border-radius: 3px;
  background: #ffffff;
  cursor: pointer;
}

.phoenix-table-cell-wrapper .phoenix-input-number--small .phoenix-input-number__input {
  height: 26px;
  line-height: 26px;
}

.phoenix-table-cell-wrapper .phoenix-select__inputWrapper--emptyMultiValue {
  height: inherit !important;
  line-height: 20px;
}

.phoenix-table-cell-wrapper .phoenix-select__input {
  height: inherit !important;
  line-height: 20px;
}

.phoenix-table-cell-wrapper-in-edit:hover {
  border: 1px solid transparent !important;
  border-radius: 3px;
  cursor: pointer;
}

.phoenix-table-cell-content {
  padding: 0 0 0 8px;
  position: relative;
}

.phoenix-table-edit-cell {
  padding: 0 !important;
}

.phoenix-table .action-container {
  text-align: left;
  white-space: nowrap;
  padding: 0 8px;
}

.phoenix-table .action-container-small {
  text-align: center;
}

.phoenix-table .action-container .action-btn {
  color: #5CADFF;
  max-width: 108px;
}

.phoenix-table .action-container .action-btn:not(:first-child) {
  margin-left: 12px;
}

.phoenix-table .action-container .action-btn:hover {
  color: #1d86f0;
  cursor: pointer;
}

.phoenix-table .action-container .action-btn svg {
  position: relative;
  top: 4px;
}

.phoenix-table .action-container .phoenix-text-button__textWraper {
  max-width: 108px !important;
  color: #106ecc;
}

.phoenix-table .action-container .phoenix-text-button__textWraper:hover {
  color: #1d86f0;
}

.phoenix-table-th-cell {
  min-width: 12px;
  padding: 0 0 0 8px;
  width: 100%;
  height: 20px;
  position: relative;
}

.phoenix-table-th-cell-title {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block;
  white-space: nowrap;
  user-select: none;
  position: relative;
}

.phoenix-table-th-cell-title > span {
  width: 100%;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block;
  white-space: nowrap;
}

.phoenix-table-th-cell,
.phoenix-table-cell {
  padding-left: 8px;
  line-height: 20px;
  min-height: 20px;
}

.phoenix-table-avatar-cell {
  padding: 0 0 !important;
  display: flex;
  align-items: center;
}

.phoenix-table-cell {
  position: relative;
}

.phoenix-table-cell-error .phoenix-table-cell-tooltip {
  color: #FF475A !important;
}

.phoenix-table-cell-error .phoenix-table-cell-wrapper {
  color: #FF475A !important;
}

.phoenix-table a {
  color: #106ecc;
  text-decoration: none;
  cursor: pointer;
}

.phoenix-table a:hover {
  color: #1d86f0;
}

.phoenix-table-editable .phoenix-table-cell-tooltip {
  padding: 3px 6px;
}

.phoenix-table-pagination-container-no-data::before {
  height: 0 !important;
}

.phoenix-table-pagination-container {
  height: 47px;
  padding-top: 10px;
  color: #83898f;
  font-size: 12px;
  position: relative;
  justify-content: space-between;
  padding: 10px 12px;
  width: 100%;
  margin: 0px !important;
  box-sizing: border-box;
}

.phoenix-table-pagination-container .phoenix-pagination {
  margin: 0;
  float: right;
  overflow: hidden;
}

.phoenix-table-pagination-container .phoenix-pagination__numberButtonGroup {
  height: inherit !important;
  box-sizing: border-box !important;
}

.phoenix-table-pagination-container::before {
  position: absolute;
  width: 100%;
  height: 1px;
  top: -1px;
  z-index: 999;
  content: ' ';
  left: 0;
  background-color: #f0f2f5;
}

.phoenix-table-pagination .phoenix-checkbox__realInput {
  top: 1px;
}

.phoenix-table-pagination .phoenix-checkbox__text {
  position: relative;
  top: 1px;
}

.phoenix-table-pagination-select-wrap {
  line-height: 26px;
  float: left;
}

.phoenix-table-pagination-select-wrap .page-selected-tip {
  margin-right: 12px;
}

.phoenix-table-pagination-allselect {
  line-height: 20px;
  display: inline-flex;
  height: 20px;
  position: relative;
  top: 1px;
}

.phoenix-table-pagination-allselect .phoenix-checkbox {
  top: -2px;
}

.phoenix-table-pagination-allselect .phoenix-checkbox__text {
  width: auto;
}

.phoenix-table .phoenix-radio {
  position: absolute;
  margin-top: -8px;
  top: 50%;
}

.phoenix-table [class^='phoenix-tag__'] {
  display: inline-flex;
  line-height: 18px;
}

.phoenix-table .phoenix-avator {
  display: block;
}

.phoenix-table .avatar-username {
  flex: 1;
  margin-left: 8px;
}

.phoenix-table .phoenix-checkbox {
  min-width: auto;
}

.phoenix-table table {
  min-width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  color: #0e1114;
  font-size: 12px;
  line-height: 20px;
  table-layout: fixed;
}

.phoenix-table table > thead > tr > th,
.phoenix-table table > tbody > tr > th,
.phoenix-table table > tfoot > tr > th,
.phoenix-table table > thead > tr > td,
.phoenix-table table > tbody > tr > td,
.phoenix-table table > tfoot > tr > td {
  position: relative;
  padding: 8px 12px;
  border-bottom: 1px solid #f0f2f5;
  line-height: 20px;
  word-break: break-all;
}

.phoenix-table table > thead > tr > th {
  font-weight: normal;
  padding: 10px 12px;
  border-bottom-width: 0;
  background-color: #FAFAFB;
  min-width: 12px;
  color: #0e1114;
  position: relative;
  vertical-align: middle;
}

.phoenix-table table > thead > tr > th.no-hover {
  background: #FAFAFB !important;
}

.phoenix-table table > thead > tr > th:hover {
  background: #f0f2f5;
}

.phoenix-table table > thead > tr > th .highlight-cell-mask {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(133, 194, 255, 0.15);
  display: none;
  pointer-events: none;
  z-index: 0;
}

.phoenix-table table > thead > tr > th.highlight .highlight-cell-mask {
  display: block;
}

.phoenix-table table > thead th:hover .phoenix-table-resize-spanner {
  background: #e6e8eb;
}

.phoenix-table table > thead + tbody > tr:first-child > td {
  border-top: 1px solid var(--table-border-color, #ddd);
}

.phoenix-table table > tbody + tbody {
  border-top: 1px solid var(--table-border-color, #ddd);
}

.phoenix-table table table {
  background-color: #fff;
}

.phoenix-table table > tbody > tr {
  position: relative;
}

.phoenix-table table > tbody tr td.phoenix-table-checkbox .phoenix-table-cell {
  padding: 0;
}

.phoenix-table table > tbody tr td .highlight-cell-mask {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(133, 194, 255, 0.15);
  display: none;
  pointer-events: none;
  z-index: 0;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .phoenix-table table > tbody tr td .highlight-cell-mask {
    padding-top: 100%;
    padding-bottom: 100%;
  }
}

.phoenix-table table > tbody tr td.highlight .highlight-cell-mask {
  display: block;
}

table tr .phoenix-table-checkbox {
  padding-right: 0;
  padding-left: 0;
  text-align: center;
}

table tr .phoenix-table-checkbox label {
  margin-right: 0;
}

table tr .phoenix-table-checkbox i {
  vertical-align: top;
}

.phoenix-table caption {
  padding-top: 10px;
  padding-bottom: 10px;
  color: var(--gray-500, #adb5bd);
  text-align: left;
}

.phoenix-table th {
  text-align: left;
}

.phoenix-table-vertical-top td {
  vertical-align: top;
}

.phoenix-table-vertical-middle td {
  vertical-align: middle;
}

.phoenix-table-sorter-container {
  position: absolute;
  top: 0px;
  cursor: pointer;
  width: 20px;
}

.phoenix-table-sorter-asc,
.phoenix-table-sorter-desc {
  position: relative;
  left: 4px;
  width: 10px;
  color: #bfc3c7;
}

.phoenix-table-sorter-asc {
  top: -5px;
  bottom: 0;
}

.phoenix-table-sorter-desc {
  transform: rotate(180deg);
  top: 1px;
  left: -6px;
}

.phoenix-table-sorter-active.phoenix-table-sorter-asc {
  color: #1d86f0;
}

.phoenix-table-sorter-active.phoenix-table-sorter-desc {
  color: #1d86f0;
}

th.phoenix-table-center {
  text-align: center;
}

table > thead > tr > th.phoenix-table-condensed {
  padding: 5px 10px;
}

.phoenix-table-hover table > tbody > tr:hover > td {
  background-color: #F4FAFF;
}

.phoenix-table-normal td {
  background-color: #ffffff;
}

.phoenix-table-small table > tbody > tr > th,
.phoenix-table-small table > tbody > tr > td {
  padding-top: 4px !important;
  padding-bottom: 4px !important;
}

.phoenix-table-middle table > tbody > tr > th,
.phoenix-table-middle table > tbody > tr > td {
  padding-top: 8px;
  padding-bottom: 8px;
}

.phoenix-table-large table > tbody > tr > th,
.phoenix-table-large table > tbody > tr > td {
  padding-top: 16px;
  padding-bottom: 16px;
}

.phoenix-table-bordered {
  position: relative;
  border-left: 1px solid #f0f2f5;
  border-right: 1px solid #f0f2f5;
  border-bottom: 1px solid #f0f2f5;
  border-top: 1px solid #f0f2f5;
}

.phoenix-table-bordered .phoenix-table-ignore-right-border,
.phoenix-table-bordered phoenix-table-ignore-bottom-border {
  border-right: none;
}

.phoenix-table-bordered .phoenix-table-ignore-right-border:after,
.phoenix-table-bordered phoenix-table-ignore-bottom-border:after {
  display: none;
}

.phoenix-table-bordered .phoenix-table-head::after {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 100%;
  left: 0;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0));
  content: ' ';
}

.phoenix-table-bordered .phoenix-table-head table {
  border-bottom-width: 0px;
}

.phoenix-table-bordered table > thead > tr > th,
.phoenix-table-bordered table > tbody > tr > th,
.phoenix-table-bordered table > tfoot > tr > th,
.phoenix-table-bordered table > thead > tr > td,
.phoenix-table-bordered table > tbody > tr > td,
.phoenix-table-bordered table > tfoot > tr > td {
  border-right: 1px solid #f0f2f5;
  border-bottom-width: 1px;
}

.phoenix-table-bordered table > tbody tr:last-child td {
  border-bottom: none;
}

.phoenix-table-bordered table > tbody > tr > td.phoenix-table-ignore-bottom-border {
  border-bottom: none;
}

.phoenix-table-bordered table > thead + tbody > tr:first-child > td {
  border-top-width: 0px;
}

.phoenix-table-bordered .phoenix-table-body table {
  border-top-width: 0;
  border-bottom: 1px solid #f0f2f5;
}

.phoenix-table-bordered .phoenix-table-float-right .phoenix-table-float-left:before {
  bottom: -1px;
}

.phoenix-table-bordered .phoenix-table-float-right .phoenix-table-float-left:after {
  bottom: -1px;
}

.phoenix-table-bordered .th:first-child {
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}

.phoenix-table-bordered .th:last-child {
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.phoenix-table-bordered .phoenix-table-fixed-right,
.phoenix-table-bordered .phoenix-table-fixed-left {
  border-right: 0;
  z-index: 1;
}

.phoenix-table-bordered .phoenix-table-fixed-right:after,
.phoenix-table-bordered .phoenix-table-fixed-left:after {
  bottom: -1px;
  position: absolute;
  content: ' ';
  background: #f0f2f5;
  height: 100%;
  width: 1px;
  top: 0;
  right: 0;
}

.phoenix-table table > tbody > tr > td {
  width: 100%;
}

table > tbody > tr.phoenix-table-even > td {
  background-color: #FBFCFD;
}

table > tbody > tr.phoenix-table-selected > td {
  background-color: #F4FAFF !important;
}

.phoenix-table-head {
  position: relative;
  flex: 0 0 auto;
  background: #FAFAFB;
  opacity: 0.999999;
}

.phoenix-table-head-fixed {
  z-index: 100;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.08);
}

.phoenix-table-head > table {
  border-bottom: 0 solid #f0f2f5;
}

.phoenix-table .phoenix-table-label {
  display: inline-block;
  vertical-align: middle;
}

.phoenix-table .phoenix-table-icon-tree-expand {
  margin-right: 4px;
  display: inline-block;
  width: 14px;
  height: 14px;
  color: rgba(191, 195, 199, 0.7);
  line-height: 14px;
  text-align: center;
  background: transparent;
  cursor: pointer;
  user-select: none;
}

.phoenix-table .phoenix-table-icon-tree-expand-loading {
  position: relative;
  top: 4px;
}

.phoenix-table .phoenix-table-icon-tree-expand svg {
  position: relative;
  top: 3px;
}

.phoenix-table-icon-expand-plus,
.phoenix-table-icon-expand-sub {
  position: relative;
  display: block;
  width: 15px;
  height: 15px;
  margin: 2px 0;
  border: solid 1px var(--gray-600, #6c757d);
  background: #fff;
  border-radius: 2px;
  cursor: pointer;
}

.phoenix-table-icon-expand-plus:before,
.phoenix-table-icon-expand-sub:before,
.phoenix-table-icon-expand-plus:after,
.phoenix-table-icon-expand-sub:after {
  position: absolute;
  top: 6px;
  left: 2px;
  width: 9px;
  height: 0px;
  border-width: 0 0 1px 0;
  border-style: solid;
  border-color: inherit;
  content: ' ';
}

.phoenix-table-icon-expand-plus:hover,
.phoenix-table-icon-expand-sub:hover {
  border-color: var(--primary-color, #3399ff);
}

.phoenix-table-icon-expand-plus:hover:before,
.phoenix-table-icon-expand-sub:hover:before,
.phoenix-table-icon-expand-plus:hover:after,
.phoenix-table-icon-expand-sub:hover:after {
  background: var(--primary-color, #3399ff);
}

.phoenix-table-icon-expand-plus:after {
  top: 2px;
  left: 6px;
  width: 0;
  height: 9px;
  border-width: 0 1px 0 0;
}

.phoenix-table-scroll-y.phoenix-table-head {
  padding-right: 10px;
}

.phoenix-table-body {
  min-width: 100%;
  flex: 1 1 auto;
}

.phoenix-table-scroll-inner {
  min-width: 100%;
}

.phoenix-table-float-left .phoenix-table-fixed-left,
.phoenix-table-float-right .phoenix-table-fixed-right {
  position: relative;
  z-index: 100;
}

.phoenix-table-float-left .phoenix-table-fixed-last:after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 100%;
  width: 6px;
  background: linear-gradient(to right, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0));
  content: ' ';
}

.phoenix-table-float-right .phoenix-table-fixed-first:before {
  position: absolute;
  top: 0;
  right: 100%;
  z-index: 9999;
  bottom: 0;
  width: 6px;
  margin-right: 0px;
  background: linear-gradient(to left, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0));
  content: ' ';
}

.phoenix-table-fixed-right + .phoenix-table-fixed-right:before {
  width: 0;
}

.phoenix-table-loading {
  position: absolute;
  z-index: 11;
  top: 44px;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  overflow: hidden;
  background-color: rgba(255, 255, 255, 0.4);
  justify-content: center;
  align-items: center;
}

.phoenix-table-empty {
  position: sticky;
  left: 0;
  display: flex;
  flex: 1;
  padding: 20px;
  color: #aaa;
  font-size: 16px;
  text-align: center;
}

.phoenix-table-empty span {
  display: block;
  margin: auto;
}

.phoenix-table-bordered .phoenix-table-empty {
  border-right: 1px solid #f0f2f5;
  border-bottom: 1px solid #f0f2f5;
}

.phoenix-table-fixed .phoenix-table-empty {
  border-right-width: 0;
}

.phoenix-table-expand-indicator {
  color: #83898f;
  cursor: pointer;
}

.phoenix-table-expand-indicator svg {
  position: relative;
  top: 2px;
}

th.phoenix-table-align-center,
td.phoenix-table-align-center {
  text-align: center;
}

th.phoenix-table-align-right,
td.phoenix-table-align-right {
  text-align: right;
}

th.phoenix-table-align-left,
td.phoenix-table-align-left {
  text-align: left;
}

.phoenix-table-resize-spanner {
  z-index: 12;
  position: absolute;
  right: 0px;
  top: 0;
  bottom: 0;
  width: 3px;
  background: transparent;
  opacity: 0;
  transition: opacity 0.3s;
  cursor: e-resize;
}

.phoenix-table-resize-spanner:hover {
  background: #5cadff !important;
}

.phoenix-table-resize-spanner:after,
.phoenix-table-resize-spanner:before {
  border-width: 3px;
  content: " ";
  position: absolute;
  width: 0;
  height: 0;
  margin: auto;
  bottom: 0;
  top: 0;
}

.phoenix-table-resize table.phoenix-table-resizing span.phoenix-table-resize-spanner {
  opacity: 0;
}

.phoenix-table-resize table th.phoenix-table-resizing-item .phoenix-table-resize-spanner {
  opacity: 1;
}

.phoenix-table-resize th:hover .phoenix-table-resize-spanner {
  opacity: 1;
}

.phoenix-table-setting-panel {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.phoenix-table-setting-panel .setting-panel-item {
  padding: 10px 16px;
  overflow: hidden;
  border-bottom: 1px solid #f0f2f5;
}

.phoenix-table-setting-panel .setting-panel-item-tip {
  color: #bfc3c7;
  font-size: 12px;
}

.phoenix-table-setting-panel .setting-panel-item-padding {
  padding: 10px 0 0px 0;
  overflow: hidden;
}

.phoenix-table-setting-panel .setting-panel-item-padding a {
  color: #33383d;
}

.phoenix-table-setting-panel .setting-panel-item-padding a:hover {
  color: #1d86f0;
}

.phoenix-table-setting-panel .setting-panel-item-padding a.selected-padding {
  color: #106ecc;
}

.phoenix-table-setting-panel .setting-panel-item-padding-mode {
  float: left;
  width: 33.3333333%;
  text-align: left;
}

.phoenix-table-setting-panel .setting-panel-item-padding-mode span {
  cursor: pointer;
  padding-left: 4px;
  line-height: 20px;
  display: inline-block;
}

.phoenix-table-setting-panel .setting-panel-item-padding-mode svg {
  position: relative;
  top: 3px;
}

.phoenix-table-setting-panel .setting-panel-field-label {
  float: left;
}

.phoenix-table-setting-panel .setting-panel-field-setting {
  float: right;
  cursor: pointer;
}

.react-resizable {
  position: relative;
}

.react-resizable-handle {
  position: absolute;
  width: 10px;
  height: 100%;
  bottom: 0;
  right: 0px;
  cursor: col-resize;
}

.z-resize-proxy {
  height: calc(100% - 2px);
  top: 40px;
  border-left: 1px solid #5cadff;
}

.z-resize-block,
.z-resize-proxy {
  position: absolute;
  width: 3px;
  z-index: 99990;
}

.z-resize-block {
  top: 0px;
  height: 40px;
  background: #5cadff;
}

.react-resizable-handle {
  z-index: 1;
}

.no-selected {
  -ms-user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  user-select: none;
  cursor: e-resize;
}