/* Print styles (loaded with media="print", so every rule here applies only when
   printing). A guide view prints as a one-page cheat sheet (below); any other view prints
   the page as it is, without the site header or the comparisons (with public guides and
   with another guide: their summaries and each contest's column), and keeps the footer,
   whose disclaimer is the only "not official" line on the home view. Page size and margins are the print dialog's. */

/* Paper is white whatever the screen's color scheme: base.css's dark tokens would print
   pale text (the draft banner's warning included) on white. */
:root {
  color-scheme: light;
  --bg: #fff;
  --surface: #fff;
  --text: #000;
  --muted: #333;
  --border: #999;
  --accent: #000;
  --accent-text: #fff;
  --banner-bg: #fff;
  --banner-text: #000;
  --banner-border: #000;
  --error: #000;
}

.skip-link,
.site-header,
.public-guides,
.guide-compare,
.guide-grid,
.districts,
.contest-compare,
.contest-more,
.contest-details {
  display: none !important;
}

.contest {
  break-inside: avoid;
}

/* The ballot's tabs and category tabs (#512) and their "show together" checkboxes (#574)
   are a screen control: print shows every category of every tab, each under a heading that
   names its tab too ("State · Judges"), whatever is checked. */
.ballot-tabs,
.ballot-subtabs,
.ballot-tab-checks,
.ballot-subrow-name,
.ballot-empty {
  display: none !important;
}

.ballot-panel[hidden],
.ballot-group[hidden],
.ballot-group-title {
  display: block;
}

.ballot-group + .ballot-group {
  margin-top: 1rem;
}

/* --- The cheat sheet (#342) ---
   A guide view (#guide's data-phase "own", editing or previewing, or "other") prints as
   one Letter page to carry into the polling place, in ballot order and in the light theme:
     - the draft-ballot banner, while the ballot is a draft;
     - the framing on one short line (moderation guards), then the guide's title, alone
       under it (#684), and the guide's notices (a different ballot, choices it can't show, a pick past the
       cap, a save that failed, an order its author set), which are rare and change what
       the sheet can be trusted for;
     - every contest the page shows, in both of the ballot's tabs and in the order it shows
       them (by tab and category, #512, under a short heading for each category; within one,
       ballot order or the guide author's, #357), as its title and the guide's choices: picks.js's .pick-print
       line, in formatChoices()'s short form (1. A  2. B  3. C for a ranking, A, B, C (vote
       for 3) for a multi-seat contest, in the guide's candidate order, the one label
       otherwise), or "No endorsement" (a pick with no choices) or "Undecided" (no pick)
       (#427). A one-piece answer (a label, Yes, No endorsement, Undecided) ends the title's
       line; a ranking or a multi-seat pick (.pick-print-list) goes below it. A contest the
       guide hides (#427) doesn't print: a view leaves it out (ballot.js), and the owner's
       editor, which lists it collapsed, has its list item dropped below.
   Nothing else prints: no election facts, summaries, options,
   candidate-order note (it qualifies the order of the options list, which doesn't print),
   sources, editors (the order editor included), reasons, notes, actions, header or footer.
   The one gate, :has() on the guide view, nests every sheet rule (each starts with &), so
   other views print as above. A browser without :has() or nesting drops the whole block
   and prints the page as it is. */

:root:has(#guide[data-phase="own"], #guide[data-phase="other"]) {
  & body {
    font: 8pt/1.25 var(--font);
  }

  & :is(.site-footer, #election-facts, .ballot-title, .ballot-status, .ballot-highlights) {
    display: none;
  }

  & :is(.notices, main) {
    max-width: none;
    padding: 0;
  }

  & .banner-draft {
    margin: 0 0 6pt;
    padding: 3pt 6pt;
    border-width: 1pt 1pt 1pt 4pt;
    border-radius: 0;
  }

  & .banner-draft .banner-title {
    font-size: 9pt;
  }

  /* The framing, then the guide's title, in the page's order: the framing is the one
     disclaimer above a title shown alone (#684). */
  & #guide {
    display: flex;
    flex-direction: column;
    margin: 0 0 8pt;
    padding: 0;
    border: 0;
    border-radius: 0;
  }

  & #guide > :not(.guide-title, .guide-framing, .guide-notice, .guide-limit, .guide-save-status.is-error, .guide-order-note) {
    display: none;
  }

  /* A failed save prints its message (not its button): the sheet shows the picks as they
     stand on this page, which the shared guide doesn't have yet. */
  & .guide-save-status button {
    display: none;
  }

  & .guide-title {
    margin: 1pt 0 0;
    font-size: 12pt;
  }

  & :is(.guide-framing, .guide-order-note) {
    margin: 1pt 0 0;
    font-size: 7.5pt;
  }

  & .guide-framing {
    margin-top: 0;
  }

  & :is(.guide-notice, .guide-limit:not(:empty), .guide-save-status.is-error) {
    margin: 3pt 0 0;
    padding: 1pt 4pt;
    border-left-width: 2pt;
  }

  /* One pair of columns for the whole ballot, the categories flowing through it. */
  & .ballot-sections {
    columns: 2;
    column-gap: 0.3in;
    column-rule: 0.5pt solid var(--border);
  }

  & .ballot-group + .ballot-group {
    margin-top: 4pt;
  }

  & .ballot-group-title {
    margin: 0 0 1pt;
    font-size: 7.5pt;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    break-after: avoid;
  }

  & .contests > li {
    margin: 0 0 3pt;
    break-inside: avoid;
  }

  /* A contest the owner hid, collapsed in the editor (#427). */
  & .contests > li:has(.pick-editor-hidden) {
    display: none;
  }

  & .contest {
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
  }

  & .contest > :not(.contest-title, .contest-pick),
  & .contest-pick > :not(.pick-print) {
    display: none;
  }

  /* The choices are what to mark, so they carry the weight; the title only finds the
     place. Title and answer share a line (a full real ballot needs it to fit one page). */
  & .contest-title {
    display: inline;
    font-size: 8pt;
    font-weight: 400;
    line-height: 1.25;
  }

  /* A break opportunity before the answer, so an answer that doesn't fit the line moves
     down alone instead of taking the title's last word with it. */
  & .contest-title::after {
    content: " ";
  }

  & .contest-pick {
    display: inline;
    margin: 0;
    padding: 0;
    border: 0;
  }

  & .pick-print {
    display: inline;
    margin: 0 0 0 0.2em;
    font-size: 9pt;
    font-weight: 700;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
  }

  /* "2. B", "(vote for 3)": whole on a line, unless one piece is longer than the line. */
  & .pick-print-piece {
    display: inline-block;
    max-width: 100%;
  }

  & .pick-print-list {
    display: block;
    margin-left: 0;
  }

  & .pick-print-skip {
    font-weight: 400;
    font-style: italic;
  }
}