/* Ficha viva de Nagare (js/fichaViva.js). Lenguaje «feng shui» de visual-flujo/nagare-v2/maqueta.html: calma, el color solo como punto de acento,
   13 px como mínimo, mismas variables que la maqueta (con respaldo por si el tablero todavía no las define). */
.fv-bloque-caja, .fv-panel-caja { --fv-tx: var(--tx, #15221c); --fv-tx2: var(--tx2, #51635a); --fv-tx3: var(--tx3, #8a998f); --fv-line: var(--line, #e3e8e5); --fv-line2: var(--line2, #d3dbd7);
  --fv-acento: var(--g7, #1d6b4f); --fv-panel: var(--panel2, #f8faf9); font-size: 13px; line-height: 1.45; color: var(--fv-tx); cursor: default; }
.fv-bloque-caja:not(.fv-caja-mini) { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--fv-line); }
.fv-bloque { display: flex; flex-direction: column; gap: 6px; }
.fv-bloque * { font-size: 13px; box-sizing: border-box; }
.fv-tit { font-weight: 650; letter-spacing: -.1px; color: var(--fv-tx); }
.fv-nuevo { display: flex; flex-direction: column; gap: 2px; }
.fv-nuevo-c { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.fv-visto { font-weight: 500; color: var(--fv-tx3); text-decoration: none; }
.fv-visto:hover { color: var(--fv-tx); text-decoration: underline; }
.fv-rec { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 3px; }
.fv-rec li { display: block; color: var(--fv-tx2); }
.fv-rec li b { color: var(--fv-tx); font-variant-numeric: tabular-nums; }
.fv-rec li small { color: var(--fv-tx3); }
.fv-cita { color: var(--fv-tx2); font-style: italic; overflow-wrap: anywhere; }
.fv-quien { color: var(--fv-tx3); }
.fv-bloque time { font-variant-numeric: tabular-nums; color: var(--fv-tx2); }
.fv-falta { color: var(--fv-tx2); }
.fv-falta b { color: var(--fv-tx); font-weight: 650; }
.fv-completa b { color: var(--fv-acento); }
/* el color es solo un punto: la palabra siempre acompaña */
.fv-punto { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 6px; vertical-align: 1px; flex: none; background: var(--fv-tx3); }
.fv-cliente { background: #1d6b4f; }
.fv-confirmado { background: #2b6cb0; }
.fv-propuesto { background: transparent; box-shadow: inset 0 0 0 1.5px #8a998f; }
.fv-ambiguo { background: #c98200; }
.fv-comercial { background: #15221c; }
.fv-batuta { background: transparent; box-shadow: inset 0 0 0 1.5px #a2b5ab; border-radius: 2px; }
body.dark-mode .fv-comercial { background: #e8f0ec; }
.fv-ficha { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--fv-line); background: none; color: var(--fv-tx2); border-radius: 8px; padding: 3px 10px; font: inherit; font-weight: 600; cursor: pointer; }
.fv-ficha small { font-weight: 500; color: var(--fv-tx3); }
.fv-ficha:hover { border-color: var(--fv-line2); color: var(--fv-tx); }
.fv-ficha:focus-visible, .fv-link:focus-visible, .fv-btn:focus-visible { outline: 2px solid var(--y, #f5b82e); outline-offset: 2px; }
.fv-lista { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-direction: column; gap: 0; border: 1px solid var(--fv-line); border-radius: 10px; background: var(--fv-panel); }
.fv-lista { max-height: 340px; overflow-y: auto; scrollbar-width: thin; }
.fv-fila { display: flex; align-items: flex-start; padding: 8px 10px; }
.fv-fila + .fv-fila { border-top: 1px solid var(--fv-line); }
.fv-fila .fv-punto { margin-top: 6px; }
.fv-fila-c { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.fv-fila-t { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; }
.fv-et { color: var(--fv-tx3); }
.fv-valor { color: var(--fv-tx); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.fv-nota { color: var(--fv-tx3); overflow-wrap: anywhere; }
.fv-pendiente .fv-valor { color: var(--fv-tx2); font-weight: 500; }
.fv-link { align-self: flex-start; border: 0; background: none; padding: 0; color: var(--fv-acento); font: inherit; font-weight: 600; cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.fv-form { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 4px; }
.fv-form input { flex: 1 1 140px; min-width: 0; border: 1px solid var(--fv-line2); border-radius: 8px; background: var(--panel, #fff); color: var(--fv-tx); padding: 5px 9px; font: inherit; }
.fv-btn { border: 1px solid var(--fv-line2); background: var(--panel, #fff); color: var(--fv-tx); border-radius: 8px; padding: 4px 10px; font: inherit; font-weight: 600; cursor: pointer; }
.fv-btn-ok { background: var(--g9, #0f3d2e); border-color: var(--g9, #0f3d2e); color: #fff; }
.fv-err { flex-basis: 100%; color: var(--red, #d6322e); }
.fv-err:empty { display: none; }
.fv-ayuda { flex-basis: 100%; color: var(--fv-tx3); }
.fv-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
/* dentro de la lista «En calificación» */
.fu-cal-lista .fv-bloque-caja { grid-column: 1 / -1; width: 100%; margin-top: 6px; }
/* insignias del formulario de Batuta */
.fv-ins { display: inline-flex; align-items: center; margin-left: 8px; font-size: 13px; color: var(--tx2, #51635a); white-space: nowrap; vertical-align: baseline; cursor: help; }
.fv-ins .fv-punto { margin-right: 5px; }
.fv-paso { margin: 0 0 8px; font-size: 13px; color: var(--tx2, #51635a); overflow-wrap: anywhere; }
.fv-paso .fv-ins { margin-left: 0; }
.fv-panel { margin: 0 0 10px; padding: 8px 12px; border: 1px solid var(--line, #e3e8e5); border-radius: 10px; background: var(--panel2, #f8faf9); font-size: 13px; }
.fv-panel ul { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-direction: column; gap: 3px; }
.fv-panel li { color: var(--tx2, #51635a); }
.fv-panel li b { color: var(--tx, #15221c); }
@media (prefers-reduced-motion: reduce) { .fv-bloque-caja * { transition: none !important; animation: none !important; } }

/* ---- en la TARJETA: dos líneas chicas, una sola fila cada una, sin estirarla ---- */
.fv-caja-mini { margin: 10px 0 0; padding: 0; }
.fv-mini { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.fv-m1, .fv-m2 { display: flex; align-items: baseline; gap: 8px; min-width: 0; white-space: nowrap; color: var(--fv-tx2); }
.fv-m1-t { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; color: var(--fv-tx); font-variant-numeric: tabular-nums; }
.fv-m1 time { flex: none; color: var(--fv-tx3); }
.fv-m2 { overflow: hidden; text-overflow: ellipsis; color: var(--fv-tx3); }
.fv-m2.fv-completa { color: var(--fv-acento); }
.fv-mini .fv-punto { margin-right: 5px; }
.fv-mini .fv-punto:not(:first-child) { margin-left: 2px; }
/* ---- en el PANEL lateral ---- */
.fv-panel-caja { margin: 0 16px; }
.fv-en-panel { display: flex; flex-direction: column; gap: 8px; padding: 12px 14px; border: 1px solid var(--fv-line); border-radius: 12px; background: var(--fv-panel); }
.fv-h { margin: 0; font-size: 14px; font-weight: 650; color: var(--fv-tx); }
.fv-h small { font-weight: 500; color: var(--fv-tx3); margin-left: 6px; }
.fv-en-panel .fv-lista { max-height: none; border: 0; background: none; border-top: 1px solid var(--fv-line); border-radius: 0; }
.fv-en-panel .fv-fila { padding: 8px 0; }

/* ---- Pop-up de Batuta (v2): acabado ---- */
#bcPopup .bc-resumen { list-style: none; padding-left: 0; margin: 8px 0; display: flex; flex-direction: column; gap: 6px; }
#bcPopup .bc-resumen > li { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; }
#bcPopup .bc-link[data-bc="editar"] { display: inline-flex; align-items: center; gap: 6px; text-decoration: none; padding: 2px 9px; border: 1px solid var(--line, #e3e8e5); border-radius: 8px; background: var(--panel2, #f8faf9); color: var(--tx, #15221c); font-size: 13px; cursor: pointer; }
#bcPopup .bc-link[data-bc="editar"]:hover, #bcPopup .bc-link[data-bc="editar"]:focus-visible { border-color: var(--g7, #1d6b4f); }
#bcPopup .bc-lapiz { font-style: normal; color: var(--tx3, #6f8077); opacity: 0; transition: opacity .12s; }
#bcPopup .bc-link[data-bc="editar"]:hover .bc-lapiz, #bcPopup .bc-link[data-bc="editar"]:focus-visible .bc-lapiz { opacity: 1; }
#bcPopup .pf-mini:empty { display: none; }
#bcPopup .bc-link[data-bc="agregar"] { text-decoration: none; display: inline-flex; align-items: center; border: 1px solid var(--line2, #d3dbd7); border-radius: 8px; padding: 5px 12px; background: var(--panel, #fff); color: var(--tx, #15221c); font-weight: 600; cursor: pointer; }
#bcPopup .bc-link[data-bc="agregar"]:hover { border-color: var(--g7, #1d6b4f); }
/* insignias: chicas, en gris, junto al chip */
#bcPopup .fv-ins { margin-left: 0; font-size: 13px; color: var(--tx3, #6f8077); }
.fv-fila-t .fv-link { margin-left: auto; font-weight: 500; color: var(--fv-tx3); }
.fv-fila-t .fv-link:hover { color: var(--fv-acento); }
#bcPopup .fv-par { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
#bcPopup .bc-link[data-bc="agregar"] { margin: 4px 0 10px; }

/* ---- Fase 3: «El cliente pidió 200 (antes 150)» en la tarjeta de la cotización ---- */
.fv-cambio { display: flex; flex-direction: column; gap: 2px; padding: 8px 10px; border: 1px solid var(--fv-line); border-left: 3px solid var(--y, #f5b82e); border-radius: 10px; background: var(--fv-panel); }
.fv-c1 { display: flex; align-items: baseline; gap: 4px; min-width: 0; color: var(--fv-tx); }
.fv-c1 b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 650; }
.fv-mas-c { margin-left: auto; flex: none; color: var(--fv-tx3); }
.fv-c2 { display: flex; align-items: baseline; gap: 8px; min-width: 0; white-space: nowrap; color: var(--fv-tx3); }
.fv-c2 .fv-cita { overflow: hidden; text-overflow: ellipsis; color: var(--fv-tx2); }
.fv-c3 { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.fv-cambio .fv-btn[disabled] { opacity: .55; cursor: progress; }
.fu-raiz .fv-cambio .fv-btn.fv-btn-ok, .fv-cambio .fv-btn.fv-btn-ok { color: #fff; }
.fu-raiz .fv-cambio .fv-btn:not(.fv-btn-ok) { color: var(--fv-tx); }
.fv-c1 b { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.fv-espera { display: flex; gap: 6px; align-items: center; font-size: 13px; padding: 3px 0; } .fv-espera img { flex: none; }
.fv-espera-aplicada { color: #166534; } .fv-espera-sin_stock_elegida, .fv-espera-pendiente { color: #92400e; }

/* «Recién identificado» / Ficha dentro de las listas de Nagare (.fu-arch-lista li es una grilla de 3 columnas: no debe heredarse a los ítems del bloque) */
.fu-raiz .fu-arch-lista .fv-bloque li, .fu-raiz .fu-arch-lista .fv-bloque-caja li, .fu-raiz .fu-arch-lista .fv-mini li { display: block; grid-template-columns: none; border-top: 0; padding: 1px 0; font-size: 13px; }
.fu-raiz .fu-arch-lista .fv-rec { gap: 2px; }
.fu-raiz .fu-arch-lista .fv-rec li { line-height: 1.35; }
.fu-raiz .fu-arch-lista .fv-lista li { padding: 3px 0; border-top: 1px solid var(--line, #e3e6e4); }
