.dataTables_wrapper table.table-list {
  margin: 10px 0 !important;
  width: 100% !important;
  border-radius: var(--rounding-sm);
  border: 1px solid #ddd;
}

.dataTables_wrapper table.table-list thead th {
  border-bottom: 4px solid rgba(29, 57, 101, 0.2);
  font-weight: normal;
}
.dataTables_wrapper table.table-list thead th:first-child {
  border-radius: var(--rounding-sm) 0 0 0;
}
.dataTables_wrapper table.table-list thead th:visible:last-child {
  border-radius: var(--rounding-sm) 0 0 0;
}
.dataTables_wrapper table.table-list tr:last-child td:first-child {
  border-radius: 0 0 0 var(--rounding-sm);
}
.dataTables_wrapper table.table-list tr:last-child td:visible:last-child {
  border-radius: 0 0 var(--rounding-sm) 0;
}

.dataTables_wrapper table.table-list thead th.sorting_asc,
.dataTables_wrapper table.table-list thead th.sorting_desc {
  background-color: #f6f6f6;
}

.dataTables_wrapper .dataTables_filter {
  float: right;
}

.dataTables_wrapper .dataTables_filter label .form-control {
  background: url('../../../assets/img/search.png') #fff no-repeat 8px 5px;
  padding: 7px 10px 7px 45px!important;
  height: auto;
  font-size: 0.9rem;
}

@media (max-width: 600px) {
  .dataTables_wrapper .dataTables_info {
    padding: 9px 10px 40px;
  }
  .dataTables_wrapper .dataTables_filter {
    float: right;
    margin-top: 30px;
    width: 100%;
  }
  .dataTables_wrapper .dataTables_filter label {
    display: block;
    margin: 5px;
    padding: 0;
  }
  .dataTables_wrapper .dataTables_filter label .form-control {
    margin: 0;
    width: 100%;
  }
}

.dataTables_wrapper .dataTables_paginate {
  float: right;
}

.pagination>li>a,
.pagination>li>span {
  color: #444;
}
.pagination>.active>a,
.pagination>.active>a:focus,
.pagination>.active>a:hover,
.pagination>.active>span,
.pagination>.active>span:focus,
.pagination>.active>span:hover,
.page-item.active .page-link {
  background-color: #4f5360;
  border-color: #4f5360;
}

table.table-list thead th {
  padding: 8px;
  background-color: #fff;
  border-bottom: 1px solid #ccc;
  color: #333;
  text-align: center;
}

table.table-list tbody td {
  padding: 10px 8px;
  vertical-align: middle;
  font-size: 0.9em;

  &.py-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
}

.table-list > tbody > tr > td a.border-left {
  border-left: 1px solid #eee;
  padding-left: 20px;
  display: block;
}

.table-list > tbody > tr > td {
  background-color: #fff;
}
.table-list > tbody > tr:hover {
  cursor: pointer;
}
.table-list > tbody > tr:hover > td {
  background-color: #f9f9f9;
}

table.dtr-inline .dtr-title:empty {
  display: none !important;
}

table.table-solid-bottom-border-light-gray {
  border-bottom:1px solid var(--border);
}

table.ox-table-accounts {
  td {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
  }
  .dropdown-hamburger::after {
    display: none;
  }
  ul.dropdown-menu button.btn-sm {
    border-radius: 0;
  }
  tbody.account-entry > tr:hover {
    background-color: rgba(0,0,0,.05);
  }
  tbody.account-entry {
    cursor: pointer;
  }
  tbody.aliases-body {
    & > tr > td {
      border-top: 0;
    }
    border-top: 0;
  }
  tr.alias-entry td:first-child {
    font-size: .9em;
  }
  tr.create-alias td:first-child {
    font-size: .9em;
  }
  span.email-aliases {
    font-size: .9em;
    font-weight: bold;
  }
  .input-group {
    width: 65%;
  }
}

// DataTables
body .dataTables_wrapper {
  table.table-list {
    border-radius: var(--rounding-md);

    thead th {
      border: none;

      &:first-child {
        border-radius: var(--rounding-md) 0 0 0;
      }

      &:last-child {
        border-radius: 0 var(--rounding-md) 0 0;
      }
    }

    td {
      text-align: center;
    }

    tr:last-child td {
      &:first-child {
        border-radius: 0 0 0 var(--rounding-md);
      }

      &:last-child {
        border-radius: 0 0 var(--rounding-md) var(--rounding-md);
      }
    }

    .label.status {
      border-radius: var(--rounding-lg);
      padding-right: 8px;
      padding-left: 8px;
    }
  }
}

body .dataTables_wrapper .dataTables_filter label .form-control {
   width: 300px;
 }

// DataTables search input > search icon
body .dataTables_wrapper .dataTables_filter {
  position: relative;

  label .form-control {
    background: white;
  }

  &::after {
    font-family: 'Font Awesome 6 Pro';
    font-size: 14px;
    content: '\f002';
    position: absolute;
    left: 20px;
    top: 50%;
    transform: translateY(-67%);
    color: var(--text-muted);
    pointer-events: none;
  }
}