/* OFICINA CORRIGE LA FICHA DE UN CLIENTE DEL COMERCIAL (8-oct-2026) — assets/js/ficha-comercial.js.
   El formulario es el de siempre (.fx-form, .fx-campos, .fx-campo, .fx-btn): aquí solo lo que es suyo. */
.fc{ margin-top:14px; }
.pd-f-cuerpo + .fc{ margin-top:18px; }
.fc .fx-form{ text-align:left; }
.fc .pa-loading{ padding:24px 0; }
.fc-t{ margin:20px 0 10px; font-size:var(--fs-sm); font-weight:700; color:var(--tx); }
.fc-form h4 + .fx-sub + .fc-t, .fc-form .fc-mal + .fc-t{ margin-top:6px; }
.fc-pais{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:8px; margin:0 0 12px; max-width:320px; }
.fc-pais .pf-banco{ min-height:48px; }
/* El elegido lleva el relleno del acento de la tienda, y su tinta: en BUSINESS el acento es grafito y la letra
   negra de .pf-banco.on no se leía (medido en la captura del 8-oct). */
.fc-pais .pf-banco.on, .fc-pais .pf-banco.on b{ color:var(--accent-ink); }
.fc-vies-linea{ margin-top:12px; }
.fc-chip{ display:inline-flex; align-items:center; gap:6px; height:28px; padding:0 12px; border-radius:999px;
  background:var(--sf2); color:var(--tx-2); font-size:13px; font-weight:600; white-space:nowrap; }
.fc-chip.bien{ background:#1f8a4c; color:#fff; }
.fc-chip.mal{ background:#c62828; color:#fff; }
.fc-vies{ margin:10px 0 0; font-size:14px; color:var(--tx-2); line-height:1.5; }
.fc-vies i{ color:var(--azul-apple); margin-right:4px; }
.fc-vies b{ color:var(--tx); }
.fc-link{ border:0; background:transparent; padding:0; font:inherit; font-weight:700; color:var(--azul-apple); cursor:pointer; }
@media (hover:hover){ .fc-link:hover{ text-decoration:underline; } }
.fc-marca{ display:flex; align-items:flex-start; gap:10px; margin:4px 0 0; font-size:14.5px; color:var(--tx); cursor:pointer; line-height:1.4; }
.fc-marca input{ appearance:none; -webkit-appearance:none; flex:none; width:22px; height:22px; margin:0; border-radius:6px;
  border:1.5px solid var(--br-2); background:#fff; cursor:pointer; display:grid; place-content:center;
  transition:background-color .15s ease-out, border-color .15s ease-out; }
.fc-marca input::after{ content:""; width:11px; height:6px; border:2.5px solid var(--accent-ink); border-top:0; border-right:0;
  transform:rotate(-45deg) translate(1px,-1px) scale(0); transition:transform .15s ease-out; }
.fc-marca input:checked{ background:var(--accent); border-color:var(--accent); }
.fc-marca input:checked::after{ transform:rotate(-45deg) translate(1px,-1px) scale(1); }
.fc-marca input:focus-visible{ outline:none; box-shadow:0 0 0 3px rgba(0,113,227,.25); }
.fc-marca + .fx-campos{ margin-top:14px; }
.fc-marca.fc-peds{ margin-top:18px; padding:14px 16px; border-radius:14px; background:var(--sf2); }
.fc-mal{ margin:0 0 12px; font-size:14px; font-weight:600; color:#b81414; display:flex; gap:8px; align-items:baseline; }
.fc-hecho, .fc-ojo{ margin:10px 0 0; font-size:14px; line-height:1.45; color:var(--tx); display:flex; gap:8px; align-items:baseline; }
.fc-hecho i{ color:#1f8a4c; }
.fc-ojo{ color:var(--tx-2); }
.fc-ojo i{ color:#c2410c; }
/* «Sus clientes» en la cuenta del comercial: la fila con el botón a la derecha; abierto, el formulario baja a lo ancho. */
.fc-lista{ border:1px solid var(--br); border-radius:16px; overflow:hidden; }
.fc-fila{ display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:8px 16px; padding:12px 16px; background:#fff; }
.fc-fila + .fc-fila{ border-top:1px solid var(--br); }
.fc-fila.cebra{ background:#fafafa; }
.fc-fila-q{ display:grid; gap:2px; min-width:0; }
.fc-fila-q b{ font-size:15px; font-weight:700; color:var(--tx); }
.fc-fila-q span{ font-size:13px; color:var(--tx-2); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fc-fila .fc{ margin-top:0; }
.fc-fila .fc-abrir{ width:auto; height:44px; padding:0 16px; font-size:14px; white-space:nowrap; }
.fc-fila .fc:has(.fx-form), .fc-fila .fc:has(.fc-hecho){ grid-column:1 / -1; }
@container (max-width:560px){ .fc-fila{ grid-template-columns:minmax(0,1fr); } }
@media (max-width:640px){ .fc-fila{ grid-template-columns:minmax(0,1fr); } .fc-fila .fc-abrir{ width:100%; } }
