Bootstrap 5.3+ 聚焦边框由 :focus-visible 和 box-shadow 控制，非 :focus 和 border-color；需覆盖 CSS 变量 --bs-form-control-focus-box-shadow 并确保样式加载顺序及层级，兼顾可访问性。
改不生效，大概率是因为你只动了 border-color，而 Bootstrap 5.3+ 的聚焦边框实际由 box-shadow 控制，:focus-visible 才是真正触发它的伪类。
为什么 .form-control:focus 写了颜色却没反应
Bootstrap 5.3+ 默认用 :focus-visible 替代 :focus 做键盘导航焦点样式，浏览器会忽略纯 :focus 规则；即使你写了 .form-control:focus { border-color: red }，键盘 Tab 过去时也完全不生效。
- 必须写
.form-control:focus-visible，且加!important—— Bootstrap 原生规则带!important，不加会被覆盖 -
border-color在默认box-shadow下几乎不可见：阴影的视觉权重远高于 1px 边框，尤其在浅色背景上 - 深色背景上
rgba(13, 110, 253, 0.25)看起来像灰，不是颜色错，是 alpha 太低或主色饱和度不够
怎么安全地统一改所有表单控件的聚焦边框
直接覆盖 CSS 变量比写一堆选择器更可靠，--bs-form-control-focus-box-shadow 控制 .form-control、.form-select、.form-check-input 的聚焦阴影，一改全改，不漏项。
- 把自定义 CSS 放在 Bootstrap 主样式之后（比如
标签末尾，或块底部） - 示例：
:root { --bs-form-control-focus-box-shadow: 0 0 0 0.25rem rgba(106, 90, 205, 0.25); } - 配套可选改
--bs-form-control-focus-border-color，但仅当禁用了box-shadow后才起作用
navbar 里搜索框聚焦边框被裁掉或看不见
导航栏默认有 overflow: hidden，会直接切掉 box-shadow 外扩部分；同时 z-index 层叠也可能遮挡阴影，导致你调了色却看不到光晕。
- 给搜索框加
position: relative和z-index: 2（或更高） - 必须用带上下文的选择器重写，比如
.navbar .form-control:focus-visible，否则权重不够 - 别只写
border-color：在 navbar-light 或 navbar-dark 里，它根本不参与聚焦反馈 - 暗色导航栏建议显式指定高对比色，例如
rgba(100, 200, 255, 0.3)，别依赖$primary
移除聚焦边框后键盘用户就“失焦”了怎么办
直接写 outline: none 或 box-shadow: none 会彻底抹掉键盘导航用户的焦点指示，违反 WCAG。这不是“美化”，是功能降级。
- 保留
outline: 0（不是none），再叠加box-shadow或高对比border-color - 真要隐藏原生 outline，至少留 fallback：
outline: 2px solid transparent; outline-offset: 2px - 验证方式很简单：用 Tab 键遍历表单，看每个字段获得焦点时是否有明确、一致、足够对比度的视觉提示
