@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
        
        body { 
            font-family: 'Inter', sans-serif; 
            background-color: #f3f4f6; 
            color: #1f2937;
        }

        /* Custom Scrollbar for Table */
        .table-container::-webkit-scrollbar { height: 12px; width: 12px; }
        .table-container::-webkit-scrollbar-track { background: #f1f5f9; }
        .table-container::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 6px; border: 3px solid #f1f5f9; }
        .table-container::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

        /* Sticky Columns Logic */
        .sticky-left-1 { position: sticky; left: 0; z-index: 30; background-color: #fff; }
        .sticky-left-2 { position: sticky; left: 200px; z-index: 30; background-color: #fff; border-right: 2px solid #e2e8f0; }
        
        thead tr th { position: sticky; top: 0; z-index: 40; box-shadow: 0 1px 2px rgba(0,0,0,0.05); }
        thead tr th.sticky-left-1 { z-index: 50; } 
        thead tr th.sticky-left-2 { z-index: 50; }

        /* Animations */
        .fade-in { animation: fadeIn 0.4s ease-out; }
        @keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

        /* Mode selector styles */
        .mode-btn { transition: all 0.3s ease; }
        .mode-btn.active { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,0.15); }

        /* =========================================
           PRINT STYLES - PRESERVE EXACT APPEARANCE
           ========================================= */
        @media print {
            @page { margin: 0.5cm; size: auto; }
            
            /* 1. Reset Page Dimensions */
            html, body {
                height: auto !important;
                min-height: 100% !important;
                overflow: visible !important;
                margin: 0 !important;
                padding: 0 !important;
            }

            /* 2. Hide Everything Except Modal */
            body > *:not(#modalContainer) {
                display: none !important;
            }

            /* 3. Force Modal to Flow Naturally */
            #modalContainer {
                display: block !important;
                position: relative !important;
                top: 0 !important;
                left: 0 !important;
                width: 100% !important;
                height: auto !important;
                min-height: 0 !important;
                max-height: none !important;
                overflow: visible !important;
                background: white !important;
                z-index: 9999;
                margin: 0 !important;
                padding: 0 !important;
            }

            /* 4. Unlock Inner Containers */
            #modalContainer .overflow-y-auto, 
            #modalContainer .max-h-\[95vh\] {
                overflow: visible !important;
                height: auto !important;
                max-height: none !important;
                display: block !important;
            }

            /* 5. Force Visibility */
            #modalContainer * {
                visibility: visible !important;
            }

            /* 6. PRESERVE ALL COLORS & STYLING - Don't override backgrounds! */
            /* Only remove excessive shadows for cleaner print */
            .shadow-2xl { 
                box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important; 
            }
            
            /* 7. Hide UI Elements */
            .no-print, button:not(.print-keep), .close-btn, header { display: none !important; }

            /* 8. Show Charts */
            canvas {
                max-width: 100% !important;
                max-height: 250px !important;
                display: block !important;
            }

            /* 9. Prevent Awkward Breaks */
            tr { page-break-inside: avoid; }
            h1, h2, h3, h4, h5 { page-break-after: avoid; }
            .break-inside-avoid { page-break-inside: avoid; }
            
            /* Keep grid layouts together */
            .grid { page-break-inside: avoid; }
            
            /* 10. Make inputs visible with their values */
            input, textarea {
                border: 1px solid #e2e8f0 !important;
                background: white !important;
                padding: 0.5rem !important;
                font-size: 0.75rem !important;
                color: #000 !important;
                -webkit-print-color-adjust: exact !important;
                print-color-adjust: exact !important;
            }

/* 11. Force Color Printing */
* {
    -webkit-print-color-adjust: exact !important; /* For WebKit-based browsers (e.g., Chrome, Safari) */
    print-color-adjust: exact !important; /* Standardized property */
}

            /* 12. Hide the separate print header, keep inline design */
            .hidden.print\\:block {
                display: none !important;
            }

            /* 13. Ensure modal content has proper padding */
            #modalContainer > div > div:last-child {
                padding: 2rem !important;
            }

            /* 14. Keep signature section at bottom */
            .invisible.print\\:visible {
                visibility: visible !important;
                margin-top: 3rem !important;
                page-break-before: avoid !important;
            }
        }