/* Ledger Desk — C2 Statement look, page layouts (13/10/2026). Loaded after app.css (index.html).
   app.css holds the shared C2 shell and Home; this file lays out Bank & cash and every other page. */
/* Bank & cash in the C2 Statement layout (13/10/2026, bank.js drawBank): Home's title band, figures and panels; a wider page for the statement */
#app.stmt .main{padding:0 32px 56px}
.hm,.hm.ldb{max-width:1376px}
.hm table.banktab th{font-family:'IBM Plex Sans',sans-serif;font-size:12px;letter-spacing:.05em}
.hm .ldb-mnav{border:1px solid var(--ld-line);border-radius:4px;overflow:hidden}
.hm .ldb-mnav > span{font-size:13px;padding:0 14px;line-height:30px;min-width:190px;text-align:center;border-left:1px solid var(--ld-line);border-right:1px solid var(--ld-line)}
.hm .ldb-mnav button{height:30px}
.hm .ldb-find input{border:1px solid var(--ld-line);border-radius:4px;height:34px}
.hm .ldb-notes .ldb-caps{padding-top:0}

/* ═══════════════════ Every other page in the C2 Statement layout (13/10/2026) ═══════════════════
   Avin, 13/10/2026: "You can complete all the pages". The pages built in Double Entry share one frame
   (.ld > .ld-hero [.l title + .r four figures] > .ld-sec …), so it is re-laid here once, the way Home is:
   a title band (title left, the meta line and buttons right), the figures as four white tiles of one height,
   and each section as a white panel with a serif heading. Titles lose their line breaks and full stops (home.js). */
#app .main{padding-left:32px;padding-right:32px}
.ld:not(.hm){max-width:1376px;padding-top:26px;display:flex;flex-direction:column;gap:20px}
.ld:not(.hm) > .ld-sec,.ld:not(.hm) > section.ld-sec{padding:18px 20px;background:#fff;border:1px solid var(--ld-line);border-radius:4px;min-width:0}
.ld:not(.hm) .ld-h2row{border-bottom:0;padding-bottom:10px;align-items:center;flex-wrap:wrap}
.ld:not(.hm) .ld-h2{font-size:20px}
.ld:not(.hm) .ld-h2row .fig{font-family:'IBM Plex Sans',sans-serif;font-size:13px;color:var(--ld-grey);text-transform:none}

.ld-hero,.ldb-hero{display:flex;flex-direction:column;gap:20px;padding:0;border:0;column-gap:0}
.ld-hero > .l{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:10px 24px;padding-bottom:16px;border-bottom:1px solid var(--ld-line);min-width:0}
.ld-hero > .l > .ld-h1{order:1;margin:0}
.ld-hero > .l > .ld-meta{order:2;font-family:'IBM Plex Sans',sans-serif;font-size:13px;color:var(--ld-grey);text-transform:none;justify-content:flex-end}
.ld-hero > .l > :not(.ld-h1):not(.ld-meta){order:3;flex-basis:100%}
.ld .ld-h1,.ldb .ld-h1.ldb-h1,.ldy .ld-h1.ldy-h1{font-size:32px;line-height:1.1;white-space:nowrap}
.ld-meta button{border:1px solid var(--ld-blue);color:var(--ld-blue);background:#fff;border-radius:4px;height:32px;padding:0 12px;
  font-family:'IBM Plex Sans',sans-serif;font-size:13px;font-weight:600;letter-spacing:0;text-transform:none}
.ld-meta button:hover:not(:disabled){background:var(--ld-blue);color:#fff}
.ld-meta button.pri{background:var(--ld-blue);color:#fff}
.ld-hero > .r{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:auto;gap:16px;border:0;align-items:stretch;min-width:0}
.ld-hero > .r > .ld-kpi,.ldb .ld-hero > .r > .ld-kpi{background:#fff;border:1px solid var(--ld-line);border-top:3px solid var(--ld-blue);border-radius:4px;
  padding:15px 18px;min-height:0;gap:6px}
.ld-hero > .r > .ld-kpi:nth-child(even){padding-left:18px;border-left:1px solid var(--ld-line)}
.ld-kpi .k{font-size:12px;letter-spacing:.06em}
.ld-kpi .v,.ldb .ld-kpi .v{font-family:var(--ld-mono);font-weight:600;font-size:28px;line-height:1.15;color:var(--ld-ink)}
.ld-kpi .v.blue{color:var(--ld-blue)}
.ld-kpi .v.exc{color:var(--ld-exc)}
.ld-hero > .r > .ld-kpi:has(.v.exc){border-top-color:var(--ld-exc)}
.ld-kpi .f{font-family:'IBM Plex Sans',sans-serif;font-size:13px;color:var(--ld-grey);margin-top:auto}
/* tables and lists inside the panels: lighter rules, sans headings */
.ld:not(.hm) table.banktab th{font-family:'IBM Plex Sans',sans-serif;font-size:12px;letter-spacing:.05em}
.ld .bsearch,.ldb .bsearch{border:1px solid var(--ld-line);border-radius:4px;height:34px;width:260px}
.ld .ldb-mnav{border:1px solid var(--ld-line);border-radius:4px;overflow:hidden}
.ld .ldb-mnav .fig,.ld .ldb-mnav > span{font-family:'IBM Plex Sans',sans-serif;font-size:13px;line-height:30px;border-color:var(--ld-line)}
.ld .ldb-mnav button{height:30px}
.ld .banner{border:1px solid var(--ld-line);border-radius:4px;background:#FAF6F3}
.ld .ldb-notes .ldb-caps{padding-top:0}
.ld-hero,.ldb-hero{align-items:stretch}
.ld-hero > .l,.ld-hero > .r{grid-column:auto;width:100%}
.ld:not(.hm) .ld-h2row > span:not(.fig):not(.ldb-mnav):not(.ldb-find){font-size:13px;color:var(--ld-grey)}
/* sections laid side by side inside a page (Cost's Ties to | How it counts, the person page's two columns): each a panel, one height */
.ld:not(.hm) .ld-bot{padding-top:0;column-gap:16px;row-gap:16px}
.ld:not(.hm) .ld-bot > .l,.ld:not(.hm) .ld-bot > .r,.ld:not(.hm) .ldy-two > .ld-sec{background:#fff;border:1px solid var(--ld-line);border-radius:4px;padding:18px 20px}
.ld:not(.hm) .ldy-two{column-gap:16px}
.ld:not(.hm) .ldy-two > .ld-sec{border-bottom:1px solid var(--ld-line)}
.ld:not(.hm) .ld-meta > span,.ld:not(.hm) .ld-h2row > .fig{font-size:12px;letter-spacing:.05em}
/* segmented switches (By person | By policy, All · Unpaid …): C2 */
.ld .ldm-seg{border:1px solid var(--ld-line);border-radius:4px;overflow:hidden}
.ld .ldm-seg button{border-left:1px solid var(--ld-line);height:30px;padding:0 12px;font-family:'IBM Plex Sans',sans-serif;font-size:13px;font-weight:500;letter-spacing:0;text-transform:none;color:var(--ld-ink)}
.ld .ldm-seg button:hover:not(.on){background:#FAF6F3}
.ld .ldm-seg button.on{background:var(--ld-blue);color:#fff;font-weight:600}
.ld:not(.hm) .ldc-panel{border-bottom:0}
/* "How it counts" boxes drew heavy rules of their own in Double Entry: the panel is the frame now */
.ld:not(.hm) .les-caps,.ld:not(.hm) .ldc-caps{border-top:0;border-bottom:0;padding-top:0}

/* 14/10/2026 (Avin: nothing cut off): names, their sub-lines and the label column under the schedule grids wrap
   instead of ending in "…"; a bank line's PR numbers wrap inside their column instead of running past it.
   Long statement descriptions and purposes keep one line (full text on hover). */
#app .ldm-nm,#app .ldm-sub{white-space:normal;overflow:visible;text-overflow:clip}
#app .ldm table.banktab td,#app .ldm table.banktab th{text-overflow:clip}
#app .ldm table.banktab td:first-child,#app .ldm table.banktab th:first-child{white-space:normal}
#app .ldb td .prbtn,#app .ldb td:has(> .prbtn){white-space:normal}
#app .lde .nm .lde-go{white-space:normal}
/* two-line labels and names split evenly ("of which written / off on exit"), never one word left alone */
#app .ldm table.banktab td:first-child,#app .ldm table.banktab th:first-child,#app .ldm-nm,#app .ldm-sub{text-wrap:balance}
