[BUG] Dropdown is clipped by kirby-card

[x] I have written a good issue

Describe the bug

I have an Angular app in which I have placed a kirby-dropdown inside a kirby-card. I do not use any outer kirby components. Viewing the page in a desktop browser (Chrome on Windows), when I click the dropdown in the browser to expand it, the dropdown is not shown fully, but is clipped by the confines of the kirby-card.

Describe how to reproduce the bug

Create an Angular component with this html:

<h1>Opret risiko</h1>
<kirby-card [hasPadding]="true">
<form [formGroup]="form">

    <div class="form-field">
        <p class="dropdown-label kirby-text-small-light">Juridisk enhed</p>
        <kirby-dropdown
            formControlName="juridiskEnhed"
            placeholder="Angiv juridisk enhed"
            [items]="['JB', 'JR', 'JF', 'JI', 'Koncern']"
        ></kirby-dropdown>
    </div>

</form>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
</kirby-card>
<button kirby-button (click)="save()">Gem</button>
<button kirby-button (click)="cancel()">Annuller</button>

View in desktop browser
Click the dropdown
See error: The dropdown is clipped by the kirby-card

Which Kirby version was used?

7.2.1

What was the expected behavior?

The dropdown should be fully visible, being displayed in front of the kirby card and extending past it.

Add any screenshots

Please complete the following information:

OS: Windows
Browser: Chrome
Browser version 107.0.5304.63 (64 bit)

Are there any additional context?

Checklist:

The following tasks should be carried out in sequence in order to follow the process of contributing correctly.

Verification

To make sure the bug is not intended behaviour; it should be verified by a member of team Kirby before moving on to implementation.

[ ] Make sure the NOT verified label has been removed by a member of team Kirby; do not proceed until this is done

Implementation

The contributor who wants to implement this issue should:

[ ] Make sure you have read: "Before you get coding".
[ ] Signal to others you are working on the issue by assigning yourself.
[ ] Create a branch from the develop branch following our branch naming convention.
[ ] Create a test that reproduces the bug following guidelines in: "The good: Test".
[ ] Write code to fix the bug

Review

Once the issue has been implemented and is ready for review:

[ ] Do a self-review.
[ ] Create a pull-request.

kirbydesign / designsystem