/* ComponentERP beta, T2794 B3 Billing, A/R, shipping-to & RMAs (BL-1..BL-12): styles for ce-billing.js. */
.bl-tab { display: grid; grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr); gap: 14px; align-items: start; padding-top: 4px; }
.bl-tab:not(:has(.bl-side)) { grid-template-columns: minmax(0, 1fr); }
.bl-main, .bl-side { display: grid; gap: 14px; min-width: 0; }
.bl-tab .record-section { margin: 0; }
.bl-card h2 { font-size: 15px; margin: 0 0 10px; }
.bl-card h2 .bl-tools { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.bl-card .form-help { margin: -4px 0 10px; }
.bl-card .tablewrap { margin: 0; }
.bl-side .bl-card .searchtable td, .bl-side .bl-card .searchtable th { white-space: normal; }
.bl-side .grid { grid-template-columns: minmax(0, 1fr); }
.bl-end { display: flex; justify-content: flex-end; margin-top: 10px; }
.bl-note textarea { width: 100%; min-height: 90px; resize: vertical; }
.bl-defaults .check { display: flex; gap: 6px; align-items: center; margin-top: 10px; font-size: 12px; }
.bl-summary { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.bl-tile { position: relative; padding: 12px 14px; border: 1px solid var(--line); border-radius: 6px; background: var(--panel); min-width: 0; }
.bl-top { margin: 4px 0 14px; }
.bl-tile-l { display: flex; justify-content: space-between; align-items: center; gap: 6px; margin-bottom: 4px; min-height: 22px; }
.bl-tile-l span { color: var(--muted); font-size: 11px; }
.bl-tile strong { font-size: 16px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.bl-tile .tiny { min-height: 0; padding: 2px 8px; }
.bl-side .searchtable { min-width: 0 !important; }
.bl-pager { margin-top: 8px; }
.bl-rma-head td { background: var(--group); font-size: 12px; }
.bl-rmas td.numeric, .bl-alloc td.numeric { font-variant-numeric: tabular-nums; }
.bl-h3 { font-size: 13px; margin: 16px 0 6px; }
.tablewrap:has(> .bl-alloc) { min-height: 0; }
.bl-alloc input[type=number] { width: 100%; min-width: 72px; max-width: 120px; min-height: 0; padding: 4px 6px; }
.bl-alloc input[type=checkbox] { margin: 0; }
.bl-pay-facts { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 12px; }
.bl-total { display: flex; justify-content: flex-end; gap: 10px; align-items: baseline; margin: 8px 0; }
.bl-total strong { font-size: 15px; font-variant-numeric: tabular-nums; }
.bl-credit-foot { margin-top: 10px; }
#bl-pay-left { margin-top: 8px; }
/* T2827: page content follows the width #content has (container "main", base.css), not the viewport; the @media copy keeps dialogs/menus outside #content on the viewport */
@container main (max-width:856px){ .bl-tab { grid-template-columns: minmax(0, 1fr); } .bl-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); }}
@media (max-width: 1100px){.bl-tab:where(:not(#content *)){ grid-template-columns: minmax(0, 1fr); }.bl-summary:where(:not(#content *)){ grid-template-columns: repeat(3, minmax(0, 1fr)); }}
@container main (max-width:616px){ .bl-summary, .bl-pay-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); } .bl-card h2 { flex-wrap: wrap; }}
@media (max-width: 640px){.bl-summary:where(:not(#content *)),.bl-pay-facts:where(:not(#content *)){ grid-template-columns: repeat(2, minmax(0, 1fr)); }.bl-card h2:where(:not(#content *)){ flex-wrap: wrap; }}
.bl-main > div, .bl-side > div { min-width: 0; }
.bl-tab .record-section, .bl-top .bl-summary { box-sizing: border-box; width: 100%; max-width: 100%; }
.bl-tab .tablewrap { overflow-x: auto; min-height: 0; max-width: 100%; }
.bl-nw { white-space: nowrap; }