/* Copyright (c) Zhmara X. All rights reserved.
   Proprietary and confidential. Unauthorized copying of this file, via any medium, is prohibited. See LICENSE.txt. */

/* Report header (Reports/ReportHeader.razor) and the printed report page (wwwroot/js/report-print.js).
   On screen the header takes the page's colours, so it reads in light and dark mode; the printed page
   (body.zx-print-doc) is black on white with thin rules. The paper, margins and page footer are set by
   the @page rule report-print.js writes into the page. */

.zx-report-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 24px;
    padding-bottom: 12px;
    margin-bottom: 16px;
    border-bottom: 2px solid currentColor;
}

.zx-rh-company {
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
}

.zx-rh-logo {
    max-height: 64px;
    max-width: 160px;
    object-fit: contain;
    flex-shrink: 0;
}

.zx-rh-name {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.25;
}

.zx-rh-line {
    font-size: 13px;
    line-height: 1.5;
    opacity: .75;
}

.zx-rh-report {
    text-align: end;
    flex-shrink: 0;
}

.zx-rh-title {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.3;
}

.zx-rh-meta {
    font-size: 11px;
    margin-top: 4px;
    opacity: .6;
}

@media (max-width: 575.98px) {
    .zx-report-header { flex-direction: column; gap: 10px; }
    .zx-rh-report { text-align: start; }
}

/* Waiting for the server PDF */
body.zx-report-busy, body.zx-report-busy * { cursor: progress !important; }

/* ---- Printed page ---- */

.zx-print-doc {
    margin: 0;
    background: #fff !important;
    background-image: none !important;
    color: #111827;
    font-family: "Segoe UI", Tahoma, Arial, sans-serif;
    font-size: 9.5pt;
    line-height: 1.4;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
}

.zx-print-doc * {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
    box-shadow: none !important;
}

.zx-print-doc .zx-report-header {
    color: #111827;
    border-bottom: 1.5pt solid #111827;
    padding-bottom: 3mm;
    margin-bottom: 5mm;
    break-inside: avoid;
    break-after: avoid;
}

.zx-print-doc .zx-rh-logo { max-height: 18mm; max-width: 45mm; }
.zx-print-doc .zx-rh-name { font-size: 15pt; }
.zx-print-doc .zx-rh-title { font-size: 13pt; }
.zx-print-doc .zx-rh-line { font-size: 8.5pt; opacity: 1; color: #4b5563; }
.zx-print-doc .zx-rh-meta { font-size: 7.5pt; opacity: 1; color: #6b7280; }

/* Wide tables are never cut off: no scroll box, and the header row repeats on every page. */
.zx-print-doc .table-responsive { overflow: visible !important; }

.zx-print-doc table {
    width: 100% !important;
    border-collapse: collapse !important;
    font-size: 8.5pt;
    margin: 0 0 4mm 0 !important;
    color: #111827;
}

.zx-print-doc.zx-landscape table { font-size: 8pt; }

.zx-print-doc thead { display: table-header-group; }
.zx-print-doc tfoot { display: table-row-group; }
.zx-print-doc tr { break-inside: avoid; page-break-inside: avoid; }

.zx-print-doc .table > :not(caption) > * > * {
    background-color: transparent;
    color: inherit;
}

.zx-print-doc th,
.zx-print-doc thead td {
    background: #eef0f3 !important;
    color: #111827 !important;
    font-weight: 600 !important;
    border-top: .75pt solid #9ca3af !important;
    border-bottom: .75pt solid #9ca3af !important;
    padding: 4px 6px !important;
    vertical-align: bottom;
}

.zx-print-doc td {
    padding: 3px 6px !important;
    border-top: 0 !important;
    border-bottom: .5pt solid #e5e7eb !important;
    vertical-align: top;
}

.zx-print-doc tfoot td,
.zx-print-doc tfoot th {
    font-weight: 700 !important;
    background: #f3f4f6 !important;
    border-top: 1pt solid #111827 !important;
    border-bottom: 1pt solid #111827 !important;
}

/* Layout tables used for headings inside a report have no rules. */
.zx-print-doc table.zx-plain td,
.zx-print-doc table.zx-plain th {
    border: 0 !important;
    background: transparent !important;
}

.zx-print-doc h1, .zx-print-doc h2, .zx-print-doc h3,
.zx-print-doc h4, .zx-print-doc h5, .zx-print-doc h6 {
    break-after: avoid;
    color: #111827;
}

.zx-print-doc .text-muted { color: #6b7280 !important; }
.zx-print-doc a { color: inherit !important; text-decoration: none !important; }
.zx-print-doc img { max-width: 100%; }
.zx-print-doc .card,
.zx-print-doc .card-body { border: 0 !important; padding: 0 !important; background: transparent !important; }

/* Amount columns: the last 1-4 cells of each row align to the end (table class zx-num-1 ... zx-num-4). */
.zx-num-1 tr > :nth-last-child(-n+1),
.zx-num-2 tr > :nth-last-child(-n+2),
.zx-num-3 tr > :nth-last-child(-n+3),
.zx-num-4 tr > :nth-last-child(-n+4) {
    text-align: end;
    white-space: nowrap;
}

/* ---- Printed invoice / voucher (mode "document") and POS receipt (mode "receipt") ----
   These keep the app's own design (theme style.css is loaded too); only what printing needs is set here:
   white page, nothing cut off by scroll boxes, table headings repeated, rows kept whole. */

.zx-print-document,
.zx-print-receipt {
    margin: 0;
    padding: 0;
    background: #fff !important;
    background-image: none !important;
    color: #1f2937;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
}

.zx-print-document *,
.zx-print-receipt * {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
    box-shadow: none !important;
}

.zx-print-document .table-responsive { overflow: visible !important; }
.zx-print-document thead { display: table-header-group; }
.zx-print-document tfoot { display: table-row-group; }
.zx-print-document tr { break-inside: avoid; page-break-inside: avoid; }
.zx-print-document .invoice-header,
.zx-print-document .terms-condition,
.zx-print-document .thanks-msg { break-inside: avoid; }
.zx-print-document a { color: inherit !important; text-decoration: none !important; }

/* Company logo at the top of an invoice or voucher. */
.zx-print-document .inv-header-left img { max-height: 22mm; max-width: 60mm; object-fit: contain; }

/* Amount columns of document tables (class zx-doc-amounts): every cell after the first aligns to the end. */
.zx-doc-amounts tr > :not(:first-child) { text-align: end; }

/* Audit footer of an invoice / voucher (DocumentAuditFooter.razor): created by at the start, status and printed by
   in the middle (printed by only on paper), last modified by at the end. Start / end follow the page direction. */
.zx-doc-audit {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: baseline;
    gap: 4px 16px;
    margin-top: 16px;
    padding-top: 6px;
    border-top: 1px solid currentColor;
    border-top-color: rgba(127, 127, 127, .35);
    font-size: 11px;
    line-height: 1.5;
    opacity: .75;
}
.zx-da-item { min-width: 0; }
.zx-da-mid { display: flex; flex-wrap: wrap; gap: 0 12px; justify-content: center; }
.zx-da-end { text-align: end; }
.zx-da-date { margin-inline-start: 4px; white-space: nowrap; }
.zx-da-history { margin-inline-start: 10px; white-space: nowrap; }
.zx-da-print-only { display: none; }
.zx-print-document .zx-da-print-only { display: inline; }
.zx-print-document .zx-doc-audit {
    font-size: 7.5pt;
    color: #6b7280;
    opacity: 1;
    border-top-color: #d1d5db;
    break-inside: avoid;
    page-break-inside: avoid;
}
.zx-doc-audit-receipt { margin-top: 4px; font-size: 11px; text-align: center; }

/* Amount in words under a document's totals (AmountInWords.razor); the label and text follow the page direction. */
.zx-amount-words {
    margin: 8px 0 12px;
    padding: 6px 10px;
    border-inline-start: 3px solid rgba(127, 127, 127, .45);
    font-size: 14px;
    line-height: 1.6;
    break-inside: avoid;
    page-break-inside: avoid;
}
.zx-aw-label { font-weight: 700; margin-inline-end: 6px; }
.zx-print-document .zx-amount-words { font-size: 10pt; color: #000; border-inline-start-color: #9ca3af; }
.zx-amount-words-receipt { margin: 4px 0; font-size: 10px; text-align: center; line-height: 1.4; }
.zx-amount-words-receipt .zx-aw-label { margin-inline-end: 3px; }

/* Receipt: 80 mm paper, about 72 mm printable. */
.zx-print-receipt { width: 80mm; font-size: 11px; }
.zx-print-receipt .receipt-wrap { width: 72mm !important; max-width: 72mm !important; margin: 0 auto !important; padding: 3mm 0 !important; border: 0 !important; }
.zx-print-receipt .logo-darkmode { display: none !important; }
.zx-print-receipt img { max-width: 40mm; max-height: 20mm; object-fit: contain; }

/* ---- Barcode labels (mode "labels") ----
   An A4 sheet, four labels across; a label is never split between two pages. */
.zx-print-labels {
    margin: 0;
    background: #fff !important;
    color: #000;
    font-family: "Segoe UI", Tahoma, Arial, sans-serif;
}
.zx-print-labels .row {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr);
    gap: 3mm 4mm;
    margin: 0 !important;
}
.zx-print-labels .row > * {
    width: auto !important;
    max-width: none !important;
    padding: 0 !important;
    margin: 0 !important;
    break-inside: avoid;
    page-break-inside: avoid;
}
.zx-print-labels .row > * > div { margin-top: 0 !important; padding: 1.5mm !important; }
.zx-print-labels img { max-width: 100%; height: auto; }

/* ---- Payslips (mode "payslip", Reports > Payroll > Monthly / Daily Payslip) ----
   One sheet per employee: two identical half-A4 copies, the employee's and the company's, with a dashed
   cut line between them. On screen the sheets look like paper; printed, each sheet is exactly one A4 page
   (the @page margin is 0, each copy has its own padding). */
.zx-payslip-sheet {
    background: #fff;
    color: #111;
    max-width: 210mm;
    margin: 0 auto 24px;
    box-shadow: 0 1px 6px rgba(0, 0, 0, .18);
    font-family: "Segoe UI", Tahoma, Arial, sans-serif;
    font-size: 9pt;
}
.zx-payslip-copy {
    position: relative;
    box-sizing: border-box;
    min-height: 148mm;
    padding: 9mm 11mm 8mm;
    display: flex;
    flex-direction: column;
    gap: 3mm;
}
.zx-payslip-copy + .zx-payslip-copy { border-top: 1px dashed #888; }
.zx-payslip-copy + .zx-payslip-copy::before {
    content: "\2702";
    position: absolute;
    top: -0.75em;
    inset-inline-start: 6mm;
    background: #fff;
    color: #888;
    padding: 0 1mm;
    font-size: 11pt;
    line-height: 1;
}
.zx-ps-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 6mm;
    padding-bottom: 2.5mm;
    border-bottom: 1.5px solid #111;
}
.zx-ps-company { display: flex; align-items: center; gap: 3mm; min-width: 0; }
.zx-ps-logo { max-height: 15mm; max-width: 35mm; object-fit: contain; }
.zx-ps-name { font-size: 12pt; font-weight: 700; line-height: 1.2; }
.zx-ps-line { font-size: 8pt; color: #444; line-height: 1.35; }
.zx-ps-title { text-align: end; }
.zx-ps-title > div:first-child { font-size: 13pt; font-weight: 700; letter-spacing: .5px; }
.zx-ps-copy {
    display: inline-block;
    margin-top: 1mm;
    padding: .3mm 2mm;
    border: 1px solid #111;
    border-radius: 2mm;
    font-size: 7.5pt;
    font-weight: 600;
    text-transform: uppercase;
}
.zx-ps-info {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1mm 4mm;
}
.zx-ps-info span { display: block; font-size: 7.5pt; color: #555; }
.zx-ps-info strong { font-weight: 600; }
.zx-ps-tables { display: grid; grid-template-columns: 1fr 1fr; gap: 4mm; }
.zx-ps-table { width: 100%; border-collapse: collapse; }
.zx-ps-table th, .zx-ps-table td { padding: .9mm 1.5mm; border-bottom: 1px solid #ddd; }
.zx-ps-table th { background: #f1f1f1; text-align: start; font-weight: 600; }
.zx-ps-table td:last-child, .zx-ps-table th:last-child { text-align: end; white-space: nowrap; }
.zx-ps-table tfoot td { border-top: 1.5px solid #111; border-bottom: 0; font-weight: 700; }
.zx-ps-days { font-size: 8pt; color: #333; }
.zx-ps-days .zx-ps-unpaid { text-decoration: line-through; color: #888; }
.zx-ps-net {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 2mm 3mm;
    border: 1.5px solid #111;
    font-size: 11pt;
    font-weight: 700;
}
.zx-ps-sign {
    margin-top: auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12mm;
    padding-top: 9mm;
}
.zx-ps-sign div { border-top: 1px solid #111; padding-top: 1mm; font-size: 8pt; text-align: center; }

.zx-print-payslip {
    margin: 0;
    background: #fff !important;
    color: #111;
}
.zx-print-payslip .zx-payslip-sheet {
    box-shadow: none;
    margin: 0;
    max-width: none;
    width: 210mm;
    height: 296.5mm;
    overflow: hidden;
    break-after: page;
    page-break-after: always;
}
.zx-print-payslip .zx-payslip-sheet:last-child { break-after: auto; page-break-after: auto; }
.zx-print-payslip .zx-payslip-copy { height: 148.25mm; min-height: 0; overflow: hidden; }

/* Receipts / payments made (DocumentPayments.razor) and journal entries (DocumentJournal.razor) near the end of a
   document: the same title, table and total row on every invoice, bill and voucher. Credit accounts are indented. */
.zx-doc-section { margin: 12px 0; }
.zx-doc-section-title { margin-bottom: 8px; font-weight: 700; break-after: avoid; page-break-after: avoid; }
.zx-doc-section-table { margin-bottom: 0; }
.zx-doc-section-table tfoot td { font-weight: 600; background: rgba(127, 127, 127, .08); }
.zx-doc-section-note { font-size: 12px; }
.zx-dj-credit { padding-inline-start: 2rem !important; }
.zx-print-document .zx-doc-section-title { font-size: 10pt; }
.zx-print-document .zx-doc-section-table { font-size: 9pt; }
.zx-print-document .zx-doc-section-note { font-size: 8pt; }