
/* BIGSYS_NEXT_VISUAL_V18_CLEAN_BASE_START
   Base estable:
   - normal gris
   - amarillo/rojo solo borde
   - line-local-confirmed = validada final verde suave
   - line-local-pending = pendiente/IA aplicada con borde azul
   - campos IA reales verdes
   - elimina efecto barra verde continua de V15/V17
*/

:root{
  --v18-gray-top:rgba(24,32,44,.98);
  --v18-gray-mid:rgba(18,27,40,.98);
  --v18-gray-bot:rgba(14,22,34,.98);

  --v18-field-bg:rgba(6,15,27,.76);
  --v18-field-border:rgba(148,163,184,.22);

  --v18-ok-top:rgba(34,93,67,.54);
  --v18-ok-mid:rgba(25,72,54,.50);
  --v18-ok-bot:rgba(18,52,42,.46);
  --v18-ok:#36c985;
  --v18-ok-border:rgba(74,222,128,.92);

  --v18-yellow:#fbbf24;
  --v18-yellow-border:rgba(251,191,36,.94);

  --v18-red:#f87171;
  --v18-red-border:rgba(248,113,113,.94);

  --v18-blue:#38bdf8;
  --v18-blue-border:rgba(56,189,248,.88);

  --v18-ia-top:rgba(40,209,124,.26);
  --v18-ia-bot:rgba(40,209,124,.15);
  --v18-ia-border:rgba(40,209,124,.64);
  --v18-ia-text:#effff5;
}

/* Base gris de burbuja */
.invoice-line-card,
.invoice-line-card.status-yellow,
.invoice-line-card.status-red,
.invoice-line-card.warning,
.invoice-line-card.error,
.invoice-line-card.no-product,
.invoice-line-card.sin-producto{
  background:linear-gradient(180deg, var(--v18-gray-top), var(--v18-gray-mid) 52%, var(--v18-gray-bot)) !important;
  border:1px solid rgba(148,163,184,.30) !important;
  border-left:5px solid rgba(148,163,184,.46) !important;
  box-shadow:0 12px 26px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.035) !important;
}

/* Estado amarillo: solo borde */
.invoice-line-card.status-yellow:not(.line-local-confirmed),
.invoice-line-card.warning:not(.line-local-confirmed),
.invoice-line-card.yellow:not(.line-local-confirmed){
  background:linear-gradient(180deg, var(--v18-gray-top), var(--v18-gray-mid) 52%, var(--v18-gray-bot)) !important;
  border-color:var(--v18-yellow-border) !important;
  border-left-color:var(--v18-yellow) !important;
}

/* Estado rojo: solo borde */
.invoice-line-card.status-red:not(.line-local-confirmed),
.invoice-line-card.error:not(.line-local-confirmed),
.invoice-line-card.no-product:not(.line-local-confirmed),
.invoice-line-card.sin-producto:not(.line-local-confirmed){
  background:linear-gradient(180deg, var(--v18-gray-top), var(--v18-gray-mid) 52%, var(--v18-gray-bot)) !important;
  border-color:var(--v18-red-border) !important;
  border-left-color:var(--v18-red) !important;
}

/* Pendiente / IA aplicada: borde azul, sin fondo azul pesado */
.invoice-line-card.line-local-pending:not(.line-local-confirmed){
  border-color:var(--v18-blue-border) !important;
  border-left-color:var(--v18-blue) !important;
}

/* Validada final real */
.invoice-line-card.line-local-confirmed,
.invoice-line-card.status-yellow.line-local-confirmed,
.invoice-line-card.status-red.line-local-confirmed,
.invoice-line-card.warning.line-local-confirmed,
.invoice-line-card.error.line-local-confirmed,
.invoice-line-card.no-product.line-local-confirmed,
.invoice-line-card.sin-producto.line-local-confirmed,
.invoice-line-card.visual-final-ok-v12,
.invoice-line-card.visual-final-ok-v15{
  background:linear-gradient(180deg, var(--v18-ok-top), var(--v18-ok-mid) 52%, var(--v18-ok-bot)) !important;
  border-color:var(--v18-ok-border) !important;
  border-left:6px solid var(--v18-ok) !important;
  box-shadow:0 12px 26px rgba(0,0,0,.20), 0 0 0 2px rgba(74,222,128,.22), inset 0 1px 0 rgba(255,255,255,.04) !important;
}

/* Hover: solo borde/halo, no fondo */
.invoice-line-card:hover{
  border-left-width:7px !important;
  box-shadow:0 12px 26px rgba(0,0,0,.22), 0 0 0 3px rgba(56,189,248,.28), inset 0 1px 0 rgba(255,255,255,.04) !important;
}

.invoice-line-card.status-yellow:not(.line-local-confirmed):hover,
.invoice-line-card.warning:not(.line-local-confirmed):hover,
.invoice-line-card.yellow:not(.line-local-confirmed):hover{
  box-shadow:0 12px 26px rgba(0,0,0,.22), 0 0 0 3px rgba(251,191,36,.36), inset 0 1px 0 rgba(255,255,255,.04) !important;
}

.invoice-line-card.status-red:not(.line-local-confirmed):hover,
.invoice-line-card.error:not(.line-local-confirmed):hover,
.invoice-line-card.no-product:not(.line-local-confirmed):hover,
.invoice-line-card.sin-producto:not(.line-local-confirmed):hover{
  box-shadow:0 12px 26px rgba(0,0,0,.22), 0 0 0 3px rgba(248,113,113,.38), inset 0 1px 0 rgba(255,255,255,.04) !important;
}

.invoice-line-card.line-local-confirmed:hover{
  border-left-width:8px !important;
  box-shadow:0 12px 26px rgba(0,0,0,.22), 0 0 0 4px rgba(74,222,128,.36), inset 0 1px 0 rgba(255,255,255,.04) !important;
}

/* Descripción principal siempre blanca */
.invoice-line-card .line-description,
.invoice-line-card .line-description *{
  color:#f8fbff !important;
  text-shadow:none !important;
}

/* Campos normales oscuros */
.invoice-line-card .line-field,
.invoice-line-card .ai-field{
  background:var(--v18-field-bg) !important;
  border:1px solid var(--v18-field-border) !important;
  color:#dce8f8 !important;
}

/* Campos IA reales verdes.
   OJO: ya no usamos visual-ai-bottom-field-v15 ni visual-ai-technical-field-v17. */
.invoice-line-card .ai-field-description,
.invoice-line-card .line-field.field-ai-applied,
.invoice-line-card .line-field.field-local-confirmed,
.invoice-line-card .line-field.field-safe,
.invoice-line-card .line-field.field-confirmed,
.invoice-line-card .ai-field.field-ai-applied,
.invoice-line-card .ai-field.field-local-confirmed,
.invoice-line-card .ai-field.field-safe,
.invoice-line-card .ai-field.field-confirmed{
  background:linear-gradient(180deg, var(--v18-ia-top), var(--v18-ia-bot)) !important;
  border:1px solid var(--v18-ia-border) !important;
  color:var(--v18-ia-text) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05) !important;
}

.invoice-line-card .ai-field-description *,
.invoice-line-card .line-field.field-ai-applied *,
.invoice-line-card .line-field.field-local-confirmed *,
.invoice-line-card .line-field.field-safe *,
.invoice-line-card .line-field.field-confirmed *,
.invoice-line-card .ai-field.field-ai-applied *,
.invoice-line-card .ai-field.field-local-confirmed *,
.invoice-line-card .ai-field.field-safe *,
.invoice-line-card .ai-field.field-confirmed *{
  color:var(--v18-ia-text) !important;
}

/* Neutralizar marcas experimentales viejas si quedaron en DOM */
.invoice-line-card .visual-ai-bottom-field-v15,
.invoice-line-card .visual-ai-technical-field-v17,
.invoice-line-card .visual-ai-description-v15,
.invoice-line-card .visual-ai-description-field-v17{
  /* no pintamos por estas clases */
}

.invoice-line-card .visual-ai-bottom-field-v15:not(.ai-field-description):not(.field-ai-applied):not(.field-local-confirmed):not(.field-safe):not(.field-confirmed),
.invoice-line-card .visual-ai-technical-field-v17:not(.ai-field-description):not(.field-ai-applied):not(.field-local-confirmed):not(.field-safe):not(.field-confirmed){
  background:var(--v18-field-bg) !important;
  border:1px solid var(--v18-field-border) !important;
  color:#dce8f8 !important;
}

/* BIGSYS_NEXT_VISUAL_V18_CLEAN_BASE_END */
