/* Pull requests list (#3498, design epic #3432; Figma 42:13210, 1440x1108).
 * The header 42:13387, the filter card 42:13401, the table 42:13437 with its
 * repository groups 42:13459, PR rows 42:13465, an expanded PR's rounds
 * 42:13601 and the footer 42:13717. The running row's button is the ds
 * running indicator (msRunning, ds/motion.css, keyframes from 42:13549).
 * The table is shared with the Overview's Active Reviews (same design), so
 * these rules key on .pr-table-card, which only prHistoryTable draws.
 * Figma's #adb5bd / #9ca3af labels use --fg-muted for AA, as in ds/surfaces.css.
 * Tokens only; dark mode comes from tokens.css. Loaded after console.css. */

/* Viewport 42:13386: 32px all round. */
.content:has(> .pr-page) { padding: var(--space-7); }
.pr-page { gap: var(--space-4); }

/* Header 42:13387: title block left, Refresh right, 32px above the filter card. */
.page-header.pr-header { flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); margin: 0 0 var(--space-4); }
.pr-title { display: flex; flex-direction: column; gap: var(--space-1); min-width: 0; }
.pr-header h1 { margin: 0; font: 700 24px/32px var(--font-sans); letter-spacing: -0.6px; color: var(--fg-strong); }
.pr-header .subtitle { margin: 0; font: 600 14px/20px var(--font-sans); color: var(--fg-muted); }
/* Refresh 42:13396: Secondary M with the card shadow. app.css's .pr-refresh is the
   Repositories page's bare icon and console.css inks .page-header buttons; neither applies here. */
.pr-header .btn.pr-refresh { padding: 0 var(--btn-px); border-color: var(--border-control); background: var(--btn-secondary-bg); color: var(--btn-secondary-fg); box-shadow: var(--shadow-card); }
.pr-header .btn.pr-refresh:hover:not(:disabled) { background: var(--hover-tint); border-color: var(--hover-border); color: var(--btn-secondary-ink); }
.pr-header .btn.pr-refresh svg { width: var(--btn-glyph); height: var(--btn-glyph); }
/* Freshness (the app's, not in Figma): a muted line under the subtitle. */
.pr-header .pr-updated { display: block; margin: 0; font: var(--type-meta); color: var(--fg-muted); }
.pr-header .pr-updated:empty { display: none; }

/* Filter card 42:13401: search over the state segments, selects and filter button. */
.pr-filter-card {
  display: flex; flex-direction: column; gap: var(--space-4); padding: var(--space-4);
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-xl); box-shadow: var(--shadow-toolbar);
}
.pr-filter-card .pr-search { height: 44px; }

/* Table card 42:13437: radius 32, the toolbar shadow. */
.pr-console.pr-table-card { background: var(--surface); border: 1px solid var(--border); border-radius: calc(var(--radius-2xl) * 2); box-shadow: var(--shadow-toolbar); }
.pr-table-card .pr-history { min-width: 1060px; font: var(--type-body-sm); }
/* Header 42:13438: 55 high, Inter Bold 10, 1px tracking. */
.pr-table-card .pr-history > thead th {
  height: 55px; padding: 0 var(--space-2); background: var(--surface-header); border-bottom: 1px solid var(--divider);
  font: var(--type-eyebrow); letter-spacing: 1px; text-transform: uppercase; color: var(--fg-muted);
}
/* Repository group 42:13459: 50 high, sunken, Inter Bold 12 at 2.4px tracking. */
.pr-table-card .pr-history tbody.repo-group td { padding: 0; background: var(--bg); border-top: 0; }
.pr-table-card .group-toggle { height: 50px; padding: 0 var(--space-2); gap: var(--space-2); font: 700 12px/16px var(--font-sans); letter-spacing: 2.4px; text-transform: uppercase; color: var(--fg-muted); }
.pr-table-card .group-toggle svg { width: 10px; height: 10px; }

/* PR row 42:13465: 73 high. */
.pr-table-card .pr-history tbody.review-group > tr { height: 73px; }
.pr-table-card .pr-history tbody.review-group > tr > td { padding: var(--space-4) var(--space-2); border-top: 1px solid var(--divider); }
.pr-table-card .pr-history tbody.repo-group + tbody.review-group > tr > td { border-top: 0; }
.pr-table-card .pr-history .expander-cell { width: 48px; padding-left: var(--space-3); padding-right: 0; }
.pr-table-card .expander { color: var(--fg-muted); }
.pr-table-card .expander svg { width: 12px; height: 12px; }
/* Open (42:13561): a mint wash on the row, the chevron green and turned. */
.pr-table-card tbody.review-group:has(.expander[aria-expanded="true"]) > tr > td { background: color-mix(in srgb, var(--brand) 3%, var(--surface)); }
.pr-table-card .expander[aria-expanded="true"] { color: var(--brand-text); }
.pr-table-card .col-score { width: 110px; }
.pr-table-card .col-issue { width: 64px; }
.pr-table-card .pr-history .pr-col { padding-left: var(--space-5); padding-right: var(--space-5); }
.pr-table-card .col-findings { width: 145px; }
.pr-table-card .col-rounds { width: 69px; }
.pr-table-card .col-cost { width: 69px; }
.pr-table-card .col-activity { width: 104px; }
.pr-table-card .col-took { width: 80px; }
.pr-table-card .pr-history .col-action { width: 60px; padding-right: var(--space-6); text-align: right; }
/* Pull request 42:13484: Inter Bold 12 title over "@author · #142". */
.pr-table-card .pr-text { flex-direction: column; align-items: flex-start; gap: 0; }
.pr-table-card .pr-text .title { font: 700 12px/20px var(--font-sans); color: var(--fg-strong); }
.pr-table-card .pr-sub { font: 700 12px/16px var(--font-sans); color: var(--fg-muted); }
.pr-table-card .col-took { color: var(--fg-muted); }
.pr-table-card .ui-cell-when, .pr-table-card .ui-cell-status { white-space: nowrap; }

/* An expanded PR's rounds 42:13601: a nested table on a half-sunken wash, 24 in. */
.pr-table-card tbody.passes > tr.pr-rounds-row > td { padding: 0; border-top: 0; background: transparent; }
.pr-rounds { padding: var(--space-6); background: color-mix(in srgb, var(--bg) 50%, transparent); }
.pr-rounds-table { width: 100%; border-collapse: collapse; }
.pr-table-card .pr-rounds-table thead th {
  height: auto; padding: 0 var(--space-2) var(--space-1); background: none; border: 0; text-align: left;
  font: var(--type-eyebrow); letter-spacing: 1px; text-transform: uppercase; color: var(--fg-muted);
}
.pr-table-card .pr-rounds-table thead th.num { text-align: right; }
.pr-table-card .pr-rounds-table tr.pass > td, .pr-table-card .pr-rounds-table tr.pass > th {
  padding: 8px var(--space-2) 9px; background: var(--surface); border-top: 0; border-bottom: 1px solid var(--divider);
  font: 700 12px/16px var(--font-sans); color: var(--fg-secondary); text-align: left; vertical-align: middle;
}
.pr-table-card .pr-rounds-table tr > :first-child, .pr-table-card .pr-rounds-table tr.pass > :first-child { padding-left: 48px; }
.pr-table-card .pr-rounds-table tr.pass > td.num { text-align: right; }
/* Hash: mono medium 12, uppercase. Cost: mono medium 12. Time: Inter Bold 12, muted. */
.pr-rounds-table th[scope=row] a { font: 500 12px/16px var(--font-mono); text-transform: uppercase; color: var(--fg-muted); text-decoration: none; }
.pr-rounds-table th[scope=row] a:hover, .pr-rounds-table th[scope=row] a:focus-visible { text-decoration: underline; }
.pr-table-card .pr-rounds-table tr.pass > td[data-contract~="pass-charged-cell"] { font: 500 12px/16px var(--font-mono); color: var(--fg-strong); white-space: nowrap; }
/* Why a round's price differs ("Ultra", "half price") sits beside the amount, not under it. */
.pr-table-card .pr-rounds-table td[data-contract~="pass-charged-cell"] .pr-sub { display: inline; margin-left: 6px; }
.pr-table-card .pr-rounds-table tr.pass > td.pr-round-time { color: var(--fg-muted); }
/* Message 42:13621: Inter Bold 12/16, 460 wide, one line cut with an ellipsis. */
.pr-rounds-table .pr-round-message > span { display: block; max-width: 460px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pr-rounds-table tr.pass:focus { outline: 2px solid var(--focus); outline-offset: -2px; }
/* Findings chips 42:13624: fitted to the count, 6 by 3 in. */
.pr-rounds-table .sev-chip, .pr-rounds-table .sev-more { min-width: 0; height: auto; padding: 2px 5px; line-height: 15px; box-shadow: none; }
.pr-rounds-table .sev-chips { gap: var(--space-1); }

/* Actions 25:40883 (#3460): every state is the Secondary icon-only L. Hover on
   an enabled one lifts it ("intable hover effect"). Done (25:41016, the bordered
   variant) is the disabled fill with a mint check on its corner. The tooltip
   opens toward the row, so the card's edge never clips it. */
.pr-table-card .col-action .ui-tooltip-wrap { vertical-align: middle; }
.pr-table-card .col-action .ui-tooltip { left: auto; right: 0; transform: translate(0, 2px); text-align: left; }
.pr-table-card .col-action .ui-tooltip::after { left: auto; right: 11px; }
.pr-table-card .col-action .ui-tooltip-wrap:is(:hover, :focus-within, [data-tip-open]):not([data-tip-dismissed]) .ui-tooltip { transform: translate(0, 0); }
.pr-table-card .col-action .btn-icon:where(:hover):where(:not(:disabled, [aria-disabled="true"])) { box-shadow: var(--shadow-row-hover); }
.pr-table-card .pr-act[aria-disabled="true"] { cursor: default; }
.pr-act-done { position: relative; overflow: visible; }
.pr-table-card .pr-act-done, .pr-table-card .pr-act-done:hover { --btn-icon: var(--btn-disabled-fg); border-color: var(--border-card); }
.pr-act-check {
  position: absolute; right: 1px; bottom: 1px; display: grid; place-items: center; box-sizing: border-box; width: 12px; height: 12px;
  background: var(--brand-mint); border: 1px solid color-mix(in srgb, var(--ink) 10%, transparent); border-radius: 50%; color: var(--ink);
}
.pr-act-check svg { width: 6px; height: 6px; stroke-width: 4; }
.pr-table-card .col-action .skip-not-covered { white-space: normal; text-align: left; }
/* An action's outcome in words (queuing, queued, why not): the icon button keeps
   its icon, so this line is what a sighted reader sees. Takes no room until used. */
.pr-act-status { display: block; width: max-content; max-width: 180px; margin: var(--space-1) 0 0 auto; font-size: 12px; line-height: 16px; white-space: normal; text-align: right; }
.pr-act-status:empty { display: none; }
#overview-recent .pr-act-status { margin-left: 0; text-align: left; }

/* Phones: the sticky expander and merge-safety cells start at the left edge
   (console.css placed them after a Repository column the table no longer has). */
@media (max-width: 600px) {
  .content:has(> .pr-page) { padding: var(--space-4); }
  .pr-console .table.pr-history .expander-cell { left: 0; width: 48px; min-width: 48px; max-width: 48px; }
  .pr-console .table.pr-history td.col-score, .pr-console .table.pr-history th.col-score { left: 48px; }
  .pr-table-card tbody.passes .pr-rounds { padding: var(--space-3); }
  .pr-rounds-table .pr-round-message > span { max-width: 200px; }
}
