
body {
    max-width: 100%;/* Override Tufte's 87.5% */
    width: 100%;
    padding: 0; /* Override Tufte's 12.5% */
}
nav {
  margin: 0 2rem;
  /* Make slightly smaller than the navigation header (if any) */
  font-size: 1.3rem;
}
/* Horiztonal navigation bar */
nav.horizontal > h1{
  display: inline;
  margin: 0 3em 0 0;
  font-size: 1.5rem;
}
article {
  margin: 2rem;
  padding: 0rem;
}
table {
  /* Defaults to 15px, but p defaults to 1.4rem ~ 21px. So increase to make it more readable. */
  font-size: 1.1rem;
  text-wrap: nowrap;
  border-collapse: collapse;
  border-spacing: 0.5rem 0;
}
colgroup:nth-child(even) {
  background: #eee;
}
@media (prefers-color-scheme: dark) {
  colgroup:nth-child(even) {
    background: #242424;
  }
}
th, td{
  /* Left-align all columns by default */
  text-align: left;
  /* Default spacing to make columns readable */
  padding: 0.25rem 1rem;
}
.compact th,
.compact td {
  /* Compact spacing to make more data viewable */
  padding: 0.1rem 0.25rem;
}
thead th:not(:empty) {
    border-bottom: 1px solid black;
}
th.numeric, td.numeric{
  /* Right-align all numeric data columns so their significant digits line up and are easier to compare */
  text-align: right;
  /* Use tabular figures so columns of numbers line up properly. Requires typeface supports. */
  font-feature-settings:"tnum" 1;
}
tfoot > tr td{
    border-top: 1px solid black;
}

/* Highlight the row when the cursor is hovering over it to make it easier to read across the row. */
tr:hover {
  background-color: rgb(172, 212, 230);
}

a.current-page {
    /* Tufte.css use background to display the underlines on links, so hide that and the default. */
    background: none;
    text-decoration: none;
}

/* Pagination Styling */
p.pagination {
    font-size: 1.2rem;
}
.pagination .label{
    font-weight: bold;
}

/* Fade the data when a request is in flght */
.htmx-request td {
  opacity: 0.5;
  transition: opacity 100ms linear;
}

.bold{
  font-style: bold;
}
.italics {
  font-style: italic;
}
.all-small-caps {
  font-variant-caps: all-small-caps;
}
.grey{
  color:  #575757;
}
@media (prefers-color-scheme: dark) {
  .grey{
    color: #b1b1b1;
  }
}
.red, .level-critical {
  color: #D32F2F;
}
.orange, .level-high, .level-warn {
  color: orange;
}
.green {
  color:  #55A66C;
}
.level-critial, .level-high, .level-warn {
    font-weight: bold;
}
td.icon {
  text-align: center;
}