Sheet Modal Toolbar Overlapping Keypad Buttons in Framework7 v9

[WhistleMaster]

Framework7: v9.0.1
framework7-plugin-keypad: v7.0.0
Platform: iOS (iOS 26 looking glass theme)

When using the keypad plugin with openIn: 'sheet' mode in Framework7 v9, the toolbar (containing custom left/right content) overlaps with the keypad buttons instead of sitting above them. Specifically, the toolbar buttons appear positioned over the top row of keypad numbers (buttons 1, 2, and 3). Expected Behavior: The sheet modal toolbar should be positioned at the top of the sheet, with the keypad buttons displayed below it without any overlap. Actual Behavior: The toolbar renders on top of the keypad buttons, making both the toolbar and the affected keypad buttons unusable. The toolbar appears to be absolutely positioned over the keypad-buttons container rather than being part of the layout flow.

Steps to Reproduce:

1. Install Framework7 v9.0.1 and framework7-plugin-keypad v7.0.0
2. Create a keypad with sheet modal:

app.keypad.create({
  inputEl: '#numpad',
  openIn: 'sheet',
  closeByOutsideClick: false,
  formatValue: function (value) {
    return Number(value).toFixed(2);
  },
  buttons: [
    { html: '<span class="keypad-button-number">1</span>', value: 1 },
    { html: '<span class="keypad-button-number">2</span>', value: 2 },
    { html: '<span class="keypad-button-number">3</span>', value: 3 },
    // ... more buttons
  ],
  on: {
    keypadChange: function (keypad, value) {
      // Custom toolbar content update
      $('.toolbar-inner .right .popover-close').html(
        '<span class="text-color-yellow"><strong>Pay USD ' + value + '</strong></span>'
      );
    }
  }
}).open();

// Set custom toolbar content
$('.toolbar-inner .left').html('<span class="text-color-yellow">TEST</span>');
$('.toolbar-inner .right .popover-close').html('<span class="text-color-yellow">Close</span>');

3. Open the keypad
4. Observe toolbar overlapping keypad buttons 1, 2, and 3