/* The coverage board, used on /coverage and in the console. */

.cov-bar {
  margin-bottom: var(--sp-3);
}

.cov-status {
  margin: 0;
  color: var(--ink-2);
}

.cov-countdown {
  white-space: nowrap;
}

.cov-placeholder {
  margin-top: var(--sp-3);
}

.cov-retry {
  margin-top: var(--sp-3);
}

.cov-content > * + * {
  margin-top: var(--sp-4);
}

.cov-totals {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  background: var(--rule);
  border: 1px solid var(--rule-strong);
}

/* Seven tiles: the last one spans the row, so no empty cell is left over. */
.cov-totals > :last-child {
  grid-column: span 2;
}

@media (min-width: 30rem) {
  .cov-totals {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .cov-totals > :last-child {
    grid-column: span 3;
  }
}

@media (min-width: 48rem) {
  .cov-totals {
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }

  .cov-totals > :last-child {
    grid-column: auto;
  }
}

.cov-total-button {
  display: block;
  width: 100%;
  border: 0;
  border-bottom: 3px solid transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.cov-total-button:hover {
  background: var(--surface-2);
}

.cov-total-button[aria-pressed="true"] {
  border-bottom-color: var(--accent);
  background: var(--surface-2);
}

.cov-banner:empty {
  display: none;
}

.cov-banner > * + * {
  margin-top: var(--sp-2);
}

.cov-filters {
  display: grid;
  gap: var(--sp-3);
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 9rem), 1fr));
  align-items: end;
}

@media (min-width: 48rem) {
  .cov-filters {
    grid-template-columns: minmax(12rem, 2fr) repeat(3, minmax(8rem, 1fr)) auto;
  }
}

.cov-showing {
  margin-bottom: calc(var(--sp-2) * -1);
}

.cov-scroll {
  max-height: none;
}

.cov-table {
  min-width: 62rem;
  /* Collapsed borders don't travel with a sticky cell, which would let scrolled text show through. */
  border-collapse: separate;
  border-spacing: 0;
}

.cov-table th,
.cov-table td {
  padding: var(--sp-2);
}

/* The book's name stays in view while the table scrolls sideways. */
.cov-table .cov-book {
  position: sticky;
  left: 0;
  z-index: 1;
  min-width: 7.5rem;
  max-width: 11rem;
  background: var(--surface);
  border-right: 1px solid var(--rule);
}

.cov-table thead th:first-child {
  position: sticky;
  left: 0;
  z-index: 2;
  border-right: 1px solid var(--rule);
}

.cov-name {
  display: block;
}

.cov-sub {
  display: block;
  margin-top: 0.1rem;
  font-size: var(--text-xs);
  font-weight: 400;
  color: var(--ink-2);
  overflow-wrap: anywhere;
}

.cov-reason {
  min-width: 13rem;
}

.cov-page-head {
  padding-block: var(--sp-6) var(--sp-5);
}

.cov-page-head p {
  margin-top: var(--sp-3);
}

.cov-defs {
  display: grid;
  gap: var(--sp-3);
  margin: var(--sp-6) 0 0;
}

@media (min-width: 48rem) {
  .cov-defs {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--sp-5);
  }
}

.cov-defs dd {
  margin: var(--sp-1) 0 0;
  color: var(--ink-2);
  font-size: var(--text-sm);
}

.cov-source-note {
  margin-top: var(--sp-4);
  color: var(--ink-2);
  font-size: var(--text-sm);
}

/* The table arrives after the page draws. Its slot keeps a screen's height until then, so what sits below it doesn't jump up and down. */
/* Only while it is still loading (or not yet drawn): once the table, an empty result or an error is up, the slot fits it (review ZM-7). */
[data-coverage]:has(.loading), [data-coverage]:not(:has(:not(noscript))) { min-height: 100vh; }
