/**
 * DataTables appearance overrides for the member area (depends on theme CSS variables in style.css).
 *
 * @package Arx_Pmc
 */

table.dataTable tr th,
table.dataTable tr td {
  white-space: nowrap;
}

table.dataTable.display tbody tr:hover > .sorting_1,
table.dataTable.order-column.hover tbody tr:hover > .sorting_1 {
  background: rgba(var(--theme-primary-rgb), 0.2);
}

table.dataTable.hover tbody tr:hover,
table.dataTable.display tbody tr:hover {
  background: rgba(var(--theme-primary-rgb), 0.1);
}

div[class$=_wrapper] .dataTables_paginate .paginate_button.current,
div[class$=_wrapper] .dataTables_paginate .paginate_button.current:hover {
  background: var(--theme-primary) !important;
  color: var(--white-color) !important;
}

div[class$=_wrapper] .dataTables_paginate .paginate_button:active,
div[class$=_wrapper] .dataTables_paginate .paginate_button,
div[class$=_wrapper] .dataTables_paginate .paginate_button:hover {
  color: rgba(var(--theme-primary-rgb), 0.8) !important;
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  font-weight: 500;
}

div[class$=_wrapper] .dataTables_paginate .paginate_button.disabled,
div[class$=_wrapper] .dataTables_paginate .paginate_button.disabled:hover,
div[class$=_wrapper] .dataTables_paginate .paginate_button.disabled:active {
  color: rgba(var(--black-color-rgb), 0.8) !important;
}

div[class$=_wrapper] .dt-buttons .dt-button {
  background: rgba(var(--theme-primary-rgb), 1) !important;
  color: var(--white-color) !important;
  box-shadow: none !important;
  border-color: var(--input-border);
}

div[class$=_wrapper] button.dt-button:hover:not(.disabled),
div[class$=_wrapper] div.dt-button:hover:not(.disabled),
div[class$=_wrapper] a.dt-button:hover:not(.disabled),
div[class$=_wrapper] input.dt-button:hover:not(.disabled),
div[class$=_wrapper] button.dt-button:focus:not(.disabled),
div[class$=_wrapper] div.dt-button:focus:not(.disabled),
div[class$=_wrapper] a.dt-button:focus:not(.disabled),
div[class$=_wrapper] input.dt-button:focus:not(.disabled) {
  box-shadow: none !important;
  outline: none !important;
  text-shadow: none !important;
}

/*data table*/
.dataTables_wrapper .dataTables_length, .dataTables_wrapper .dataTables_filter {
  margin-bottom: 15px;
}
.dataTables_wrapper .dataTables_length select, .dataTables_wrapper .dataTables_length input, .dataTables_wrapper .dataTables_filter select, .dataTables_wrapper .dataTables_filter input {
  border-color: var(--input-border);
  outline: none;
}
.dataTables_wrapper .dataTables_length select:focus, .dataTables_wrapper .dataTables_length input:focus, .dataTables_wrapper .dataTables_filter select:focus, .dataTables_wrapper .dataTables_filter input:focus {
  border-color: var(--input-border);
  outline: none;
}
.dataTables_wrapper .dataTables_info {
  margin-top: 15px;
}
.dataTables_wrapper .dt-button {
  background-color: var(--theme-primary);
  border-color: var(--theme-primary);
  color: var(--white-color);
}
.dataTables_wrapper .dt-button:hover {
  background-color: var(--theme-primary) !important;
}
.dataTables_wrapper .dataTables_paginate {
  margin-top: 15px;
}
.dataTables_wrapper .dataTables_paginate .paginate_button {
  border: 1px solid var(--input-border);
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
  background: var(--theme-primary) !important;
  color: var(--white-color) !important;
  border-color: var(--theme-primary) !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover, .dataTables_wrapper .dataTables_paginate .paginate_button:hover:hover {
  background: var(--theme-primary) !important;
  color: var(--white-color) !important;
  border-color: var(--theme-primary) !important;
}
.dataTables_wrapper.no-footer .dataTables_scrollBody {
  border-color: var(--input-border);
}

table.dataTable thead th {
  border: 1px solid var(--input-border);
}
table.dataTable tfoot {
  margin-top: 15px;
}
table.dataTable tfoot th, table.dataTable tfoot td {
  border: 1px solid var(--input-border);
}
