Increase height of Cookie Settings modal; some categories can't even be seen without scrolling!

The height of the per-category cookie preferences modal/iframe is currently hard-coded to be 650px high:

The reason this is a big problem is that if users choose to give consent for individual categories only rather than use of the bulk consent options (clicking "Reject all" or "Accept all"), then we are entirely dependent on the user to:

1. See and notice each category that we would like their consent for,
2. Understand the purpose of each category enough that they want to consent to it, and
3. Actually consent to it by toggling the slider for each category by clicking on it.

1. That requires more work/effort on their part (a fundamental problem with scrollbars in general), and
2. There is a usability problem with the visual design (more below)

Usability problem: Scrollbar not fully visible

Currently, the "Save and continue" button obscures the bottom part of the scrollbar. As you can see here, the bottom scrollbar arrow isn't even visible:

What is the solution to this problem? Here are two possible solutions:

Make .iubenda-iframe-footer to use position: relative (same as header) instead of position: absolute, so that the footer is not included as part of the scrollable content at all:

Now you can very clearly see that you are currently viewing 75% of the total viewable content and that you would need to scroll down in order to see the bottom 25% of that content.

Workarounds to the main problem of some categories not being visible

The ideal option would be to to make sure all of the options are on-screen and visible without needing to scroll. Lacking built-in support for that, here are 2 possible options that I came up with to achieve that...

Workaround 1: Use CSS to condense the top part of the window. Each of .purposes-top and .purposes-header add an extra, not-very-necessary 24px around the top of the of the "Cookie preferences" heading. So reducing that padding can gain back up to 48px of wasted vertical space that can be used to show more categories in the main part of the window:

It seems like an even better solution would be to change the height to something relative to the viewport height, like 99%, so that it will expand to fill the available height.

Unfortunately I couldn't figure out how to get my CSS to have any effect on #iubenda-iframe or anything within it.

So I ended up using a callback to set inline style on the element via JavaScript instead:

  callback: {
    onCookiePolicyShown: function() {
      iframe = document.querySelector('#iubenda-iframe #iubenda-iframe-popup')
      iframe['style'] = 'height: 99% !important; max-height: 900px !important;'
    },
  }, 

Now the modal window expands to fill the height of the viewport, and you can easily see all categories — even if we were using all 5 categories:

Ideal solution

The options above were just workarounds. It would be nice to have an official built-in support for getting it to show all options on screen without needing to scroll.

One solution would be to add a new property to the API which would make setting the height to something other than the default as easy as this:  

per_purpose_modal: {
  height: '99%' // or '650px' or whatever
}

per_purpose_modal: {
  styles: "height: 99% !important; max-height: 900px !important;"
}