
#jp-budget .bsh-card{padding:18px 18px 20px}
#jp-budget .bsh-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:14px}
#jp-budget .bsh-title{font-size:17px;font-weight:800;color:var(--text);letter-spacing:-.2px;margin-bottom:2px}
#jp-budget .bsh-actions{display:flex;gap:8px;align-items:center;flex-shrink:0}
#jp-budget .bsh-sheet{overflow:auto;flex:1;min-height:0}
/* NOT height:100%. Stretching the table to fill the card divides the slack between its
   rows, so a job with two collapsed parents drew 400px-tall rows with the money pinned to
   the top edge and the row's own label floating 200px below it — the figures and the thing
   they describe stopped reading as one row (Ryan, 2026-08-20: "this doesn't look good").
   Natural height keeps every number beside its label; the card simply ends where the rows do. */
#jp-budget .bsh-sheet > table.et{height:auto}
/* THE ACTUALS BAND (Ryan, 2026-08-20: "need a way to distinguish spent better from
   budgeted cost"). Budget is what the job was PRICED to cost; Spent and Profit are what
   actually happened. Sitting in identical right-aligned columns they read as one run of
   numbers — $2,000.00 and $1,509.62 side by side, same weight, no seam. So the two actual
   columns are banded: a rule down the left edge is the line between plan and actual, and a
   faint fill carries the pair as one zone the whole way down the sheet, header to subtotal.
   The rule is an inset box-shadow, not a border — the sheet's table collapses borders and
   would drop a border-left on some rows. */
#jp-budget .bsh-table .bsh-act{background:rgba(255,255,255,.035)}
#jp-budget .bsh-table .bsh-act-l{box-shadow:inset 1px 0 0 rgba(255,255,255,.17)}
#jp-budget .bsh-table .tot td.bsh-act-l{box-shadow:inset 1px 0 0 rgba(255,255,255,.17),inset 0 1px 0 rgba(255,255,255,.06)}
#jp-budget .bsh-table thead th.bsh-act{background:rgba(255,255,255,.06)}
/* Full-screen Budget: table area scrolls, the customer-price bar is pinned to the bottom, edge-to-edge */
#page-jobportal.jpb-full .jp-scroll{padding:0;overflow:hidden;display:flex;flex-direction:column;min-height:0}
#page-jobportal.jpb-full #jp-budget{flex:1;min-height:0;display:flex;flex-direction:column}
#jp-budget .bsh-full{flex:1;min-height:0;display:flex;flex-direction:column}
#jp-budget .bsh-scroll{flex:1;min-height:0;overflow:hidden;padding:20px 24px;display:flex;flex-direction:column}
#jp-budget .bsh-scroll .bsh-card{margin-bottom:0;flex:1;min-height:0;display:flex;flex-direction:column}
#jp-budget .est-sticky{margin:0;border-radius:0;flex-shrink:0}
/* MORE SHEET, LESS CHROME (Ryan, 2026-08-19: "can't see enough of project budget — make
   that a bigger widget view and it's ok if I have to scroll to see actuals to date").
   The sheet already fills the screen; what was eating it was padding and a tall header.
   On anything short of a big desktop the frame tightens so the ROWS get the pixels —
   scrolling to reach Actuals to date is expected, squinting at six rows was not. */
@media (max-height:900px){
  #jp-budget .bsh-scroll{padding:10px 14px}
  #jp-budget .bsh-card{padding:12px 13px 12px}
  #jp-budget .bsh-head{margin-bottom:8px}
  #jp-budget .bsh-title{font-size:15px}
  #jp-budget .bsh-pcell,#jp-budget .bsh-pcost,#jp-budget .bsh-pprice{padding:8px 10px}
  #jp-budget .et .tot td{padding:9px 10px}
}
/* locked: the budget is read-only — inputs render exactly like New Estimate but can't be edited */
#jp-budget .et input{pointer-events:none;cursor:default;user-select:text}
#jp-budget .et .gr td{cursor:pointer}
/* template parent rows */
#jp-budget .bsh-parent{cursor:pointer;transition:filter .12s}
#jp-budget .bsh-parent:hover td{filter:brightness(1.08)}
#jp-budget .bsh-parent td{background:linear-gradient(180deg,#2a313b 0%,#222831 100%);border-top:1px solid rgba(255,255,255,.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.07)}
#jp-budget .bsh-pcell{font-size:15px;font-weight:700;color:var(--text);padding:11px 10px;vertical-align:top}
#jp-budget .bsh-pcost{font-size:13px;font-weight:700;color:var(--text3);padding:11px 10px;vertical-align:top}
#jp-budget .bsh-pprice{font-size:14px;font-weight:800;color:var(--text);padding:11px 10px;letter-spacing:-.3px;vertical-align:top}
#jp-budget .bsh-namerow{display:flex;align-items:center;gap:8px}
#jp-budget .bsh-arrow{font-size:12px;color:var(--brand);font-weight:700;flex-shrink:0;width:11px;text-align:center}
#jp-budget .bsh-ptitle{font-size:15px;font-weight:700;color:var(--text);letter-spacing:-.2px}
#jp-budget .bsh-pdesc{font-size:12px;color:var(--text3);font-style:italic;margin-top:5px;margin-left:19px;line-height:1.5}
#jp-budget .bsh-irow td{vertical-align:middle}
#jp-budget .bsh-sub{cursor:pointer;transition:background .12s}
#jp-budget .bsh-sub td{border-top:1px solid rgba(255,255,255,.045)}
#jp-budget .bsh-sub:hover td{background:rgba(255,255,255,.035)}
#jp-budget .bsh-subtitle{font-size:13.5px;font-weight:600;color:var(--text)}
#jp-budget .bsh-detail td{background:rgba(0,0,0,.14)}
#jp-budget .et .tot td{padding:12px 10px}
