/* GENERATED FILE - DO NOT EDIT.
   Source: shared/expense-balance.css - run `npm run sync:shared` after editing. */

/* The Balance tab + the status colours of a person's line on a bill (shared/expense-balance.js; web + app). */
.bal { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.6rem; }
/* Run 21 C-128: a grid column grows to its widest no-wrap line; keep every card inside the screen (360 px). */
.bal > *, .bal-group, .bal-group ul > li, .bal-line, .bal-what { min-width: 0; }
.bal-group { max-width: 100%; box-sizing: border-box; }
.bal-top { display: grid; gap: 0.25rem; padding: 0.8rem 0.95rem; border: 1px solid #e8e0cf; border-radius: 16px; background: #fff; }
.bal-sum { display: flex; align-items: baseline; justify-content: space-between; gap: 0.75rem; font-size: 0.95rem; color: #1b2a23; }
.bal-sum b { font-size: 1.1rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
.bal-sum b.is-in { color: #12673d; }
.bal-sum b.is-out { color: #b2462b; }
/* "All in with Sam": the offset worked out (owner 2026-10-18). */
.bal-net { margin: 0.6rem 0 0.2rem; padding: 0.6rem 0.75rem; border: 1px solid rgba(29, 92, 99, 0.18); border-radius: 12px; background: #f3f8f6; }
.bal-net-h { margin: 0 0 0.3rem; font-size: 0.78rem; font-weight: 800; letter-spacing: 0.04em; text-transform: uppercase; color: #1d5c63; }
.bal-net ul { margin: 0; padding: 0; list-style: none; }
.bal-net li { display: flex; justify-content: space-between; gap: 0.75rem; padding: 0.15rem 0; font-size: 0.9rem; color: #4d5a52; }
.bal-net li b { font-variant-numeric: tabular-nums; color: #26332c; white-space: nowrap; }
.bal-net li.is-total { margin-top: 0.25rem; padding-top: 0.35rem; border-top: 1px solid rgba(29, 92, 99, 0.2); font-weight: 800; color: #1d5c63; }
/* A total with nothing above it (one-way card: just "You pay Sheshe") gets no divider line (owner 2026-10-20). */
.bal-net li.is-total:first-child { margin-top: 0; padding-top: 0.15rem; border-top: 0; }
/* Both-ways card: the working box closes the card, under its last section, like a receipt (owner 2026-10-20). */
.bal-group.is-both > .bal-net { margin: 0.6rem 0.5rem 0.1rem; }
.bal-net li.is-total b { color: #1d5c63; }
.bal-net-note { margin: 0.35rem 0 0; font-size: 0.78rem; color: #6b766f; }
.bal-clear { margin: 0; padding: 0.85rem 0.95rem; border: 1px solid #e8e0cf; border-radius: 16px; background: #fff; color: #12673d; font-weight: 700; }
.bal-h { margin: 0.5rem 0.1rem 0; font-size: 0.7rem; letter-spacing: 0.12em; text-transform: uppercase; color: #6d746c; font-weight: 700; }
.bal-group { border: 1px solid #e8e0cf; border-radius: 16px; background: #fff; padding: 0.35rem 0 0.45rem; }
.bal-group ul { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.3rem; margin: 0; padding: 0 0.5rem; list-style: none; }
.bal-who { display: flex; align-items: center; gap: 0.55rem; padding: 0.45rem 0.75rem 0.4rem; }
.bal-who b { flex: 1; min-width: 0; font-size: 0.95rem; overflow-wrap: anywhere; }
.bal-face { display: grid; place-items: center; flex: none; width: 1.75rem; height: 1.75rem; border-radius: 50%; background: #fbf0d6; color: #7a5c1c; font-size: 0.78rem; font-weight: 800; }
.bal-left { flex: none; font-size: 0.8rem; font-weight: 700; color: #b2462b; white-space: nowrap; }
.bal-left.is-done { color: #12673d; }
/* A person's line: its background says the status (owner 2026-10-16). Used by Balance and the Split bill. */
.bal-line { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.65rem; border-radius: 11px; }
.bal-line.st-paid { background: #e3f1e9; }
.bal-line.st-due { background: #fbe9e5; }
.bal-line.st-part { background: #fdf1d8; }
.bal-line.st-late { background: #f6d3cb; }
.bal-what { flex: 1; min-width: 0; }
.bal-what b { display: block; font-size: 0.9rem; font-weight: 600; color: #1b2a23; overflow-wrap: anywhere; }
.bal-what small { display: block; margin-top: 0.1rem; font-size: 0.74rem; font-weight: 700; }
.st-paid .bal-what small { color: #1f5a3d; }
.st-due .bal-what small { color: #b2462b; }
.st-part .bal-what small { color: #8a5a10; }
.st-late .bal-what small { color: #8f2a14; }
.bal-amt { flex: none; font-weight: 700; font-size: 0.92rem; font-variant-numeric: tabular-nums; white-space: nowrap; color: #1b2a23; }
.bal-mark { flex: none; min-height: 2rem; padding: 0 0.75rem; border: 1.5px solid #173a40; border-radius: 999px; background: transparent; color: #173a40; font: inherit; font-size: 0.8rem; font-weight: 700; white-space: nowrap; cursor: pointer; }
.bal-mark:disabled { opacity: 0.55; cursor: default; }
/* One width for Paid? / Saving… / Undo: the row never grows while it saves (Run 7 sim 2026-10-18 C-45: 70 → 104 px). */
.bal-mark { min-width: 5.6rem; box-sizing: border-box; }
.bal-mark.is-saving { padding: 0 0.45rem; }
.bal-mark.is-saving .lb-busy-label { white-space: nowrap; }
.bal-ok { flex: none; width: 2rem; text-align: center; color: #12673d; font-weight: 800; }
/* Paid? → Saving… → Undo → ✓ never moves the row (Run 8 sim 2026-10-18 C-60: "To pay" on 2 lines → "Paid" on 1, then
   the ✓ narrower than Undo reflowed the title): one mark column, one height, the status on one line. */
.bal-mark,
.bal-ok { width: 5.6rem; height: 2rem; min-height: 2rem; box-sizing: border-box; }
.bal-ok { display: inline-grid; place-items: center; }
/* The Split bill's ✓ for who may set it back to Not paid (Run 21 sim C-126): looks like the plain ✓ until tapped. */
button.bal-ok.is-fix { padding: 0; border: 0; border-radius: 999px; background: transparent; font: inherit; font-weight: 800; color: #12673d; cursor: pointer; }
button.bal-ok.is-fix.is-armed { border: 1.5px dashed #173a40; color: #173a40; font-size: 0.8rem; font-weight: 700; white-space: nowrap; }
button.bal-ok.is-fix:disabled { opacity: 0.55; cursor: default; }
/* The day / status line wraps (up to three lines on a narrow card), never "…" (Run 21 replay 4 C-129: "Day 3 · Sa…", "Settled in the …" at 360 px).
   A tapped row keeps its old words' room while its Undo is open (.bal-keep: both in one cell, the old one invisible). */
.bal-what small { white-space: normal; overflow-wrap: anywhere; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; overflow: hidden; }
.bal-what small.bal-keep { display: grid; -webkit-line-clamp: none; line-clamp: none; }
.bal-keep > span { grid-area: 1 / 1; min-width: 0; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; overflow: hidden; }
.bal-keep-was { visibility: hidden; }

/* The bill's own money under the peso amount (owner-approved mock 2026-10-17). */
.bal-amt .bal-fx,
.nu-settle-end .owe-fx {
  display: block;
  font-style: normal;
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--lb-primary, #2a6f5a);
  font-variant-numeric: tabular-nums;
}
.bal-amt { display: inline-grid; justify-items: end; line-height: 1.2; }
.owe-charged { margin: 0 0 6px; font-size: 0.8rem; color: var(--muted, #6b7a70); }
.owe-charged b { color: var(--lb-primary, #2a6f5a); }

/* "Undo" for 10 s right after Paid? (USA sim 2026-10-17 C-8). */
.bal-mark.is-undo { border-style: dashed; }
/* "Undo payment" fits its words (Run 9 sim 2026-10-18 A-8: it overflowed the 5.6rem mark at 360 px). */
.bal-mark.is-undo[data-pay-undo] { width: auto; min-width: 5.6rem; max-width: 100%; padding: 0 0.75rem; flex: none; }

/* "Group total · filtered: Day 3 · Clear filters" (Run 13 sim A-4) — web + app. */
.exp-filter-clear { display: inline-block; margin: 0.35rem 0 0; padding: 0; border: 0; background: none; color: inherit; font: inherit; font-size: 0.82rem; font-weight: 600; text-decoration: underline; cursor: pointer; opacity: 0.85; }

/* A card just paid, Undo still open (Run 14 sim C-96): in place, already looking settled. */
.bal-group.is-settling { opacity: 0.62; }
.bal-group.is-settling .bal-left { color: #2f7a4f; }
/* "Paid ✓" keeps the width of the label it replaced, so the name beside it doesn't re-wrap (Run 16 sim C-102). */
.bal-left-stack { display: inline-grid; justify-items: end; }
.bal-left-stack > span { grid-area: 1 / 1; }
.bal-left-was { visibility: hidden; }
.bal-left-ghost::before { content: "Paid ✓"; visibility: hidden; } /* a both-ways card says its amount in the total below (W-39); this keeps the header width (no words in the page) */