/* Default css */
:root {
  --scroll-height: 10px;
  --scroll-height-fix: -10px;
  --border: 1px solid rgb(1, 1, 1, 0.1);
}
::placeholder {
   text-align: center;
}
input[type="text"] {
  text-align: center;
}
body {
  margin: 1em;
  margin-top: 0.5em;
}
h1 {
  font-size: 1em;
}
th, td {
  white-space: nowrap;
}
table {
  border-radius: 0px !important;
  border-left: 0px !important;
}
th, td {
  /* border-right: var(--border) solid green; */
  border-right: var(--border);
}
tr td:first-child {
  border-left: var(--border);
}
tr th:first-child {
  border-left: var(--border);
}

table.dataTable tbody th, table.dataTable tbody tr:first-child td {
  padding-top: 18px;
}
.dtfh-floatingparenthead table.dataTable thead th,
.dataTables_scrollHead table thead th {
  /* border-bottom: var(--border) solid yellow !important; */
  border-bottom: var(--border) !important;
}

table tbody td {
  /* border-top: var(--border) solid black !important */
  border-top: var(--border) !important;
}
div.dataTables_scrollHead table.dataTable {
  /* border-top: var(--border) solid blue !important; */
  border-top: var(--border) !important;
}
div.dataTables_scrollBody table.dataTable {
  /* border-bottom: var(--border) solid red !important; */
  border-bottom: var(--border) !important;
}

#scroll-container::-webkit-scrollbar, .dt-scroll-head::-webkit-scrollbar {
  -webkit-appearance: none;
  height: var(--scroll-height);
  width: 1px;
}
#scroll-container::-webkit-scrollbar-thumb, .dt-scroll-head::-webkit-scrollbar-thumb {
  border-radius: var(--scroll-height);
  background-color: rgba(0,0,0,0.4);
  box-shadow: 0 0 0px rgba(255,255,255,.4);
}
#scroll-container {
  display: none;
  position: relative;
  top: 0;
  z-index: 5;
  height: var(--scroll-height);
  overflow-x: auto;
  background: rgba(226, 223, 223, 0.4);
  /* Causes problems w/ syntax highlighting in Code
  @-moz-document url-prefix() {
    background: lightgrey;
  }
  */
  margin-bottom: var(--scroll-height-fix);
}
div.cell {
  position: relative;
  height: 100%;
}
.icon-in-cell {
  position: absolute;
  top: 1px;
  left: 1px;
}

.dataTables_wrapper.no-footer div.dataTables_scrollBody>table {
  border: 1px solid #ddd;
}
button {
  background-color: white;
  border: 1px solid black;
}
summary {
  cursor: pointer;
}
details {
  background-color: white;
}
input[type="checkbox"] {
  accent-color: black;
}
a {
  color: black;
  text-decoration-color: black;
}
details code {
  font-size: small;
  background-color: rgb(244, 244, 244);
  border: 1px solid black;
  border-radius: 4px;
  padding: 0.1em;
}
select.columnUniques {
  visibility: hidden;
  overflow: auto;
  margin-top: 0.25em;
}
span.clearOneSearch {
  white-space: nowrap;
  visibility: hidden;
  cursor: pointer;
}

/*
  Fix for Chrome autofill, which has its own background color.
  When an autofill value is selected, the input gets a class of
  input:-webkit-autofill.
*/
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
  -webkit-text-fill-color: black;
  -webkit-box-shadow: 0 0 0px 40rem yellow inset;
}

#relatedTables {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 1000;
  background-color: white;
  padding: 5px;
  border-radius: 4px;
  box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

#table1 {
  width: 100% !important;
}
#error {
  color: red;
  font-weight: bold;
  padding: 0.5em;
  display: none;
  padding-bottom: 3px;
}
#showHideColumns {
  margin-right: 1em;
  padding-bottom: 0.5em;
}
#clearAllSearches {
  display: none;
}
#clearAllSearches button {
  margin-right: 1em;
  background-color: yellow;
}
#relatedTables {
  display: none;
}
#relatedTablesSelect {
  margin-right: 1em;
}

table.dataTable thead th {
  font-size: 0.8em;
  text-align: center;
}

table.dataTable tbody {
  font-family: monospace;
  text-align: center;
  font-size: 9pt;
}

.ellipsis {
  cursor: pointer;
}
.dataTables_filter {
  float: left;
  display: none;
}
.dataTables_length {
  display: inline-block;
}
.dataTables_wrapper .dataTables_info {
  clear: none;
  text-align: left;
  padding-top: 0.45em;
}
.dataTables_wrapper .dataTables_paginate {
  float: left;
  text-align: right;
}
.dataTables_wrapper .dataTables_paginate .paginate_button {
  padding: 0em;
}
.dataTables_wrapper .dataTables_paginate .ellipsis {
  padding: 0em;
}

/* Move processing indicator to top of page */
div.dataTables_processing {
  z-index: 101;
  top: 0px;
}
