/* Job Records inside Production Analytics (portal/jobRecords.js): drawn with
   the portal's Analytics pieces from styles.css (om-table, an-badge); only
   what those don't cover lives here. */
/* A catalogue job's runs, opened beneath its row. */
.an-runs-row > td { padding: 6px 10px 14px; background: var(--raise); }
.jr-runs { width: 100%; font-size: 13px; }

/* Records table: every column and its contents centered. */
.om-table.jr-table th, .om-table.jr-table td { text-align: center; vertical-align: middle; }
.om-table.jr-table td.an-left { white-space: nowrap; }
.jr-table td:first-child { min-width: 180px; }
.jr-job-name { margin-inline: auto; }
.jr-invoice { font-weight: 700; color: var(--text); }
.jr-job-name { max-width: 260px; font-size: 12.5px; color: var(--muted); white-space: normal; }
.jr-wf { display: inline-flex; align-items: center; gap: 7px; font-weight: 600; }
.jr-wf::before { content: ""; flex: none; width: 9px; height: 9px; border-radius: 50%; background: var(--dim); }
.jr-wf.wf-sp::before { background: #2563eb; }
.jr-wf.wf-emb::before { background: #f5b316; }
.jr-wf.wf-dtf::before { background: #7c3aed; }
.jr-wf.wf-promo::before { background: #ec4899; }
.jr-wf.wf-dual::before { background: linear-gradient(110deg, #2563eb 0 50%, #f5b316 50% 100%); }
.jr-approval { display: inline-flex; align-items: center; gap: 8px; }
.an-badge.complete { color: var(--good); background: var(--good-wash); border-color: var(--good-line); }
.an-badge.partial { color: var(--accent); background: var(--marigold-wash); border-color: rgba(245, 178, 27, .35); }
.iaos-approval-summary { cursor: help; }
.iaos-approval-summary.has-proof { cursor: pointer; }
/* Resizable headers (the Deals list's .opp-resize grip) and the filter row.
   Column lines show where each column ends; a header's edge darkens on hover. */
.jr-table [data-jr-head] th { position: relative; }
.om-table.jr-table th, .om-table.jr-table td { border-right: 1px solid var(--line); }
.om-table.jr-table th:last-child, .om-table.jr-table td:last-child { border-right: 0; }
.jr-table [data-jr-head] th .opp-resize::after { opacity: 0; }
.jr-table [data-jr-head] th:hover .opp-resize::after, .jr-table .opp-resize.on::after { top: 6px; bottom: 6px; opacity: .9; }
.jr-sort-mark { margin-left: 4px; opacity: .35; }
[aria-sort="ascending"] > .an-sort .jr-sort-mark, [aria-sort="descending"] > .an-sort .jr-sort-mark { opacity: 1; }
.jr-table.sized { table-layout: fixed; }
/* A narrowed column wraps onto more lines rather than cutting text off. */
.om-table.jr-table.sized th, .om-table.jr-table.sized td, .om-table.jr-table.sized td.an-left { white-space: normal; overflow-wrap: anywhere; }
.jr-table.sized .jr-wf { display: inline; }
.jr-table.sized .jr-wf::before { display: inline-block; margin-right: 6px; vertical-align: middle; }
.jr-table.sized td:first-child { min-width: 0; }
.jr-filter-row th { padding: 4px; vertical-align: top; }
.jr-filter-row .o-in { width: 100%; min-width: 0; min-height: 30px; padding: 4px 6px; font-size: 12px; font-weight: 500; text-transform: none; letter-spacing: 0; }
.jr-pages { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; padding-top: 4px; }
.jr-pages select.o-in { width: auto; min-height: 36px; }

/* The approval card (proof above the checks) floats over the page. */
.iaos-job-approval-card { font-family: var(--f-body); font-variant-numeric: tabular-nums; -webkit-font-smoothing: antialiased; position: fixed; z-index: 2147483647; display: none; width: 242px; padding: 8px; border: 1px solid var(--line-2); border-radius: 0; background: var(--panel); box-shadow: 0 14px 30px rgba(15, 23, 42, .28); pointer-events: none; }
.jr-card-proof img, .jr-card-proof embed { display: block; width: 100%; height: 270px; max-height: 270px; object-fit: contain; border-radius: 0; background: #fff; pointer-events: none; }
.jr-card-proof span { padding: 120px 0; text-align: center; font-size: 12px; }
.jr-card-lines { font-size: 12px; font-weight: 600; line-height: 1.35; color: var(--text); }
.jr-card-proof + .jr-card-lines:not(:empty) { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--line-2); }

@media (max-width: 760px) {
  .jr-search { max-width: none; }
}
