/*
 * Print stylesheet — scoped per export source via body class.
 *
 * Linked with media="print" — zero effect on screen rendering.
 *
 * Two export flows:
 *   body.print-agent     → Agent tab PDF export (Wave 6B4)
 *   body.print-changelog → Changelog tab PDF export (period-filtered)
 *
 * Each handler:
 *   1. document.body.classList.add('print-<scope>')
 *   2. window.print()
 *   3. removes the class in finally{}
 */

@page {
    size: A4;
    margin: 12mm 10mm;
}

/* ════════════════════════════════════════════════════════════
   Common chrome hide — applies to BOTH export flows
   ════════════════════════════════════════════════════════════ */

body.print-agent header,
body.print-agent nav#tabs,
body.print-agent footer,
body.print-agent #modal-overlay,
body.print-agent #cmdk-palette,
body.print-agent #watchlist-btn,
body.print-agent #cmdk-hint,
body.print-agent #theme-toggle,
body.print-changelog header,
body.print-changelog nav#tabs,
body.print-changelog footer,
body.print-changelog #modal-overlay,
body.print-changelog #cmdk-palette,
body.print-changelog #watchlist-btn,
body.print-changelog #cmdk-hint,
body.print-changelog #theme-toggle {
    display: none !important;
}

/* Always honour Tailwind .print:hidden helper */
.print\:hidden {
    display: none !important;
}

/* Hide the export buttons themselves */
#agent-export-pdf-btn,
#changelog-export-pdf,
#changelog-controls,
.no-print {
    display: none !important;
}

html,
body {
    background: #ffffff !important;
    color: #000000 !important;
}

/* ════════════════════════════════════════════════════════════
   Agent tab export (body.print-agent)
   ════════════════════════════════════════════════════════════ */

body.print-agent .tab-content:not(#tab-agent) {
    display: none !important;
}

body.print-agent #tab-agent,
body.print-agent #tab-agent.hidden {
    display: block !important;
    visibility: visible !important;
}

body.print-agent main,
body.print-agent #tab-agent,
body.print-agent #tab-agent * {
    background: transparent !important;
    color: #000000 !important;
    border-color: #999999 !important;
    box-shadow: none !important;
    overflow: visible !important;
    max-height: none !important;
}

body.print-agent #tab-agent a {
    color: #000000 !important;
    text-decoration: underline;
}

body.print-agent #tab-agent .rounded,
body.print-agent #tab-agent .border,
body.print-agent #tab-agent [class*="border-"] {
    border: 1px solid #cccccc !important;
}

body.print-agent #tab-agent h2,
body.print-agent #tab-agent h3 {
    break-before: page;
    page-break-before: always;
    break-after: avoid;
    page-break-after: avoid;
}

body.print-agent #tab-agent > div > :first-child h2:first-child,
body.print-agent #tab-agent #agent-sota-watch h2:first-child {
    break-before: auto;
    page-break-before: auto;
}

body.print-agent #tab-agent #agent-charts > div,
body.print-agent #tab-agent #agent-categories > div,
body.print-agent #tab-agent #agent-leaderboard,
body.print-agent #tab-agent #agent-compare,
body.print-agent #tab-agent #agent-sota-watch {
    break-inside: avoid;
    page-break-inside: avoid;
}

body.print-agent #tab-agent .w-full,
body.print-agent #tab-agent canvas,
body.print-agent #tab-agent [_echarts_instance_] {
    width: 100% !important;
    max-width: 100% !important;
}

body.print-agent #tab-agent table {
    width: 100% !important;
    border-collapse: collapse !important;
    font-size: 10pt;
}
body.print-agent #tab-agent table th,
body.print-agent #tab-agent table td {
    border: 1px solid #cccccc !important;
    padding: 4px 6px !important;
}

/* ════════════════════════════════════════════════════════════
   Changelog tab export (body.print-changelog)
   ════════════════════════════════════════════════════════════ */

body.print-changelog .tab-content:not(#tab-changelog) {
    display: none !important;
}

body.print-changelog #tab-changelog,
body.print-changelog #tab-changelog.hidden {
    display: block !important;
    visibility: visible !important;
}

body.print-changelog #changelog-print-header.hidden,
body.print-changelog #changelog-print-header {
    display: block !important;
}

body.print-changelog main,
body.print-changelog #tab-changelog,
body.print-changelog #tab-changelog * {
    background: transparent !important;
    color: #000000 !important;
    border-color: #999999 !important;
    box-shadow: none !important;
    overflow: visible !important;
    max-height: none !important;
}

/* Bigger title text for the print header */
body.print-changelog #changelog-print-header h1 {
    font-size: 18pt !important;
    color: #111827 !important;
    margin-bottom: 4px !important;
}
body.print-changelog #changelog-print-header p {
    font-size: 10pt !important;
    color: #4b5563 !important;
}

/* Type section headings */
body.print-changelog #changelog-list h3 {
    color: #374151 !important;
    font-size: 11pt !important;
    margin-top: 12px !important;
    margin-bottom: 6px !important;
    border-bottom: 1px solid #e5e7eb !important;
    padding-bottom: 3px !important;
    break-after: avoid;
    page-break-after: avoid;
}

/* Each changelog entry — keep together, don't split across pages */
body.print-changelog #changelog-list > div > div {
    break-inside: avoid;
    page-break-inside: avoid;
    border-top: 1px solid #e5e7eb !important;
    padding: 4px 0 !important;
}

/* Date badge — light grey on paper */
body.print-changelog #changelog-list span[class*="bg-"] {
    background: #f3f4f6 !important;
    color: #374151 !important;
    border: 1px solid #d1d5db !important;
    padding: 1px 6px !important;
    border-radius: 3px !important;
    font-size: 8pt !important;
}

body.print-changelog #changelog-list .text-gray-200,
body.print-changelog #changelog-list .text-gray-400,
body.print-changelog #changelog-list .text-gray-500 {
    color: #1f2937 !important;
    font-size: 9pt !important;
}

body.print-changelog #changelog-list .text-gray-400 {
    color: #4b5563 !important;
}
