/* Gaby · toasts efímeros — pintan las confirmaciones que dispara el store
   ("Lo dejé en Pendientes", "Te lo agendé", etc.). Esquina inferior derecha,
   se autoocultan a los 3.2s desde el store. */

function GabyToasts() {
  const toasts = window.useGabyStore((s) => s.toasts);
  if (!toasts || !toasts.length) return null;
  return (
    <div style={{
      position: "fixed", bottom: 96, right: 20, zIndex: 1200,
      display: "flex", flexDirection: "column", gap: 8,
      pointerEvents: "none", maxWidth: 320,
    }}>
      {toasts.map((t) => (
        <div key={t.id} className="cy-glass" style={{
          padding: "10px 14px", borderRadius: 12, fontSize: 13,
          color: "var(--cy-text-1)", boxShadow: "0 12px 32px rgba(0,0,0,.35)",
        }}>
          {t.msg}
        </div>
      ))}
    </div>
  );
}

window.GabyToasts = GabyToasts;