.payment-step p{color:var(--muted);margin-top:-4px}
.payment-options{display:grid;grid-template-columns:repeat(5,minmax(120px,1fr));gap:10px}
.payment-options label{cursor:pointer;position:relative;min-width:0}
.payment-options input{position:absolute;width:1px;height:1px;padding:0;margin:0;border:0;clip-path:inset(50%);opacity:0}
.payment-options span{display:grid;place-items:center;min-height:48px;padding:9px 10px;border:1px solid var(--line);border-radius:12px;background:#fffaf8;font-weight:750;text-align:center;transition:.15s ease}
.payment-options input:checked+span{background:#f98675;color:#fff;border-color:#f98675;box-shadow:0 7px 18px #e46f5c33}
.payment-options input:focus-visible+span{outline:3px solid #2f6feb55;outline-offset:2px}
.balance-value{white-space:nowrap}
.balance-value.red{color:#c22f3d}.balance-value.green{color:#087a49}.balance-value.yellow{color:#987016}
.pix-card{display:grid;gap:10px;margin-bottom:20px}
.pix-copy-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.pix-key{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;overflow-wrap:anywhere}
.family-header-actions{display:flex;align-items:center;gap:8px}
.copy-toast{position:fixed;left:50%;
  bottom:22px;z-index:40;transform:translate(-50%,18px);padding:11px 16px;border-radius:999px;background:#254b38;color:#fff;font-weight:750;opacity:0;pointer-events:none;transition:.2s ease
}
.copy-toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:820px){
 .payment-options{grid-template-columns:repeat(2,minmax(0,1fr))}
 .payment-options label:last-child{grid-column:1/-1}
 .family-app>header{align-items:flex-start;gap:12px}
 .family-header-actions{flex-direction:row;align-items:center;flex:0 0 auto}
 .family-header-actions .btn{padding:10px 12px;white-space:nowrap;text-align:center}
 .family-history{padding:18px 14px}
 .family-history .family-period{display:grid;grid-template-columns:1fr 1fr;gap:10px}
 .family-history .family-period>div{grid-column:1/-1;grid-row:1;text-align:center}
 .family-history .family-period>a{white-space:nowrap;padding:10px 8px;text-align:center}
 .family-history .table-wrap{overflow:visible}
 .family-history table,.family-history tbody{display:block;width:100%;min-width:0!important}
 .family-history thead{display:none}
 .family-history tr{display:grid;grid-template-columns:1fr auto;gap:8px 12px;padding:14px 0;border-bottom:1px solid var(--line)}
 .family-history td{display:block;padding:0!important;border:0!important;min-width:0;white-space:normal;overflow-wrap:anywhere}
 .family-history td::before{content:attr(data-label);display:block;margin-bottom:2px;color:var(--muted);font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em}
 .family-history td[data-label="Itens"]{grid-column:1/-1}
 .family-history td[data-label="Valor"]{grid-column:2;grid-row:1;text-align:right;font-weight:800}
 .family-history td[data-label="Cliente"],.family-history td[data-label="Movimentação"],.family-history td[data-label="Pagamento"]{font-size:.93rem}
 .family-history td.empty{grid-column:1/-1;text-align:center;padding:18px!important}
}
@media(max-width:460px){
 .family-app{padding:14px}
 .family-app>header h1{font-size:clamp(1.55rem,8vw,2rem)}
 .family-header-actions{gap:6px}
 .family-header-actions .btn{padding:9px 10px;font-size:.9rem}
 .family-history .family-period>a{font-size:.86rem}
}

/* 0.7.3: contained grids, without hiding overflowing page content. */
.app{min-width:0}
.app>*,.sale-grid,.product-grid,.product,.product-finder,.payment-options,.qty-stepper{min-width:0}
.product-grid{grid-template-columns:repeat(auto-fill,minmax(min(180px,100%),1fr))}
.product{overflow-wrap:anywhere}
.product input,.product-finder input{min-width:0}
.product-finder{grid-template-columns:minmax(0,1fr) auto}
.qty-stepper{grid-template-columns:minmax(36px,44px) minmax(0,1fr) minmax(36px,44px);max-width:100%}
.qty-stepper input{width:100%;min-width:0}
.sale-totals{display:grid;gap:10px}
.sale-totals>span{display:flex;justify-content:space-between;gap:12px}
.sale-totals>span:last-child{font-size:1.2rem;padding-top:12px;border-top:1px solid var(--line)}
.discount-step [hidden]{display:none!important}
.extract-pagination{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:16px 0}
.extract-pagination [aria-current=page]{background:var(--coral);color:white}
.product-performance>summary{font-weight:750;font-size:20px;cursor:pointer;padding:8px 0}
.base-metrics{grid-template-columns:repeat(auto-fit,minmax(125px,1fr))}
@media(max-width:900px){.app{width:100%}.app>header{justify-content:flex-start;gap:18px}.app>header>div{min-width:0}.payment-options{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){
 .product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .product{padding:10px}
 .product-finder{grid-template-columns:minmax(0,1fr)}
 .qty-stepper{grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);gap:4px}
 .qty-stepper button{min-height:44px;min-width:0;padding:0}
 .qty-stepper input{padding:10px 1px}
}
@media(max-width:359px){.product-grid{grid-template-columns:minmax(0,1fr)}}
