安装flowbite-react后React应用输入框聚焦出现蓝色轮廓求助

我在React项目中安装flowbite-react后，所有输入框在聚焦状态下都会显示蓝色轮廓，尝试添加自定义样式也无法彻底移除。已按要求完成TailwindCSS的插件配置与相关设置，安装流程无异常。

排查发现 #

通过浏览器元素检查工具定位到问题根源是--tw-ring-color这个CSS变量（对应元素样式中的环形高亮配置）。

尝试过的无效方法 #

在index.css中添加全局样式，仅能缩小轮廓但无法完全消除：

* {
    --tw-ring-color: rgb(0 0 0 / 0) !important;
}

可行解决方案 #

• 针对Flowbite组件的包装器，使用Kyle Xyian Dilbeck提供的方案有效：为组件添加内联Tailwind类 focus:border-transparent，或者自定义边框颜色，即可移除蓝色轮廓。
• 注意：直接使用ring系列的内联类无法移除该轮廓，需使用上述border相关的类来覆盖样式。

内容的提问来源于stack exchange，提问作者Stinny