/* ============================================================
   Tax Title Payment Agreement System — Print Stylesheet
   Target: US Letter (8.5×11 in), 0.75in top/bottom, 0.875in left/right
   Linked in base.html via: <link media="print" href="...print.css">
   Do NOT add screen rules here — screen styles live in style.css
   ============================================================ */

/* ── PAGE SETUP ─────────────────────────────────────────── */
@page {
    size: letter portrait;
    margin: 0.75in 0.875in;
}

/* ── PRINT COLOR ACCURACY ───────────────────────────────── */
/* Required for background colors (table headers, summary boxes, etc.) */
* {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
}

/* ── BODY / PAGE WRAPPER ────────────────────────────────── */
body {
    background: white !important;
    font-size: 10pt;
}

.page-wrapper {
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* ── HIDE ALL UI-ONLY CHROME ────────────────────────────── */
nav,
.tabs,
.site-footer,
.button-group,
.no-print,
.btn,
.alert,
select,
.add-row-btn {
    display: none !important;
}

/* ── PAGE HEADER ────────────────────────────────────────── */
.page-header {
    padding: 0.6rem 0.75rem !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    margin-bottom: 0.5rem !important;
}

.page-header h1 {
    font-size: 14pt !important;
    margin-bottom: 0.15rem !important;
}

.page-header .subtitle,
.page-header .municipality,
.page-header .date,
.page-header .legal-ref {
    font-size: 9pt !important;
}

/* ── CARDS ──────────────────────────────────────────────── */
.card {
    box-shadow: none !important;
    border: 1px solid #bbb !important;
    border-radius: 2px !important;
    padding: 0.5rem 0.65rem !important;
    margin-bottom: 0.4rem !important;
    break-inside: avoid;
}

.card h2 {
    font-size: 11pt !important;
    margin-bottom: 0.4rem !important;
    padding-bottom: 0.2rem !important;
}

.card h3 {
    font-size: 10pt !important;
    margin-top: 0.5rem !important;
    margin-bottom: 0.3rem !important;
}

/* ── TABS: MAKE ALL CONTENT VISIBLE ─────────────────────── */
/* Individual tabs are hidden via .no-print on specific tab divs */
.tab-content {
    display: block !important;
}

/* ── SUMMARY BOXES ───────────────────────────────────────── */
.summary-grid {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 0.3rem !important;
    margin-bottom: 0.4rem !important;
}

.summary-box {
    padding: 0.35rem 0.5rem !important;
    border-radius: 2px !important;
    break-inside: avoid;
}

.box-label {
    font-size: 7.5pt !important;
}

.box-value {
    font-size: 11pt !important;
}

/* ── INFO GRID ───────────────────────────────────────────── */
.info-grid {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 0.3rem !important;
    margin-bottom: 0.4rem !important;
}

.info-item {
    padding: 0.35rem 0.5rem !important;
    break-inside: avoid;
}

.info-item .info-label {
    font-size: 7.5pt !important;
}

.info-item .info-value {
    font-size: 9.5pt !important;
}

/* ── CALCULATION STEPS ───────────────────────────────────── */
.calc-step {
    padding: 0.4rem 0.6rem !important;
    margin-bottom: 0.3rem !important;
    break-inside: avoid;
}

.step-number {
    width: 22px !important;
    height: 22px !important;
    line-height: 22px !important;
    font-size: 8pt !important;
    flex-shrink: 0;
}

.step-title {
    font-size: 9pt !important;
    margin-bottom: 0.15rem !important;
}

.step-value {
    font-size: 11pt !important;
    margin-bottom: 0.1rem !important;
}

.step-detail {
    font-size: 8.5pt !important;
}

/* ── TABLES ──────────────────────────────────────────────── */
.financial-table,
.data-table {
    font-size: 8.5pt !important;
    width: 100%;
}

.financial-table th,
.financial-table td,
.data-table th,
.data-table td {
    padding: 0.2rem 0.4rem !important;
}

/* Keep each row together — avoids a row splitting across pages */
.data-table tr,
.financial-table tr {
    break-inside: avoid;
}

/* ── DASHBOARD WIDGETS (home page) ───────────────────────── */
/* Clickable KPI link wrappers must not split across page breaks */
a.dash-widget-link {
    display: block;
    break-inside: avoid;
}

.dash-grid {
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 0.3rem !important;
    margin-bottom: 0.4rem !important;
}

.dash-widget {
    padding: 0.35rem 0.5rem !important;
    box-shadow: none !important;
    break-inside: avoid;
}

.dash-widget .dw-label {
    font-size: 7pt !important;
}

.dash-widget .dw-value {
    font-size: 14pt !important;
}

.dash-widget .dw-sub {
    font-size: 7pt !important;
}

/* Collapse home two-column grid to single column for print */
.home-grid {
    grid-template-columns: 1fr !important;
}

/* ── ALLOCATION BOX ──────────────────────────────────────── */
.allocation-box {
    break-inside: avoid;
}

.allocation-grid {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 0.3rem !important;
}

/* ── LINKS ───────────────────────────────────────────────── */
a {
    color: inherit !important;
    text-decoration: none !important;
}

/* ── LEGAL DOCUMENT ARTICLE HEADINGS ────────────────────── */
/* CSS "keepNext" equivalent — prevents orphan headings at    */
/* the bottom of a page by keeping each heading joined to    */
/* the content that immediately follows it.                  */
.legal-article-heading {
    break-after: avoid;
}

/* ── SIGNATURE PAGE ─────────────────────────────────────── */
/* Force the signature/notarization block onto its own page  */
.sig-block {
    break-before: page;
    break-inside: avoid;
}

/* ── LEGAL DOCUMENT PRINT MODE ───────────────────────────── */
/* Activated by printLegal() in results.html:
   document.body.classList.add('legal-print') → window.print() */

body.legal-print .tab-content {
    display: none !important;
}

body.legal-print #tab-legal {
    display: block !important;
}

body.legal-print .page-header {
    display: none !important;
}

body.legal-print #legal-doc-card {
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
}
