/* Fase 9.3 — CSS verbatim de los bloques de estilo de Pages/CPP/CuentaPagarProveedorAmortizacionModalPage.razor. Igual que hoy, es global mientras el componente está en pantalla:
   se enlaza con <link> donde estaba el bloque. Cambios: @@ → @ y capas D-51. */
/* Estilos propios de este componente — usan las mismas variables --cxc-* que
   define CuentasPagarProveedorMainPage.razor (el selector de tema vive solo
   ahí; este modal se renderiza como hijo DENTRO del div [data-cxc-theme], así
   que hereda los valores por cascada CSS normal). Las clases genéricas
   (.cxc-modal-backdrop, .cxc-modal, .btn, .badge-cxc, .mini-table, .form-check,
   .spin-ic) ya están definidas en el style de MainPage y se reutilizan aquí
   sin duplicarlas. */
.amort-modal .cxc-modal{ max-width:920px; }
.amort-card{ background:var(--cxc-surface); border:1px solid var(--cxc-border); border-radius:8px; margin-bottom:16px; overflow:hidden; }
.amort-card .hd{ padding:10px 14px; font-weight:700; font-size:13px; display:flex; align-items:center; gap:8px; color:#fff; }
.amort-card .hd.primary{ background:var(--cxc-primary); }
.amort-card .hd.success{ background:var(--cxc-success); }
.amort-card .bd{ padding:14px; }
.field-label{ display:block; font-size:10.5px; font-weight:700; color:var(--cxc-text-muted); text-transform:uppercase; letter-spacing:.35px; margin-bottom:4px; }
.section-sep{ display:flex; align-items:center; gap:8px; font-size:11px; font-weight:700; color:var(--cxc-text-muted); text-transform:uppercase; letter-spacing:.35px; margin:14px 0 10px; }
.section-sep::after{ content:''; flex:1; height:1px; background:var(--cxc-border); }
.nuevo-proveedor-block{ background:var(--cxc-surface-alt); border:1px solid var(--cxc-border); border-radius:6px; padding:12px 14px; margin-top:10px; }
.doc-summary{ display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:8px; margin-bottom:4px; }
.doc-stat{ background:var(--cxc-surface-alt); border:1px solid var(--cxc-border); border-radius:6px; padding:8px 12px; }
.doc-stat-label{ font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.35px; color:var(--cxc-text-muted); margin-bottom:2px; }
.doc-stat-value{ font-size:15px; font-weight:700; color:var(--cxc-text); }
.tabla-cuotas{ width:100%; border-collapse:collapse; font-size:12px; margin-top:4px; }
.tabla-cuotas thead tr{ background:var(--cxc-hover); border-bottom:2px solid var(--cxc-border); }
.tabla-cuotas th{ padding:7px 10px; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.3px; color:var(--cxc-text-muted); text-align:left; }
.tabla-cuotas td{ padding:6px 10px; border-bottom:1px solid var(--cxc-border); color:var(--cxc-text); vertical-align:middle; }
.tabla-cuotas tbody tr:hover{ background:var(--cxc-hover); }
.tabla-cuotas tr.cuota-activa{ background:var(--cxc-success-bg); }
.tabla-cuotas tr.cuota-activa td{ color:var(--cxc-success-ink); }
.tabla-cuotas td.pagado{ font-weight:700; color:var(--cxc-success-ink); }
.preview-saldo{ display:flex; align-items:center; gap:8px; background:var(--cxc-info-bg); border:1px solid var(--cxc-info); border-radius:6px; padding:8px 12px; font-size:13px; color:var(--cxc-info-ink); margin-top:10px; }
.equivalente-texto{ font-size:11px; color:var(--cxc-text-muted); margin-top:3px; padding-left:2px; }
.autocomplete-wrap{ position:relative; }
.autocomplete-list{ position:absolute; z-index:20; top:100%; left:0; right:0; max-height:280px; overflow-y:auto; background:var(--cxc-surface); border:1px solid var(--cxc-border); border-radius:6px; box-shadow:0 8px 24px rgba(0,0,0,.15); margin-top:2px; }
.autocomplete-item{ padding:8px 10px; border-bottom:1px solid var(--cxc-border); cursor:pointer; }
.autocomplete-item:last-child{ border-bottom:none; }
.autocomplete-item:hover{ background:var(--cxc-hover); }
.proveedor-elegido{ display:flex; align-items:center; justify-content:space-between; gap:10px; background:var(--cxc-success-bg); border:1px solid var(--cxc-success); border-radius:6px; padding:10px 12px; }
.accordion-hd{ display:flex; align-items:center; gap:8px; padding:10px 14px; background:var(--cxc-hover); border:1px solid var(--cxc-border); border-radius:6px 6px 0 0; font-weight:700; font-size:12.5px; color:var(--cxc-text); }
.accordion-bd{ border:1px solid var(--cxc-border); border-top:none; border-radius:0 0 6px 6px; padding:12px 14px; }
.medio-pago-tabs{ display:flex; gap:6px; margin:10px 0; }
.medio-pago-tabs .mp-btn{ padding:6px 12px; font-size:12px; border-radius:6px; border:1px solid var(--cxc-border); background:var(--cxc-surface); color:var(--cxc-text-muted); }
.medio-pago-tabs .mp-btn.active{ background:var(--cxc-primary); border-color:var(--cxc-primary); color:#fff; font-weight:700; }
