/* Textbook tables: accessible structure, course palette, and responsive grids. */

:root {
  --dact-table-head-bg: #212529;
  --dact-table-head-fg: #ffffff;
  --dact-table-head-accent: #35b779;
  --dact-table-frame: #cfd7d3;
  --dact-table-row-alt: #f3f8f5;
  --dact-table-row-hover: #e8f5ee;
  --dact-table-caption-bg: #f4f6f5;
  --dact-table-row-head-bg: #edf5f0;
}

body.quarto-dark,
body[data-bs-theme="dark"] {
  --dact-table-head-bg: #11171b;
  --dact-table-head-fg: #f3f4f6;
  --dact-table-head-accent: #5fd39a;
  --dact-table-frame: #46504b;
  --dact-table-row-alt: #1d2421;
  --dact-table-row-hover: #26342d;
  --dact-table-caption-bg: #20242a;
  --dact-table-row-head-bg: #202b25;
}

/* Ordinary textbook tables use the course row colors. Worksheet previews and
   other table components keep their own styling, including wrapper classes. */
main.content table.table:not(.table-striped, .dact-table, .excel-table, .gt_table, .form-table, .handwritten-table, .decision-table):not(.dact-table table, .excel-table table, .gt_table table, .form-table table, .handwritten-table table, .decision-table table, [id^="dact-decision-"] table) > tbody > tr:nth-of-type(even) > * {
  --bs-table-bg-type: var(--dact-table-row-alt);
}

main.content div.quarto-figure:has(table.dact-table) {
  background: var(--paper);
  border: 1px solid var(--dact-table-frame);
  border-radius: 0.45rem;
  box-shadow: 0 0.45rem 1.15rem rgb(24 39 31 / 8%);
  margin-block: 1.35rem 1.65rem;
  max-width: 100%;
  overflow: hidden;
}

main.content figure.quarto-float-tbl:has(table.dact-table) {
  margin: 0;
}

main.content table.dact-table {
  --bs-table-bg: transparent;
  background: var(--paper);
  border-collapse: separate;
  border-spacing: 0;
  color: var(--ink);
  font-size: 0.96rem !important;
  font-variant-numeric: tabular-nums;
  line-height: 1.42;
  margin: 0 !important;
  max-width: none;
  width: 100%;
}

main.content .callout table.dact-table {
  font-size: 0.94rem !important;
}

main.content table.dact-table > thead > tr > th {
  background: var(--dact-table-head-bg) !important;
  border-bottom: 3px solid var(--dact-table-head-accent) !important;
  border-top: 0;
  color: var(--dact-table-head-fg) !important;
  font-family: "Jost", "Segoe UI", Arial, sans-serif;
  font-size: 0.9em;
  font-weight: 650;
  letter-spacing: 0.012em;
  line-height: 1.3;
  padding: 0.76rem 0.82rem;
  vertical-align: bottom;
}

main.content table.dact-table > tbody > tr > td,
main.content table.dact-table > tbody > tr > th[scope="row"] {
  background: var(--paper);
  border-bottom: 1px solid var(--line);
  color: var(--ink);
  padding: 0.68rem 0.82rem;
  vertical-align: top;
}

main.content table.dact-table > tbody > tr:nth-child(even) > td,
main.content table.dact-table > tbody > tr:nth-child(even) > th[scope="row"] {
  background: var(--dact-table-row-alt);
}

main.content table.dact-table > tbody > tr:hover > td,
main.content table.dact-table > tbody > tr:hover > th[scope="row"] {
  background: var(--dact-table-row-hover);
}

main.content table.dact-table > tbody > tr:last-child > td,
main.content table.dact-table > tbody > tr:last-child > th[scope="row"] {
  border-bottom: 0;
}

main.content table.dact-table th:not([style*="text-align"]),
main.content table.dact-table td:not([style*="text-align"]) {
  text-align: left;
}

main.content table.dact-table > tbody > tr > th[scope="row"] {
  background: var(--dact-table-row-head-bg);
  color: var(--navy);
  font-family: "Jost", "Segoe UI", Arial, sans-serif;
  font-weight: 620;
}

main.content table.dact-table code {
  white-space: nowrap;
}

main.content div.quarto-figure:has(table.dact-table) figcaption,
main.content div.quarto-figure:has(table.dact-table) .quarto-float-caption {
  background: var(--dact-table-caption-bg);
  border-bottom: 1px solid var(--dact-table-frame);
  color: var(--muted);
  font-family: "Jost", "Segoe UI", Arial, sans-serif;
  font-size: 0.84rem;
  font-weight: 520;
  line-height: 1.35;
  margin: 0;
  padding: 0.62rem 0.82rem;
  text-align: left;
}

/* A trace preserves horizontal relationships. On a narrow screen it scrolls
   rather than stacking state-before, condition, and state-after into cards. */
main.content table.trace-table > thead > tr > th:first-child,
main.content table.trace-table > tbody > tr > th[scope="row"] {
  left: 0;
  position: sticky;
  z-index: 2;
}

main.content table.trace-table > thead > tr > th:first-child {
  z-index: 3;
}

main.content .table-scroll-region:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--accent) 72%, transparent);
  outline-offset: 2px;
}

main.content .table-scroll-region {
  max-width: 100%;
  overflow-x: auto !important;
  overflow-y: hidden;
  overscroll-behavior-inline: contain;
}

main.content .table-scroll-hint {
  display: none;
}

@media (max-width: 650px) {
  main.content table.dact-table {
    font-size: 0.92rem !important;
  }

  main.content table.dact-table:has(thead th:nth-child(4)) {
    min-width: 38rem;
  }

  main.content table.dact-table:has(thead th:nth-child(5)) {
    min-width: 44rem;
  }

  main.content table.dact-table:has(thead th:nth-child(6)) {
    min-width: 50rem;
  }

  main.content table.dact-table:has(thead th:nth-child(7)) {
    min-width: 58rem;
  }

  main.content .table-scroll-region > .table-scroll-hint {
    background: color-mix(in srgb, var(--paper) 92%, var(--accent));
    border-bottom: 1px solid var(--line);
    color: var(--muted);
    display: block;
    font-family: "Jost", "Segoe UI", Arial, sans-serif;
    font-size: 0.75rem;
    font-weight: 600;
    left: 0;
    letter-spacing: 0.02em;
    padding: 0.4rem 0.72rem;
    position: sticky;
    width: max-content;
    z-index: 5;
  }
}

@media print {
  main.content div.quarto-figure:has(table.dact-table) {
    border: 1px solid #555;
    border-radius: 0;
    box-shadow: none;
    break-inside: avoid;
  }

  main.content table.dact-table {
    color: #000 !important;
    font-size: 8.5pt !important;
  }

  main.content table.dact-table > thead > tr > th {
    background: #e7e7e7 !important;
    border-bottom-color: #000 !important;
    color: #000 !important;
  }

  main.content table.dact-table > tbody > tr > td,
  main.content table.dact-table > tbody > tr > th[scope="row"] {
    background: #fff !important;
    color: #000 !important;
  }

  main.content .table-scroll-hint {
    display: none !important;
  }
}
