#projectArticlePickerPage .project-picker-toolbar {
  display: flex;
  gap: 16px;
  justify-content: space-between;
  align-items: end;
  flex-wrap: wrap;
}

#projectArticlePickerPage .project-picker-toolbar__main {
  display: grid;
  gap: 8px;
  min-width: 220px;
}

#projectArticlePickerPage .project-picker-toolbar__actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

#projectArticlePickerPage table.dataTable td.select-checkbox,
#projectArticlePickerPage table.dataTable th.select-checkbox {
  width: 42px;
  text-align: center;
}

#projectArticlePickerPage table.dataTable td.select-checkbox::before,
#projectArticlePickerPage table.dataTable th.select-checkbox::before,
#projectArticlePickerPage table.dataTable tr.selected td.select-checkbox::after,
#projectArticlePickerPage table.dataTable tr.selected th.select-checkbox::after {
  content: none !important;
  display: none !important;
}

#projectArticlePickerPage table.dataTable input.dt-select-checkbox {
  appearance: none;
  -webkit-appearance: none;
  width: 18px;
  height: 18px;
  border: 1px solid var(--color-text-secondary);
  border-radius: 4px;
  background: var(--color-surface-1);
  display: inline-grid !important;
  place-content: center;
  margin: 0;
  vertical-align: middle;
  position: static;
  font-size: 0;
  line-height: 0;
  color: transparent;
  box-shadow: none;
}

#projectArticlePickerPage table.dataTable input.dt-select-checkbox::after {
  content: "";
}

#projectArticlePickerPage table.dataTable input.dt-select-checkbox:checked {
  background: var(--color-surface-2);
  border-color: var(--color-text-primary);
}

#projectArticlePickerPage table.dataTable input.dt-select-checkbox:checked::before {
  content: "";
  width: 6px;
  height: 10px;
  border-right: 2px solid var(--color-text-primary);
  border-bottom: 2px solid var(--color-text-primary);
  transform: rotate(45deg) translate(-1px, -1px);
}

#projectArticlePickerPage table.dataTable thead input.dt-select-checkbox {
  background: var(--color-surface-2);
}

#projectArticlePickerPage table.dataTable tbody tr.selected > * {
  background: rgba(44, 111, 237, 0.12) !important;
  color: var(--color-text-primary) !important;
  box-shadow: none !important;
}

#projectArticlePickerPage table.dataTable tbody tr.selected a {
  color: var(--color-primary) !important;
}

#projectArticlePickerPage tr.is-in-project td {
  background: rgba(22, 114, 60, 0.06);
}

#projectArticlePickerPage tr.is-in-project.selected td {
  background: linear-gradient(0deg, rgba(44, 111, 237, 0.12), rgba(44, 111, 237, 0.12)),
              linear-gradient(0deg, rgba(22, 114, 60, 0.06), rgba(22, 114, 60, 0.06)) !important;
}

@media (max-width: 900px) {
  #projectArticlePickerPage .project-picker-toolbar {
    align-items: stretch;
  }
}
