如何使用带有条纹元素的引导浮动标签？

我想知道如何使用浮动标签设置条纹元素的样式（bootstrap 5）。我的所有其他字段都采用这种方式设计，因此最好对信用卡输入和 cvv 输入进行设计，以匹配我网站的主题。我尝试过使用以下答案：如何使用 Bootstrap 设置 Stripe Elements 输入的样式？ https://stackoverflow.com/questions/46039315/how-can-i-style-a-stripe-elements-input-with-bootstrap，但它们似乎不能很好地转化为浮动字段。问题是字段无法识别何时选择字段，因此浮动动画永远不会发生。这是我尝试专门用于该元素的代码：

<div class="form-floating">
    <label for="card-number" class="form-label">Credit Card Number</label>
    <span id="card-number" class="form-control">
         <!-- Stripe Card Element -->
    </span>
</div>

有没有办法识别输入并强制动画发生？

顺便说一句，如果有人想知道我正在使用完全自定义的结帐页面，而我只是使用 stripe 作为信用卡信息：它使用 stripe 验证付款信息，返回发送到我的服务器后端的令牌，并且使用令牌在后端创建付款。这就是为什么我更喜欢使用样式表单，因为它更适合我的流程和主题。