table.entity-list-table {
  table-layout: fixed;
  color: #000;
  @include media-breakpoint-up(md) {
    overflow: visible;
  }

  td {
    border-top: 0;
  }

  tr.selected {
    border: 2px solid #000;
  }

  .sorting-widget {
    color: #8E8EA9;
  }

  th {
    vertical-align: inherit;
    &.checkbox-field-header {
      width: 40px;
    }
    border: 1px solid #E3E3E3;
    background-color: #fff;
    height: 50px;
    font-size: 14px;
  }

  &.table-striped {
    tbody {
      border: 1px solid #E3E3E3;
      tr {
        &:nth-of-type(odd) {
          background-color: #F2F7FF;
          td {
            &:first-child {
              background-color: #F2F7FF;
            }
          }
        }
        &:nth-of-type(even) {
          background-color: #fff;
        }
        td {
          &:first-child {
            border: 0;
            //background-color: $almostWhite;
          }
          &:not(:last-child) {
            overflow: hidden;
            text-overflow: ellipsis;
          }
          white-space: nowrap;
          max-width: 0;
          .small-action-button {
            width: 28px;
            height: 28px;
            border-radius: 4px;
            font-size: 17px;
            padding: 0;
            line-height: 28px;
            margin-right: 5px;
            &.btn-primary {
              color: $primary;
              background-color: unset;
            }
            &.btn-secondary {
              color: $secondary;
              background-color: unset;
            }
            &.btn-danger {
              color: $danger;
              background-color: unset;
            }
          }
          .dropleft {
            button {
              height: 37px;
              width: 19px;
              text-align: center;
              padding: 0;
              border-radius: 0 4px 4px 0;
              background-color: unset;
              color: #8e8ea9;
              border: 0;
              i {
                font-size: 17px;
                line-height: 37px;
              }
              &:focus {
                box-shadow: none;
              }
              &[aria-expanded="true"] {
                background-color: $secondary;
                color: #fff;
              }
            }
            .dropdown-menu {
              border-radius: 4px 0 4px 4px;
            }
          }
        }
      }
    }
  }

  .header-search-row {
    display: none;

    &.active {
      display: table-row;
    }

    .searching-widget {
      input {
        height: calc(2.25rem + 2px);
      }
    }
  }

  .entity-field-header {
    white-space: nowrap;
    overflow: hidden;
    user-select: none;

    & > * {
      white-space: nowrap;
    }

    &.identifier-header-type {
      width: 100px;
    }

    &.boolean-header-type {
      width: 100px;
    }

    &.actions-table-header {
      width: 180px;
    }

    &.resize-stretched {
      width: 70%;
    }

    .entity-field-title {
    }

    .entity-field-sort {
      width: 30px;
      padding-left: 10px;
      margin-left: auto;

      form.sorting-widget {
        cursor: pointer;

        i.active {
          color: $primary;
        }
      }
    }
  }
}

.table-header-btn {
  height: 24px;
  line-height: 24px;
  padding-top: 0;
  padding-bottom: 0;
}

.header-search-row-toggler {
  &,
  &:hover,
  &:focus,
  &:active {
    box-shadow: none;
    background: $primary;
    color: #fff;
  }

  &.active,
  &.active:hover,
  &.active:focus,
  &.active:active {
    background: transparent;
    color: $primary;
    border: 1px solid $primary;
  }
}


.pagination-widget {
  display: flex;
  justify-content: end;
  gap: 10px;

  .list-page-input {
    width: 36px;
    padding: 0 0 0 2px;
    text-align: center;
    height: 23px;
    line-height: 23px;
    font-size: 14px;
    -moz-appearance: textfield;
    &::-webkit-outer-spin-button, &::-webkit-inner-spin-button {
      -webkit-appearance: none;
      margin: 0;
    }
  }
  .input-group-append {
    height: 23px;
    .input-group-text {
      margin: 0;
      padding: 0 10px;
    }
  }
  .btn {
    text-align: center;
    padding: 0;
    &:hover {
      color: $primary;
    }
    &:focus {
      box-shadow: none;
    }
  }

}

.quick-filter {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
  align-self: center;
  .quick-filter-item {
    margin-right: 25px;
    .quick-filter-link {
      color: #000000;
      text-decoration: none;
      font-size: 14px;
      &.active {
        color: $primary;
      }
      &.disable {
        color: #8E8EA9;
        cursor: not-allowed;
      }
    }
  }
}

.multi-form-entity-table {
  .form-group {
    margin-bottom: 0;
  }
  #global-search, button {
    font-size: 14px;
  }
}

.custom-dropdown-wrap {
  .dropdown-toggle {
    background-color: #fff;
    border: 1px solid #CED4DA;
    border-radius: .35rem;
    color: #343A40;
    font-size: 14px;
    padding: 0 10px;
  }
  .dropdown-menu {
    margin-top: 0;
    padding: 0;
    border-radius: .35rem;
    min-width: 100%;
    .dropdown-item {
      font-size: 14px;
      padding: 5px 10px;
      &:active {
        background-color: $primary;
      }
    }
  }
  span {
    font-size: 14px;
    margin: 0 5px;
  }
}

input[type="checkbox"].form-control:focus {
  border: 0;
  box-shadow: none;
}


.page-top-wrap,
.page-bottom-wrap {
  .row {
    .col {
      display: flex;
      gap: 10px;
    }
    .col + .col {
      flex-direction: row-reverse;
    }
  }
}

.page-top-wrap {
  padding-top: 10px;
}

.searching-by-empty {
  display: flex;
  justify-content: space-between;
  align-items: center;
  .search-empty-label {
    margin: 0;
    margin-left: 5px;
    cursor: pointer;
  }
  .search-empty-input {
    display: none;
  }
}

.searching-by-empty-type {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  div:first-child {
    width: 100%;
    div:first-child {
      width: 100%;
    }
    .search-empty-label {
      margin: 0;
      margin-left: 5px;
      cursor: pointer;
    }
    .search-empty-input {
      display: none;
    }
  }
}