/* ════════════════════════════════════════════════════════════════════
   LA PESTAÑA «COMERCIAL Y CRÉDITO» DE LA FICHA DEL CLIENTE
   Portada del prototipo aprobado el 03-11-2026: aviso de bloqueo, condiciones
   comerciales, control del crédito con su barra, cobranza al vencer paso a paso,
   bloqueo automático e historial. Usa el sistema de diálogo (.campo, .campo-grupo,
   .btn); acá va sólo lo propio, colgado de .cred.
   ════════════════════════════════════════════════════════════════════ */

.aux-pestanas { display: flex; align-items: center; gap: 4px; padding: 0 var(--dlg-margen, 14px); border-bottom: 1px solid var(--mud-palette-lines-default); }
.aux-pestanas button { background: none; border: 0; color: var(--mud-palette-text-secondary); font: inherit; font-weight: 600; font-size: 12.5px; letter-spacing: .04em; text-transform: uppercase; padding: 11px 14px; border-bottom: 2px solid transparent; cursor: pointer; }
.aux-pestanas button.on { color: var(--mud-palette-primary); border-bottom-color: var(--mud-palette-primary); }
.aux-pestanas .marca { margin-left: auto; }

.cred { display: flex; flex-direction: column; gap: 14px; font-size: 13px; color: var(--dlg-txt); }
.cred .mono { font-family: var(--dlg-mono); font-variant-numeric: tabular-nums; }
.cred .dim { color: var(--dlg-dim); }
.cred-vacio { padding: 24px 8px; text-align: center; color: var(--dlg-dim); }

.cred-bloqueo { display: flex; gap: 14px; align-items: center; padding: 12px 14px; border-radius: 10px; background: var(--dlg-rojo-bg); border: 1px solid color-mix(in srgb, var(--dlg-rojo) 35%, transparent); }
.cred-bloqueo .icono { font-size: 22px; }
.cred-bloqueo .texto { display: flex; flex-direction: column; gap: 3px; flex: 1; min-width: 0; }
.cred-bloqueo b { color: var(--dlg-rojo); font-size: 14px; }
.cred-bloqueo .acc { display: flex; gap: 8px; flex-wrap: wrap; }
.cred .btn.out { border: 1px solid var(--dlg-lines); background: var(--dlg-surf); padding: 7px 14px; }
.cred-aviso { font-size: 12.5px; padding: 8px 12px; border-radius: 8px; background: var(--dlg-ambar-bg); color: var(--dlg-ambar); border: 1px solid var(--dlg-ambar-bd); }

.cred-accion { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 12px; border-radius: 8px; border: 1px solid var(--dlg-lines); background: var(--dlg-surf2); }
.cred-accion label { font-size: 12px; font-weight: 700; color: var(--dlg-dim); }
.cred-accion input { flex: 1; min-width: 240px; font: inherit; font-size: 13px; color: var(--dlg-txt); background: var(--dlg-surf); border: 1px solid var(--dlg-lines); border-radius: 6px; padding: 7px 9px; }

.cred-deuda { border: 1px solid var(--dlg-lines); border-radius: 10px; padding: 8px 12px; max-height: 260px; overflow: auto; }
.cred-deuda table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.cred-deuda th { text-align: left; font-size: 10.5px; letter-spacing: .05em; text-transform: uppercase; color: var(--dlg-dim); padding: 4px 6px; border-bottom: 1px solid var(--dlg-lines); }
.cred-deuda td { padding: 5px 6px; border-bottom: 1px solid var(--dlg-lines2); }
.cred-deuda .n { text-align: right; }
.cred-deuda tr.vencido td { color: var(--dlg-rojo); }
.cred-deuda a { color: var(--dlg-primary); text-decoration: none; }

.cred-dos { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px; }
@media (max-width: 1000px) { .cred-dos { grid-template-columns: minmax(0, 1fr); } }
.cred-dos .col { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.cred .grupo-rot { display: flex; align-items: center; gap: 8px; }
.cred .pista { font-weight: 400; text-transform: none; letter-spacing: 0; color: var(--dlg-dim2); font-size: 12px; }
.cred-campos { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px 12px; }

.cred-control { border: 1px solid var(--dlg-lines); border-radius: 10px; padding: 14px; display: flex; flex-direction: column; gap: 12px; }
.cred-control .barra { display: flex; height: 14px; border-radius: 7px; overflow: hidden; background: color-mix(in srgb, var(--dlg-lines) 70%, var(--dlg-surf)); }
.cred-control .seg.vencido { background: color-mix(in srgb, var(--mud-palette-error) 85%, var(--dlg-surf)); }
.cred-control .seg.vigente { background: var(--dlg-primary); }
.cred-control .leyenda { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.cred-control .leyenda div { display: grid; grid-template-columns: 12px 1fr; column-gap: 7px; row-gap: 1px; align-items: center; }
.cred-control .leyenda i { width: 10px; height: 10px; border-radius: 3px; }
.cred-control .leyenda i.vencido { background: color-mix(in srgb, var(--mud-palette-error) 85%, var(--dlg-surf)); }
.cred-control .leyenda i.vigente { background: var(--dlg-primary); }
.cred-control .leyenda i.libre { background: var(--dlg-surf2); border: 1px solid var(--dlg-lines); }
.cred-control .leyenda span { font-size: 12px; color: var(--dlg-dim); }
.cred-control .leyenda b { grid-column: 2; font-size: 16px; }
.cred-control .leyenda b.malo { color: var(--dlg-rojo); }
.cred-control .leyenda small { grid-column: 2; font-size: 11.5px; color: var(--dlg-dim); }
.cred-control .kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; border-top: 1px solid var(--dlg-lines); padding-top: 10px; }
.cred-control .kpis span { display: block; font-size: 11px; color: var(--dlg-dim); }
.cred-control .kpis b { font-size: 13px; }

.cred-opciones { display: flex; flex-direction: column; gap: 8px; font-size: 13px; }
.cred-opciones label { display: flex; align-items: center; gap: 8px; cursor: pointer; }
.cred-opciones input[type=radio], .cred-opciones input[type=checkbox] { accent-color: var(--dlg-primary); width: 15px; height: 15px; }
.cred-opciones.linea { flex-direction: row; flex-wrap: wrap; gap: 16px; margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--dlg-lines); }
.cred-opciones .rot { font-size: 10.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--dlg-dim); }
.cred-opciones .num { width: 64px; font: inherit; font-family: var(--dlg-mono); font-size: 12.5px; color: var(--dlg-txt); background: var(--dlg-surf); border: 1px solid var(--dlg-lines); border-radius: 5px; padding: 2px 6px; }

.cred .sw { position: relative; display: inline-block; width: 32px; height: 18px; border-radius: 9px; background: var(--dlg-dim2); margin-left: auto; cursor: pointer; }
.cred .sw input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.cred .sw b { position: absolute; top: 2px; left: 2px; width: 14px; height: 14px; border-radius: 50%; background: #fff; transition: left .15s; pointer-events: none; }
.cred .sw.on { background: var(--dlg-primary); }
.cred .sw.on b { left: 16px; }

.cred-revision { font-size: 12px; padding: 8px 12px; border-radius: 8px; background: var(--dlg-ambar-bg); color: var(--dlg-ambar); border: 1px solid var(--dlg-ambar-bd); margin-bottom: 10px; }
.cred-pasos { display: flex; flex-direction: column; }
.cred-pasos .paso { display: grid; grid-template-columns: 120px minmax(0, 1fr) auto; gap: 10px; padding: 8px 4px; border-bottom: 1px solid var(--dlg-lines2); font-size: 12.5px; align-items: center; }
.cred-pasos .paso .d { font-weight: 700; color: var(--dlg-dim); }
.cred-pasos .paso em { font-style: normal; font-size: 11.5px; color: var(--dlg-dim); text-align: right; }
.cred-pasos .paso.hecho em { color: var(--dlg-ambar); }
.cred-contactos { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 10px; font-size: 12.5px; }
.cred-contactos > span { font-size: 10.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--dlg-dim); }
.cred-contactos b { font-weight: 600; background: var(--dlg-surf2); border: 1px solid var(--dlg-lines); padding: 3px 9px; border-radius: 999px; }
.cred-contactos .btn { margin-left: auto; padding: 4px 10px; color: var(--dlg-primary); text-decoration: none; }

.cred .cred-bloquear { margin-left: auto; padding: 2px 8px; font-size: 12px; color: var(--dlg-rojo); }
.cred-hist { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.cred-hist td { padding: 6px 4px; border-bottom: 1px solid var(--dlg-lines2); vertical-align: middle; }
.cred .pill, .aux-pestanas .pill { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; font-weight: 700; padding: 3px 10px; border-radius: 999px; white-space: nowrap; }
.cred .pill.mal, .aux-pestanas .pill.mal { background: color-mix(in srgb, var(--mud-palette-error) 11%, var(--mud-palette-surface)); color: color-mix(in srgb, var(--mud-palette-error) 70%, var(--mud-palette-text-primary)); border: 1px solid color-mix(in srgb, var(--mud-palette-error) 35%, transparent); }
.cred .pill.ok { background: color-mix(in srgb, var(--mud-palette-success) 13%, var(--mud-palette-surface)); color: color-mix(in srgb, var(--mud-palette-success) 55%, var(--mud-palette-text-primary)); border: 1px solid color-mix(in srgb, var(--mud-palette-success) 35%, transparent); }

/* La autorización de una venta sobre la línea, en la revisión de la ventana de emisión. */
.fac .revision .autoriza { display: flex; align-items: center; gap: 6px; margin-top: 6px; font-weight: 600; cursor: pointer; }
.fac .revision .autoriza input { accent-color: var(--dlg-primary); }