/* b2b.css — owned by WP-B2B-HORECA-SUPPORT. Tokens only (docs/vfx-master-spec.md §1 rule 5).
   Motion here is transform/opacity only; every duration and easing is a token. */

/* ------------------------------------------------------- APPROVAL TRAIL */
/* The three-node trail an approval draws inside its card. */
.b2b-trail { padding-top: var(--fc-s-2); }
.b2b-trail .tl-t { font-size: var(--fc-t-sm); }

/* -------------------------------------------------------------- OUTCOME */
/* The mark beside the outcome heading: a drawn check (approved) or the clock
   (held). Sized like the lrow-ic it replaced. */
.b2b-mark {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  flex: none;
  border-radius: var(--fc-r-md);
  background: var(--on-glass-chip);
  color: var(--txt-1);
}
.b2b-mark.is-held { background: var(--fc-warn); color: var(--accent-ink); }
.b2b-mark .vfx-check { display: block; }
.b2b-outcome-art { width: 64px; height: 64px; flex: none; }
.b2b-outcome-art img, .b2b-outcome-art canvas { width: 100%; height: 100%; object-fit: contain; display: block; }

/* ------------------------------------------------------------- INVOICES */
/* The stamp is positioned by vfx.css against the card; the card only needs
   to be a positioning context and to keep the stamp inside its corner. */
.b2b-inv { position: relative; overflow: hidden; }
.b2b-inv-ic {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  flex: none;
  color: var(--txt-3);
}
.b2b-inv-ic.is-paid { color: var(--fc-success); }
.b2b-inv-ic .vfx-check { display: block; }