:root {
margin-left: 0 !important;
margin-right: 0 !important;
}
.table thead th {
text-transform: none;
}
.required-label::before {
content: "*";
color: red;
margin-right: 5px;
}
.min-w-0 {
min-width: 0 !important;
}
/* select2 默认按初始化时源 select 元素的渲染宽度写死一个 px 值，
缩小窗口后不会跟着收缩，导致内容溢出；这里兜底限制不超过父容器宽度 */
.select2-container {
max-width: 100%;
}
/* select2 默认主题的选择框高度写死 28px（内部 line-height 也是写死的），
比 Tabler 的 .form-control 矮一截——大多数表单里每个字段各占一行看不
出来，但只要跟别的输入框摆在同一行（比如产品详情页"BOM 明细"面板的
物料选择 + 单位用量）就会明显对不齐。这里改成跟 .form-control 同一套
高度公式（见 tabler.min.css 的 .form-control min-height），选择框、
内部文字、下拉箭头三处都要改，不然文字和箭头没法跟着新高度居中 */
.select2-container--default .select2-selection--single {
height: calc(1.25rem + 1.125rem + calc(var(--tblr-border-width) * 2));
/* __clear 用 top:50% + translateY(-50%) 定位，需要这里是定位祖先 */
position: relative;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
line-height: calc(1.25rem + 1.125rem);
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
height: calc(1.25rem + 1.125rem + calc(var(--tblr-border-width) * 2));
}
/* allowClear 的清除按钮（"×"）默认是 float:right 贴在选择框顶部，靠自己
height 跟 line-height 相等来撑出"看起来居中"的效果——choice 框变高之后
这个假居中就对不上了。改用绝对定位 + translateY(-50%) 直接按选择框的
实际高度取中点，不管选择框多高都不会跑偏（下拉箭头本来就是这么定位的） */
.select2-container--default .select2-selection--single .select2-selection__clear {
position: absolute;
top: 50%;
right: 20px;
float: none;
height: auto;
line-height: normal;
margin-right: 0;
transform: translateY(-50%);
}
/* 多选框（比如排产表单的"人员"）用的是 select2-selection--multiple，
跟单选框是完全不同的一套 DOM/CSS class，上面对 --single 的高度改动
套不到它头上——默认 min-height 只有 32px，比 .form-control 矮，跟同一行
的其它输入框、提交按钮对不齐。
前两次改法都往 display/flex 上动了手（外层 flex 居中、或者连内层的
select2-selection__rendered 也一起接管），结果都出了问题——尤其是内层
一旦被强制 display:flex，会打乱 select2 自己对搜索框（打字过滤用的
，插入位置是它自己 JS 算好挂进 DOM 的）的定位逻辑。这次完全不碰
display/flex，只用 select2 原生就在用的"padding 撑间距"这套机制：
选中项自带 margin-top:5px，容器原生带 padding-bottom:5px，一高一矮基本
对称，只是这套间距是按原来固定 32px 设计的。改高 min-height 之后，
只需要把多出来的高度，用同样的 padding-top 补在上面，让新增的空间
一半在顶一半在底，不改变 select2 原有的排布方式，风险最低 */
.select2-container--default .select2-selection--multiple {
min-height: calc(1.25rem + 1.125rem + calc(var(--tblr-border-width) * 2));
padding-top: 4px;
}
/* tabler.min.css 里 .steps 这个类名被定义了两遍：一遍是横向 flex 进度条
（订单详情页"订单进度"用的就是这个），另一遍是不相关的竖排时间线组件，
后者的 border-left/margin-left/padding-left 都覆盖到了前者头上——横向
进度条左边多出一根没意义的竖线，还只在左边多出 1rem 外边距 + 2rem 内
边距、右边没有，窄屏下尤其明显（可用宽度小，这块固定偏移占比更大），
看着就是左右留白不对称。这里把这几个属性都清掉 */
.steps {
border-left: none;
margin-left: 0;
padding-left: 0;
}
.navbar-brand-logo {
object-fit: contain;
}
.list-body-row {
display: flex;
width: 100%;
gap: 1rem;
min-width: 0;
}
.list-main-col {
flex: 1 1 auto;
min-width: 0;
}
.filter-sidebar-col {
width: 220px;
flex-shrink: 0;
}
.filter-lookup-option {
display: block;
}
/* 选中态那一项内部要左右排（标签 + 清除按钮），单独用自己的类设置 display，
不用 Bootstrap 的 d-flex（带 !important，narrow 断点下会盖掉下面的
inline-flex，导致选中项撑满一整行、把其它选项挤到下一行错位） */
.filter-lookup-option-active {
display: flex;
}
/* 窄屏下筛选栏跟列表并排会挤压表格，改成上下堆叠，筛选栏占满宽度 */
@media (max-width: 991.98px) {
.list-body-row {
flex-direction: column;
}
.filter-sidebar-col {
width: 100%;
/* DOM 里筛选栏在表格后面，竖排堆叠时默认会排在表格下面；
用 order 只调视觉顺序、不用改 DOM，让筛选栏排到表格上面 */
order: -1;
}
/* 筛选栏占满宽度后横向空间足够，选项从竖排列表改成横向流式排列，
避免选项一个个往下堆、把页面撑得很高 */
.filter-lookup-options {
display: flex;
flex-wrap: wrap;
gap: 0.375rem;
}
.filter-lookup-option,
.filter-lookup-option-active {
display: inline-flex;
width: auto;
}
}
/* 列表页操作图标：原来紧挨在一起、点击区域只有图标本身大小，容易误触。
这里放大点击区域并拉开间距，删除用红色跟查看/编辑区分开 */
.row-actions {
display: inline-flex;
align-items: center;
gap: 0.25rem;
}
.row-action-btn,
.row-action-btn:hover {
display: inline-flex;
align-items: center;
justify-content: center;
width: 2rem;
height: 2rem;
border-radius: 6px;
font-size: 1rem;
text-decoration: none;
}
.row-action-btn-view {
background: rgba(var(--tblr-primary-rgb), 0.1);
color: var(--tblr-primary);
}
.row-action-btn-view:hover {
background: var(--tblr-primary);
color: #fff;
}
.row-action-btn-edit {
background: rgba(var(--tblr-warning-rgb), 0.15);
color: var(--tblr-warning);
}
.row-action-btn-edit:hover {
background: var(--tblr-warning);
color: #fff;
}
.row-action-btn-danger {
background: rgba(var(--tblr-danger-rgb), 0.1);
color: rgba(var(--tblr-danger-rgb), 0.6);
}
.row-action-btn-danger:hover {
background: var(--tblr-danger);
color: #fff;
}
.admin-toast {
width: auto;
}
.filter-form {
gap: 8px;
}
.filter-form-actions {
gap: 8px;
}
/* 折叠状态下（窄屏）让菜单展开按钮始终固定在右侧、垂直居中。
展开的菜单用绝对定位挂在按钮所在行下方，脱离文档流，
不会撑高按钮所在的这一行，按钮/logo 的位置和高度
不会因为菜单展开收起而跟着变化或位移。 */
@media (max-width: 991.98px) {
.navbar-vertical .container-fluid {
position: relative;
flex-wrap: wrap;
align-items: center;
}
.navbar-vertical #navbar-menu {
display: flex;
align-items: center;
flex: 1 1 auto;
}
.navbar-vertical #navbar-menu .navbar-toggler {
margin-left: auto;
align-self: center;
}
.navbar-vertical #navbar-menu .navbar-collapse {
position: absolute;
top: 100%;
right: 0;
left: auto;
width: max-content;
min-width: 220px;
max-width: min(90vw, 360px);
z-index: 1030;
background: var(--tblr-navbar-bg, #1a2234);
max-height: calc(100vh - 100%);
overflow-y: auto;
}
}
/* 隐藏侧边菜单栏的滚动条，保留滚动功能 */
.navbar-vertical {
scrollbar-width: none;
-ms-overflow-style: none;
}
.navbar-vertical::-webkit-scrollbar {
display: none;
}
/* 二级菜单（分类）用 Bootstrap Collapse 实现折叠/展开，
始终在正常文档流内变化高度，不会被定位成浮层撑宽菜单、挤动一级菜单。 */
.navbar-vertical .category-collapse-caret {
font-size: 0.7rem;
color: var(--tblr-nav-link-color, inherit);
transition: transform 0.2s ease;
}
.navbar-vertical [aria-expanded="true"] .category-collapse-caret {
transform: rotate(180deg);
}
/* 宽屏（>=992px）下侧边栏收起为纯图标模式的折叠按钮，状态记忆在 localStorage。
折叠按钮与 logo 同排显示，避免单独占一行。
固定行高：折叠后 logo 整行隐藏，避免这一行变矮导致下方菜单跟着上下位移。
width:100% 只在宽屏（container-fluid 纵向排列）时需要，窄屏下 container-fluid
是横向 flex-wrap 布局，让这一行占满宽度会把 navbar-toggler 挤到第二行去。 */
.navbar-vertical .navbar-brand-row {
min-height: 3.5rem;
padding-left: 0.75rem;
padding-right: 0.75rem;
}
@media (min-width: 992px) {
.navbar-vertical .navbar-brand-row {
width: 100%;
}
}
.navbar-vertical .navbar-brand-row .navbar-brand {
min-width: 0;
justify-content: flex-start;
}
.navbar-vertical .navbar-brand-title {
margin: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
/* navbar-brand-title 外层的 是裸标签、没挂 .navbar-brand 类（那个类在
它外面的