/* CRM_SUPPLIER_PAYMENTS_STYLE_V112 */
.supplier-payment-kpis{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));
  gap:12px;
  margin-bottom:14px
}
.supplier-payment-kpi{
  min-width:0;
  display:grid;
  gap:4px;
  padding:15px;
  border:1px solid var(--line);
  border-radius:16px;
  background:var(--panel,#fff)
}
.supplier-payment-kpi small{color:var(--muted)}
.supplier-payment-kpi strong{
  font-size:clamp(20px,2vw,30px);
  overflow-wrap:anywhere
}
.supplier-payment-flow{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  padding:12px;
  margin-bottom:14px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#f8fafc
}
.supplier-payment-flow span{
  padding:7px 10px;
  border:1px solid var(--line);
  border-radius:999px;
  background:#fff;
  font-size:12px;
  font-weight:800
}
.supplier-payment-flow b{color:var(--muted)}
.supplier-payment-actions{
  display:flex;
  flex-wrap:wrap;
  gap:6px
}
.supplier-payment-id{
  font-family:ui-monospace,SFMono-Regular,Consolas,monospace;
  font-size:11px;
  color:var(--muted)
}
.supplier-payment-allocation-note{
  padding:11px 12px;
  border:1px dashed var(--line);
  border-radius:12px;
  background:#f8fafc;
  color:var(--muted)
}
.supplier-statement-controls{
  display:grid;
  grid-template-columns:minmax(180px,1fr) minmax(150px,220px) auto;
  gap:10px;
  align-items:end
}
.supplier-statement-summary{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin-top:14px
}
.supplier-statement-columns{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin-top:12px
}
.supplier-statement-columns>article{
  min-width:0;
  padding:12px;
  border:1px solid var(--line);
  border-radius:14px
}
.supplier-statement-line{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding:9px 0;
  border-bottom:1px solid var(--line)
}
.supplier-statement-line:last-child{border-bottom:0}
.supplier-statement-line div{
  min-width:0;
  display:grid;
  gap:2px
}
.supplier-statement-line small{
  color:var(--muted);
  overflow-wrap:anywhere
}
.supplier-statement-line strong{white-space:nowrap}
@media (max-width:760px){
  .supplier-statement-controls,
  .supplier-statement-summary,
  .supplier-statement-columns{
    grid-template-columns:1fr
  }
  .supplier-statement-controls button{width:100%}
}