/* estilos/estado-vacio.css — componentes/estado-vacio.js (mxVacio.html).
   Solo tokens. El acento va en el ícono (línea), el fondo queda en la superficie neutra. */

.mx-vacio {
  display: flex; flex-direction: column; align-items: center; text-align: center;
  gap: 10px; padding: 28px 20px;
}
.mx-vacio-ico {
  width: 56px; height: 56px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: var(--navy-3); border: 1px solid var(--border);
  color: var(--blue-light-txt, var(--blue-light)); font-size: 26px;
}
.mx-vacio-tit { font-size: 16px; font-weight: 700; color: var(--text); }
.mx-vacio-txt { margin: 0; max-width: 360px; font-size: 14px; line-height: 1.45; color: var(--text-2); }
.mx-vacio-accion { margin-top: 6px; min-height: 44px; padding: 0 18px; font-size: 14.5px; font-weight: 600; }