/* ============================================================
   css/alta-odoo.css — "Dar de alta en Odoo" (T5b, 2026-09-06).
   Solo lo específico de la hoja (components/alta-odoo-sheet.js) y
   de la banda de la ficha (views/ficha.js) — el shell
   `.sheet`/`.sheet-backdrop`/`.sheet-hd`/`.sheet-body`, `.btn*` y
   `.chip*` ya viven en app.css/tokens.css. La tarjeta del embudo
   ("Falta alta en Odoo") reusa `.kcard-actions`/`.chip`/`.btn-sm`
   de embudo.css/app.css sin agregar nada acá.
   ============================================================ */

.alta-sheet-body { padding: 0 var(--sp-4) var(--sp-5); display: flex; flex-direction: column; gap: var(--sp-4); }
.alta-loading,
.alta-mensaje {
  padding: var(--sp-4) 0;
  font-size: var(--fs-sm);
  color: var(--text-2);
  text-align: center;
}
.alta-aviso {
  font-size: var(--fs-sm); color: var(--text-2); line-height: 1.5;
  background: var(--surface-2); border-radius: var(--r); padding: var(--sp-3) var(--sp-4);
}
.alta-payload {
  display: flex; flex-direction: column;
  border: 1px solid var(--border); border-radius: var(--r);
  overflow: hidden;
}
.altap-row {
  display: flex; gap: var(--sp-2); align-items: baseline;
  padding: 10px var(--sp-4);
  background: var(--surface); border-bottom: 1px solid var(--border);
}
.altap-row:last-child { border-bottom: none; }
.altap-label { font-size: var(--fs-caption); color: var(--text-3); width: 110px; flex-shrink: 0; }
.altap-value { font-size: var(--fs-sm); color: var(--text-1); font-weight: 500; word-break: break-word; }
.alta-afip-line { font-size: var(--fs-caption); color: var(--text-3); text-align: center; }
.alta-destinatario { display: flex; flex-direction: column; gap: 2px; }
.alta-destinatario-line { margin: 0; font-size: var(--fs-sm); color: var(--text-1); word-break: break-word; }
.alta-destinatario-label { color: var(--text-3); }
.alta-destinatario-val { font-weight: 600; }
.alta-destinatario-nota { margin: 0; font-size: var(--fs-caption); }
.alta-contacto-principal { display: flex; flex-direction: column; gap: var(--sp-2); align-items: stretch; }
.alta-actions { display: flex; flex-direction: column; gap: var(--sp-2); margin-top: var(--sp-1); }
.alta-note { margin-top: 0; }

.alta-missing-title {
  display: flex; align-items: center; gap: var(--sp-2);
  font-size: var(--fs-body); font-weight: 600; color: var(--red-text);
}
.alta-missing-list { list-style: none; display: flex; flex-direction: column; gap: 6px; padding: 0; margin: 0; }
.alta-missing-list li {
  font-size: var(--fs-sm); color: var(--text-2);
  display: flex; align-items: center; gap: var(--sp-2);
}
.alta-missing-list li::before {
  content: ""; width: 6px; height: 6px; border-radius: 50%;
  background: var(--red-text); flex-shrink: 0;
}

/* ---- Bloque "Comercial" del faltante de comercial (§7e). El `<select>` y `.btn-block` ya traen
   `min-height: var(--touch)` (app.css) — ningún blanco táctil nuevo que agrandar acá. ---- */
.alta-comercial { display: flex; flex-direction: column; gap: var(--sp-2); }
.alta-comercial .field-label { margin: 0; }
.alta-comercial-select { margin: 0; }
.alta-comercial-hint { font-size: var(--fs-caption); color: var(--text-3); margin: 0; }
.alta-comercial-error {
  font-size: var(--fs-sm); color: var(--red-text);
  background: var(--red-soft); border: 1px solid var(--red-border);
  border-radius: var(--r-sm); padding: var(--sp-2) var(--sp-3); margin: 0;
}
.alta-comercial-error[hidden] { display: none; }

/* ---- "Consultar BCRA y completar" (2026-09-08, contrato-bcra-consulta-inmediata.md §2): botón
   secundario que aparece SOLO si el faltante es la razón social Y `bcra.cuit_ok` (feature detection
   asíncrona — nace vacío, `buildBcraCompletarBlock` lo llena si corresponde, nunca deja un hueco
   visible si no aplica). `.btn` ya trae la variante en el nodo mismo (`btn-ghost`, §4.1 nº22). */
.alta-bcra-completar { display: flex; flex-direction: column; gap: var(--sp-2); align-items: flex-start; }
.alta-bcra-msg { font-size: var(--fs-caption); color: var(--text-3); margin: 0; }
.alta-bcra-msg[hidden] { display: none; }

/* ---- Banda "prospecto / alta en Odoo" en la ficha (§4.1 nº21: banda, nunca pared — el cuerpo de
   la ficha sigue entero debajo). Mismo patrón visual que `.dup-banner` (app.css), tres colores
   según el estado: naranja = pendiente de acción, rojo = falló, verde = ya es cliente. ---- */
.alta-band {
  display: flex; flex-wrap: wrap; gap: var(--sp-3); align-items: center;
  justify-content: space-between;
  padding: var(--sp-3) var(--sp-4); border-radius: var(--r);
  border: 1px solid transparent;
}
.alta-band.pend  { background: var(--orange-soft); border-color: var(--orange-border); }
.alta-band.fail  { background: var(--red-soft);    border-color: var(--red-border); }
.alta-band.ok    { background: var(--green-soft);  border-color: var(--green-border); }
.alta-band-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1 1 320px; }
.alta-band.pend .alta-band-title { color: var(--orange-text); }
.alta-band.fail .alta-band-title { color: var(--red-text); }
.alta-band.ok   .alta-band-title { color: var(--green-text); }
.alta-band-title { font: 700 var(--fs-body)/1.35 var(--font); }
.alta-band-sub { font: 400 var(--fs-sm)/1.4 var(--font); color: var(--text-2); }
.alta-band-sub a { color: var(--blue-text); text-decoration: none; font-weight: 600; }
.alta-band-acc { flex: 0 0 auto; }