/* Global Print Styles - Common for all report pages */
.print-only {
    display: none;
}

@media print {
    /* Reset and hide non-print elements */
    * {
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }
    
    body * {
        visibility: hidden;
    }
    
    .no-print, .no-print * {
        display: none !important;
    }
    
    .print-only, .print-only * {
        visibility: visible;
    }
    
    .print-only {
        display: block !important;
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
    }
    
    /* Page setup - default landscape for reports with page numbers */
    @page {
        size: A4 landscape;
        margin: 1.5cm 1cm 2.5cm 1cm; /* Extra bottom margin for page numbers */
    }
    
    /* Portrait option - add class 'print-portrait' to printable container */
    @page :root.print-portrait {
        size: A4 portrait;
    }
    
    /* Print header - repeats on every page */
    .print-header {
        text-align: center;
        margin-bottom: 15px;
        border-bottom: 2px solid #333;
        padding-bottom: 10px;
        page-break-after: avoid;
    }
    
    .print-header h2 {
        margin: 0 0 8px 0;
        font-size: 22px;
        font-weight: bold;
    }
    
    .print-header h3 {
        margin: 0 0 6px 0;
        font-size: 18px;
        font-weight: bold;
    }
    
    .print-header p {
        margin: 3px 0;
        font-size: 13px;
    }
    
    /* Table styles */
    .print-table {
        width: 100%;
        border-collapse: collapse;
        font-size: 11px;
        margin-bottom: 50px; /* Space to prevent overlap with footer */
        page-break-after: auto;
    }
    
    /* Ensure headers repeat on every page */
    .print-table thead {
        display: table-header-group;
    }
    
    .print-table thead tr {
        page-break-inside: avoid;
        page-break-after: avoid;
    }
    
    .print-table tbody {
        display: table-row-group;
    }
    
    /* Prevent row breaks */
    .print-table tbody tr {
        page-break-inside: avoid;
        page-break-after: auto;
    }
    
    .print-table th,
    .print-table td {
        border: 1px solid #333;
        padding: 6px 8px;
        text-align: left;
    }
    
    .print-table th {
        background-color: #e0e0e0 !important;
        font-weight: bold;
        text-align: center;
        font-size: 11px;
    }
    
    /* Footer totals - only prints once at the end */
    .print-footer {
        page-break-inside: avoid;
        page-break-before: avoid;
        margin-top: 20px;
        padding-top: 10px;
        border-top: 3px double #333;
        clear: both;
    }
    
    .totals-table {
        width: 100%;
        border-collapse: collapse;
        margin-bottom: 20px; /* Space to prevent overlap */
    }
    
    .totals-table td {
        padding: 8px;
        font-size: 12px;
        font-weight: bold;
        border: 1px solid #333;
        background-color: #f5f5f5 !important;
    }
    
    /* Try to keep last few rows with totals */
    .print-table tbody tr:nth-last-child(-n+5) {
        page-break-after: avoid;
    }
    
    /* Company Logo/Branding - if needed */
    .print-logo {
        max-width: 120px;
        max-height: 60px;
        margin-bottom: 10px;
    }
    
    /* Note: Page numbers must be enabled in browser print settings
       Chrome: More settings > Options > Headers and footers
       Firefox: Page Setup > Margins & Header/Footer
       Edge: More settings > Headers and footers */
}

/* Portrait print layout - wrap content in div with class 'print-portrait' */
@media print {
    .print-portrait {
        /* Portrait-specific styles */
    }
}

/* Use this class on the html element to switch to portrait mode */
html.print-portrait-mode {
    /* Placeholder for JS-based orientation switching */
}

@media print {
    html.print-portrait-mode .print-only,
    .print-only.print-portrait {
        /* Portrait container styles */
    }
}

/* Portrait page setup - add 'print-portrait' class to print-only container */
@page portrait {
    size: A4 portrait;
    margin: 1cm;
}

@media print {
    .print-only.print-portrait {
        page: portrait;
    }
    
    .print-portrait .print-table {
        width: 100%;
        table-layout: fixed;
    }
    
    .print-portrait .print-table th,
    .print-portrait .print-table td {
        word-wrap: break-word;
        overflow-wrap: break-word;
    }
}