/* Send to billing → Materials used: parts the tech used but nobody put on the job (billing-missed-parts.js).
   Each part: what the tech wrote, our part on the table's columns, then its source and the actions. */
.bmp-glyph{flex:none;width:12px;height:12px;fill:none;stroke-width:1.5;stroke-linecap:round}
.bmp-glyph-warn{stroke:var(--ds-st-route)}
.bmp-glyph-done circle{fill:var(--ds-st-done);stroke:none}.bmp-glyph-done path{stroke:var(--ds-surface)}
.bmp-glyph-info{stroke:var(--ds-ink-3)}
.bmp-glyph-late circle{fill:var(--ds-st-late);stroke:none}.bmp-glyph-late path{stroke:var(--ds-surface)}
.bmp-count{display:inline-flex;align-items:center;gap:6px;color:var(--ds-ink-2);font-size:var(--ds-text-sm);line-height:var(--ds-lh-sm);font-weight:var(--ds-w-medium);white-space:nowrap}
.bmp-st{display:inline-flex;align-items:center;gap:6px;color:var(--ds-ink-2);font-size:var(--ds-text-sm);line-height:var(--ds-lh-sm);font-weight:var(--ds-w-medium);white-space:nowrap}
.bmp-dim{color:var(--ds-ink-3)}
.bmp-none{color:var(--ds-ink-3)}
.bmp-sub{display:flex;flex-wrap:wrap;align-items:center;gap:var(--ds-s-2);font-size:var(--ds-text-sm);line-height:var(--ds-lh-sm);color:var(--ds-ink-2)}
.bmp-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* shared column widths: the billing materials table and the notes table line up */
.bill-table.bmp-mat-table,.bill-table.bmp-table{table-layout:fixed}
.bmp-col-pn{width:114px}
.bmp-col-qty{width:56px}
.bmp-col-money{width:84px}
.bill-table.bmp-mat-table th{white-space:nowrap}
.bill-table.bmp-mat-table td:nth-child(2) strong,.bmp-pn{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}

/* "Not allocated" under a Simpro line: the line above keeps no rule so the two read as one */
.bill-table tr:has(+ tr.bmp-note-row) td{border-bottom:0}
.bill-table tr.bmp-note-row td{padding-top:0;padding-bottom:var(--ds-s-3)}

/* the notes section, below the materials subtotal, headed like the billing sections around it */
.bmp-block{margin-top:18px}
.bmp-block-head{margin-bottom:var(--ds-s-2)}

/* what the tech wrote leads each part */
.bill-table tr.bmp-said td{padding-top:var(--ds-s-3);padding-bottom:0;border-bottom:0}
.bill-table tr.bmp-said td{font-size:var(--ds-text-sm);line-height:var(--ds-lh-sm)}
.bmp-quote{color:var(--ds-ink);font-weight:var(--ds-w-medium)}
.bmp-by{color:var(--ds-ink-3);white-space:nowrap}
/* data row: every cell is one 28px line */
.bill-table tr.bmp-row td{position:relative;vertical-align:top;padding-top:var(--ds-s-2);padding-bottom:0;border-bottom:0}
.bill-table tr.bmp-row td.num{white-space:nowrap}
.bmp-l1{display:inline-block;line-height:28px}
.bill-table tr.bmp-row .bmp-pn{line-height:28px}
.bmp-part{display:flex;align-items:center;justify-content:space-between;gap:var(--ds-s-1);width:100%;min-height:28px;margin:0;padding:3px 4px 3px var(--ds-s-2);border:1px solid var(--ds-field);border-radius:var(--ds-r-md);background:var(--ds-surface);color:var(--ds-ink);font:inherit;font-size:var(--ds-text-base);font-weight:var(--ds-w-regular);text-align:left;cursor:pointer}
.bmp-part:hover:not(:disabled){border-color:var(--ds-ink-3)}
.bmp-part[aria-expanded="true"]{border-color:var(--ds-ink-3);background:var(--ds-paper-hover)}
.bmp-pop-search:focus-within{border-bottom-color:var(--ds-ink-2)}
.bmp-part.is-static{padding:0;border-color:transparent;background:transparent;cursor:default}
.bmp-part-name{min-width:0;line-height:var(--ds-lh-sm);overflow-wrap:normal;word-break:keep-all;text-align:left}
.bmp-part-name.is-empty{color:var(--ds-ink-3)}
.bmp-part-chev{display:inline-flex;flex:none}
.bmp-chev{flex:none;width:16px;height:16px;fill:none;stroke:var(--ds-icon);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}

/* detail row: the source under the part control, actions to the right */
.bill-table tr.bmp-detail td{vertical-align:middle;padding-top:var(--ds-s-2);padding-bottom:var(--ds-s-3);border-bottom:0.5px solid var(--ds-rule)}
.bill-table tr.bmp-detail td.bmp-actions-cell{text-align:right}
/* the source names can run past the part column; the rest of this row is empty except the buttons on the right */
.bill-table tr.bmp-detail .bmp-select-wrap{position:relative;z-index:1;min-width:100%}
.bill-table tr.bmp-detail .bmp-select{min-width:100%;max-width:300px;width:auto}
.bmp-actions .bmp-btn{white-space:nowrap}
.bill-table tr.bmp-problem td{padding-top:0;border-bottom:0.5px solid var(--ds-rule)}
.bill-table tr.bmp-detail:has(+ tr.bmp-problem) td{border-bottom:0}
.bmp-maybe{color:var(--ds-ink-2)}
.bmp-maybe .bmp-glyph{display:inline-block;vertical-align:-1px}
.bmp-from{color:var(--ds-ink-3)}
.bmp-actions{display:inline-flex;align-items:center;gap:var(--ds-s-2);margin-left:auto}

/* controls: one size, one treatment */
.bmp-select-wrap{position:relative;display:inline-flex;align-items:center}
.bmp-select{appearance:none;-webkit-appearance:none;max-width:240px;height:28px;margin:0;padding:0 26px 0 var(--ds-s-2);border:1px solid var(--ds-field);border-radius:var(--ds-r-md);background:var(--ds-surface);color:var(--ds-ink);font:inherit;font-size:var(--ds-text-sm);font-weight:var(--ds-w-medium);text-align:left;cursor:pointer}
.bmp-select:hover:not(:disabled){border-color:var(--ds-ink-3)}
.bmp-select-wrap .bmp-chev{position:absolute;right:6px;width:14px;height:14px;pointer-events:none}
.bmp-select:disabled{background:var(--ds-disabled-bg);border-color:var(--ds-disabled-bd);color:var(--ds-disabled-fg);cursor:default}
.bmp-cell{width:44px;height:28px;padding:0 5px 0 var(--ds-s-1);border:1px solid var(--ds-field);border-radius:var(--ds-r-md);background:var(--ds-surface);color:var(--ds-ink);font:inherit;font-size:var(--ds-text-base);text-align:right;font-variant-numeric:var(--ds-nums)}
.bmp-cell:hover:not(:disabled){border-color:var(--ds-ink-3)}
.bmp-cell:disabled{background:var(--ds-disabled-bg);border-color:var(--ds-disabled-bd);color:var(--ds-disabled-fg)}
.bmp-btn{display:inline-flex;align-items:center;height:28px;padding:0 var(--ds-s-3);border:1px solid var(--ds-ink-3);border-radius:var(--ds-r-md);background:var(--ds-surface);color:var(--ds-ink);font:inherit;font-size:var(--ds-text-sm);font-weight:var(--ds-w-medium);cursor:pointer}
.bmp-btn:hover:not(:disabled){background:var(--ds-paper-hover);border-color:var(--ds-ink-3)}
.bmp-btn:disabled{background:var(--ds-disabled-bg);border-color:var(--ds-disabled-bd);color:var(--ds-disabled-fg);cursor:default}
.bmp-btn-quiet{padding:0 var(--ds-s-3);border-color:var(--ds-field);background:transparent;color:var(--ds-ink-2)}
.bmp-btn-quiet:hover:not(:disabled){border-color:var(--ds-field);background:var(--ds-paper-hover);color:var(--ds-ink)}

.bmp-link{padding:0;border:0;background:transparent;color:var(--ds-ink);font:inherit;font-size:var(--ds-text-sm);font-weight:var(--ds-w-medium);text-decoration:underline;text-decoration-color:var(--ds-field);text-underline-offset:3px;cursor:pointer}
.bmp-link:disabled{color:var(--ds-disabled-fg);cursor:default;text-decoration:none}
.bmp-part:focus-visible,.bmp-select:focus-visible,.bmp-cell:focus-visible,.bmp-btn:focus-visible,.bmp-link:focus-visible,.bmp-option:focus-visible{outline:2px solid var(--ds-focus);outline-offset:2px}

/* status line */
.bmp-status{display:flex;flex-wrap:wrap;align-items:center;gap:6px;width:100%;color:var(--ds-ink-2);font-size:var(--ds-text-sm);line-height:var(--ds-lh-sm);font-weight:var(--ds-w-medium)}
.bmp-status-late{color:var(--ds-st-late-ink)}

/* part picker: anchored under the part, kept in view by afterRender */
.bmp-pop{position:absolute;top:calc(var(--ds-s-2) + 32px);left:0;z-index:20;width:min(340px,calc(100vw - 48px));background:var(--ds-surface);border:1px solid var(--ds-field);border-radius:var(--ds-r-lg);box-shadow:var(--ds-e-pop);overflow:hidden;scroll-margin:96px 0}
.bmp-pop-search{display:flex;align-items:center;gap:var(--ds-s-2);padding:0 var(--ds-s-3);border-bottom:1px solid var(--ds-line)}
.bmp-pop-hint{display:flex;align-items:center;gap:6px;padding:var(--ds-s-2) var(--ds-s-3);border-bottom:0.5px solid var(--ds-rule);color:var(--ds-ink-2);font-size:var(--ds-text-sm);line-height:var(--ds-lh-sm)}
.bmp-pop-search svg{flex:none;width:16px;height:16px;fill:none;stroke:var(--ds-icon);stroke-width:1.5;stroke-linecap:round}
.bmp-pop-search{padding-top:0;padding-bottom:0}
.bmp-pop-search input{flex:1;min-width:0;height:40px;padding:0 var(--ds-s-2);border:0;border-radius:0;background:transparent;color:var(--ds-ink);font:inherit;font-size:var(--ds-text-base)}
.bmp-pop-search input:focus-visible{outline:0}

.bmp-pop-search input::-webkit-search-cancel-button{-webkit-appearance:none}
.bmp-pop-label{padding:var(--ds-s-2) var(--ds-s-3) var(--ds-s-1);color:var(--ds-ink-3);font-size:var(--ds-text-sm);line-height:var(--ds-lh-sm);font-weight:var(--ds-w-medium)}
.bmp-pop-list{display:flex;flex-direction:column;gap:2px;max-height:264px;overflow-y:auto;padding:var(--ds-s-1)}
.bmp-option{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--ds-s-3);width:100%;border-radius:var(--ds-r-md);padding:var(--ds-s-2) var(--ds-s-3);border:0;background:transparent;color:var(--ds-ink);font:inherit;text-align:left;cursor:pointer}
.bmp-option:hover,.bmp-option:focus-visible,.bmp-option.is-current{background:var(--ds-paper-hover)}
.bmp-option-main{display:flex;flex-direction:column;gap:2px;min-width:0}
.bmp-option-name{font-size:var(--ds-text-sm);line-height:var(--ds-lh-sm);font-weight:var(--ds-w-medium)}
.bmp-option-cost{flex:none;color:var(--ds-ink-2);font-size:var(--ds-text-sm);line-height:var(--ds-lh-sm);font-variant-numeric:var(--ds-nums)}
.bmp-option-meta{color:var(--ds-ink-3);font-size:var(--ds-text-sm);line-height:var(--ds-lh-sm);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bmp-pop-note{padding:var(--ds-s-3);color:var(--ds-ink-3);font-size:var(--ds-text-sm);line-height:var(--ds-lh-sm)}

/* added rows quiet down */
.bill-table tr.bmp-row.is-done .bmp-part-name{color:var(--ds-ink-2)}

/* narrow panels: billing stacks table cells */
@media (max-width: 680px){
  .bill-table tr.bmp-detail td{justify-content:flex-start;text-align:left !important}
  .bill-table tr.bmp-note-row td{justify-content:flex-start;text-align:left !important}
  .bmp-actions{margin-left:0}
}
/* search icon sits inside the bordered field */
.bmp-pop-search{position:relative}
.bmp-pop-search svg{position:absolute;left:calc(var(--ds-s-3) + var(--ds-s-2));pointer-events:none}
.bmp-pop-search input{padding-left:28px}

/* ---- notes section: every part on one grid [label | part or place | amount | of N free | ×]; the quantity needed
   sits in the amount column above the amount from each place ---- */
.bmp-list{border-top:1px solid var(--ds-line)}
.bmp-item{display:flex;flex-direction:column;gap:var(--ds-s-2);padding:var(--ds-s-4) 10px;border-bottom:0.5px solid var(--ds-rule)}
.bill-prepared-review-modal .bmp-item{padding-left:7px;padding-right:7px}
.bmp-item .bmp-said{font-size:var(--ds-text-sm);line-height:var(--ds-lh-sm)}
.bmp-item .bmp-said .bmp-quote{font-weight:var(--ds-w-regular)}
.bmp-item .bmp-maybe{display:flex;align-items:flex-start;gap:6px;margin-top:calc(-1 * var(--ds-s-1));color:var(--ds-ink-2);font-size:var(--ds-text-sm);line-height:var(--ds-lh-sm)}
.bmp-item .bmp-maybe .bmp-glyph{margin-top:3px}
/* The billing table's own columns (see .bmp-col-*): amounts sit under QTY, "needed" / "of N free" under UNIT COST,
   the remove button under UNIT SELL, so the notes cards and the not-allocated rows line up with the table above. */
.bmp-grid{display:grid;grid-template-columns:44px minmax(0,1fr) 56px 84px 84px;column-gap:0;row-gap:var(--ds-s-1);align-items:center}
.bmp-grid > .bmp-label{padding-right:var(--ds-s-2)}
.bmp-grid > .bmp-cell{justify-self:end}
.bmp-grid > .bmp-place-of{justify-self:end}
.bmp-grid > .bmp-x{justify-self:end}
.bmp-label{color:var(--ds-ink-3);font-size:var(--ds-text-sm);line-height:var(--ds-lh-sm)}
.bmp-span{grid-column:2 / -1}
.bmp-full{grid-column:1 / -1}
.bmp-partcell{position:relative;display:flex;flex-direction:column;min-width:0;padding:2px 0}
.bmp-partcell > .bmp-btn{align-self:flex-start}
.bmp-part-title{color:var(--ds-ink);font-size:var(--ds-text-base);line-height:var(--ds-lh-base);font-weight:var(--ds-w-semi);overflow-wrap:anywhere}
.bmp-part-meta{color:var(--ds-ink-3);font-size:var(--ds-text-sm);line-height:var(--ds-lh-sm);font-variant-numeric:var(--ds-nums)}
.bmp-change{font-size:var(--ds-text-sm)}
.bmp-grid .bmp-cell{width:56px;height:32px;padding:0 var(--ds-s-2);text-align:right}
.bmp-place-name{min-width:0;padding-right:var(--ds-s-2);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--ds-ink);font-size:var(--ds-text-sm)}
.bmp-place-of{color:var(--ds-ink-3);font-size:var(--ds-text-sm);font-variant-numeric:var(--ds-nums);white-space:nowrap}
.bmp-x{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:0;border-radius:var(--ds-r-sm);background:transparent;cursor:pointer}
.bmp-x svg{width:14px;height:14px;fill:none;stroke:var(--ds-ink-2);stroke-width:1.5;stroke-linecap:round}
.bmp-x:hover:not(:disabled){background:var(--ds-paper-hover)}
.bmp-x:focus-visible{outline:2px solid var(--ds-focus);outline-offset:1px}
.bmp-add-place{justify-self:start}
.bmp-add-place select{appearance:none;-webkit-appearance:none;height:28px;padding:0;border:0;background:transparent;color:var(--ds-ink);font:inherit;font-size:var(--ds-text-sm);font-weight:var(--ds-w-medium);text-decoration:underline;text-decoration-color:var(--ds-field);text-underline-offset:3px;cursor:pointer}
.bmp-add-place select:focus-visible{outline:2px solid var(--ds-focus);outline-offset:2px}
.bmp-place-warn{display:flex;align-items:center;gap:6px;color:var(--ds-ink-2);font-size:var(--ds-text-sm);line-height:var(--ds-lh-sm)}
.bmp-foot{display:flex;justify-content:flex-end;gap:var(--ds-s-2);margin-top:calc(-1 * var(--ds-s-1))}
/* the row's commit action reads as the one to press; "Not used" is a plain text button; disabled is unmistakable */
.bmp-btn-add:not(:disabled){border-color:var(--ds-action);box-shadow:inset 0 0 0 0.5px var(--ds-action);color:var(--ds-action);font-weight:var(--ds-w-semi)}
.bmp-btn-add:hover:not(:disabled){background:color-mix(in srgb, var(--ds-action) 6%, var(--ds-surface))}
.bmp-foot .bmp-btn-quiet,.bmp-actions-cell .bmp-btn-quiet{border-color:var(--ds-rule);background:transparent}
.bmp-foot .bmp-btn-quiet:hover:not(:disabled),.bmp-actions-cell .bmp-btn-quiet:hover:not(:disabled){background:var(--ds-paper-hover)}
.bmp-btn:disabled{opacity:0.6;cursor:not-allowed}
.bmp-add-place select:disabled{color:var(--ds-ink-3);text-decoration:none;cursor:not-allowed}
.bmp-block-head{margin-bottom:var(--ds-s-2)}
.bmp-block-head .bmp-count{margin-left:0}
/* the picker opens inside the part's block, across the whole grid, so it can never push the panel sideways */
.bmp-grid .bmp-pop{position:static;grid-column:1 / -1;width:auto;margin:var(--ds-s-1) 0 var(--ds-s-2);box-shadow:none;border-color:var(--ds-line)}
.bill-table tr.bmp-note-row td .bmp-grid{max-width:none}
.bmp-item.is-done .bmp-part-title{color:var(--ds-ink-2)}

/* the actions end each part on the "+ Add a place" line, right-aligned across the number columns */
.bmp-actions-cell{grid-column:3 / -1;justify-self:end;display:inline-flex;gap:var(--ds-s-2);white-space:nowrap}
/* one control height across the card */
.bmp-btn,.bmp-grid .bmp-cell,.bmp-part.is-static{height:32px}
.bmp-pop-search input{height:36px}
/* "Not allocated" under a Simpro line reads as part of that line */
/* "Not allocated" under a Simpro line uses the notes cards' grid exactly, so both editors line up */
.bill-table tr.bmp-note-row td{padding-left:10px;padding-right:10px}
.bill-prepared-review-modal .bill-table tr.bmp-note-row td{padding-left:7px;padding-right:7px}
.bmp-none{white-space:nowrap;color:var(--ds-ink-3);font-size:var(--ds-text-sm)}

/* an open picker shows on its trigger as a focus-coloured edge, never a grey pressed fill */
.bmp-partcell > .bmp-btn[aria-expanded="true"]{background:var(--ds-surface);border-color:var(--ds-focus)}
/* the two commit actions are one size */
.bmp-btn-add{min-width:104px;justify-content:center}
/* amount boxes match the labour hour inputs in the same card; room under Allocate matches the notes cards */
.bmp-grid .bmp-cell{height:28px}
.bill-table tr.bmp-note-row td{padding-bottom:var(--ds-s-4)}