/* Seat link: the way from a seated ticket to its seat map, shaped like the
   stepper so seated and standing tickets read alike; its one accent is the
   round arrow where the stepper has its plus. */
.seat-link {
  align-items: center;
  background: var(--color-surface-1);
  border-radius: var(--radius-pill);
  color: var(--color-text);
  display: flex;
  font-weight: var(--weight-semibold);
  justify-content: space-between;
  padding: var(--space-3xs) var(--space-3xs) var(--space-3xs) var(--space-s);
  text-decoration: none;
}

.seat-link__label {
  align-items: center;
  display: inline-flex;
  gap: var(--space-2xs);

  .icon {
    --icon-color: var(--color-muted);
  }
}

.seat-link__go {
  align-items: center;
  aspect-ratio: 1;
  background: var(--color-accent-fill);
  block-size: 2.5rem;
  border-radius: var(--radius-pill);
  color: var(--color-on-accent);
  display: inline-flex;
  justify-content: center;
  transition: translate var(--duration-fast) var(--ease-out);
}

.seat-link:hover .seat-link__go {
  translate: var(--space-3xs) 0;
}