{"includes":"<style id=\"style\">\n    @import url($font_url);\n\n    :root {\n        --primary-color: $primary_color;\n        --secondary-color: $secondary_color;\n        --line-height: 1.6;\n    }\n\n    html {\n        width: 210mm;\n        height: 200mm;\n    }\n\n    body {\n        -webkit-font-smoothing: antialiased;\n        -moz-osx-font-smoothing: grayscale;\n        font-family: $font_name, Helvetica, sans-serif;\n        font-size: $font_size !important;\n        zoom: 80%;\n    }\n\n\n    table tr td,\n    table tr,\n    th {\n        font-size: $font_size !important;\n    }\n\n    @page {\n        margin-left: $global_margin;\n        margin-right: $global_margin;\n        margin-top: 0;\n        margin-bottom: 0;\n        size: $page_size $page_layout;\n    }\n\n    p {\n        margin: 0;\n        padding: 0;\n    }\n\n    .header-wrapper {\n        display: grid;\n        grid-template-rows: 0.5fr;\n        grid-template-columns: auto auto auto auto auto;\n        grid-template-areas: \"a b c d e\";\n        grid-auto-columns: minmax(0, 1fr);\n        grid-auto-flow: column;\n        align-items: start;\n        gap: 0px;\n        line-height: var(--line-height);\n    }\n\n    .company-logo {\n        max-width: $company_logo_size;\n        float: right;\n    }\n\n    .logo-wrapper {\n        grid-area: e;\n        justify-self: end;\n        align-self: start;\n    }\n\n    #entity-details {\n        width: 100%;\n        white-space: nowrap;\n        text-align: right;\n    }\n\n    #entity-details p {\n        margin-top: 5px;\n    }\n\n    .header-wrapper #client-details,\n    .header-wrapper #company-details,\n    .header-wrapper #company-address {\n        display: flex;\n        flex-direction: column;\n        line-height: var(--line-height) !important;\n    }\n\n    [data-ref=\"company_details-company.name\"] {\n        color: var(--primary-color);\n        font-weight: bold;\n    }\n\n    .header-wrapper #client-details>*:first-child {\n        font-weight: bold;\n    }\n\n    .header-wrapper .company-info-wrapper>* {\n        margin-bottom: 1rem;\n        grid-row-end: 4;\n    }\n\n    .entity-label-wrapper {\n        \/* display: flex; *\/\n        display: grid;\n        grid-template-columns: 2fr 1fr;\n        width: 100%;\n        word-break: break-all;\n        box-sizing: border-box;\n        margin-top: 1rem;\n        margin-bottom: 1rem;\n\n    }\n\n    .entity-label {\n        display: flex;\n    }\n\n    .entity-label h4 {\n        margin-top: 0rem;\n        margin-bottom: 0rem;\n    }\n\n    .entity-details-wrapper {\n        flex-shrink: 0;\n    }\n\n    .entity-label-wrapper .entity-label>* {\n        font-size: 2.5rem;\n\n    }\n\n    .entity-label-wrapper .entity-label>*:first-child {\n        text-transform: uppercase;\n        white-space: nowrap;\n    }\n\n    .entity-label-wrapper .entity-label>*:last-child {\n        color: var(--primary-color);\n        font-style: italic;\n\n    }\n\n    #shipping-details {\n        display: $show_shipping_address;\n        flex-direction: column;\n        line-height: var(--line-height) !important;\n        margin-left: 1rem;\n    }\n\n    .entity-label-wrapper #entity-details>tr,\n    .entity-label-wrapper #entity-details th {\n        font-weight: normal;\n        line-height: var(--line-height);\n        padding-left: 1rem;\n    }\n\n    [data-ref=\"table\"] {\n        margin-bottom: 5px;\n        min-width: 100%;\n        table-layout: fixed;\n        overflow-wrap: break-word;\n    }\n\n    [data-ref=\"table\"]:not(:empty) {\n        border-top: 5px solid var(--primary-color);\n        margin-top: 1rem;\n    }\n\n    .task-time-details {\n        display: block;\n        margin-top: 5px;\n        color: grey;\n    }\n\n\n    [data-ref='product_table-product.description-th'],\n    [data-ref='task_table-task.description-th'] {\n        width: 35% !important;\n        overflow-wrap: break-word;\n    }\n\n    [data-ref='product_table-product.item-td'] {\n        color: var(--primary-color);\n    }\n\n    [data-ref=\"table\"]>thead {\n        text-align: left;\n    }\n\n    [data-ref=\"table\"]>thead>tr>th {\n        font-size: 1.1rem;\n        padding: 1rem;\n    }\n\n    th.right-radius {\n        text-align: right !important;\n    }\n\n    td.right-radius {\n        text-align: right !important;\n    }\n\n    [data-ref=\"table\"]>tbody>tr>td {\n        padding: 1rem;\n    }\n\n    [data-ref=\"table\"]>tbody>tr:nth-child(odd) {\n        background-color: #e8e8e8;\n    }\n\n    #table-totals {\n        margin-top: 0rem;\n        display: grid;\n        grid-template-columns: 2fr 1fr;\n        padding-top: 1rem;\n        margin-right: .75rem;\n        page-break-inside: auto;\n        overflow: visible !important;\n    }\n\n    #table-totals .totals-table-right-side>* {\n        display: grid;\n        grid-template-columns: 1fr 1fr;\n    }\n\n    #table-totals>.totals-table-right-side>*> :nth-child(1) {\n        text-align: $dir_text_align;\n        margin-top: .75rem;\n    }\n\n    #table-totals>.totals-table-right-side>*> :not([hidden])~ :not([hidden]) {\n        --tw-space-y-reverse: 0;\n        margin-top: calc(.75rem * calc(1 - var(--tw-space-y-reverse)));\n        margin-bottom: calc(.75rem * var(--tw-space-y-reverse));\n    }\n\n    #table-totals>.totals-table-right-side>*> :nth-child(2) {\n        text-align: right;\n    }\n\n    #table-totals>*>* {}\n\n    #table-totals>*> :last-child {\n        text-align: right;\n        padding-right: 1rem;\n    }\n\n    [data-ref=\"total_table-footer\"] {\n        padding-right: 0.8rem;\n    }\n\n    #footer {\n        margin-top: 30px;\n    }\n\n    \/** Markdown-specific styles. **\/\n    [data-ref=\"table\"] h3 {\n        font-size: 1rem;\n        margin-bottom: 0;\n    }\n\n    [data-ref=\"statement-totals\"] {\n        margin-top: 1rem;\n        text-align: right;\n        margin-right: .75rem;\n    }\n\n    [data-ref*=\".line_total-td\"] {\n        white-space: nowrap;\n    }\n\n    \/** .repeating-header,\n    .repeating-header-space, **\/\n    .repeating-footer,\n    .repeating-footer-space {\n        height: 10px;\n    }\n\n    .repeating-header {\n        position: fixed;\n        top: 0;\n    }\n\n    .repeating-footer {\n        position: fixed;\n        bottom: 0;\n    }\n\n    [data-element='product_table-product.description-td'],\n    td {\n        min-width: 100%;\n        max-width: 300px;\n        overflow-wrap: break-word;\n    }\n\n    .stamp {\n        transform: rotate(12deg);\n        color: #555;\n        font-size: 3rem;\n        font-weight: 700;\n        border: 0.25rem solid #555;\n        display: inline-block;\n        padding: 0.25rem 1rem;\n        text-transform: uppercase;\n        border-radius: 1rem;\n        font-family: 'Courier';\n        mix-blend-mode: multiply;\n        z-index: 200 !important;\n        position: fixed;\n        text-align: center;\n    }\n\n    .is-paid {\n        color: #D23;\n        border: 1rem double #D23;\n        transform: rotate(-5deg);\n        font-size: 6rem;\n        font-family: \"Open sans\", Helvetica, Arial, sans-serif;\n        border-radius: 0;\n        padding: 0.5rem;\n        opacity: 0.2;\n        z-index: 200 !important;\n        position: fixed;\n        display: $show_paid_stamp;\n\n    }\n\n    .project-header {\n        font-size: 1.2em;\n        margin-top: 0.1em;\n        margin-bottom: 0;\n        padding-bottom: 0;\n        margin-left: 0;\n        margin-right: 0;\n        font-weight: bold;\n        color: #505050;\n    }\n\n    .pqrcode {}\n\n    #qr-bill {\n        width: 100% !important;\n    }\n\n    \/** Useful snippets, uncomment to enable. **\/\n\n    \/** Hide company logo **\/\n    \/* .company-logo { display: none } *\/\n\n    \/* Hide company details *\/\n    \/* #company-details > * { display: none } *\/\n\n    \/* Hide company address *\/\n    \/* #company-address > * { display: none } *\/\n\n    \/* Hide public notes *\/\n    \/* [data-ref=\"total_table-public_notes\"] { display: none } *\/\n\n    \/* Hide terms label *\/\n    \/* [data-ref=\"total_table-terms-label\"] { display: none } *\/\n\n    \/* Hide totals table *\/\n    \/* #table-totals { display: none } *\/\n\n    \/* Hide totals table left side *\/\n    \/* #table-totals div:first-child > * { display: none !important } *\/\n\n    \/* Hide totals table right side *\/\n    \/* .totals-table-right-side { display: none } *\/\n\n    \/** For more info, please check our docs: https:\/\/invoiceninja.github.io **\/\n    \/** To find out selectors on your own: https:\/\/invoiceninja.github.io\/docs\/custom-fields\/#snippets **\/\n<\/style>\n","header":"<div class=\"repeating-header\" id=\"header\"><\/div>\n","body":"<div id=\"body\">\n                    <div class=\"header-wrapper\">\n                        <div id=\"client-details\"><\/div>\n                        <div id=\"vendor-details\"><\/div>\n                        <div id=\"shipping-details\"><\/div>\n\n                        <div class=\"company-info-wrapper\">\n                            <div id=\"company-details\"><\/div>\n                            <div id=\"company-address\"><\/div>\n                        <\/div>\n                        <div class=\"logo-wrapper\">\n                            <img class=\"company-logo\" src=\"$company.logo\" alt=\"$company.name logo\">\n                        <\/div>\n                    <\/div>\n                    <div class=\"entity-label-wrapper\">\n                        <div class=\"entity-label\">\n                            <h4>$entity_label<\/h4>\n                            <h4>#$entity_number<\/h4>\n                        <\/div>\n                        <div class=\"entity-details-wrapper\">\n                            <table id=\"entity-details\" cellspacing=\"0\" dir=\"$dir\"><\/table>\n                        <\/div>\n                    <\/div>\n                    <table id=\"product-table\" cellspacing=\"0\" data-ref=\"table\"><\/table>\n                    <table id=\"task-table\" cellspacing=\"0\" data-ref=\"table\"><\/table>\n                    <table id=\"delivery-note-table\" cellspacing=\"0\" data-ref=\"table\"><\/table>\n                    <table id=\"statement-invoice-table\" cellspacing=\"0\" data-ref=\"table\"><\/table>\n                    <div id=\"statement-invoice-table-totals\" data-ref=\"statement-totals\"><\/div>\n                    <table id=\"statement-payment-table\" cellspacing=\"0\" data-ref=\"table\"><\/table>\n                    <div id=\"statement-payment-table-totals\" data-ref=\"statement-totals\"><\/div>\n                    <table id=\"statement-credit-table\" cellspacing=\"0\" data-ref=\"table\"><\/table>\n                    <div id=\"statement-credit-table-totals\" data-ref=\"statement-totals\"><\/div>\n                    <table id=\"statement-aging-table\" cellspacing=\"0\" data-ref=\"table\"><\/table>\n                    <div id=\"statement-aging-table-totals\" data-ref=\"statement-totals\"><\/div>\n                    <div id=\"table-totals\" cellspacing=\"0\">$status_logo<\/div>\n                <\/div>\n","product":"","task":"","footer":"<div class=\"repeating-footerx\" id=\"footer\">\n    <p data-ref=\"total_table-footer\">$entity_footer<\/p>\n\n<\/div>\n"}