Visual glitch on thumbnails plugin, when thumbnail padding is provided via styles prop

[GarikHarutyunyan]

Describe the bug

When passing the thumbnail's padding style option via the lightbox's styles prop(styles->thumbnail), the thumbnails show visual glitches.
The same issue can be reproduced by trying to change "--yarl__thumbnails_thumbnail_padding" variable inside the same prop.

Expected behavior

Thumbnails plugin must work in the same way as it does in case of adding padding via thumbnails->padding prop.

How to reproduce

Stackblitz

The glitch is appearing on slide change.

Screenshots / Logs

No response

Additional context

No response

[igordanchenko]

There is a dedicated setting to define custom thumbnail padding:

<Lightbox
  thumbnails={{ padding: 27 }}
  // ...
/>

Does this address your visual glitch?

[GarikHarutyunyan]

In such a simple case it actually works, but in cases where there is a need to do some style modifications it brings a glitch, for instance if you want to fix left and right paddings

thumbnails={{ padding: 27 }} 
styles={{
  thumbnail: {
    paddingLeft: "0px",   
    paddingRight: "0px",
  },
}}

[igordanchenko]

Defining custom padding through the thumbnails.padding prop is the only supported way to customize thumbnail padding, and only symmetric padding is supported.