/* Money at the desk (md2.js): ways to pay, promises, family checkout, end of day */
.md2-refs { display: grid; gap: 8px; }
.md2-refs3 { grid-template-columns: 1fr 1fr; }
.md2-refs3 .fld:last-of-type { grid-column: 1 / -1; }
.md2-span { grid-column: 1 / -1; }
.tag.md2-tag { background: #fff1db; color: #8a4a00; }
.md2-ico { background: #fff1db; color: #b25b00; font-weight: 700; }
.md2-prom { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 12px; margin: 4px 0 10px; border-radius: 10px; background: #fff7e8; border: 1px solid #f3d9a8; }
.md2-prom > span:first-child { display: grid; gap: 2px; min-width: 0; }
.md2-prom small { color: var(--ink2); font-size: var(--fs-12); }
.md2-prom.md2-late { background: #fdecea; border-color: #f1c4bf; }
.md2-acts { display: flex; gap: 6px; flex-shrink: 0; }
.md2-acts a.mini-btn { text-decoration: none; display: inline-grid; place-items: center; }
.go2.md2-fambtn { margin: 0 0 10px; width: 100%; }
.md2-when { display: grid; gap: 8px; }
/* the family checkout sheet */
.md2-fc .md2-rows { padding: 0; }
.md2-frow { display: flex; justify-content: space-between; gap: 12px; padding: 10px 14px; border-bottom: 1px solid var(--line, #ececf0); }
.md2-frow:last-child { border-bottom: 0; }
.md2-frow.md2-off { opacity: .55; }
.md2-fnum { display: grid; justify-items: end; gap: 2px; text-align: end; white-space: nowrap; }
.md2-fnum small { color: var(--ink2); font-size: var(--fs-12); }
.md2-sum { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: baseline; justify-content: center; padding: 12px; border-radius: 12px; background: #f2f7f3; font-size: var(--fs-15); }
.md2-sum b { font-size: var(--fs-17); }
.md2-dot { color: var(--ink2); }
.md2-pay { display: grid; gap: 12px; }
.md2-claim { display: flex; gap: 10px; align-items: flex-start; font-size: var(--fs-14); cursor: pointer; }
.md2-claim input { margin-top: 3px; width: 18px; height: 18px; flex-shrink: 0; }
.md2-claim > span { display: grid; gap: 2px; }
.go2.md2-go { white-space: normal; line-height: 1.3; }
.md2-done { display: flex; gap: 12px; align-items: center; padding: 14px; border-radius: 12px; background: #eef7f0; }
.md2-done > div { display: grid; gap: 3px; }
.md2-done small { color: var(--ink2); }
.go2.md2-wa { background: #1f9d55; }
/* end of day */
.md2-close { grid-column: 1 / -1; display: grid; gap: 12px; }
.md2-count { border: 1px solid var(--line, #e3e3e8); border-radius: 12px; padding: 8px 12px; }
.md2-count > summary { cursor: pointer; font-weight: 600; font-size: var(--fs-14); padding: 4px 0; }
.md2-dens { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 18px; margin-top: 8px; }
.md2-dcol { display: grid; gap: 6px; align-content: start; }
.md2-den { display: grid; grid-template-columns: 1fr auto 56px auto; gap: 6px; align-items: center; font-size: var(--fs-14); }
.md2-cn { width: 56px; text-align: center; padding: 6px 4px; border: 1px solid var(--line, #d8d8de); border-radius: 8px; font: inherit; }
.md2-ctot { display: flex; justify-content: space-between; margin-top: 10px; padding-top: 8px; border-top: 1px solid var(--line, #ececf0); }
.md2-term { display: grid; gap: 6px; }
.md2-ok { color: #2e6b34; font-weight: 600; }
.md2-bad { color: #b3261e; font-weight: 600; }
.md2-sweep { display: grid; gap: 8px; padding: 10px 12px; border-radius: 12px; background: #fff7e8; border: 1px solid #f3d9a8; }
.md2-sweep.md2-clear { display: flex; align-items: center; gap: 8px; background: #eef7f0; border-color: #cfe8d4; color: #2e6b34; font-weight: 600; }
.md2-sgrp { display: grid; gap: 4px; }
.md2-shead { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.md2-scounts { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: var(--fs-14); color: var(--ink2); }
.md2-sline { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: var(--fs-14); }
.md2-sline a.mini-btn { text-decoration: none; display: inline-grid; place-items: center; }
.md2-sline.md2-info { padding: 0 2px; color: var(--ink2); }
@media (max-width: 700px) { .md2-dens, .md2-refs3 { grid-template-columns: 1fr; } }
/* card and BenefitPay: what the machine said (D-032). APPROVED is the one answer that takes money, so it gets its own
   row; declined, no answer and not sure sit together underneath. */
.md2-mach { display: grid; gap: 6px; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--sep); background: #fafafb; }
.md2-mach.md2-mach-ok { border-color: #a9d3b0; background: #f2f8f3; }
.md2-mach.md2-mach-no { border-color: #f1c4bf; background: #fdf3f2; }
.md2-machq { font-size: var(--fs-14); }
.md2-mach > small { font-size: var(--fs-12); }
.seg.md2-said { grid-auto-flow: row; grid-template-columns: repeat(3, 1fr); gap: 2px; }
.seg.md2-said .md2-sayok { grid-column: 1 / -1; display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 8px 6px; font-weight: 600; }
.seg.md2-said .md2-sayok[aria-pressed=true] { background: #2e6b34; color: #fff; }
.seg.md2-said .md2-sayno { padding: 7px 4px; }
.seg.md2-said .md2-sayno[aria-pressed=true] { background: #fff; color: #b3261e; box-shadow: 0 0 0 1.5px #e3a39c inset; }
.md2-appr input { font-variant-numeric: tabular-nums; letter-spacing: .04em; }
.md2-appr small, .md2-noline { color: var(--ink2); font-size: var(--fs-12); line-height: 1.4; }
.md2-noline { color: #8c2a20; }
.md2-notpaid { display: grid; gap: 3px; padding: 10px 12px; border-radius: 12px; background: #fdecea; border: 1px solid #f1c4bf; color: #6b1c14; font-size: var(--fs-13); line-height: 1.45; }
.md2-notpaid b { font-size: var(--fs-15); color: #b3261e; letter-spacing: .01em; }
.go2.md2-nobtn { background: #8c2a20; }