/* Admin pages: the books (accounting). Statements read like printed accounts: figures right-aligned in
   tabular numbers, a minus in brackets, sections indented, a rule over totals and a double rule under the
   last one. Forms reuse .field / .in / .cols from base.css; only what they lack is here. */

/* ---- small parts ---- */
.bk-bi { font-weight: 500; color: var(--muted); font-size: .86em; }
.bk-push { margin-left: auto; }
.bk-hint { margin: 0 0 12px; font-size: 13.5px; }
.bk-memo { margin: 12px 0; padding: 10px 12px; background: var(--bg); border-radius: var(--r-sm); font-size: 14px; }
.bk-sh { font-size: 13.5px; font-weight: 600; color: var(--muted); margin: 0 0 8px; }
/* money balances: one cell per account, figures a size down so seven-digit amounts fit */
.bk-strip { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }
.bk-strip .v { font-size: 20px; }
.bk-fh { font-size: 14px; margin: 16px 0 6px; }
.bk-form-foot { display: flex; justify-content: flex-end; padding-top: 4px; }
.row.bk-wrap { flex-wrap: wrap; }
.bk-stack-gap { margin-bottom: 16px; }
.bk-tab-body, .bk-rep-f { margin-top: 14px; }
.bk-dates { display: inline-flex; align-items: center; gap: 8px; }
.bk-dates .in { min-width: 0; }
a.bk-link { color: var(--ink); text-decoration: none; }
a.bk-link.primary { color: #fff; }
a.bk-kvlink { color: inherit; text-decoration: none; }
a.bk-kvlink:hover > span:first-child { color: var(--blue); }
.in.bk-num { text-align: right; font-variant-numeric: tabular-nums; }
.bk-acc td.act { width: 1%; padding: 6px 12px; }
.bk-acc td.act .btn { min-height: 32px; padding: 0 8px; }
/* journal lists: number and kind in their own columns on a wide screen, folded in on a phone */
.bk-jt .bk-narrow { display: none; }
@media (max-width: 640px) { .bk-jt .bk-wide { display: none; } .bk-jt .bk-narrow { display: block; } .bk-jt td, .bk-jt th { padding-left: 10px; padding-right: 10px; } }
.bk-lines { margin-top: 4px; }
.bk-lines td, .bk-lines th { padding: 8px 10px; }

/* label : value pairs in two columns inside a sheet */
.bk-kvs { display: grid; grid-template-columns: 1fr 1fr; column-gap: 24px; margin-bottom: 4px; }
.bk-kvs .kv { border-top: 1px solid var(--line); }
.bk-kvs .kv:nth-child(-n+2) { border-top: 0; }
.bk-kvs .kv > b { font-weight: 600; text-align: right; }
@media (max-width: 560px) { .bk-kvs { grid-template-columns: 1fr; } .bk-kvs .kv:nth-child(2) { border-top: 1px solid var(--line); } }

/* empty states that explain what the page is for */
.bk-empty-help { padding: 28px 20px; text-align: center; color: var(--muted); max-width: 560px; margin: 0 auto; }
.bk-empty-help b { display: block; color: var(--ink); margin-bottom: 6px; }
.bk-open-note b { display: block; margin-bottom: 2px; }
.bk-open-note p { margin-bottom: 10px; }

/* ---- segmented choice (money out / in / transfer) ---- */
.bk-seg { display: inline-flex; border: 1px solid var(--line); border-radius: var(--r-sm); overflow: hidden; background: var(--surface); max-width: 100%; }
.bk-seg button { min-height: 38px; padding: 0 16px; font-weight: 600; font-size: 14px; color: var(--muted); border-left: 1px solid var(--line); white-space: nowrap; }
.bk-seg button:first-child { border-left: 0; }
.bk-seg button:hover:not(.on) { background: var(--hover); color: var(--ink); }
.bk-seg button.on { background: var(--navy); color: #fff; }
.bk-seg.full { display: flex; width: 100%; }
.bk-seg.full button { flex: 1; padding: 0 8px; }
.sheet .bk-seg { margin-bottom: 14px; }

/* ---- line editors (purchase lines, journal lines) ---- */
.bk-bl { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr) 40px; gap: 6px 10px; align-items: end; padding: 10px 0; border-top: 1px solid var(--line); }
.bk-bl.jl { grid-template-columns: minmax(0, 2.2fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.4fr) 40px; }
.bk-bl .field { margin: 0; }
.bk-bl-head { padding: 4px 0; border-top: 0; font-size: 12.5px; font-weight: 600; color: var(--muted); }
.bk-bl-head .r { text-align: right; }
.bk-bl-x { width: 40px; height: var(--tap); display: grid; place-items: center; border-radius: var(--r-sm); color: var(--muted); }
.bk-bl-x:hover { background: var(--hover); color: var(--red); }
.bk-bl-note { grid-column: 1 / -1; color: var(--muted); font-size: 12.5px; font-variant-numeric: tabular-nums; }
.bk-bl-note:empty { display: none; }
.bk-sfx { position: relative; }
.bk-sfx .in { padding-right: 46px; }
.bk-sfx em { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); font-style: normal; color: var(--muted); font-size: 14px; pointer-events: none; }
.bk-add-row { flex-wrap: wrap; padding: 10px 0 14px; border-top: 1px solid var(--line); }
.bk-owed-v { font-size: 18px; font-variant-numeric: tabular-nums; min-height: var(--tap); display: flex; align-items: center; }
.bk-jl-sum { display: flex; flex-wrap: wrap; gap: 6px 20px; align-items: center; justify-content: flex-end; padding: 10px 0 14px; border-top: 1px solid var(--ink); font-size: 14px; font-variant-numeric: tabular-nums; }
@media (min-width: 641px) { .bk-bl:not(.bk-bl-head) .field > span { display: none; } }
@media (max-width: 640px) {
  .bk-bl-head { display: none; }
  .bk-bl { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 40px; }
  .bk-bl > .field:first-child { grid-column: 1 / -1; }
  .bk-bl.jl { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .bk-bl.jl > .field:nth-child(4) { grid-column: 1 / 2; }
}

/* opening balances: one account per line with its amount */
.bk-ob { display: flex; align-items: center; gap: 12px; padding: 6px 0; border-top: 1px solid var(--line); font-size: 14px; }
.bk-ob > span { flex: 1; min-width: 0; }
.bk-ob .in { width: 150px; min-height: 38px; flex: none; }
.bk-code { color: var(--muted); font-size: 12.5px; margin-right: 8px; display: inline-block; min-width: 34px; font-variant-numeric: tabular-nums; }
.bk-ob-grid { gap: 8px 28px; }
.bk-ob-sum { margin-top: 14px; }

/* pictures of receipts and bills */
.bk-ph-prev { width: 44px; height: 44px; object-fit: cover; border-radius: var(--r-sm); border: 1px solid var(--line); }
.bk-ph-box { margin-top: 14px; }
.bk-ph-full { display: block; max-width: 100%; max-height: 60vh; border-radius: var(--r-sm); border: 1px solid var(--line); }

/* month close checklist: a state, what it is, a link to fix it */
.bk-chk { display: flex; align-items: flex-start; gap: 14px; padding: 14px 16px; }
.bk-chk + .bk-chk { border-top: 1px solid var(--line); }
.bk-chk .state { width: 76px; flex: none; padding-top: 2px; }
.bk-chk .w { flex: 1; min-width: 0; }
.bk-chk .w b { display: block; font-size: 14.5px; }
.bk-chk .w small { display: block; color: var(--muted); font-size: 13px; }
.bk-chk .link { white-space: nowrap; padding-top: 2px; }

/* ---- statements ---- */
.bk-stmt { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 22px 24px 18px; }
.bk-stmt-h { text-align: center; margin-bottom: 18px; }
.bk-stmt-h .shop { font-weight: 700; color: var(--navy); font-size: 14px; }
.bk-stmt-h h3 { font-size: 18px; margin: 2px 0 4px; }
.bk-stmt-h .per { color: var(--muted); font-size: 13.5px; }
.bk-st-t { font-size: 14px; margin: 26px 0 6px; }
.bk-st { width: 100%; border-collapse: collapse; font-size: 14px; font-variant-numeric: tabular-nums; }
.bk-st th { text-align: left; font-size: 12.5px; font-weight: 600; color: var(--muted); padding: 6px 10px; border-bottom: 1px solid var(--line); vertical-align: bottom; }
.bk-st th.n, .bk-st td.n { text-align: right; }
.bk-st td { padding: 5px 10px; vertical-align: top; }
.bk-st td.n { white-space: nowrap; min-width: 96px; }
.bk-st td.tx { color: var(--muted); }
.bk-st tr.k-head td { font-weight: 700; padding-top: 14px; }
.bk-st tr.k-sub td { font-weight: 600; padding-top: 10px; }
.bk-st tr.l1 td:first-child { padding-left: 26px; }
.bk-st tr.l2 td:first-child { padding-left: 42px; }
.bk-st tr.k-total td { font-weight: 700; }
.bk-st tr.k-total td.n { border-top: 1px solid var(--ink); }
.bk-st tr.k-grand td { font-weight: 800; padding-top: 8px; }
.bk-st tr.k-grand td.n { border-top: 1px solid var(--ink); border-bottom: 3px double var(--ink); }
.bk-st tr.k-gap td { height: 10px; padding: 0; }
.bk-st tr.k-check td, .bk-st tr.k-note td { padding-top: 14px; font-size: 13.5px; color: var(--muted); }
.bk-st tr.k-check .state { margin-left: 6px; }
.bk-st tr.click { cursor: pointer; }
.bk-st tr.click:hover td { background: var(--hover); }
@media (max-width: 560px) {
  .bk-stmt { padding: 16px 12px 12px; }
  .bk-st { font-size: 13.5px; }
  .bk-st td, .bk-st th { padding-left: 6px; padding-right: 6px; }
  .bk-st tr.l1 td:first-child { padding-left: 16px; }
  .bk-st tr.l2 td:first-child { padding-left: 26px; }
  .bk-st td.n { min-width: 84px; }
  .bk-st td:first-child { min-width: 150px; }
}

@media print {
  .bk-stmt { border: 0; padding: 0; }
  .bk-st { font-size: 10.5pt; }
  .bk-st tr.click:hover td { background: none; }
  .scroll-x { overflow: visible; }
}