@media print {
    @page {
        size: A4;
        margin: 0;
    }

    body {
        background: white;
        margin: 0;
        padding: 0;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    #app {
        display: block;
        height: auto;
        overflow: visible;
    }

    .no-print {
        display: none !important;
    }

    .preview-wrapper {
        width: 100% !important;
        height: auto !important;
        padding: 0 !important;
        margin: 0 !important;
        background: none !important;
        display: block !important;
        overflow: visible !important;
    }

    #invoice-preview {
        width: 210mm;
        min-height: 297mm;
        padding: 0;
        margin: 0;
        box-shadow: none;
        overflow: visible;
        position: relative;
        page-break-after: always;
    }

    /* Ensure background colors are printed */
    * {
        -webkit-print-color-adjust: exact !important;
        color-adjust: exact !important;
    }
}

/* Screen styles for preview */
#invoice-preview {
    width: 210mm;
    min-height: 297mm;
    background: white;
    margin: 0 auto;
    position: relative;
    /* Scale down for smaller screens in preview mode */
    transform-origin: top center;
}

@media screen and (max-width: 800px) {
    #invoice-preview {
        transform: scale(0.5);
        margin-bottom: -150mm; /* Adjust for the empty space caused by scaling */
    }
}

.invoice-container {
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 10;
}

/* Custom fonts and colors */
.bg-saladey-green {
    background-color: #1a7f5d;
}

.text-saladey-green {
    color: #1a7f5d;
}

.bg-saladey-gold {
    background-color: #e5c573;
}

.text-saladey-gold {
    color: #e5c573;
}

.border-saladey-gold {
    border-color: #e5c573;
}