/**
 * ProScore DataTables overrides
 * Keep vendor bundles untouched and centralize house styling here.
 */

:root {
  --ps-dt-button-font-size: 0.8125rem;
  --ps-dt-button-line-height: 1.2;
  --ps-dt-button-padding-y: 0.375rem;
  --ps-dt-button-padding-x: 0.7rem;
  --ps-dt-button-gap: 0;
  --ps-dt-button-radius: 0;
  --ps-dt-button-min-height: 2rem;
  --ps-dt-button-shadow: none;
}

[data-bs-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.current,
[data-bs-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover,
[data-bs-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.current:focus,
[data-bs-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.active,
[data-bs-theme="dark"] .dt-container .dt-paging .dt-paging-button.current,
[data-bs-theme="dark"] .dt-container .dt-paging .dt-paging-button.current:hover,
[data-bs-theme="dark"] .dt-container .dt-paging .dt-paging-button.active,
[data-bs-theme="dark"] .dataTables_wrapper .pagination .page-item.active .page-link,
[data-bs-theme="dark"] .dt-container .pagination .page-item.active .page-link {
  background: var(--ps-accent-gradient) !important;
  border-color: var(--ps-accent) !important;
  color: var(--ps-accent-contrast, #fff) !important;
  box-shadow: 0 10px 24px rgba(var(--ps-accent-strong-rgb), 0.3) !important;
}

[data-bs-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button:hover,
[data-bs-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button:focus,
[data-bs-theme="dark"] .dt-container .dt-paging .dt-paging-button:hover,
[data-bs-theme="dark"] .dt-container .dt-paging .dt-paging-button:focus,
[data-bs-theme="dark"] .dataTables_wrapper .pagination .page-link:hover,
[data-bs-theme="dark"] .dataTables_wrapper .pagination .page-link:focus,
[data-bs-theme="dark"] .dt-container .pagination .page-link:hover,
[data-bs-theme="dark"] .dt-container .pagination .page-link:focus {
  background: rgba(var(--ps-accent-rgb), 0.16) !important;
  border-color: rgba(var(--ps-accent-soft-rgb), 0.42) !important;
  color: #fff !important;
  box-shadow: 0 0 0 0.2rem rgba(var(--ps-accent-rgb), 0.16) !important;
}

[data-bs-theme="dark"] .dataTables_wrapper .dataTables_filter input:focus,
[data-bs-theme="dark"] .dataTables_wrapper input:focus,
[data-bs-theme="dark"] .dataTables_wrapper textarea:focus,
[data-bs-theme="dark"] .dataTables_wrapper select:focus,
[data-bs-theme="dark"] .dt-container .dt-input:focus {
  border-color: var(--ps-accent) !important;
  box-shadow: 0 0 0 0.2rem rgba(var(--ps-accent-rgb), 0.18) !important;
}

[data-bs-theme="dark"] .dt-button-collection .dt-button.active,
[data-bs-theme="dark"] .dt-button-collection button.active,
[data-bs-theme="dark"] .dt-button-collection a.active,
[data-bs-theme="dark"] .buttons-collection .dt-button.active,
[data-bs-theme="dark"] .buttons-collection button.active,
[data-bs-theme="dark"] .buttons-collection a.active,
[data-bs-theme="dark"] .dt-button-collection .dt-button.dt-button-active,
[data-bs-theme="dark"] .buttons-collection .dt-button.dt-button-active,
[data-bs-theme="dark"] .dtsp-searchPane table.dataTable tbody tr.selected,
[data-bs-theme="dark"] .editor-datetime-calendar td.selected,
[data-bs-theme="dark"] .select2-container--default .select2-results__option--highlighted[aria-selected],
[data-bs-theme="dark"] .bootstrap-select .dropdown-item.active {
  background: var(--ps-accent-gradient) !important;
  border-color: var(--ps-accent) !important;
  color: var(--ps-accent-contrast, #fff) !important;
}

[data-bs-theme="dark"] .dt-rowReorder-float,
[data-bs-theme="dark"] .dt-autofill-handle,
[data-bs-theme="dark"] .DTCR_pointer {
  background-color: var(--ps-accent) !important;
  border-color: var(--ps-accent) !important;
}

[data-bs-theme="dark"] .dt-autofill-select {
  background-color: rgba(var(--ps-accent-rgb), 0.3) !important;
  border-color: var(--ps-accent) !important;
}

[data-bs-theme="dark"] .dt-autofill-background {
  background-color: rgba(var(--ps-accent-rgb), 0.15) !important;
}

[data-bs-theme="dark"] .focus {
  background-color: var(--ps-accent) !important;
  color: var(--ps-accent-contrast, #fff) !important;
  outline-color: var(--ps-accent-soft) !important;
}

.dt-container .dt-buttons,
.dataTables_wrapper .dt-buttons {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--ps-dt-button-gap);
  width: auto !important;
  max-width: 100%;
  flex: 0 0 auto;
}

.dt-container .dt-buttons > .btn,
.dt-container .dt-buttons > .dt-button,
.dt-container .dt-buttons > .btn-group,
.dataTables_wrapper .dt-buttons > .btn,
.dataTables_wrapper .dt-buttons > .dt-button,
.dataTables_wrapper .dt-buttons > .btn-group {
  margin-right: 0 !important;
  margin-left: 0 !important;
}

.dt-container .dt-buttons .btn,
.dt-container .dt-buttons .dt-button,
.dt-container .btn-group > .btn,
.dt-container .buttons-collection,
.dataTables_wrapper .dt-buttons .btn,
.dataTables_wrapper .dt-buttons .dt-button,
.dataTables_wrapper .buttons-collection,
.dt-button-collection .dt-button,
.dt-button-collection button,
.dt-button-collection a,
.dtsp-searchPane .dt-button,
.dtsp-searchPane .btn,
.dtsb-searchBuilder .dt-button,
.dtsb-searchBuilder .btn {
  min-height: var(--ps-dt-button-min-height) !important;
  padding: var(--ps-dt-button-padding-y) var(--ps-dt-button-padding-x) !important;
  font-size: var(--ps-dt-button-font-size) !important;
  line-height: var(--ps-dt-button-line-height) !important;
  border-radius: var(--ps-dt-button-radius) !important;
  box-shadow: var(--ps-dt-button-shadow) !important;
}

.dt-container .dt-buttons .btn,
.dt-container .dt-buttons .dt-button,
.dt-container .buttons-collection,
.dataTables_wrapper .dt-buttons .dt-button,
.dataTables_wrapper .dt-buttons .btn,
.dataTables_wrapper .buttons-collection {
  margin-right: 0 !important;
  margin-left: 0 !important;
}

.dt-container .dt-buttons .btn > span,
.dt-container .dt-buttons .dt-button > span,
.dataTables_wrapper .dt-buttons .btn > span,
.dataTables_wrapper .dt-buttons .dt-button > span,
.dt-button-collection .dt-button > span,
.dtsp-searchPane .dt-button > span,
.dtsb-searchBuilder .dt-button > span {
  font-size: inherit !important;
  line-height: inherit !important;
}

.dt-container .dt-button-collection,
.dataTables_wrapper .dt-button-collection {
  padding: 0.35rem;
  border-radius: 0;
}

.dt-container .dt-button-collection .dt-button,
.dt-container .dt-button-collection button,
.dt-container .dt-button-collection a,
.dataTables_wrapper .dt-button-collection .dt-button,
.dataTables_wrapper .dt-button-collection button,
.dataTables_wrapper .dt-button-collection a {
  min-height: auto !important;
  padding: 0.45rem 0.7rem !important;
  border-radius: 0 !important;
}

.dtsp-searchPanes .dtsp-paneInputButton,
.dtsp-searchPanes .dtsp-clearAll,
.dtsp-searchPanes .dtsp-collapseAll,
.dtsp-searchPanes .dtsp-showAll,
.dtsb-searchBuilder button {
  min-height: var(--ps-dt-button-min-height);
  font-size: var(--ps-dt-button-font-size);
}

@media (max-width: 767.98px) {
  .dt-container .dt-buttons,
  .dataTables_wrapper .dt-buttons {
    gap: 0;
  }

  .dt-container .dt-buttons .btn,
  .dt-container .dt-buttons .dt-button,
  .dt-container .buttons-collection,
  .dataTables_wrapper .dt-buttons .dt-button,
  .dataTables_wrapper .dt-buttons .btn,
  .dataTables_wrapper .buttons-collection {
    padding: 0.35rem 0.6rem !important;
    font-size: 0.75rem !important;
  }
}