/* ============================================================
   PRINT — Robust, high-fidelity print styles for invoices,
           receipts, ledgers, and student ID cards
   ============================================================ */

@media print {
    /* ── A4 Page setup ────────────────────────────────────────── */
    @page {
        size: A4 portrait;
        margin: 0;
    }

    html, body {
        background: #ffffff !important;
        color: #000000 !important;
        margin: 0 !important;
        padding: 0 !important;
        width: 210mm !important;
        min-width: 210mm !important;
        height: auto !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    /* ── Hide page navigation, chrome, and toolbars ───────────── */
    body > header,
    body > .top-header-bar,
    body > .context-bar,
    body > .hamburger-drawer,
    body > script,
    .top-header-bar,
    .context-bar,
    .nav-bar,
    .school-nav,
    .app-header,
    .page-header,
    .header-actions,
    #school-quick-actions,
    .hamburger-drawer,
    .hamburger-backdrop,
    #hamburger-backdrop,
    .student-filter-bar,
    .tab-title-bar,
    .bulk-actions-bar,
    .id-side-switcher,
    .id-bulk-print-toolbar,
    .a4-page-badge,
    .profile-page-toolbar,
    .profile-tabs,
    .modal-header .close-btn,
    .modal-header button,
    .modal-overlay.hidden,
    .no-print,
    .modal-actions,
    .voucher-actions,
    .school-tab-content.hidden,
    .tab-content.hidden,
    .hidden,
    [hidden],
    #suspended-screen,
    #auth-required-screen,
    footer,
    #super-admin-view {
        display: none !important;
    }

    /* If a modal overlay is open, hide main body so only the modal prints */
    body:has(.modal-overlay:not(.hidden)) > main,
    body:has(.modal-overlay:not(.hidden)) #school-view {
        display: none !important;
    }

    /* When printing dedicated document pages, ensure only the active tab is visible */
    body > main,
    .app-viewport,
    #school-view,
    .school-tab-content:not(.hidden),
    #school-invoice-a4-container,
    #school-receipt-a4-container,
    #school-payslip-a4-container {
        display: block !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        box-shadow: none !important;
        border: none !important;
    }

    /* ── Exact A4 Document Sheet Print Fidelity (Invoices & Receipts) ── */
    .a4-document-sheet {
        box-sizing: border-box !important;
        width: 210mm !important;
        min-width: 210mm !important;
        max-width: 210mm !important;
        height: 297mm !important;
        min-height: 297mm !important;
        max-height: 297mm !important;
        margin: 0 auto !important;
        padding: 12mm 14mm !important;
        box-shadow: none !important;
        border: none !important;
        border-radius: 0 !important;
        background: #ffffff !important;
        color: #0f172a !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: space-between !important;
        page-break-inside: avoid !important;
        break-inside: avoid !important;
        page-break-after: avoid !important;
        break-after: avoid !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
        overflow: hidden !important;
    }

    .a4-document-sheet,
    .a4-document-sheet * {
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    /* ── Active Modal Layout in Print ─────────────────────────── */
    .modal-overlay:not(.hidden) {
        display: block !important;
        position: static !important;
        background: transparent !important;
        width: 100% !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
    }

    .modal-overlay:not(.hidden) .modal-card {
        box-shadow: none !important;
        border: none !important;
        background: transparent !important;
        width: 100% !important;
        max-width: 100% !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
    }

    .modal-overlay:not(.hidden) .modal-header {
        display: none !important;
    }

    /* ── Printable Modal Content Containers (Invoice, Receipt, Ledger, Summary, ID Cards) ── */
    #student-id-card-preview,
    #view-invoice-content,
    #view-receipt-content-v2,
    #view-ledger-content-v2,
    #view-student-fee-summary-content-v2 {
        display: block !important;
        overflow: visible !important;
        max-height: none !important;
        padding: 0 !important;
        margin: 0 !important;
        width: 100% !important;
        background: transparent !important;
    }

    .a4-pages-wrapper {
        display: block !important;
        width: 210mm !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .a4-page {
        width: 210mm !important;
        height: 297mm !important;
        min-width: 210mm !important;
        min-height: 297mm !important;
        max-width: 210mm !important;
        max-height: 297mm !important;
        box-sizing: border-box !important;
        padding: 10mm 15mm !important;
        display: grid !important;
        grid-template-columns: 85.6mm 85.6mm !important;
        grid-template-rows: repeat(5, 54mm) !important;
        gap: 1.75mm 8.8mm !important;
        margin: 0 !important;
        background: #ffffff !important;
        box-shadow: none !important;
        page-break-after: always !important;
        break-after: page !important;
        overflow: hidden !important;
    }

    .a4-page:last-child {
        page-break-after: avoid !important;
        break-after: avoid !important;
    }

    .a4-page.a4-vertical-grid {
        grid-template-columns: repeat(3, 54mm) !important;
        grid-template-rows: repeat(3, 85.6mm) !important;
        gap: 4.5mm 9mm !important;
        padding: 12mm 15mm !important;
    }

    .student-id-card {
        width: var(--id-card-width, 85.6mm) !important;
        height: var(--id-card-height, 54mm) !important;
        min-width: var(--id-card-width, 85.6mm) !important;
        min-height: var(--id-card-height, 54mm) !important;
        max-width: var(--id-card-width, 85.6mm) !important;
        max-height: var(--id-card-height, 54mm) !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
        position: relative !important;
        background: #ffffff !important;
        border: 0.8px solid #000000 !important;
        box-shadow: none !important;
        page-break-inside: avoid !important;
        break-inside: avoid !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    .student-id-card.layout-vertical {
        width: var(--id-card-width, 54mm) !important;
        height: var(--id-card-height, 85.6mm) !important;
        min-width: var(--id-card-width, 54mm) !important;
        min-height: var(--id-card-height, 85.6mm) !important;
        max-width: var(--id-card-width, 54mm) !important;
        max-height: var(--id-card-height, 85.6mm) !important;
    }

    .id-vert-header, .id-vert-back-header, .id-vert-photo-box, .id-vert-class-badge, .id-vert-badge {
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    .student-id-card.hidden-side {
        display: none !important;
    }

    .id-card-header {
        background: #1e293b !important;
        color: #ffffff !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    .id-back-header {
        background: #0f172a !important;
        color: #ffffff !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    .id-logo-wrap,
    .id-card-badge,
    .id-photo-box,
    .id-card-footer,
    .id-back-footer {
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    /* Single ID card preview container in print */
    .id-cards-container {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        gap: 10mm !important;
        justify-content: flex-start !important;
        align-items: flex-start !important;
        padding: 10mm !important;
        page-break-inside: avoid !important;
        break-inside: avoid !important;
    }

    /* ── Fee Voucher & Payment Receipt Print Styling ──────────── */
    .fee-voucher-sheet,
    #view-invoice-content,
    #view-receipt-content-v2,
    #view-ledger-content-v2,
    #view-student-fee-summary-content-v2 {
        color: #0f172a !important;
        background: #ffffff !important;
    }

    #view-invoice-content .card,
    #view-receipt-content-v2 .card,
    #view-ledger-content-v2 .card,
    #view-student-fee-summary-content-v2 .card {
        box-shadow: none !important;
        border: 1px solid #cbd5e1 !important;
        background: #ffffff !important;
        page-break-inside: avoid !important;
        break-inside: avoid !important;
    }

    #view-invoice-content table,
    #view-receipt-content-v2 table,
    #view-ledger-content-v2 table,
    #view-student-fee-summary-content-v2 table {
        width: 100% !important;
        border-collapse: collapse !important;
        page-break-inside: auto !important;
    }

    #view-invoice-content tr,
    #view-receipt-content-v2 tr,
    #view-ledger-content-v2 tr,
    #view-student-fee-summary-content-v2 tr {
        page-break-inside: avoid !important;
        break-inside: avoid !important;
    }

    #view-invoice-content th,
    #view-invoice-content td,
    #view-receipt-content-v2 th,
    #view-receipt-content-v2 td,
    #view-ledger-content-v2 th,
    #view-ledger-content-v2 td,
    #view-student-fee-summary-content-v2 th,
    #view-student-fee-summary-content-v2 td {
        color: #0f172a !important;
        border-color: #cbd5e1 !important;
    }
}