/* Print and Save as PDF (2026-10-19). Every portal page links this one sheet
   (lib/pwa-head.js PRINT_HEAD; the static pages carry the same tags) and
   /print.js, which prepares the page just before it prints: the title block at
   the top, link addresses, opened disclosures, scroll boxes let out, and the
   whole live-chat conversation in place of its frame.

   On paper: no navigation (the shared bar hides itself in global-nav.css),
   controls, composers, banners or Feedback; light with dark text whatever
   theme is saved; the full page width; nothing cut off. Sheet-specific sizing stays with its sheet (library-reference.css).

   A Letter or A4 page is about 725 CSS pixels wide between the margins, so
   the phone layout rules (max-width:760px) also apply in print; the rules
   below undo the ones that would hide or squeeze content there. */

@media screen {
  .print-header, [data-print-only] { display: none !important; }
  /* "Preparing the whole conversation to print…" while /print.js fetches it. */
  .print-wait { position: fixed; top: max(12px, env(safe-area-inset-top, 0px)); left: 50%; transform: translateX(-50%); z-index: 2147482000;
    box-sizing: border-box; max-width: min(560px, calc(100vw - 24px)); padding: 10px 16px; border: 1px solid var(--line, #d5dce7); border-radius: 12px;
    background: var(--paper, #fff); color: var(--ink, #0f1f38); font: 600 .875rem/1.4 var(--font-sans, system-ui, sans-serif);
    box-shadow: 0 10px 30px rgb(15 31 56 / .28); }
}

@page { margin: 14mm 12mm; }

@media print {
  /* ---- Light paper, dark ink, whatever the saved theme ---- */
  :is(html, html[data-theme], body, .page):not(#print-ink) { background: #fff !important; color: #000 !important; color-scheme: light !important; }
  /* :not(#print-ink) (no such id) outranks a page's own class rules, even !important ones. */
  *:not(#print-ink), *:not(#print-ink)::before, *:not(#print-ink)::after {
    background: transparent !important; color: #000 !important; box-shadow: none !important; text-shadow: none !important;
    border-color: #999 !important; outline: none !important; filter: none !important; backdrop-filter: none !important;
    animation: none !important; transition: none !important;
  }
  html { -webkit-print-color-adjust: economy; print-color-adjust: economy; }
  body, .page { font-size: 10.5pt; line-height: 1.45; }
  a, a:visited { text-decoration: underline; }

  /* ---- Nothing that is only for the screen ---- */
  :is(.skip-link, .header-tools, #theme-toggle, .theme-toggle, .viewas-row, .viewas-select, .viewas-banner, .inspect-banner,
  .fbw, .fbw-dock, .fbw-panel, .fbw-pickbar, .feedback-launch,
  dialog, .modal, .overlay, .update-banner, .signin-banner, .conn-banner, .conn-status, .undo-notice, .print-wait,
  .export-tools, .export-stage, .ct-row, .ct-tools, .ct-file, .ct-status, .slow-line, .session-reply, .session-host > .request-files, .file-add,
  .open-sessions-bar, .phone-back, .search-field, .picker, .tabs, .show-more-error, .team-alerts, .assistant-panel,
  .field-error-live, [role=status].status, [data-print-hide]):not(#print-ink) { display: none !important; }

  /* Controls: buttons, fields, forms to fill in and links drawn as buttons. A
     button or a link that holds content (a request in a list, a card) stays; its
     words are the content. A form of checkboxes only (a checklist) stays. */
  :is(button:not(:has(h1, h2, h3, h4, h5, h6, p, div, ul, ol, table, strong)), a.button:not(:has(h1, h2, h3, h4, h5, h6, p, div, ul, ol, table, strong)), a.btn,
  input:not([type=checkbox]):not([type=radio]):not([readonly]), select, textarea:not([readonly]),
  label:has(> input:not([type=checkbox]):not([type=radio]), > select, > textarea),
  form:has(textarea:not([readonly]), select, input:not([type=hidden]):not([type=checkbox]):not([type=radio]):not([readonly])),
  details:has(> form):not(:has(> :not(summary, form)))):not(#print-ink) {
    display: none !important;
  }
  :is(button, a.button):has(h1, h2, h3, h4, h5, h6, p, div, ul, ol, table, strong) { max-width: 100% !important; text-align: left !important; min-height: 0 !important; }
  button[aria-expanded=false]:has(h1, h2, h3, h4, h5, h6, p, div, ul, ol, table, strong)::after { content: " (collapsed)"; font-weight: 400; }
  textarea[readonly], input[readonly] { border: 0 !important; padding: 0 !important; resize: none !important; field-sizing: content; }
  input[type=checkbox], input[type=radio] { print-color-adjust: exact; -webkit-print-color-adjust: exact; }
  summary { list-style: none; min-height: 0 !important; padding: 4pt 0 !important; }
  summary::-webkit-details-marker { display: none; }

  /* ---- The full width of the paper ---- */
  body, main, #main, #view, .app, .view, .layout, .workspace, .queue, .panel, .solo, .up-main, .container, .page > *,
  section, article, .card, .reqs, .ask, .domain, .compose, .edit-form, .notice, .wp-page main, .lib-page main {
    max-width: none !important; margin-left: 0 !important; margin-right: 0 !important;
  }
  body.page, main, #main, .layout, .solo, .up-main, .view, .container { padding-left: 0 !important; padding-right: 0 !important; }
  .layout { display: block !important; padding: 0 !important; }
  .layout > .queue:not([hidden]), .layout > .workspace:not([hidden]), .layout > :not([hidden]) { display: block !important; position: static !important; inset: auto !important; width: auto !important; }
  /* A list beside an open item: the open item is what prints. */
  .layout:has(.queue-item.selected, .workspace.request-open) > .queue { display: none !important; }
  .queue, .workspace, .panel { border: 0 !important; border-radius: 0 !important; }
  .task-layout { display: block !important; }
  /* Tasks and Messages: an open task or conversation prints without the list beside it. */
  .task-layout:has(#detail .team-message, #detail > h2 + p:not(:empty)) > :not(#detail) { display: none !important; }

  /* ---- Nothing cut off ---- */
  html, body { height: auto !important; min-height: 0 !important; overflow: visible !important; }
  *:not(img, svg, video, canvas, iframe, .img-box, .file-thumb, .ct-thumb, .client-mark, .sr-only) {
    overflow: visible !important; max-height: none !important; min-height: 0 !important;
  }
  /* The Work pipeline: four stages to a row instead of a strip that scrolls sideways. */
  .wm-line { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; width: auto !important; row-gap: 8pt !important; }
  .wm-line li { width: auto !important; }
  .wm-line li::after { display: none !important; }
  * { text-wrap-mode: wrap !important; text-overflow: clip !important; -webkit-line-clamp: none !important; line-clamp: none !important; }
  .page, .workspace.request-open, .sessions-container, .session-host, .request-pane, .request-live, .request-summary, .request-activity,
  .queue-list, .wm-layout, .wm-content, [data-print-grow] {
    height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; flex: none !important;
  }
  .sessions-container:not([hidden]), .session-host:not([hidden]) { display: block !important; }
  [data-print-static], .queue, .group-heading, .review-bar, .modal-actions, .site-header, .wm-bar, .wm-zoom-context,
  .layout > .workspace.request-open { position: static !important; inset: auto !important; top: auto !important; bottom: auto !important; transform: none !important; z-index: auto !important; }
  /* Short status labels stay on one line and keep their room in a row. */
  :is(.badge, [class*=-badge], .pill, [class*=-pill]) { text-wrap-mode: nowrap !important; flex: none !important; overflow-wrap: normal !important; }
  [data-print-wrap] { white-space: normal !important; overflow: visible !important; text-overflow: clip !important; -webkit-line-clamp: none !important; }
  pre, code, kbd, samp { white-space: pre-wrap !important; overflow-wrap: anywhere !important; word-break: normal !important; }
  p, li, dd, dt, td, th, h1, h2, h3, h4, h5, h6, blockquote, a, span, strong { overflow-wrap: anywhere; }
  table { width: 100% !important; max-width: 100% !important; table-layout: auto; border-collapse: collapse; }
  th, td { white-space: normal !important; overflow-wrap: anywhere !important; word-break: normal; }
  img, svg, video, canvas, iframe, object, embed { max-width: 100% !important; }
  img { height: auto; }
  .img-box { max-width: 100% !important; }

  /* The live-chat frame: replaced by the whole conversation when /print.js has
     it; otherwise the part on screen, with a sentence saying so. */
  iframe { border: 1px solid #999 !important; }
  iframe.session-frame, iframe.wm-frame, iframe.route-frame { display: block !important; width: 100% !important; height: 7in !important; flex: none !important; break-inside: avoid; }
  iframe[data-print-replaced] { display: none !important; }
  /* The chat follows the portal's theme and cannot be restyled from here: a dark one prints light. */
  html[data-theme=dark] :is(iframe.session-frame, iframe.wm-frame, iframe.route-frame):not(#print-ink) { filter: invert(1) hue-rotate(180deg) !important; }
  .print-note { margin: 6pt 0 !important; font-style: italic; }
  .print-conversation h1 { font-size: 14pt; margin: 0 0 10pt; }
  .print-conversation article { padding: 8pt 0; border-top: 1px solid #999; }
  .print-conversation h2 { font-size: 11pt; margin: 0 0 4pt; }
  .print-conversation p { margin: 4pt 0; white-space: pre-wrap; }
  html[data-print-scope=conversation] body > :not(.print-header, .print-stage) { display: none !important; }

  /* ---- The title block at the top of the first page ---- */
  .print-header:not(#print-ink) { display: block !important; margin: 0 0 12pt !important; padding: 0 0 8pt !important; border-bottom: 1.5pt solid #000 !important; break-after: avoid; }
  .print-header .print-site { margin: 0; font-size: 9pt; letter-spacing: .04em; }
  .print-header .print-title { margin: 2pt 0 0; font-size: 16pt; font-weight: 700; line-height: 1.25; }
  .print-header .print-item { margin: 2pt 0 0; font-size: 12pt; font-weight: 600; }
  .print-header .print-when { margin: 4pt 0 0; font-size: 9pt; }

  /* ---- Link addresses: inline links only, filled in by /print.js ---- */
  a[data-print-url]::after { content: "\00a0(" attr(data-print-url) ")"; font-size: .9em; font-weight: 400; text-decoration: none; overflow-wrap: anywhere; word-break: break-all; }

  /* ---- Page breaks ---- */
  h1, h2, h3, h4, h5, h6, summary, .small-heading, .eyebrow, thead { break-after: avoid; page-break-after: avoid; }
  h1, h2, h3, h4, h5, h6 { break-inside: avoid; }
  tr, li, figure, img, svg, blockquote, .queue-item, .audit-row, .team-message, .card, .client, .req, .sub, .submission-item,
  .print-conversation article, .msg-view, .meeting-item, .attachment-list li, .wk-card, .pc-step, dl > div { break-inside: avoid; page-break-inside: avoid; }
  thead { display: table-header-group; }
  tfoot { display: table-footer-group; }
  p, li { orphans: 3; widows: 3; }

  /* The cheat sheet keeps its shaded rows (library-reference.css sizes it). */
  .cheat tr:nth-child(even):not(#print-ink) { background: #eee !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}
