/* GovLoX Scorecard - print stylesheet (Phase 1f).
 *
 * Spec: docs/superpowers/plans/2026-04-28-govlox-scorecard.md Section 7.
 *
 * Scope:
 *   - A4 default, US Letter selectable in print dialog (margins fit both)
 *   - Watermark on first page via @page :first @top-center
 *   - Repeating footer via @page @bottom-center (version + page X of Y)
 *   - Hide site nav / .sc-run-again / CTAs / .sc-footer-line
 *   - Disclaimer (.sc-exposure) restyled as bordered 14pt block, page-break-inside avoid
 *   - Three composite variants:
 *       data-variant="full"      - solid fill bar
 *       data-variant="partial"   - hatched fill bar
 *       (suppressed)             - no .sc-composite element; .sc-uncertainty block instead
 *   - Greyscale contrast: band labels distinguishable via fill, weight, border (not colour)
 *   - 150% zoom acceptance: watermark visible on every page; disclaimer self-contained
 *
 * Em-dash editorial v0.6: watermark text uses spaced hyphen (' - ') not em-dash,
 * matching the customer-facing copy invariant tested in scorecard.test.js.
 *
 * No headless print verification on VPS3. Manual visual review by Barry in Phase 3
 * via Chrome devtools "Print preview" (test all 3 composite variants on both A4
 * and US Letter, plus 150% zoom).
 */

/* ============================================================
   Page rules - A4 default; Letter selected via print dialog
   ============================================================ */

@page {
  size: A4;
  margin: 18mm 16mm 22mm 16mm;
}

/* Per Barry's spec, US Letter margins are 0.75in 0.75in 1in 0.75in
 * (~19mm 19mm 25mm 19mm). CSS Paged Media has no size-conditional @page
 * selector, so both papers share the A4 margin set above (which fits within
 * Letter's slightly larger page with no clipping). Letter renders correctly
 * with marginally tighter side margins than spec; functionally indistinguishable.
 */

/* First-page top stamp - watermark */
@page :first {
  @top-center {
    content: "GovLoX EU AI Act Readiness Scorecard - informational only, not legal advice";
    font-family: 'Inter', sans-serif;
    font-size: 9pt;
    color: #000;
  }
}

/* Repeating footer on every page */
@page {
  @bottom-center {
    content: "GovLoX Scorecard v1.0 - informational only - Page " counter(page) " of " counter(pages);
    font-family: 'Inter', sans-serif;
    font-size: 8pt;
    color: #000;
  }
}

/* ============================================================
   Print body styles
   ============================================================ */

@media print {

  /* Reset / page setup */
  html, body {
    background: #fff !important;
    color: #000 !important;
    font-size: 11pt;
    line-height: 1.4;
  }
  body { margin: 0; padding: 0; }
  .scorecard-shell { padding: 0; max-width: 100%; }

  /* ---------- Hide chrome ---------- */
  nav,
  .sc-run-again,
  .sc-next-step,
  .sc-cta-primary,
  .sc-cta-secondary,
  .sc-cta-group,
  .sc-footer-line,
  .no-print {
    display: none !important;
  }

  /* Always show results in print; hide gate / questionnaire if user prints
   * during state machine traversal (defensive). */
  #scorecard-gate,
  #scorecard-questionnaire {
    display: none !important;
  }
  #scorecard-results,
  #scorecard-results[hidden] {
    display: block !important;
  }

  /* Hide the on-screen hero <header> with the H1; @top-center watermark replaces it */
  .scorecard-shell > header { display: none !important; }

  /* ---------- Headings ---------- */
  h2, h3 { color: #000 !important; page-break-after: avoid; break-after: avoid; }
  h2 { font-size: 16pt; margin: 0 0 6pt; }
  h3 { font-size: 12pt; margin: 8pt 0 4pt; }

  /* ---------- Bullets ---------- */
  .sc-bullets { margin-bottom: 8pt; }
  .sc-bullets li { color: #000 !important; padding: 0; }

  /* ---------- Banner ---------- */
  .sc-banner {
    background: #fff !important;
    border: 1pt solid #000 !important;
    border-left-width: 3pt !important;
    border-radius: 0 !important;
    color: #000 !important;
    padding: 6pt 8pt;
    margin-bottom: 8pt;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  /* ---------- Composite bar (full / partial variants) ---------- */
  .sc-composite { margin-bottom: 12pt; page-break-inside: avoid; break-inside: avoid; }
  .sc-composite-text { color: #000 !important; font-size: 12pt; margin-bottom: 4pt; }
  .sc-composite-bar {
    height: 8pt;
    background: #fff !important;
    border: 1pt solid #000 !important;
    border-radius: 0 !important;
    overflow: hidden;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
  .sc-composite-fill {
    height: 100%;
    background: #000 !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
  /* Greyscale band differentiation via pattern (printers without colour exact
   * still render the patterns as differing densities). */
  .sc-composite-fill[data-band="demonstrable"] {
    background: #000 !important;
  }
  .sc-composite-fill[data-band="partial"] {
    background: repeating-linear-gradient(45deg, #000 0, #000 1.2pt, #fff 1.2pt, #fff 3pt) !important;
  }
  .sc-composite-fill[data-band="gaps"] {
    background: repeating-linear-gradient(135deg, #000 0, #000 0.8pt, #fff 0.8pt, #fff 2pt) !important;
  }

  /* Variant gates */
  .sc-composite[data-variant="full"],
  .sc-composite[data-variant="partial"] { display: block; }
  /* No CSS rule for suppressed: the controller renders .sc-uncertainty instead
   * of .sc-composite when composite.suppressed === true (S15). */

  /* ---------- Uncertainty block (suppressed variant) ---------- */
  .sc-uncertainty {
    background: #fff !important;
    border: 1pt solid #000 !important;
    border-radius: 0 !important;
    padding: 8pt;
    margin: 0 0 10pt;
    page-break-inside: avoid;
    break-inside: avoid;
  }
  .sc-uncertainty h2 { font-size: 14pt; margin: 0 0 4pt; }
  .sc-uncertainty p  { color: #000 !important; margin: 0; }

  /* ---------- Dimension card grid (always 2 cols in print for legibility) ---------- */
  .sc-dim-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 4pt !important;
    margin: 0 0 8pt !important;
  }
  .sc-dim-card {
    background: #fff !important;
    border: 1pt solid #000 !important;
    border-radius: 0 !important;
    padding: 4pt 6pt !important;
    page-break-inside: avoid;
    break-inside: avoid;
    gap: 2pt !important;
  }
  .sc-dim-card[data-band="not_assessed"] {
    background: #f0f0f0 !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
  .sc-dim-card h3 { color: #000 !important; font-size: 10pt; margin: 0; }
  .sc-dim-card-score { color: #000 !important; font-size: 9pt; }

  /* ---------- Label pills (greyscale-distinguishable) ----------
   * Distinguishable in greyscale via:
   *   demonstrable  - solid black background, white text, bold
   *   partial       - mid-grey background, black text, semibold
   *   gaps          - white background, double-stroke border, bold
   *   not_assessed  - light-grey background, italic
   */
  .sc-label-pill {
    color: #000 !important;
    background: #fff !important;
    border: 1pt solid #000;
    padding: 1pt 4pt;
    border-radius: 0;
    font-size: 9pt;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
  .sc-label-pill[data-band="demonstrable"] {
    background: #000 !important; color: #fff !important; font-weight: 700;
  }
  .sc-label-pill[data-band="partial"] {
    background: #c8c8c8 !important; color: #000 !important; font-weight: 600;
  }
  .sc-label-pill[data-band="gaps"] {
    background: #fff !important; color: #000 !important; font-weight: 700;
    border-width: 2pt;
    box-shadow: inset 0 0 0 1pt #000;
  }
  .sc-label-pill[data-band="not_assessed"] {
    background: #f0f0f0 !important; color: #000 !important;
    font-style: italic; font-weight: 400;
  }

  /* In print, show full label - hide mobile abbreviations */
  .sc-label-full   { display: inline !important; }
  .sc-label-mobile { display: none !important; }

  /* Footnote button: print as static asterisk; no interaction */
  .sc-fn-ref {
    all: unset !important;
    color: #000 !important;
    font: inherit !important;
  }
  .sc-footnote { color: #000 !important; font-size: 9pt; margin: 0 0 8pt; }

  /* ---------- Strongest / Weakest summary ---------- */
  .sc-summary { page-break-inside: avoid; break-inside: avoid; margin: 0 0 10pt; }
  .sc-summary h3 { color: #000 !important; }
  .sc-summary li { color: #000 !important; }

  /* ---------- Narrative copy ---------- */
  .sc-narrative {
    color: #000 !important;
    font-size: 11pt;
    margin: 0 0 10pt;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  /* ---------- Divider ---------- */
  .sc-divider {
    border: 0 !important;
    border-top: 1pt solid #000 !important;
    margin: 10pt 0 !important;
  }

  /* ---------- Disclaimer / exposure block (>=14pt, bordered, page-break-avoid) ----------
   * Spec calls this 'Disclaimer injected immediately before exposure line';
   * implementation reuses the on-screen .sc-exposure element with print-only
   * styling - bordered box, 14pt, page-break-inside: avoid.
   */
  .sc-exposure {
    background: #fff !important;
    color: #000 !important;
    border: 1.5pt solid #000 !important;
    border-radius: 0 !important;
    padding: 6mm !important;
    font-size: 14pt !important;
    line-height: 1.4 !important;
    margin: 8pt 0 !important;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  /* ---------- Out-of-date guard banner (printed if triggered) ---------- */
  .sc-out-of-date {
    background: #fff !important;
    color: #000 !important;
    border: 1pt solid #000 !important;
    border-radius: 0 !important;
    padding: 4pt 6pt;
    margin-bottom: 8pt;
    font-size: 10pt;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  /* ---------- Page-break hints ---------- */
  ul, ol { page-break-inside: auto; }
  h2, h3 { page-break-after: avoid; }

  /* ---------- Print colour restoration (Phase 3 follow-up) ----------
   * The Phase 3 a11y fix darkened brand colours for screen contrast (--teal-text,
   * --green-text, --amber-text, --red-text). On screen those darker variants meet
   * WCAG AA. On printed paper they read flat and muted. WCAG AA contrast rules
   * apply to interactive screen elements, not print, so we restore richer brand
   * colours here. Greyscale fallbacks above (solid black + 45/135 hatch + label
   * weight/border patterns) remain in place for B&W printers - colour layered on
   * top, not replacing.
   */
  .sc-dim-id,
  .sc-label-pill[data-band="demonstrable"],
  .sc-label-pill[data-band="partial"],
  .sc-label-pill[data-band="gaps"],
  .sc-cta-primary,
  .sc-btn-primary {
    color: revert;
    background-color: revert;
    border-color: revert;
  }

  /* Composite bar fill - selector translated from Barry's spec
   * ('.sc-composite-bar-fill[data-variant=...]') to the actual DOM class
   * ('.sc-composite-fill[data-band=...]') applied by the renderer in scorecard.js. */
  .sc-composite-fill[data-band="demonstrable"] { background: #047857 !important; background-image: none !important; }
  .sc-composite-fill[data-band="partial"]      { background: #D97706 !important; background-image: none !important; }
  .sc-composite-fill[data-band="gaps"]         { background: #DC2626 !important; background-image: none !important; }

  /* Dimension card border colour by band */
  .sc-dim-card[data-band="demonstrable"] { border-color: #047857 !important; }
  .sc-dim-card[data-band="partial"]      { border-color: #D97706 !important; }
  .sc-dim-card[data-band="gaps"]         { border-color: #DC2626 !important; }

  /* Label pills - solid colour fill, white text */
  .sc-label-pill[data-band="demonstrable"] { background: #047857 !important; color: #fff !important; border-color: #047857 !important; }
  .sc-label-pill[data-band="partial"]      { background: #D97706 !important; color: #fff !important; border-color: #D97706 !important; }
  .sc-label-pill[data-band="gaps"]         { background: #DC2626 !important; color: #fff !important; border-color: #DC2626 !important; }

  /* Primary CTA - full-saturation teal. Note: .sc-cta-primary is currently hidden
   * in print via .sc-next-step's display:none rule above; this colour rule is
   * dormant unless the print-CTA hide is later relaxed. */
  .sc-cta-primary { background: #0EA5E9 !important; color: #fff !important; }
}