Max bounds not respected when global padding is present

Nobody has claimed this yet.

**mapbox-gl-js version**: 2.4.1

**browser**: Chrome 93

### Steps to Trigger Behavior

1. Create a map with a global padding not symetric (left is wider than right, top is wider than bottom
2. Set maxBounds on this map.
3. Draw maxBounds on this map

### Link to Demonstration

https://jsfiddle.net/qmartouzet/Lg2zmr6y/

### Expected Behavior

Drawn rectangle representing maxBounds should be barely visible at the edge of the map.

### Actual Behavior

The whole map seems shifted by some amount to the north and to the west.
Cf screenshot below (red is top padding, blue line is left padding, orange corner is north-west corner of maxBounds) :


### Comments

- This behaviour doesn't occur when using `FitBoundsOptions.padding` in `map.fitBounds` (<= for now, I'm using this as a workaround).
- The shifted size seems correlated to the size of padding.

Reproduce the issue using the linked JSFiddle with asymmetric global padding, maxBounds, and the drawn bounds rectangle. Trace the maxBounds and global-padding handling from the map entry points, comparing it with the fitBounds padding behavior described in the report. Done means the rectangle aligns with the map edge despite asymmetric padding, without breaking existing bounds behavior.

Written by the indexing model from the issue text.