/* The Extra Info windows (What Do You Want To Load), for containers and for references.
   Same look as the login activity pages (LoginActivity.css). Scoped on .ExtraInfoBb */
.bootbox.ExtraInfoBb {
  --eit-accent: #17a2b8;
  --eit-accent-dark: #138496;
  --eit-on: #138496;
  --eit-accent-border: #b6e3ea;
  --eit-text: #1f2937;
  --eit-muted: #6b7280;
  --eit-border: #e5e7eb;
  --eit-row-border: #f1f5f9;
  --eit-surface: #ffffff;
  --eit-surface-alt: #f8fafc;
  --eit-warning: #b45309;
  --eit-warning-border: #f3d3a8;
  --eit-warning-bg: #fff7ed;
}
body.darkmode .bootbox.ExtraInfoBb {
  --eit-accent-dark: #5bc8d9;
  --eit-accent-border: #2c6a75;
  --eit-text: #e5e7eb;
  --eit-muted: #9ca3af;
  --eit-border: #374151;
  --eit-row-border: #374151;
  --eit-surface: #1f2937;
  --eit-surface-alt: #111827;
  --eit-warning: #fbbf24;
  --eit-warning-border: #92590f;
  --eit-warning-bg: #2b2113;
}
.bootbox.ExtraInfoBb .bootbox-body {
  color: var(--eit-text);
  text-align: left;
}
/* the buttons: same outline button in every part of the window */
.bootbox.ExtraInfoBb .ExtraInfoSaveDefault .btn,
.bootbox.ExtraInfoBb .ToLoadOptions .btn,
.bootbox.ExtraInfoBb .SelectedItemsOptions .btn,
.bootbox.ExtraInfoBb .modal-header2 .btn,
.bootbox.ExtraInfoBb table.dataTable .btn,
.bootbox.ExtraInfoBb table.table > thead > tr > th > .btn,
.bootbox.ExtraInfoBb table.table > tbody > tr > td > .btn {
  margin: 0 !important; /* the m-2 of these buttons is !important too */
  padding: 0.3125rem 0.625rem;
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.3;
  color: var(--eit-accent-dark);
  background: var(--eit-surface);
  border: 1px solid var(--eit-accent-border);
  border-radius: 8px;
  box-shadow: none;
  transition: background-color 0.12s ease, color 0.12s ease, border-color 0.12s ease;
}
.bootbox.ExtraInfoBb .ExtraInfoSaveDefault .btn:hover,
.bootbox.ExtraInfoBb .ToLoadOptions .btn:hover,
.bootbox.ExtraInfoBb .SelectedItemsOptions .btn:hover,
.bootbox.ExtraInfoBb .modal-header2 .btn:hover,
.bootbox.ExtraInfoBb table.table > thead > tr > th > .btn:hover,
.bootbox.ExtraInfoBb table.table > tbody > tr > td > .btn:hover {
  color: var(--eit-accent-dark);
  background: var(--eit-surface-alt);
  border-color: var(--eit-accent);
}
.bootbox.ExtraInfoBb .btn:focus {
  box-shadow: none;
  outline: none;
}
.bootbox.ExtraInfoBb .btn:focus-visible,
.bootbox.ExtraInfoBb .dataTables_filter > label > input:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(23, 162, 184, 0.3);
}
.bootbox.ExtraInfoBb .btn:disabled {
  opacity: 0.5;
}
.bootbox.ExtraInfoBb .ToLoadOptions .btn.btn-warning,
.bootbox.ExtraInfoBb .SelectedItemsOptions .btn.btn-warning {
  color: var(--eit-warning);
  background: var(--eit-warning-bg);
  border-color: var(--eit-warning-border);
}
.bootbox.ExtraInfoBb .ToLoadOptions .btn.btn-warning:hover,
.bootbox.ExtraInfoBb .SelectedItemsOptions .btn.btn-warning:hover {
  border-color: var(--eit-warning);
}
/* a column that is on, or a row that is selected */
.bootbox.ExtraInfoBb .ToLoadOptions .btn.SND,
.bootbox.ExtraInfoBb .ToLoadOptions .btn.SND:hover,
.bootbox.ExtraInfoBb table.table > tbody > tr > td > .btn.SND,
.bootbox.ExtraInfoBb table.table > tbody > tr > td > .btn.SND:hover {
  color: #ffffff;
  background: var(--eit-on);
  border-color: var(--eit-on);
}
/* the column choices: a small title with its buttons next to it */
.bootbox.ExtraInfoBb .ExtraInfoSaveDefault {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 0.5rem;
}
.bootbox.ExtraInfoBb .ToLoadOptions,
.bootbox.ExtraInfoBb .SelectedItemsOptions {
  display: grid;
  grid-template-columns: 7.5rem minmax(0, 1fr);
  align-items: baseline;
  column-gap: 0.75rem;
  margin: 0;
  padding: 0.5rem 0.75rem;
  background: var(--eit-surface);
  border: 1px solid var(--eit-border);
}
.bootbox.ExtraInfoBb .ToLoadOptions + .ToLoadOptions {
  border-top-width: 0;
}
.bootbox.ExtraInfoBb .ToLoadOptions:not(.ToLoadOptions + .ToLoadOptions) {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}
.bootbox.ExtraInfoBb .ToLoadOptions:not(:has(+ .ToLoadOptions)) {
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}
.bootbox.ExtraInfoBb .SelectedItemsOptions {
  margin: 0.75rem 0 0;
  background: var(--eit-warning-bg);
  border-color: var(--eit-warning-border);
  border-radius: 10px;
}
.bootbox.ExtraInfoBb .ToLoadOptions > h3,
.bootbox.ExtraInfoBb .SelectedItemsOptions > h3 {
  margin: 0;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--eit-muted);
}
.bootbox.ExtraInfoBb .ToLoadOptions > .btn-group,
.bootbox.ExtraInfoBb .SelectedItemsOptions > .btn-group {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem;
}
/* search on the left, the exports on the right */
.bootbox.ExtraInfoBb .theTableContentDiv {
  margin-top: 0.75rem;
}
.bootbox.ExtraInfoBb .modal-header2 {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  float: right;
  gap: 0.5rem;
  width: auto;
  margin: 0 0 0.75rem;
  padding: 0;
  border: 0;
}
.bootbox.ExtraInfoAboutReferenceNumbers .modal-header2 {
  margin-top: 0.75rem;
}
.bootbox.ExtraInfoBb .modal-header2 > .clearfix {
  display: none;
}
.bootbox.ExtraInfoBb .modal-header2 > .form-group {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 0;
}
.bootbox.ExtraInfoBb .modal-header2 .ContainerChatBtn {
  width: auto;
  height: auto;
}
.bootbox.ExtraInfoBb .modal-header2 .ContainerChatBtn > i {
  font-size: 1rem;
}
.bootbox.ExtraInfoBb div:has(> .dataTables_wrapper) {
  padding: 0;
}
.bootbox.ExtraInfoBb .dataTables_filter {
  display: inline-block;
  width: 22rem;
  max-width: 100%;
  min-width: 0;
  margin: 0 0 0.75rem;
  float: none;
  text-align: left;
}
.bootbox.ExtraInfoBb .dataTables_filter > label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0;
  padding: 0;
  font-size: 0.8125rem;
  color: var(--eit-muted);
  background: transparent;
  border: 0;
  border-radius: 0;
}
.bootbox.ExtraInfoBb .dataTables_filter > label > input {
  flex: 1 1 auto;
  width: 100%;
  height: 2.25rem;
  margin: 0;
  padding: 0 0.75rem;
  font-size: 0.875rem;
  color: var(--eit-text);
  background: var(--eit-surface);
  border: 1px solid var(--eit-border);
  border-radius: 8px;
}
.bootbox.ExtraInfoBb .dataTables_info {
  padding: 0.5rem 0 0;
  font-size: 0.8125rem;
  color: var(--eit-muted);
}
/* the table */
.bootbox.ExtraInfoBb table.table {
  clear: both;
  width: 100%;
  margin: 0;
  font-size: 0.875rem;
  color: var(--eit-text);
  background: var(--eit-surface);
  border: 1px solid var(--eit-border);
  border-collapse: separate;
  border-spacing: 0;
  border-radius: 10px;
}
.bootbox.ExtraInfoBb table.table > thead > tr > th {
  position: sticky;
  top: 0;
  z-index: 2;
  padding: 0.625rem 1.5rem 0.625rem 0.75rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  white-space: nowrap;
  vertical-align: middle;
  color: var(--eit-muted);
  background-color: var(--eit-surface-alt);
  border: 0;
  border-bottom: 1px solid var(--eit-border);
}
.bootbox.ExtraInfoBb table.table > thead > tr > th.sorting_asc,
.bootbox.ExtraInfoBb table.table > thead > tr > th.sorting_desc {
  color: var(--eit-accent-dark);
}
.bootbox.ExtraInfoBb table.table > thead > tr > th.sorting,
.bootbox.ExtraInfoBb table.table > thead > tr > th.sorting_asc,
.bootbox.ExtraInfoBb table.table > thead > tr > th.sorting_desc {
  cursor: pointer;
}
.bootbox.ExtraInfoBb table.table > thead > tr > th.sorting::after,
.bootbox.ExtraInfoBb table.table > thead > tr > th.sorting_asc::after,
.bootbox.ExtraInfoBb table.table > thead > tr > th.sorting_desc::after {
  margin-left: 0.375rem;
  font-family: "Font Awesome 7 Free", "Font Awesome 6 Free";
  font-weight: 900;
  content: "\f0dc";
  opacity: 0.35;
}
.bootbox.ExtraInfoBb table.table > thead > tr > th.sorting_asc::after {
  content: "\f0de";
  opacity: 1;
}
.bootbox.ExtraInfoBb table.table > thead > tr > th.sorting_desc::after {
  content: "\f0dd";
  opacity: 1;
}
.bootbox.ExtraInfoBb table.table > thead > tr > th.ExcludeFromDownOrCopy {
  padding-right: 0.75rem;
}
.bootbox.ExtraInfoBb table.table > thead > tr > th > .btn {
  padding: 0.125rem 0.5rem;
  font-size: 0.72rem;
  letter-spacing: 0;
  text-transform: none;
}
.bootbox.ExtraInfoBb table.table > tbody > tr,
.bootbox.ExtraInfoBb table.table > tbody > tr:nth-of-type(odd) {
  background-color: transparent;
}
.bootbox.ExtraInfoBb table.table > tbody > tr:hover {
  background-color: var(--eit-surface-alt);
}
.bootbox.ExtraInfoBb table.table > tbody > tr > td {
  padding: 0.5rem 0.75rem;
  font-size: 0.875rem;
  vertical-align: middle;
  color: var(--eit-text);
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--eit-row-border);
}
.bootbox.ExtraInfoBb table.table > tbody > tr:last-child > td {
  border-bottom: 0;
}
.bootbox.ExtraInfoBb table.table > tbody > tr > td > .OptionalSelectedItemsOptions {
  padding: 0.1875rem 0.5rem;
}
/* Darkmode.css sets these with !important */
body.darkmode .bootbox.ExtraInfoBb table.table > thead > tr,
body.darkmode .bootbox.ExtraInfoBb table.table > tbody > tr,
body.darkmode .bootbox.ExtraInfoBb table.table > tbody > tr.odd {
  background-color: transparent !important;
}
body.darkmode .bootbox.ExtraInfoBb table.table > tbody > tr:hover {
  background-color: var(--eit-surface-alt) !important;
}
body.darkmode .bootbox.ExtraInfoBb table.table > thead > tr > th > .btn,
body.darkmode .bootbox.ExtraInfoBb table.table > tbody > tr > td > .btn {
  color: var(--eit-accent-dark) !important;
}
body.darkmode .bootbox.ExtraInfoBb table.table > tbody > tr > td > .btn.SND {
  color: #ffffff !important;
}
@media (max-width: 767.98px) {
  .bootbox.ExtraInfoBb .ToLoadOptions,
  .bootbox.ExtraInfoBb .SelectedItemsOptions {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 0.375rem;
  }
  .bootbox.ExtraInfoBb .modal-header2 {
    float: none;
  }
  .bootbox.ExtraInfoBb .dataTables_filter {
    display: block;
    width: 100%;
  }
}