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


/* CUSTOMER_RECEIVABLE_FILTER_V33 */
.customer-aging-filter{margin-bottom:14px}
.customer-aging-controls{display:flex;flex-wrap:wrap;align-items:end;gap:9px}
.customer-aging-controls>label{display:grid;gap:4px;font-size:11px;font-weight:700;color:var(--muted)}
.customer-aging-controls input{min-height:36px;padding:7px 9px;border:1px solid var(--line);border-radius:8px;background:#fff}
.customer-aging-presets{display:flex;flex-wrap:wrap;gap:5px;margin-right:auto}
.customer-aging-presets .ghost{min-height:34px;padding:6px 10px;border-radius:999px;font-size:12px}
.customer-aging-presets .is-active{color:#0e5da8;border-color:#93c5fd;background:#eff6ff}
@media(max-width:680px){.customer-aging-controls{align-items:stretch}.customer-aging-controls>label{flex:1 1 140px}.customer-aging-controls>.primary{width:100%}}

/* CUSTOMER_UI_HOTFIX_V332 */
.customer-aging-column-picker { position:relative; margin:0; }
.customer-aging-column-picker>summary { list-style:none; cursor:pointer; user-select:none; white-space:nowrap; font-size:12px; padding:6px 10px; }
.customer-aging-column-picker>summary::-webkit-details-marker { display:none; }
.customer-aging-column-popover { position:absolute; z-index:40; top:calc(100% + 6px); right:0; width:220px; max-height:360px; overflow:auto; padding:9px; border:1px solid #d7e0e9; border-radius:11px; background:#fff; box-shadow:0 14px 34px rgba(35,55,75,.17); }
.customer-aging-column-popover label { display:flex; align-items:center; gap:8px; min-height:30px; padding:5px 7px; border-radius:7px; color:#33485c; font-size:12px; }
.customer-aging-column-popover label:hover { background:#f4f7fa; }
.customer-aging-column-popover input { width:14px; height:14px; margin:0; }
.customer-aging-column-popover>button { width:100%; margin-top:7px; }