/* invoice-designs.css — the five fee-note designs (2026-10-03).
 *
 * Chosen in Settings → Invoice appearance → Design gallery (invoice-designs.js),
 * stored as INVSTYLE.design, rendered by feeNoteHTML() as
 *     <div data-jb-doc="invoice" data-design="…" style="--inv-accent:…">
 * Every design restyles the SAME content: figures, numbering, VAT/WHT, bank
 * details and signature are identical in all five. Only the Legal letterhead
 * design changes a word (the document title reads "FEE NOTE").
 *
 * "classic" is the original look and has no rules here. The renderer writes
 * its styles inline, so overriding them needs !important; every rule is
 * scoped to one design on the fee-note document and touches nothing else.
 * Linked by index.html, and therefore copied into the print document too.
 */
[data-jb-doc="invoice"] { -webkit-print-color-adjust: exact; print-color-adjust: exact; }

/* ---------------------------------------------------------------- MODERN */
[data-jb-doc="invoice"][data-design="modern"] { --inv-a: var(--inv-accent, #1D5FD1); }
[data-design="modern"] .inv-masthead > div { text-align: left !important; }
[data-design="modern"] .inv-doclabel { text-align: left !important; font-style: normal !important; text-transform: uppercase; letter-spacing: .14em; color: var(--inv-a) !important; }
[data-design="modern"] .inv-rule { border-top: 2px solid var(--inv-a) !important; }
[data-design="modern"] .inv-rule-thin { border-top-color: #E3E8EF !important; }
[data-design="modern"] .inv-items th { background: #F3F6FA !important; color: #1a1a1a !important; border: 0 !important; border-bottom: 2px solid var(--inv-a) !important; }
[data-design="modern"] .inv-items td { border-left: 0 !important; border-right: 0 !important; border-top: 0 !important; border-bottom: 1px solid #E6EAF0 !important; }
[data-design="modern"] .inv-total-row td { border: 0 !important; }
[data-design="modern"] .inv-grand td:last-child { background: #EEF3FC !important; border-top: 2px solid var(--inv-a) !important; color: var(--inv-a) !important; }
[data-design="modern"] .inv-signline { border-top-color: var(--inv-a) !important; }

/* --------------------------------------------------------------- MINIMAL */
[data-jb-doc="invoice"][data-design="minimal"] { --inv-a: var(--inv-accent, #111111); }
[data-design="minimal"] .inv-masthead span { color: var(--inv-a) !important; }
[data-design="minimal"] .inv-masthead div:not(:first-child) { color: #555 !important; }
[data-design="minimal"] .inv-doclabel { font-style: normal !important; text-transform: uppercase; letter-spacing: .2em; color: var(--inv-a) !important; }
[data-design="minimal"] .inv-rule { border-top: 1px solid var(--inv-a) !important; }
[data-design="minimal"] .inv-rule-thin { border-top: 1px solid #C9C9C9 !important; }
[data-design="minimal"] .inv-items th { background: transparent !important; color: var(--inv-a) !important; border: 0 !important; border-bottom: 1px solid var(--inv-a) !important; }
[data-design="minimal"] .inv-items td { border: 0 !important; }
[data-design="minimal"] .inv-total-row td { border: 0 !important; color: #111 !important; }
[data-design="minimal"] .inv-grand td:last-child { border-top: 1px solid var(--inv-a) !important; border-bottom: 3px double var(--inv-a) !important; }
[data-design="minimal"] .inv-from { color: #444; }

/* ----------------------------------------------------------- BOLD HEADER */
[data-jb-doc="invoice"][data-design="bold"] { --inv-a: var(--inv-accent, #102B4C); }
[data-design="bold"] .inv-masthead { background: var(--inv-a); padding: 18px 20px 14px; border-radius: 4px; margin-bottom: 8px; }
[data-design="bold"] .inv-masthead span,
[data-design="bold"] .inv-masthead div { color: #fff !important; }
[data-design="bold"] .inv-masthead img { filter: brightness(0) invert(1); }
[data-design="bold"] .inv-doclabel { font-style: normal !important; text-transform: uppercase; letter-spacing: .12em; font-size: 14pt !important; color: var(--inv-a) !important; }
[data-design="bold"] .inv-rule { display: none; }
[data-design="bold"] .inv-items th { background: var(--inv-a) !important; color: #fff !important; border-color: var(--inv-a) !important; }
[data-design="bold"] .inv-grand td:nth-child(2) { color: var(--inv-a) !important; }
[data-design="bold"] .inv-grand td:last-child { background: var(--inv-a) !important; color: #fff !important; border-color: var(--inv-a) !important; }
[data-design="bold"] .inv-signline { border-top: 2px solid var(--inv-a) !important; }

/* ------------------------------------------------------ LEGAL LETTERHEAD */
[data-jb-doc="invoice"][data-design="legal"] { --inv-a: var(--inv-accent, #5A1A1A); }
[data-design="legal"] .inv-masthead span { color: #111 !important; font-family: Georgia, 'Times New Roman', Times, serif !important; }
[data-design="legal"] .inv-masthead div:not(:first-child) { color: var(--inv-a) !important; font-family: Georgia, 'Times New Roman', serif !important; }
[data-design="legal"] .inv-doclabel { text-align: center !important; font-style: normal !important; letter-spacing: .3em; font-size: 14pt !important; color: var(--inv-a) !important; font-family: Georgia, 'Times New Roman', serif !important; margin: 10px 0 2px !important; }
[data-design="legal"] .inv-rule { border-top: 3px double #111 !important; }
[data-design="legal"] .inv-rule-thin { border-top: 1px solid #111 !important; }
[data-design="legal"] .inv-items th { background: transparent !important; color: #111 !important; border: 1px solid #111 !important; font-family: Georgia, 'Times New Roman', serif !important; }
[data-design="legal"] .inv-items td { border-color: #111 !important; }
[data-design="legal"] .inv-total-row td:nth-child(2) { color: #111 !important; }
[data-design="legal"] .inv-grand td:last-child { border-bottom: 4px double #111 !important; border-top: 1px solid #111 !important; }
[data-design="legal"] .inv-signfirm::before { content: 'For: '; font-weight: 400; }

/* the header colour is painted on the <tr>, not only on the <th> cells */
[data-design="modern"] .inv-items thead tr { background: #F3F6FA !important; }
[data-design="minimal"] .inv-items thead tr,
[data-design="legal"] .inv-items thead tr { background: transparent !important; }
[data-design="bold"] .inv-items thead tr { background: var(--inv-a) !important; }

/* ------------------------------------------------------------- EXECUTIVE
 * 2026-10-12. House style: Century Gothic, hairline rules instead of boxes,
 * every figure on tabular lining numerals so naira amounts align to the
 * decimal, the amount now due on a payment on account set apart as its own
 * band, and one bold total closed by a double rule. Same content as every
 * other design; presentation only. */
[data-jb-doc="invoice"][data-design="executive"] {
  --inv-a: var(--inv-accent, #1F3864);
  --inv-ink: #16202E; --inv-mute: #5B6676; --inv-hair: #D5DBE3;
  font-family: 'Century Gothic', CenturyGothic, 'URW Gothic', AppleGothic, Futura, 'Trebuchet MS', sans-serif !important;
  color: var(--inv-ink) !important; line-height: 1.45 !important;
}
[data-design="executive"] table, [data-design="executive"] td, [data-design="executive"] th { font-family: inherit !important; }
[data-design="executive"] td, [data-design="executive"] th { font-variant-numeric: tabular-nums lining-nums; }
/* masthead: the firm name left, quiet and wide-tracked */
[data-design="executive"] .inv-masthead > div { text-align: left !important; }
[data-design="executive"] .inv-masthead span { color: var(--inv-a) !important; font-size: 22pt !important; letter-spacing: .06em !important; font-weight: 700 !important; }
[data-design="executive"] .inv-masthead div:not(:first-child) { color: var(--inv-mute) !important; font-size: 9.5pt !important; letter-spacing: .04em; }
[data-design="executive"] .inv-doclabel { font-style: normal !important; text-transform: uppercase; letter-spacing: .32em; font-size: 10pt !important; color: var(--inv-a) !important; margin-top: 14px !important; }
[data-design="executive"] .inv-rule { border-top: 1.5px solid var(--inv-a) !important; margin: 4px 0 10px !important; }
[data-design="executive"] .inv-date { color: var(--inv-mute); font-size: 10.5pt !important; }
[data-design="executive"] .inv-from { color: var(--inv-mute); font-size: 9.5pt !important; }
[data-design="executive"] .inv-rule-thin { border-top: 1px solid var(--inv-hair) !important; margin: 12px 0 14px !important; }
[data-design="executive"] .inv-transaction-meta table { font-size: 11pt !important; }
[data-design="executive"] .inv-transaction-meta b { color: var(--inv-mute); font-weight: 600; letter-spacing: .02em; }
[data-design="executive"] .inv-transaction-meta td > div:first-of-type { color: var(--inv-ink); font-size: 12.5pt; }
/* items: no boxes; a header rule and quiet row hairlines */
[data-design="executive"] .inv-items { font-size: 11pt !important; margin-top: 18px !important; }
[data-design="executive"] .inv-items thead tr { background: transparent !important; }
[data-design="executive"] .inv-items th { background: transparent !important; color: var(--inv-mute) !important; border: 0 !important; border-bottom: 1.5px solid var(--inv-ink) !important; font-size: 8.5pt !important; text-transform: uppercase; letter-spacing: .14em; font-weight: 700 !important; padding: 0 8px 7px !important; }
[data-design="executive"] .inv-items tbody td { border: 0 !important; border-bottom: 1px solid var(--inv-hair) !important; padding: 9px 8px !important; }
[data-design="executive"] .inv-items tbody td:first-child { color: var(--inv-mute); }
/* totals: labels quiet, figures aligned, no boxes */
[data-design="executive"] .inv-items tbody tr.inv-total-row td { border: 0 !important; padding: 6px 8px !important; }
[data-design="executive"] .inv-items tbody tr:not(.inv-total-row) td:nth-child(2) { text-align: left !important; }
[data-design="executive"] .inv-total-row td:nth-child(2) { color: var(--inv-mute) !important; font-weight: 600 !important; font-size: 10.5pt !important; }
[data-design="executive"] .inv-total-row td:last-child { color: var(--inv-ink) !important; }
[data-design="executive"] .inv-totals, [data-design="executive"] table.inv-items + table { margin-top: 10px !important; }
/* the amount now due on a payment on account: its own band */
[data-design="executive"] .inv-total-row[data-k="onAccount"] td:nth-child(2),
[data-design="executive"] .inv-total-row[data-k="onAccount"] td:last-child { background: color-mix(in srgb, var(--inv-a) 7%, #fff) !important; color: var(--inv-a) !important; font-weight: 700 !important; font-size: 11.5pt !important; padding-top: 9px !important; padding-bottom: 9px !important; }

/* the one bold line: total due, closed by a double rule */
[data-design="executive"] .inv-grand td:nth-child(2) { color: var(--inv-ink) !important; font-size: 11.5pt !important; font-weight: 700 !important; text-transform: uppercase; letter-spacing: .06em; }
[data-design="executive"] .inv-items tbody tr.inv-grand td:last-child, [data-design="executive"] .inv-grand td:last-child { border-top: 1.5px solid var(--inv-ink) !important; border-bottom: 3px double var(--inv-ink) !important; font-size: 13pt !important; font-weight: 700 !important; background: transparent !important; }
[data-design="executive"] .inv-words { font-size: 10.5pt !important; color: var(--inv-mute); margin-top: 18px !important; }
[data-design="executive"] .inv-words b { color: var(--inv-ink); }
/* payment details in a quiet panel */
[data-design="executive"] .inv-payment-block { margin-top: 20px; padding: 12px 16px 14px; border: 1px solid var(--inv-hair); border-radius: 2px; }
[data-design="executive"] .inv-payment-block > div:first-child { margin-top: 0 !important; font-size: 8.5pt !important; text-transform: uppercase; letter-spacing: .16em; color: var(--inv-a); }
[data-design="executive"] .inv-payment-block table { font-size: 10.5pt !important; }
[data-design="executive"] .inv-tax-signature { font-size: 10pt; }
[data-design="executive"] .inv-tax-signature > div:first-child { font-size: 10pt !important; color: var(--inv-mute); margin-top: 12px !important; }
[data-design="executive"] .inv-signline { border-top: 1px solid var(--inv-ink) !important; }
/* Executive, refinement pass (impeccable): headers share one baseline and
   follow their columns; the now-due band is tint only; the engagement note
   reads as a quiet footnote rather than a block of italics. */
[data-design="executive"] .inv-items th { vertical-align: bottom !important; white-space: normal; }
[data-design="executive"] .inv-items th:nth-child(2) { text-align: left !important; }
[data-design="executive"] .inv-items th:last-child { text-align: right !important; }
[data-design="executive"] .inv-items tbody tr.inv-total-row[data-k="onAccount"] td:nth-child(2) { border-left: 0 !important; }
[data-design="executive"] .inv-total-row + div, [data-design="executive"] .inv-totals + div { font-style: normal !important; font-size: 9.5pt !important; color: var(--inv-mute); }
[data-design="executive"] table.inv-items + div[style*="italic"] { font-style: normal !important; font-size: 9.5pt !important; color: var(--inv-mute); margin-top: 8px !important; }
[data-design="executive"] .inv-words i { font-style: normal; color: var(--inv-ink); }
