/* =====================================================================
   LedgerNest theme - "Option A, Brand" (2026-10-30)
   Navy + green to match the LN logo. Loaded after app.css: it re-points
   the colour tokens and restyles buttons, inputs, tabs, tables, the
   sidebar and the top bar. Inter for every screen (numbers with equal-
   width digits, no typewriter font); Lora only for printed statement
   titles and letterheads. Dark mode: html[data-theme="dark"].
   ===================================================================== */
:root {
  --navyA: #1e2a3a; --navyA-2: #26364a; --navyA-3: #33465e;
  --paper: #f5f7f8; --sheet: #ffffff; --ink: #1e2a3a; --ink-soft: #475467; --muted: #687370;
  --rule: #e2e7eb; --rule-strong: #c3ccd3; --line-soft: #eef2f4;
  --teal: #0e8a6a; --teal-d: #0b6b53; --teal-soft: #e3f4ee; --accent-soft-line: #bfe4d6;
  --saffron: #b45309; --saffron-soft: #fef3e2; --red: #c0362c; --red-soft: #fcebe9; --green: #15803d; --green-soft: #e6f6ec;
  --navyb: #1e2a3a; --leaf: #0e8a6a; --grey-tag: #eef1f4; --grey-tag-ink: #4b5866;
  --paper-2: var(--paper); --card: var(--sheet); --line: var(--rule);
  --accent: var(--teal); --accent-d: var(--teal-d); --accent-soft: var(--teal-soft);
  --ok: var(--green); --ok-soft: var(--green-soft); --bad: var(--red); --bad-soft: var(--red-soft); --warn: var(--saffron); --warn-soft: var(--saffron-soft);
  --th-bg: #f6f8fa; --hover: #f4f8f6; --focus-ring: rgba(14, 138, 106, .22);
  --f-ui: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --f-head: "Inter", system-ui, "Segoe UI", sans-serif;
  --f-print: "Lora", Georgia, serif;
  --f-num: "Inter", system-ui, "Segoe UI", sans-serif;
}

/* ---------- type ---------- */
html, body { font-family: var(--f-ui); color: var(--ink); background: var(--paper); }
h1, h2, h3, .serif, .panel-head h2, .led-head { font-family: var(--f-head) !important; letter-spacing: -.01em; }
h1 { font-size: 20px; font-weight: 650; }
.page-head h1 { font-size: 20px; }
.serif { font-weight: 600; }
.num, td.num, th.num, .kpi-num, .sm-big, .sm-row b, .sm-cmp b, .panel-foot b, input.amt, .inv-num { font-family: var(--f-num) !important; font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1; }
table { font-size: 13px; }
/* printed / previewed statements and letterheads keep a formal serif title */
.rep-sheet .serif, .rep-title, .letterhead2-co, .rep-banner .serif, #stmt-paper .serif, .inv-paper > div:first-child b { font-family: var(--f-print) !important; }
.rep-sheet td.num, .rep-sheet th.num { font-family: var(--f-num) !important; }
.muted, .page-sub, .stat-delta, .led-bal-hint { color: var(--muted); }

/* ---------- negatives: red brackets (set by App.markNegatives) ---------- */
.neg-amt { color: var(--red); }

/* ---------- buttons: one solid main action, outlined second, plain rest ---------- */
.btn { background: var(--teal); border-color: var(--teal); color: #fff; }
.btn:hover { background: var(--teal-d); border-color: var(--teal-d); }
.btn.quiet, .content table .btn.tiny.quiet { background: var(--sheet) !important; color: var(--ink) !important; border: 1px solid var(--rule-strong) !important; }
.btn.quiet:hover, .content table .btn.tiny.quiet:hover { background: var(--teal-soft) !important; color: var(--teal-d) !important; border-color: var(--teal) !important; }
.btn.quiet kbd { background: var(--th-bg); border-color: var(--rule); }
.btn.btn-post, button.btn.btn-post, .btn.btn-save { background: var(--teal) !important; border-color: var(--teal) !important; color: #fff !important; box-shadow: 0 1px 2px rgba(14, 138, 106, .25); }
.btn.btn-post:hover, .btn.btn-save:hover, .btn.btn-post:focus, .btn.btn-save:focus { background: var(--teal-d) !important; border-color: var(--teal-d) !important; }
.btn.risk { background: var(--sheet); color: var(--red); border-color: #e9b9b3; }
.btn:focus-visible { outline: 2px solid var(--teal); outline-offset: 2px; }
/* tab strips and chips: neutral outline, active = solid green */
.tab, .tab-chip, button.tab { background: var(--sheet); color: var(--ink); border: 1px solid var(--rule-strong); }
.tab:hover, .tab-chip:hover { background: var(--teal-soft); color: var(--teal-d); border-color: var(--teal); }
.tab.on, .tab-chip.on, .ev-tabs .tab-chip.on { background: var(--teal); color: #fff; border-color: var(--teal); }
.key-corner { color: var(--muted); }
.btn .key-corner, .tab.on .key-corner, .tab-chip.on .key-corner { color: rgba(255, 255, 255, .8); }

/* ---------- inputs: white, thin border, green focus ---------- */
input, select, textarea { background: var(--sheet); border: 1px solid var(--rule-strong); color: var(--ink); }
input:hover, select:hover, textarea:hover { border-color: #a9b5be; }
input:focus, select:focus, textarea:focus { background: var(--sheet); border-color: var(--teal); box-shadow: 0 0 0 3px var(--focus-ring); outline: none; }
input:disabled, select:disabled, textarea:disabled, input[readonly] { background: var(--th-bg); color: var(--muted); }
input[type=checkbox], input[type=radio] { accent-color: var(--teal); box-shadow: none !important; }
.field2 input, .field2 select { background: var(--sheet); }
label { color: var(--ink-soft); }

/* ---------- tables ---------- */
.content table { border-color: var(--rule); }
.content table thead th, th, .rep-table th { background: var(--th-bg) !important; color: var(--muted) !important; font-weight: 600; }
.content table th, .content table td { border-bottom: 1px solid var(--line-soft); }
.content table tbody tr:hover td { background: var(--hover); }
tr.row-on, tr.stmt-aim, tr.row-on td, tr.stmt-aim td { background: var(--teal-soft) !important; }
.scroll-pane thead th, .bank-scroll thead th, .led-amt-scroll thead th { background: var(--th-bg) !important; }
a.led-link, .led-link { color: var(--ink); }
.led-link:hover { color: var(--teal); }

/* ---------- status colours: green paid/posted, amber due/pending, red overdue, grey draft/open ---------- */
.tag.in { background: var(--green-soft); color: var(--green); border-color: #b7e2c6; }
.tag.out { background: var(--red-soft); color: var(--red); border-color: #f0c4be; }
.tag.move { background: var(--saffron-soft); color: var(--saffron); border-color: #f2d3a6; }
.tag.adj { background: var(--grey-tag); color: var(--grey-tag-ink); border-color: #dde3e8; }
.tag.inv { background: #e8f0fb; color: #2a5ca8; border-color: #c9d9f2; }

/* ---------- cards / tiles ---------- */
.card, .panel, .kpi-tile, .sm-card { border-color: var(--rule); }
.kpi-tile.t-orange { background: var(--saffron-soft); border-color: #f0d6ae; }
.kpi-tile.t-orange .kpi-num { color: var(--saffron); }
.panel-foot { background: var(--th-bg); }
.due-bar { background: var(--saffron-soft); color: var(--saffron); }

/* ---------- top bar ---------- */
.app.tb { background: var(--paper); }
.tb-top { background: var(--sheet); border-bottom: 1px solid var(--rule); }
.tb-a { color: var(--navyA); } .tb-b { color: var(--teal); }
.tb-top .aim-hint, .tb-top > .top-right > .clock { display: none; }
.saved-pill { background: var(--teal-soft); color: var(--teal-d); }
.avatar { background: var(--navyA); }
.user-menu { min-width: 250px; }
.user-menu .um-row { display: flex; justify-content: space-between; align-items: center; font-size: 12.5px; color: var(--muted); padding: 6px 0; border-top: 1px solid var(--line-soft); }
.user-menu .um-row b { color: var(--ink); font-weight: 600; font-variant-numeric: tabular-nums; }
.user-menu .um-sep { border-top: 1px solid var(--line-soft); margin: 4px 0; }

/* ---------- sidebar: dark navy, white text, icons ---------- */
.app.tb .tb-wrap { gap: 0; }
.app.tb .sidebar.rail { background: var(--navyA); color: #d5dde6; padding: 12px 8px 10px 10px; border-right: 0; }
.app.tb .sidebar .nav-scroll { padding-right: 2px; }
.app.tb .nav-sec { color: #8fa0b2 !important; text-decoration: none; font-size: 10.5px; letter-spacing: .12em; padding: 14px 10px 5px; }
.app.tb .nav-btn { color: #c9d3dd; font-size: 13.5px; padding: 7px 10px; border-radius: 7px; }
.app.tb .nav-btn .nav-l { gap: 10px; }
.app.tb .nav-btn .ic { display: inline-block; width: 17px; height: 17px; flex: 0 0 17px; color: #8fa0b2; }
.app.tb .nav-btn:hover { background: var(--navyA-2); color: #fff; }
.app.tb .nav-btn:hover .ic { color: #fff; }
.app.tb .nav-btn.on, .app.tb .nav-btn.nav-aim { background: var(--navyA-3) !important; color: #fff !important; box-shadow: inset 3px 0 0 var(--teal) !important; }
.app.tb .nav-btn.on .ic, .app.tb .nav-btn.nav-aim .ic { color: #5fd3ad; }
.app.tb .sidebar .nav-k, .app.tb .nav-k { color: #7be0bd !important; }
.app.tb .sidebar .pill, .app.tb .nav-btn .pill { background: #f2b75b; color: #3a2400; }
.app.tb .side-foot { color: #e7edf3; border-top: 1px solid var(--navyA-3); }
.app.tb .side-foot .muted { color: #7be0bd; }
.app.tb .sidebar.nav-aim-zone .nav-sec { color: #b6c3d1 !important; }
.app.tb .sidebar-resize-handle::after { background: transparent; }
.nav-collapse { display: flex; align-items: center; gap: 8px; width: 100%; border: 0; background: transparent; color: #8fa0b2; font: inherit; font-size: 12.5px; padding: 7px 10px; border-radius: 7px; cursor: pointer; margin-top: 4px; }
.nav-collapse:hover { background: var(--navyA-2); color: #fff; }
/* collapsed to icons */
.app.tb.nav-mini .sidebar.rail { width: 58px !important; padding-left: 6px; padding-right: 6px; }
.app.tb.nav-mini .nav-btn { justify-content: center; padding: 8px 0; }
.app.tb.nav-mini .nav-btn .nav-l > span, .app.tb.nav-mini .nav-btn .pill, .app.tb.nav-mini .nav-sec, .app.tb.nav-mini .side-foot, .app.tb.nav-mini .nav-collapse span { display: none; }
.app.tb.nav-mini .nav-sec + .nav-btn { margin-top: 10px; }
.app.tb.nav-mini .nav-collapse { justify-content: center; padding: 8px 0; }
.app.tb.nav-mini .sidebar-resize-handle { display: none; }

/* ---------- content sheet ---------- */
.app.tb .content { background: var(--sheet); border-color: var(--rule); }
.tb-credit { color: var(--muted); }

/* ===================== DARK MODE ===================== */
html[data-theme="dark"] {
  --paper: #121a24; --sheet: #18222e; --ink: #e6ecf2; --ink-soft: #b9c4cf; --muted: #93a1b0;
  --rule: #2a3746; --rule-strong: #3a4a5c; --line-soft: #223040;
  --teal: #19a37f; --teal-d: #138a6b; --teal-soft: #173b33; --accent-soft-line: #24584b;
  --saffron: #f0a54a; --saffron-soft: #3a2a14; --red: #f07167; --red-soft: #3d1f1d; --green: #4ccb7f; --green-soft: #173525;
  --grey-tag: #263342; --grey-tag-ink: #c2ccd6; --th-bg: #1d2836; --hover: #1d2a37; --focus-ring: rgba(25, 163, 127, .3);
  --navyA: #0f1620; --navyA-2: #1a2430; --navyA-3: #24303d; --navyb: #e6ecf2;
  color-scheme: dark;
}
html[data-theme="dark"] body, html[data-theme="dark"] .app.tb { background: var(--paper); }
html[data-theme="dark"] .tb-top, html[data-theme="dark"] .user-menu, html[data-theme="dark"] .notes-pop, html[data-theme="dark"] .modal, html[data-theme="dark"] .modal-box,
html[data-theme="dark"] .card, html[data-theme="dark"] .panel, html[data-theme="dark"] .kpi-tile, html[data-theme="dark"] .sm-card, html[data-theme="dark"] .bell,
html[data-theme="dark"] .content table, html[data-theme="dark"] .rep-sheet, html[data-theme="dark"] .alloc-box { background: var(--sheet) !important; color: var(--ink); border-color: var(--rule) !important; }
html[data-theme="dark"] .tb-a { color: #e6ecf2; }
html[data-theme="dark"] .content table td { color: var(--ink); }
html[data-theme="dark"] input, html[data-theme="dark"] select, html[data-theme="dark"] textarea { background: #101821; color: var(--ink); border-color: var(--rule-strong); }
html[data-theme="dark"] .btn.quiet, html[data-theme="dark"] .content table .btn.tiny.quiet, html[data-theme="dark"] .tab, html[data-theme="dark"] .tab-chip { background: var(--sheet) !important; color: var(--ink) !important; border-color: var(--rule-strong) !important; }
html[data-theme="dark"] .tab.on, html[data-theme="dark"] .tab-chip.on { background: var(--teal) !important; color: #fff !important; border-color: var(--teal) !important; }
html[data-theme="dark"] .kpi-tile.t-orange { background: var(--saffron-soft); border-color: #5a4220 !important; }
html[data-theme="dark"] .searchbox input { background: #101821; }
html[data-theme="dark"] .alloc-box, html[data-theme="dark"] .recur-box { background: #142029 !important; }
html[data-theme="dark"] .due-bar { background: var(--saffron-soft); }
html[data-theme="dark"] a { color: #7fd8bd; }
html[data-theme="dark"] .led-link, html[data-theme="dark"] a.led-link { color: var(--ink); }
html[data-theme="dark"] .inv-paper, html[data-theme="dark"] #inv-paper { background: #fff !important; color: #1e2a3a !important; }
html[data-theme="dark"] .inv-paper td, html[data-theme="dark"] .inv-paper th { color: #1e2a3a; }
@media print {
  html[data-theme="dark"] body, html[data-theme="dark"] .card, html[data-theme="dark"] .content { background: #fff !important; color: #1e2a3a !important; }
}
html[data-theme="dark"] .app select, html[data-theme="dark"] .app textarea,
html[data-theme="dark"] .app input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]) { background: #101821 !important; color: var(--ink) !important; border-color: var(--rule-strong) !important; }
html[data-theme="dark"] .app select option { background: #18222e; color: var(--ink); }
html[data-theme="dark"] .app input:disabled, html[data-theme="dark"] .app input[readonly] { background: #1a2532 !important; color: var(--muted) !important; }
/* report letterhead band and nature chips */
.rep-banner { background: linear-gradient(180deg, #eef2f6, #fff); border-bottom-color: var(--navyA); }
html[data-theme="dark"] .rep-banner { background: linear-gradient(180deg, #223042, var(--sheet)) !important; }
html[data-theme="dark"] .rep-banner .rep-title, html[data-theme="dark"] .rep-banner .serif { color: var(--ink) !important; }
html[data-theme="dark"] .nchip.nat-pill.n-exp { background: var(--green-soft); color: var(--green); border-color: #24563a; }
html[data-theme="dark"] .nchip.nat-pill.n-inc { background: var(--teal-soft); color: #5fd3ad; border-color: var(--accent-soft-line); }
html[data-theme="dark"] .nchip.nat-pill.n-ast { background: #1b2c44; color: #8ab6ec; border-color: #2c4566; }
html[data-theme="dark"] .nchip.nat-pill.n-lia { background: #2a2342; color: #b9a5ef; border-color: #43386a; }
html[data-theme="dark"] .rep-sheet, html[data-theme="dark"] #rep-paper { background: var(--sheet) !important; }

/* ===== Stage 2 layout ===== */
/* Drop-down menu (Print & share ▾, + New ▾, Options ▾) */
details.dd-menu { position: relative; display: inline-block; }
details.dd-menu > summary { list-style: none; cursor: pointer; }
details.dd-menu > summary::-webkit-details-marker { display: none; }
details.dd-menu .dd-list { position: absolute; right: 0; top: calc(100% + 4px); z-index: 60; min-width: 190px; background: var(--sheet); border: 1px solid var(--rule-strong); border-radius: 8px; box-shadow: 0 8px 24px rgba(16,24,40,.14); padding: 5px; display: flex; flex-direction: column; }
details.dd-menu .dd-list.dd-left { left: 0; right: auto; }
details.dd-menu .dd-list button { all: unset; box-sizing: border-box; display: block; padding: 7px 10px; border-radius: 6px; font-size: 13px; color: var(--ink); cursor: pointer; white-space: nowrap; }
details.dd-menu .dd-list button:hover, details.dd-menu .dd-list button:focus { background: var(--line-soft); }
details.dd-menu .dd-list .dd-sep { border-top: 1px solid var(--line-soft); margin: 4px 2px; }
details.dd-menu .dd-list .dd-head { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); padding: 6px 10px 2px; }
.dd-note { font-size: 12px; padding: 6px 10px; }
.seg-tabs { display: inline-flex; }
.seg-tabs .tab-chip { border-radius: 0; margin: 0; }
.seg-tabs .tab-chip:first-child { border-radius: 7px 0 0 7px; }
.seg-tabs .tab-chip:last-child { border-radius: 0 7px 7px 0; border-left: 0; }

/* Document form */
.doc-head { display: flex; flex-direction: column; gap: 8px; }
.dh-row { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: flex-start; }
.dh-f { display: flex; flex-direction: column; min-width: 0; }
.dh-f label { font-size: 11.5px; margin-bottom: 3px; white-space: nowrap; }
.dh-no { width: 140px; } .dh-date { width: 130px; }
.dh-party { flex: 1 1 240px; } .dh-supply { width: 230px; } .dh-place { width: 120px; } .dh-nature { width: 200px; }
.dh-addr { flex: 1 1 280px; }
.dh-tick { padding-top: 24px; }
.dh-tick label { margin: 0; }
.dh-hints { min-height: 0; } .dh-hints .led-bal-hint { margin-top: 2px; font-size: 11.5px; }
.dh-note { color: var(--muted); font-weight: 400; }
.dh-addrsum { flex: 1 1 200px; font-size: 12px; padding-top: 28px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dh-row2 { padding-top: 8px; border-top: 1px dashed var(--line-soft); }
table.doc-items { margin-top: 12px; table-layout: fixed; width: 100%; }
table.doc-items .c-desc { width: 40%; } table.doc-items .c-hsn { width: 11%; }
table.doc-items .c-qty { width: 9%; } table.doc-items .c-rate { width: 11%; }
table.doc-items .c-disc { width: 7%; } table.doc-items .c-gst { width: 8%; } table.doc-items .c-amt { width: 14%; }
table.doc-items td input, table.doc-items td select { width: 100%; box-sizing: border-box; }
.doc-bottom { display: flex; gap: 20px; align-items: flex-start; margin-top: 12px; }
.doc-bottom-l { flex: 1; min-width: 0; }
.doc-bottom-l p { margin: 0 0 6px; }
.doc-totals { width: 320px; border: 1px solid var(--rule); border-radius: 8px; padding: 8px 12px; background: var(--paper); }
.doc-totals > div { display: flex; justify-content: space-between; align-items: center; padding: 3px 0; font-size: 13px; }
.doc-totals > div > span, .doc-totals label { color: var(--ink-soft); margin: 0; }
.doc-totals b { font-family: var(--f-num); font-variant-numeric: tabular-nums; font-weight: 600; }
.doc-totals .dt-total { border-top: 1px solid var(--rule-strong); margin-top: 4px; padding-top: 7px; font-size: 15px; }
.doc-totals .dt-total span { color: var(--ink); font-weight: 600; }
.row.doc-actions { position: sticky; bottom: 0; z-index: 5; justify-content: flex-end; gap: 8px; margin: 12px -16px -16px; padding: 10px 16px; background: var(--sheet); border-top: 1px solid var(--rule); border-radius: 0 0 10px 10px; }
.row.doc-actions .btn-post { order: 9; }
@media (max-width: 900px) { .doc-bottom { flex-direction: column; } .doc-totals { width: 100%; box-sizing: border-box; } }

/* Entry screen: one action row - type chips left, Save on the right */
.row.entry-actions { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--line-soft); }
.row.entry-actions .bottom-kinds { display: flex; flex-wrap: wrap; gap: 4px; margin: 0; }
.row.entry-actions .ea-right { display: flex; gap: 8px; align-items: center; margin-left: auto; }
.row.entry-actions .ea-save { order: 9; }
#e-bal { margin: 8px 0 0; }

/* Slim summary line on list pages */
.sum-line { display: flex; flex-wrap: wrap; gap: 0; background: var(--sheet); border: 1px solid var(--rule); border-radius: 10px; margin: 0 0 14px; }
.sum-line .sl-item { flex: 1 1 180px; display: flex; flex-direction: column; padding: 9px 16px; border-left: 1px solid var(--line-soft); min-width: 0; }
.sum-line .sl-item:first-child { border-left: 0; }
.sum-line .sl-lab { font-size: 11.5px; color: var(--muted); }
.sum-line .sl-val { font-family: var(--f-num); font-variant-numeric: tabular-nums; font-size: 16px; font-weight: 600; color: var(--ink); }
.sum-line .sl-sub { font-size: 11.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Document-type tabs (Sales & Purchases) */
.doc-tabs { display: flex; flex-wrap: wrap; gap: 2px; padding: 0 16px; border-bottom: 1px solid var(--rule); }
.doc-tab { background: none; border: 0; border-bottom: 2px solid transparent; padding: 10px 12px 8px; font: inherit; font-size: 13px; color: var(--ink-soft); cursor: pointer; margin-bottom: -1px; }
.doc-tab:hover { color: var(--ink); }
.doc-tab.on { color: var(--teal); border-bottom-color: var(--teal); font-weight: 600; }

/* Lists: sticky header, zebra rows, totals row */
.scroll-pane table thead th { position: sticky; top: 0; z-index: 2; background: var(--sheet); box-shadow: inset 0 -1px 0 var(--rule); }
.content .scroll-pane table tbody tr:nth-child(even):not(.row-on):not(.stmt-aim):not(.alloc-row) td { background: color-mix(in srgb, var(--paper) 60%, var(--sheet)); }
table tfoot tr.tot-row td { font-weight: 600; border-top: 1px solid var(--rule-strong); border-bottom: 3px double var(--rule-strong); background: var(--sheet); position: sticky; bottom: 0; }
table tfoot tr.tot-row td.num { font-family: var(--f-num); font-variant-numeric: tabular-nums; }
.content td.num, .content th.num { text-align: right; }

/* Compact density */
.app.dense .content table th, .app.dense .content table td { padding-top: 4px !important; padding-bottom: 4px !important; }
.app.dense .content table td input, .app.dense .content table td select { padding-top: 3px; padding-bottom: 3px; }
.app.dense .panel-head { padding-top: 8px; padding-bottom: 8px; }
.app.dense .sum-line .sl-item { padding: 6px 14px; }
details.dd-menu .dd-list button.has-key { display: flex; justify-content: space-between; gap: 18px; position: static; }
details.dd-menu .dd-list button.has-key .key-corner { position: static; display: inline-block; font-size: 10.5px; color: var(--muted); border: 1px solid var(--rule); border-radius: 4px; padding: 0 5px; background: var(--paper); }

/* Statements: Options menu + A4-width centred preview */
details.dd-menu .dd-list .dd-check { display: flex; align-items: center; gap: 8px; padding: 6px 10px; font-size: 13px; color: var(--ink); cursor: pointer; border-radius: 6px; white-space: nowrap; margin: 0; }
details.dd-menu .dd-list .dd-check:hover { background: var(--line-soft); }
.stmt-opts .dd-list { min-width: 240px; }
#stmt-paper .a4-sheet { max-width: 880px; margin: 0 auto; }
#stmt-paper:has(.a4-sheet) { background: var(--paper); }
#stmt-paper .a4-sheet { background: var(--sheet); padding: 18px 26px; border: 1px solid var(--rule); border-radius: 6px; box-shadow: 0 2px 10px rgba(16,24,40,.06); }
#stmt-paper .a4-sheet table { min-width: 0; }

/* Reports: picker in the page head, preview uses the full width */
.rep-headl { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.rep-headl h1 { margin: 0; }
.rep-headl .rep-pick { min-width: 260px; font-weight: 600; }
.rep-layout { display: block !important; }

/* ===== Stage 3 statements ===== */
.stmt-banner { text-align: center; margin-bottom: 12px; padding-bottom: 8px; border-bottom: 2px solid var(--ink); }
.stmt-banner .rep-brand { justify-content: flex-start; }
.stmt-banner .rep-title { font-family: var(--f-print); font-size: 19px; font-weight: 700; color: var(--ink); }
.stmt-banner .stmt-title2 { font-size: 15px; font-weight: 600; margin-top: 4px; }
.stmt-banner .stmt-addr { font-size: 12px; color: var(--muted); }
.stmt-banner .stmt-unit { text-align: right; font-size: 11.5px; color: var(--ink-soft); font-style: italic; margin-top: 2px; }
table.stmt3 { width: 100%; border-collapse: collapse; }
table.stmt3 th, table.stmt3 td { padding: 5px 8px; }
table.stmt3 .c-note { width: 56px; text-align: center; color: var(--ink-soft); }
table.stmt3 tr.sec-row td { padding-top: 10px; color: var(--ink); }
table.stmt3 tr.sub-line td:first-child { padding-left: 20px; }
table.stmt3 tr.tot-row3 td.num, table.stmt tr.tot-row3 td.num { border-top: 1px solid var(--ink); }
table.stmt3 tr.tot-grand td.num, table.stmt tr.tot-grand td.num { border-top: 1px solid var(--ink); border-bottom: 3px double var(--ink); }
#stmt-paper .c-py, #stmt-paper th.c-py { color: #7b8794; }
#stmt-paper .c-py b { font-weight: 500; }
.notes-wrap .note-blk { margin: 14px 0 18px; break-inside: avoid; }
.notes-wrap .note-h { font-weight: 700; font-size: 13.5px; margin-bottom: 4px; color: var(--ink); }
.notes-wrap .note-sub { font-size: 11.5px; color: var(--muted); margin-bottom: 4px; }
.notes-wrap .note-pol { margin: 4px 0 0 18px; padding: 0; font-size: 12.5px; line-height: 1.55; }
.notes-wrap .note-tbl { max-width: 640px; }
.sign-blk { display: flex; justify-content: space-between; gap: 24px; margin-top: 28px; font-size: 12.5px; line-height: 1.5; break-inside: avoid; }
.sign-blk .sg-col { flex: 1; }
.sign-blk .sg-col:last-child { text-align: right; }
.sign-blk .sg-space { height: 38px; }
.sign-blk .sg-pair { display: flex; gap: 28px; justify-content: flex-end; }
.sign-pd { display: flex; flex-direction: column; font-size: 12.5px; margin-top: 10px; }
.fa-foot { display: flex; justify-content: space-between; align-items: center; gap: 14px; margin-top: 10px; flex-wrap: wrap; }
table.fa-tbl th { white-space: normal; }

/* ===== Stage 4 reports ===== */
table.rep4 { width: 100%; border-collapse: collapse; }
table.rep4 tr.grp-row td { background: var(--line-soft); }
table.rep4 tr.tot-grand td.num { border-top: 1px solid var(--ink); border-bottom: 3px double var(--ink); }
table.rep4 td.pad-l { padding-left: 22px; }
.rep-sub { font-weight: 700; margin: 16px 0 6px; color: var(--ink); }
.ps-head { display: flex; justify-content: space-between; gap: 16px; margin-bottom: 8px; }

/* ===== Stage 5 import + cost centres ===== */
.cc-line { margin-top: 4px; }
.cc-line .cc-pick { max-width: 220px; font-size: 12px; padding: 3px 6px; }
.imp-prev { margin-top: 12px; padding: 12px 14px; border: 1px solid var(--rule); border-radius: 8px; background: var(--paper); }
.imp-sum td { padding: 4px 10px 4px 0; }
.imp-err { margin-top: 8px; font-size: 12.5px; color: #9a3412; }
.imp-err ul { margin: 4px 0 0 18px; padding: 0; }
.cc-tbl td { padding: 3px 8px 3px 0; }
/* "Hide summary" switch above the summary line / cards */
.cards-switch { display: inline-flex; margin: -4px 0 6px; font-size: 11.5px; color: var(--muted); }
.cards-switch + .cards-folded + * { margin-top: 0; }

/* Recurring: add form - two tidy rows */
.recur-add { margin: 0 20px 12px; padding: 12px 14px; border: 1px solid var(--rule); border-radius: 10px; background: var(--paper); display: flex; flex-direction: column; gap: 10px; }
.recur-add .ra-row { display: grid; gap: 10px; align-items: end; }
.recur-add .ra-row:first-child { grid-template-columns: 130px minmax(0, 1fr) minmax(0, 1fr) 150px; }
.recur-add .ra-row:last-child { grid-template-columns: minmax(0, 1fr) 120px 130px 130px auto; }
.recur-add label { display: flex; flex-direction: column; gap: 4px; font-size: 11.5px; font-weight: 600; color: var(--ink-soft); min-width: 0; margin: 0; }
.recur-add label select, .recur-add label input { flex: none !important; text-align: left; width: 100% !important; max-width: none !important; min-width: 0; height: 36px !important; min-height: 0 !important; padding: 0 10px !important; font-size: 13.5px; box-sizing: border-box; }
.recur-add #ra-amt { text-align: right; }
.recur-add .ra-btns { display: flex; gap: 6px; align-items: center; height: 36px; }
@media (max-width: 1100px) { .recur-add .ra-row:first-child, .recur-add .ra-row:last-child { grid-template-columns: 1fr 1fr; } }
.recur-tbl td.narr-plain { width: 34%; white-space: normal; overflow: visible; text-overflow: clip; max-width: none; }
.inv-nil { margin: 0 0 8px; }

/* Automatic backup */
.bk-pill { border: 0; font: inherit; font-size: 11.5px; font-weight: 600; padding: 4px 10px; border-radius: 999px; cursor: pointer; white-space: nowrap; }
.bk-pill.ok { background: var(--teal-soft, #e3f4ee); color: var(--teal, #0e8a6a); }
.bk-pill.warn { background: #fdf1dc; color: #9a5b00; }
.bk-pill.bad { background: #fdecea; color: #b42318; }
.bk-pill.busy { background: var(--line-soft); color: var(--muted); }
.bk-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.bk-card { border: 1px solid var(--rule); border-radius: 10px; padding: 12px 14px; background: var(--paper); display: flex; flex-direction: column; gap: 6px; }
.bk-h { font-weight: 700; font-size: 13px; color: var(--ink); }
.bk-row { display: flex; justify-content: space-between; align-items: center; gap: 10px; font-size: 12.5px; color: var(--ink-soft); }
.bk-row b { color: var(--ink); font-weight: 600; }
.bk-note { font-size: 11.5px; color: var(--muted); line-height: 1.45; }
.bk-err { font-size: 11.5px; color: #b42318; }
.bk-msg { font-size: 12px; color: var(--teal); font-weight: 600; }
.bk-tbl { margin-top: 12px; width: 100%; }
.bk-setup { margin-top: 12px; font-size: 12.5px; }
.bk-setup summary { cursor: pointer; font-weight: 600; color: var(--ink-soft); }
.bk-steps { margin: 8px 0 0 18px; padding: 0; line-height: 1.55; color: var(--ink-soft); }
@media (max-width: 900px) { .bk-grid { grid-template-columns: 1fr; } }

/* ---- Settings: category tabs ---- */
.set-wrap { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 18px; align-items: start; }
.set-nav { display: flex; flex-direction: column; gap: 4px; position: sticky; top: 8px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--card); padding: 6px; }
.set-nav button { all: unset; box-sizing: border-box; cursor: pointer; display: flex; flex-direction: column; gap: 2px; padding: 9px 12px; border-radius: 8px; border-left: 3px solid transparent; }
.set-nav button b { font-size: 13.5px; font-weight: 600; color: var(--ink); }
.set-nav button span { font-size: 11.5px; color: var(--ink-soft); }
.set-nav button:hover { background: var(--line-soft); }
.set-nav button.on { background: color-mix(in srgb, var(--accent, #0f8a6a) 10%, transparent); border-left-color: var(--accent, #0f8a6a); }
.set-nav button.on b { color: var(--accent, #0f8a6a); }
.set-nav button:focus-visible { outline: 2px solid var(--accent, #0f8a6a); }
.set-body { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.set-body > .panel { margin-top: 0 !important; }
.set-cols { display: grid; grid-template-columns: 1.4fr 1fr; gap: 16px; align-items: start; }
.set-sub { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-soft); margin: 18px 0 8px; padding-bottom: 6px; border-bottom: 1px solid var(--line-soft); }
.set-sub:first-child { margin-top: 0; }
.set-note { font-size: 12px; color: var(--ink-soft); margin: 8px 0 0; }
.set-body .toggle-row { border-top: none !important; margin-top: 0 !important; padding-top: 12px !important; }
.set-body .toggle-row:first-child { padding-top: 2px !important; }
@media (max-width: 1100px) { .set-cols { grid-template-columns: 1fr; } }
@media (max-width: 820px) {
  .set-wrap { grid-template-columns: 1fr; }
  .set-nav { flex-direction: row; overflow-x: auto; position: static; }
  .set-nav button { flex: none; border-left: none; border-bottom: 3px solid transparent; }
  .set-nav button.on { border-bottom-color: var(--accent, #0f8a6a); }
  .set-nav button span { display: none; }
}

/* WhatsApp contact link */
.wa-link { display: inline-flex; align-items: center; gap: 4px; color: #128C4A !important; font-weight: 600; text-decoration: none; white-space: nowrap; vertical-align: middle; }
.wa-link:hover { text-decoration: underline; }
.wa-link .wa-ic { width: 15px; height: 15px; flex: none; }