.footer {
  $multiplier: 4;

  align-items: flex-end;
  background: var(--dialog-bg);
  bottom: -1px; // hack to fix content being visible 1px below
  box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.16);
  border-top: 1px solid rgba(0, 0, 0, 0.24);
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  padding: ($unit * 1.5) ($unit * $multiplier) $unit-3x;
  position: sticky;

  .left,
  .right {
    display: flex;
    gap: $unit;
  }
}
