@use '../../helpers/baseMixin.scss';

.vxe-list-design--field-search-popup {
  border-bottom: 1px solid var(--vxe-ui-list-design-table-border-color);
  table {
    width: 100%;
    border: 0;
    table-layout: fixed;
    word-break: break-all;
    border-spacing: 0;
    border-collapse: separate;
    th {
      position: sticky;
      top: 0;
      text-align: left;
      border-top: 1px solid var(--vxe-ui-list-design-table-border-color);
      border-bottom: 1px solid var(--vxe-ui-list-design-table-border-color);
      border-left: 1px solid var(--vxe-ui-list-design-table-border-color);
      background-color: var(--vxe-ui-list-design-table-header-background-color);
      z-index: 7;
    }
    td {
      border-top: 1px solid var(--vxe-ui-list-design-table-border-color);
      border-left: 1px solid var(--vxe-ui-list-design-table-border-color);
    }
    tr {
      &:first-child {
        td {
          border-top: 0;
        }
      }
      &:hover {
        background-color: var(--vxe-ui-font-primary-hover-color);
      }
    }
    th,
    td {
      height: 44px;
      padding: 0 0.6em;
      &:last-child {
        border-right: 1px solid var(--vxe-ui-list-design-table-border-color);
      }
    }
  }
}
.vxe-list-design--field-search-checkbox-option {
  @include baseMixin.createCheckboxIcon();
}
.vxe-list-design--field-search-checkbox-option {
  padding-right: 0.4em;
  flex-shrink: 0;
  user-select: none;
}
.vxe-list-design--field-search-option-item {
  &.col--visible {
    text-align: center;
  }
}


.vxe-list-design--search-item-list {
  .vxe-list-design--search-item {
    display: flex;
    flex-direction: row;
    align-items: center;
    height: 1.8em;
    padding: 0 0.5em;
    &:hover {
      background-color: var(--vxe-ui-base-hover-background-color);
    }
  }
  .vxe-list-design--search-item-title {
    flex-grow: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .vxe-list-design--search-item-btn {
    flex-shrink: 0;
  }
}