/* ============================================================================
   caja_tokens.css — Panel de paquetes de tokens (agente `caja-tokens`).

   Hoja propia y ADITIVA, mismo motivo que `asistente.css` y `precios.css`:
   `app.css` no tiene dueño y varios hilos lo tocan a la vez — dos agentes en
   el mismo archivo se pisan. Esto solo trae clases NUEVAS (`nv-paq-*`), no
   redefine ni una regla de `app.css`, así que el orden de carga da igual.

   Chico y honesto: tres tarjetas, el sugerido resaltado con el borde savia —
   el mismo color que ya usa `.nv-btn-primary` para "esto es lo que te
   conviene", no un color nuevo inventado para la ocasión.
   ========================================================================== */
.nv-paq { margin-top: 4px; }
.nv-paq-h { font-size: 12px; font-weight: 700; color: var(--nv-tenue); text-transform: uppercase; letter-spacing: .04em; margin-bottom: 8px; }
/* PIEZA 2-bis — la frase "cuota diaria / lo comprado no se vence" (pedido
   del dueño). Va ARRIBA de las tarjetas, no dentro de ninguna: es contexto
   de las tres, no de una sola. */
.nv-paq-cuota { font-size: 11.5px; color: var(--nv-tenue); line-height: 1.4; margin: 0 0 10px; }
/* PIEZA 2-bis cambió la forma: de 3 tarjetas angostas en fila a una lista
   vertical de filas anchas. Con la línea de equivalencias nueva ("≈ 3
   diagnósticos · 2 recomendaciones · 22 búsquedas") una tarjeta de ~110px
   la habría partido a la mitad; a lo ancho, entra en una o dos líneas. */
.nv-paq-lista { display: flex; flex-direction: column; gap: 8px; }
.nv-paq-card { width: 100%; display: flex; flex-direction: column; align-items: stretch; gap: 2px;
  position: relative; padding: 10px 12px; background: var(--nv-superficie); border: 1px solid var(--nv-linea-fuerte);
  border-radius: var(--nv-r-sm); cursor: pointer; font: inherit; color: var(--nv-texto); text-align: left; }
.nv-paq-card:hover { border-color: var(--nv-savia); }
.nv-paq-card.is-sugerido { border-color: var(--nv-savia); border-width: 2px; background: color-mix(in srgb, var(--nv-savia) 8%, var(--nv-superficie)); }
.nv-paq-card.is-cargando { opacity: .6; cursor: default; }
.nv-paq-card:disabled { opacity: .6; cursor: default; }
.nv-paq-tag { align-self: flex-start; font-size: 9.5px; font-weight: 800;
  color: #04140E; background: var(--nv-savia); padding: 2px 8px; border-radius: 999px; letter-spacing: .03em;
  white-space: nowrap; margin-bottom: 2px; }
.nv-paq-top { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.nv-paq-tk { font-size: 15px; font-weight: 700; }
.nv-paq-precio { font-size: 13px; color: var(--nv-tenue); }
/* "≈ 3 diagnósticos · 2 recomendaciones · 22 búsquedas". Texto corrido, no
   tabla: son 2-3 equivalencias, no una lista larga. */
.nv-paq-eq { font-size: 11px; color: var(--nv-tenue); opacity: .85; line-height: 1.4; margin-top: 2px; }
.nv-paq-err:empty { display: none; }