.billing-page { background:var(--white); color:var(--text); }
.billing { width:min(1120px,calc(100% - 48px)); margin:0 auto; padding:40px 0 80px; }
.billing [hidden] { display:none!important; }
.billing-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:24px; margin-bottom:32px; }
.billing h1 { font-family:var(--font-main); font-size:36px; font-weight:600; line-height:1.15; margin:0; color:inherit; }
.billing h2 { font-family:var(--font-main); font-size:24px; font-weight:600; margin:0 0 24px; color:inherit; }
.billing h3 { font-family:var(--font-main); font-size:20px; font-weight:600; margin:0; color:inherit; overflow-wrap:anywhere; }
.billing p { font-size:16px; line-height:1.6; }
.billing-heading p { margin:12px 0 0; color:var(--muted); }
.billing-steps { display:flex; gap:24px; border-bottom:1px solid var(--button-outline); margin-bottom:32px; }
.billing-steps button { appearance:none; border:0; border-bottom:2px solid transparent; background:none; padding:12px 0 16px; font:600 16px var(--font-main); color:var(--muted); cursor:pointer; }
.billing-steps button[aria-current] { color:var(--text); border-color:currentColor; }
.billing-steps span { font-size:14px; margin-right:8px; }
.billing-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; max-width:760px; }
.billing label { display:grid; gap:8px; font-size:14px; font-weight:600; min-width:0; }
.billing :is(input,select,textarea) { width:100%; min-width:0; min-height:46px; padding:10px 12px; font:400 16px var(--font-main); border:1px solid var(--button-outline); border-radius:6px; background:var(--white); color:var(--text); box-sizing:border-box; }
.billing textarea { resize:vertical; }
.billing :is(input,select,textarea):focus-visible, .billing-steps button:focus-visible { outline:2px solid var(--button-focus); outline-offset:3px; }
.billing h2 { scroll-margin-top:calc(var(--site-header-height,76px) + 24px); }
.billing button:disabled { cursor:wait; opacity:.6; }
.billing-unit { position:relative; }
.billing-unit input { padding-right:36px; }
.billing-unit > span { position:absolute; right:14px; top:14px; font-size:16px; }
.billing-split { border:0; padding:0; margin:32px 0; }
.billing-split legend { font-size:20px; font-weight:600; margin-bottom:16px; }
.billing-split p { font-size:14px; color:var(--muted); }
.billing .billing-remember { display:flex; align-items:center; gap:10px; }
.billing-remember input { width:20px; height:20px; min-height:0; accent-color:var(--button-blue); }
.billing-privacy, .billing .billing-privacy { max-width:76ch; font-size:14px; color:var(--muted); line-height:1.6; }
.billing-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:32px; }
.billing-error { border-left:3px solid #b33643; padding:12px 16px; color:var(--text); background:color-mix(in srgb,#b33643 8%,var(--white)); }
.billing-people { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.billing-person { border:1px solid var(--button-outline); border-radius:8px; padding:20px; min-width:0; }
.billing-person > header { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:12px; margin-bottom:20px; }
.billing-person output { font-size:20px; font-weight:600; font-variant-numeric:tabular-nums; }
.billing-row { position:relative; display:grid; grid-template-columns:minmax(0,1fr) minmax(110px,.7fr); gap:12px; padding:0 0 20px; margin-bottom:20px; border-bottom:1px solid var(--button-outline); }
.billing-row .billing-description { grid-column:1 / -1; padding-right:42px; }
.billing-remove { position:absolute; right:0; top:24px; width:36px; height:44px; border:0; background:transparent; color:var(--muted); cursor:pointer; }
.billing-remove::before { content:''; display:block; width:20px; height:20px; margin:auto; background:currentColor; -webkit-mask:var(--icon-close) center/contain no-repeat; mask:var(--icon-close) center/contain no-repeat; }
.billing-remove:hover { color:#b33643; }
.billing-remove:focus-visible { outline:2px solid var(--button-focus); }
.billing-reset { border-top:1px solid var(--button-outline); margin-top:48px; padding-top:24px; }
.billing-title { font-size:20px!important; margin-bottom:24px; overflow-wrap:anywhere; }
.billing-transfer { padding:24px 0; margin-bottom:20px; border-block:1px solid var(--button-outline); }
.billing-transfer strong { display:block; font-size:28px; font-weight:600; line-height:1.4; color:var(--text); overflow-wrap:anywhere; }
.billing-transfer p { margin-bottom:0; }
.billing-table-wrap { overflow-x:auto; margin:16px 0 32px; }
.billing table { border-collapse:collapse; width:100%; min-width:560px; font-size:14px; }
.billing th, .billing td { text-align:left; padding:14px 12px; border-bottom:1px solid var(--button-outline); vertical-align:top; max-width:280px; overflow-wrap:anywhere; }
.billing th { font-weight:600; background:color-mix(in srgb,var(--text) 4%,var(--white)); }
.billing .billing-amount { text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
.billing .billing-subheading { margin:32px 0 20px; }
.billing-save-sender { margin-top:28px; }
.billing-steps--four { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.billing-steps--four button { text-align:left; overflow-wrap:anywhere; }
.billing-field-note { display:grid; align-content:start; gap:8px; font-size:14px; }
.billing-field-note output { padding-top:10px; font-size:16px; }
.invoice-item { position:relative; border-bottom:1px solid var(--button-outline); padding-bottom:24px; margin-bottom:24px; }
.invoice-item > header { display:flex; gap:16px; justify-content:space-between; align-items:center; margin-bottom:16px; }
.invoice-item .billing-remove { position:static; height:36px; }
.invoice-item-fields { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; max-width:760px; margin-top:16px; }
.invoice-item-description { max-width:760px; }
.invoice-item-template { max-width:760px; margin-bottom:16px; }
.invoice-item-total { display:block; text-align:right; font-size:16px; margin-top:12px; }
.invoice-running-total { display:flex; justify-content:space-between; align-items:center; gap:20px; max-width:760px; margin:28px 0 0; font-size:20px; font-weight:600; }
.invoice-preview { padding:32px; border:1px solid var(--button-outline); border-radius:8px; max-width:860px; overflow-wrap:anywhere; }
.invoice-preview-header { display:flex; align-items:center; gap:20px; margin-bottom:32px; }
.invoice-preview-header img { width:64px; height:64px; object-fit:contain; }
html[data-theme="dark"] .invoice-preview-header img { filter:brightness(0) invert(1); }
.invoice-preview-addresses { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:32px; margin-bottom:24px; }
.invoice-preview-addresses p { margin:0; white-space:pre-line; }
.invoice-preview-meta { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 24px; margin:24px 0; font-size:14px; }
.invoice-preview-meta dt { color:var(--muted); }
.invoice-preview-meta dd { margin:0; font-size:16px; }
.invoice-preview .billing-table-wrap { margin-bottom:24px; }
.invoice-preview .invoice-quantity { white-space:nowrap; }
.document-choices { border:0; padding:0; margin:28px 0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 24px; max-width:760px; }
.document-choices legend { font-size:16px; font-weight:600; margin-bottom:16px; }
[data-document-builder] .invoice-preview p { white-space:pre-line; margin:12px 0 24px; }
[data-document-builder] .invoice-preview h3 { margin-top:24px; }
[data-document-builder] .invoice-preview-header h3 { margin-top:0; }
[data-document-builder] .invoice-preview strong { display:block; text-align:right; font-size:24px; }
.invoice-preview-total { display:grid; gap:8px; text-align:right; font-size:16px; margin-bottom:24px; }
.invoice-preview-total strong { font-size:24px; }
@media(max-width:760px) {
    .billing { width:calc(100% - 32px); padding-top:24px; }
    .billing-heading { flex-direction:column; gap:16px; }
    .billing h1 { font-size:28px; }
    .billing-people { grid-template-columns:minmax(0,1fr); }
    .billing-fields { gap:16px; }
    .billing-steps { gap:16px; }
    .billing-steps button { font-size:14px; }
    .billing-steps span { display:block; margin:0 0 4px; text-align:left; }
    .billing-person { padding:16px; }
    .invoice-preview { padding:20px 16px; }
    .invoice-preview-addresses { grid-template-columns:minmax(0,1fr); gap:24px; }
}
@media(max-width:420px) { .billing-fields,.invoice-preview-meta,.document-choices { grid-template-columns:minmax(0,1fr); } .invoice-item-fields { grid-template-columns:repeat(2,minmax(0,1fr)); } .invoice-item-fields > label:last-child { grid-column:1 / -1; } }
@media print {
    @page { size:A4; margin:16mm; }
    html,body.billing-page { background:#fff!important; color:#111!important; padding:0!important; }
    .billing-page::before,.billing-page::after,.billing-page .site-header,.billing-heading,.billing-steps,.billing-error,.billing-actions,.billing-reset,[data-export-status] { display:none!important; }
    .billing { width:100%; padding:0; margin:0; }
    .billing [data-step]:not([data-step="2"]) { display:none!important; }
    .billing-table-wrap { overflow:visible; }
    .billing table { min-width:0; font-size:10pt; }
    .billing th,.billing td { color:#111; padding:8px 6px; border-color:#ccc; }
    .billing tr { break-inside:avoid; }
    .billing thead { display:table-header-group; }
    .billing h3 { break-after:avoid; }
    .billing-transfer strong { color:#111; }
}