Legend not formatted like an label in a vertical form

[mimmi20]

Prerequisites

• [X] I have searched for duplicate or closed issues
• [X] I have validated any HTML to avoid common problems
• [X] I have read the contributing guidelines

Describe the issue

On the layout page is an description, how to use fieldsets with a legend for Radios or Multiple Checkboxes in an Horizontal form.

I tried to use a fieldset with a legend in an vertical form and with floating labels, and the legend was not formatted like the labels. On my screen the legend is also larger than the labels.

Reduced test cases

https://codepen.io/mimmi20/pen/rNRNOLE - without floating labels https://codepen.io/mimmi20/pen/dyryYXp - with floating labels

What operating system(s) are you seeing the problem on?

Windows

What browser(s) are you seeing the problem on?

Opera

What version of Bootstrap are you using?

5.3.2

[vipinnation]

I want to work on this issue

[mimmi20]

These are the fixes I made in my project:

/* copied from the reset rules for label */
legend.form-label, legend.card-title {
    display: inline-block;
    font-family: var(--bs-body-font-family);
    font-size: var(--bs-body-font-size);
    font-weight: var(--bs-body-font-weight);
    line-height: var(--bs-body-line-height);
}

/* just copied from the rule `.form-floating > label.form-label` */
.form-floating > legend.form-label {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    height: 100%;
    padding: 1rem 0.75rem;
    overflow: hidden;
    text-align: start;
    text-overflow: ellipsis;
    white-space: nowrap;
    pointer-events: none;
    border: var(--bs-border-width) solid transparent;
    transform-origin: 0 0;
    transition: opacity .1s ease-in-out, transform .1s ease-in-out;

    color: rgba(var(--bs-body-color-rgb), .65);
    transform: scale(.85) translateY(-0.5rem) translateX(0.15rem);
}