/* ub/data-table — a real table for regulated disclosures.
   ==========================================================================

   Loaded only on pages carrying ub/data-table (see ub-elements.php).

   The design problem: CAEP accountability measures and Title II pass rates run
   to eight columns of numbers, and state licensure tables carry a paragraph in
   a single cell. Neither can be reflowed into cards without changing what the
   University has published, so the table stays a table and the LAYOUT absorbs
   the width instead.

   Wide tables therefore scroll inside .ub-table-scroll rather than pushing the
   page sideways. The page body must never scroll horizontally; a data table
   legitimately may.
   ========================================================================== */

.ub-table-sec {
  padding: var(--section-pad, 72px) 0;
  background: var(--white);
}

.ub-table-sec--dark {
  background: var(--bg-light);
}

.ub-table-head {
  max-width: 62rem;
  margin-bottom: 1.8rem;
}

.ub-table-head h2 {
  font-size: clamp(1.6rem, 2.6vw, 2.3rem);
  font-weight: 800;
  line-height: 1.16;
  margin: 0 0 0.6rem;
  color: var(--text-main);
}

.ub-table-head .section-lede {
  color: var(--text-light);
  line-height: var(--line-height-base, 1.6);
  margin: 0;
}

/* The scroll container is focusable (tabindex="0" in the renderer) so keyboard
   users can reach and pan a wide table. That focus must be visible. */
.ub-table-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border: 1px solid rgba(44, 62, 80, 0.14);
  border-radius: 0;
  background: var(--white);
}

.ub-table-scroll:focus-visible {
  outline: 3px solid var(--ub-blue);
  outline-offset: 2px;
}

.ub-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.92rem;
  line-height: 1.5;
  color: var(--text-main);
}

/* Opt-in for tables whose columns should share the width evenly. Numeric
   reporting tables read better this way; a table with one prose column does
   not, which is why it is not the default. */
.ub-table--fixed { table-layout: fixed; }

/* A wide reporting table gets a minimum width so eight columns of numbers stay
   legible; .ub-table-scroll takes the overflow. Without this, "fixed" divides
   the container evenly and every column ends up too narrow to read. */
.ub-table--fixed { min-width: 46rem; }

.ub-table caption {
  caption-side: top;
  text-align: left;
  font-weight: 700;
  color: var(--text-main);
  padding: 0.95rem 1.05rem 0.75rem;
  border-bottom: 1px solid rgba(44, 62, 80, 0.1);
}

.ub-table th,
.ub-table td {
  padding: 0.72rem 1.05rem;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid rgba(44, 62, 80, 0.09);
}

/* Header labels WRAP. Title II columns carry names like "% pass rate (1st time
   test takers)" — eight of those cannot each hold one line, and nowrap under
   table-layout: fixed clips them rather than overflowing, so the label is
   silently truncated with no scrollbar to reveal it. Wrapping is the honest
   behaviour for a disclosure: the full column name has to be readable. */
.ub-table thead th {
  background: var(--bg-light);
  font-weight: 700;
  font-size: 0.83rem;
  line-height: 1.35;
  letter-spacing: 0.02em;
  color: var(--ub-purple-dark);
  border-bottom: 2px solid rgba(89, 45, 130, 0.22);
  vertical-align: bottom;
  white-space: normal;
  hyphens: auto;
}

/* A row header names the thing being measured — a program, a year, a term.
   Keeping it unwrapped stops "Spring 2023" breaking across two lines while the
   numbers beside it stay on one. */
.ub-table tbody th[scope="row"] {
  font-weight: 700;
  color: var(--text-main);
  white-space: nowrap;
}

.ub-table tbody tr:last-child th,
.ub-table tbody tr:last-child td { border-bottom: 0; }

.ub-table tbody tr:nth-child(even) { background: rgba(244, 247, 246, 0.55); }

.ub-table-note,
.ub-table-source {
  max-width: 62rem;
  margin: 0.9rem 0 0;
  font-size: 0.85rem;
  line-height: 1.55;
  color: var(--text-light);
}

.ub-table-source { font-style: italic; }

@media (max-width: 768px) {
  .ub-table { font-size: 0.86rem; }
  .ub-table th,
  .ub-table td { padding: 0.6rem 0.8rem; }
  /* table-layout: fixed plus a narrow viewport squeezes eight columns into
     unreadable slivers. Let the content set the width and let the container
     scroll instead. */
  .ub-table--fixed { table-layout: auto; }
  .ub-table thead th { white-space: normal; }
}

/* A group heading spanning the table — "Middle level education areas" in the
   CAEP program list. Distinct from a column header so it does not read as a
   second header row. */
.ub-table .ub-table-group th {
  background: rgba(89, 45, 130, 0.06);
  color: var(--ub-purple-dark);
  font-weight: 700;
  font-size: 0.84rem;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  white-space: normal;
}