/* ========== 后台管理专属样式（与前台视觉语言保持一致） ========== */
.admin-table{
    width:100%;
    border-collapse:collapse;
    background:#fff;
}
.admin-table th,
.admin-table td{
    padding:12px 14px;
    border-bottom:1px solid #e4e9f2;
    text-align:left;
    font-size:14px;
    vertical-align:middle;
}
.admin-table th{
    background:#fafafa;
    font-weight:600;
    color:#1f2121;
    white-space:nowrap;
}
.admin-table tbody tr:hover td{
    background:#fafcff;
}
.admin-table .col-id{
    width:90px;
    color:#888;
    font-variant-numeric:tabular-nums;
}
.admin-table .col-uid{
    color:#1f2121;
}
.admin-table .col-op{
    width:250px;                 /* 操作列：条码录入 + 编辑 + 删除 三个按钮 */
    white-space:nowrap;
    text-align:right;
}
.op-btn{
    border:none;
    background:transparent;
    cursor:pointer;
    color:#007f3a;
    font-size:13px;
    padding:5px 10px;
    border-radius:8px;
    transition:background 0.15s;
}
.op-btn:hover{ background:#e9f6ee; }   /* 浅绿悬停底（原浅蓝 #eef3fb） */
.op-btn.danger{ color:#d23f3f; }
.op-btn.danger:hover{ background:#fdeaea; }

.list-card{
    background:#fff;
    border-radius:16px;
    padding:16px;
}
.empty-tip{
    text-align:center;
    color:#999;
    padding:40px 0;
    font-size:14px;
}
.admin-alert{
    border-radius:12px;
    padding:10px 14px;
    margin-bottom:12px;
    font-size:14px;
}
.admin-alert.success{ background:#f0fcf4; color:#1f7a36; border:1px solid #cdeed4; }
.admin-alert.error{ background:#fdeaea; color:#b22; border:1px solid #f3cccc; }

.header-actions .btn-add{
    background:#007f3a;
    color:#fff;
    border:none;
    border-radius:24px;
    padding:8px 18px;
    font-size:14px;
    display:inline-flex;
    align-items:center;
    gap:6px;
    transition:background 0.2s;
}
.header-actions .btn-add:hover{ background:#e6f4ec; }   /* 顶栏已反白为白底绿字，悬停用极浅绿 */

/* 顶栏占位按钮：只占宽度、不显示不响应点击。
   作用：admin.php 顶栏只有「新增电池型号」一个按钮，用一个与编辑页「返回列表」
   等宽的占位块把按钮向左推，使其右边缘与 battery_edit.php 的「新增版本号」对齐。 */
.header-actions .btn-add-ghost{
    visibility:hidden;
    pointer-events:none;
    user-select:none;
}

/* 弹窗内表单与按钮沿用蓝调 */
.modal-title{ color:#007f3a; font-weight:600; }
.form-label{ color:#1f2121; font-weight:500; }
.btn-primary{ background:#007f3a; border-color:#007f3a; }
.btn-primary:hover{ background:#00632e; border-color:#00632e; }

/* ========== 编辑页表单（battery_edit.php） ========== */
.btn-add{ text-decoration:none; }          /* 返回列表按钮为 <a>，去掉下划线 */
a.op-btn{ text-decoration:none; display:inline-block; }  /* 列表「编辑」为链接 */

.form-card{
    background:#fff;
    border-radius:16px;
    padding:20px;
}
.field{
    margin-bottom:16px;
}
.field-label{
    display:block;
    color:#1f2121;
    font-weight:500;
    margin-bottom:6px;
}
.field-hint{
    color:#999;
    font-weight:400;
    font-size:12px;
}
/* 双语录入：中文值输入框下方的「英文值」行（左侧带 EN 小标签） */
.field-en{
    display:flex;
    align-items:center;
    gap:8px;
}
.field-en > :not(.field-en-tag){
    flex:1;
    min-width:0;
}
.field-en-tag{
    flex:none;
    display:inline-block;
    min-width:30px;
    text-align:center;
    font-size:11px;
    font-weight:600;
    letter-spacing:.5px;
    color:#007f3a;
    background:#e6f4ec;
    border:1px solid #cfe8da;
    border-radius:10px;
    padding:2px 6px;
}
.field-value{
    color:#333;
    background:#fafafa;
    border-radius:10px;
    padding:9px 12px;
    min-height:38px;
    line-height:20px;
}
.field-value.mono{
    font-family:"Consolas","Courier New",monospace;
    letter-spacing:1px;
    color:#666;
}
/* 字段行：按字段宽度（1 / 1/2 / 1/3 / 1/4 / 1/5）自动换行排布 */
.field-row{
    display:flex;
    flex-wrap:wrap;
    margin:0 -8px;
}
.field-row > .field{
    flex:0 0 auto;
    box-sizing:border-box;
    width:50%;                 /* 默认 1/2 行 */
    padding-left:8px;
    padding-right:8px;
}
.field-row > .field.fw-1{ width:100%; }
.field-row > .field.fw-1_2{ width:50%; }
.field-row > .field.fw-1_3{ width:33.3333%; }
.field-row > .field.fw-1_4{ width:25%; }
.field-row > .field.fw-1_5{ width:20%; }
.form-actions{
    margin-top:22px;
    display:flex;
    gap:10px;
}
/* .form-subtitle 已废弃：编辑页标题体系统一由「分组管理」的分组标题承担 */
.form-actions-center{
    text-align:center;
    margin-top:16px;
}
/* 表单聚焦环统一改绿（原为蓝边框 #8fb0e8 + 蓝阴影 rgba(22,65,148,.15)，bootstrap 默认也是蓝环） */
.form-card .form-control:focus,
.form-control:focus,
.form-select:focus{
    border-color:#8fcfa9;
    box-shadow:0 0 0 .2rem rgba(0,127,58,.18);
}
@media (max-width:560px){
    /* 窄屏一律整行，避免挤在一起 */
    .field-row > .field,
    .field-row > .field.fw-1,
    .field-row > .field.fw-1_2,
    .field-row > .field.fw-1_3,
    .field-row > .field.fw-1_4,
    .field-row > .field.fw-1_5{ width:100%; }
}

/* ========== 字段管理弹窗 ========== */
.fm-top{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    margin-bottom:12px;
}
.fm-top .btn-add{
    background:#007f3a;
    color:#fff;
    border:none;
    border-radius:24px;
    padding:6px 14px;
    font-size:13px;
    display:inline-flex;
    align-items:center;
    gap:6px;
    white-space:nowrap;
}
.fm-top .btn-add:hover{ background:#00632e; }
#fieldsModal .modal-body{
    max-height:84vh;
    overflow-y:auto;
}
.fm-table{
    width:100%;
    border-collapse:collapse;
}
.fm-table th,
.fm-table td{
    padding:8px 10px;
    border-bottom:1px solid #e4e9f2;
    font-size:13px;
    text-align:left;
    vertical-align:middle;
}
.fm-table th{
    background:#fafafa;
    color:#1f2121;
    font-weight:600;
    white-space:nowrap;
}
.fm-table td.mono{
    font-family:"Consolas","Courier New",monospace;
    color:#666;
    white-space:nowrap;
}
.fm-table .fm-num{ width:56px; color:#888; text-align:center; }
.fm-table .fm-hint{
    color:#999;
    max-width:150px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.fm-table .fm-op{
    width:130px;
    white-space:nowrap;
    text-align:right;
}
.fm-row{
    display:flex;
    gap:12px;
}
.fm-row > div{ flex:1; min-width:0; }
/* 字段设置：是/否开关改为勾选框 */
.fm-check{ display:inline-flex; align-items:center; gap:6px; margin-top:5px; font-weight:500; font-size:14px; color:#1f2121; cursor:pointer; }
.fm-check input[type="checkbox"]{ width:18px; height:18px; cursor:pointer; accent-color:#c9cfd8; }
.fm-check input:disabled{ cursor:not-allowed; }
@media (max-width:560px){
    .fm-row{ flex-direction:column; gap:0; }
}
/* 字段管理弹窗：分区卡片 */
.fm-section{ background:#fff; border:1px solid #e7ecf3; border-radius:10px; padding:14px 16px; margin-bottom:14px; }
.fm-section-title{ font-size:13px; font-weight:700; color:#2563eb; letter-spacing:.3px; margin-bottom:10px; padding-left:9px; border-left:3px solid #2563eb; line-height:1.2; }
.fm-section .field-hint{ color:#8a97ab; font-size:12px; }

/* ---- 字段管理：批量设置条 ---- */
.fm-batch{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px;
    margin-bottom:10px;
    padding:8px 12px;
    background:#fafafa;
    border:1px solid #e4e9f2;
    border-radius:8px;
}
.fm-batch-title{
    color:#1f2121;
    font-weight:600;
    font-size:13px;
    white-space:nowrap;
}
.fm-batch-sel{
    color:#666;
    font-size:13px;
    white-space:nowrap;
}
.fm-batch-sel b{ color:#007f3a; }
.fm-batch-input{
    width:auto;
    min-width:150px;
    height:32px;
    padding:2px 8px;
    font-size:13px;
}
.fm-batch .btn-add{
    background:#007f3a;
    color:#fff;
    border:none;
    border-radius:24px;
    padding:5px 14px;
    font-size:13px;
    display:inline-flex;
    align-items:center;
    gap:6px;
    white-space:nowrap;
}
.fm-batch .btn-add:hover{ background:#00632e; }
@media (max-width:560px){
    .fm-batch-input{ width:100%; min-width:0; }
}
/* 勾选列：窄列 + 居中，避免挤占字段名 */
.fm-table th.fm-check,
.fm-table td.fm-check{
    width:36px;
    text-align:center;
    padding-left:4px;
    padding-right:4px;
}
.fm-table .fm-check input{
    width:15px;
    height:15px;
    cursor:pointer;
    margin:0;
    vertical-align:middle;
}

/* ========== 顶部双按钮 / 版本号标签 ========== */
.header-actions{
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
}
/* 固定顶栏内的「登录 / 语言」按钮组：始终横向并排，避免窄屏下与可信徽标挤成竖排 */
.ha-buttons{
    display:flex;
    align-items:center;
    gap:8px;
}
.chips{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
}
.chip{
    background:#eaf6ef;
    color:#007f3a;
    border-radius:12px;
    padding:2px 10px;
    font-size:12px;
}

/* ========== 版本管理弹窗 ========== */
.vm-list{
    display:flex;
    flex-direction:column;
    gap:8px;
}
.vm-item{
    display:flex;
    align-items:center;
    gap:12px;
    padding:10px 14px;
    background:#fafcff;
    border:1px solid #e4e9f2;
    border-radius:8px;
}
.vm-name{
    font-weight:600;
    font-size:15px;
    color:#1f2121;
    min-width:120px;
}
.vm-name .sys-tag{
    margin-left:6px;
    font-size:11px;
}
.vm-bc{
    font-size:13px;
    color:#6b7686;
}
.vm-item .op-btn.danger{
    margin-left:auto;
}
.vm-lock{
    margin-left:auto;
    font-size:12px;
    color:#a0a8b5;
    display:inline-flex;
    align-items:center;
    gap:4px;
}
.vm-sep{
    margin:20px 0 16px;
    border:0;
    border-top:1px solid #e4e9f2;
}
.vm-add-form .btn-primary{
    min-width:120px;
}
/* 版本列表上的「字段 N 个」标记（后台主色为绿，不要用蓝） */
.vm-vf{
    font-size:12px;
    color:#6b7686;
    background:#f4f6f8;
    border:1px solid #e5e8ec;
    border-radius:10px;
    padding:2px 9px;
    white-space:nowrap;
}
.vm-vf.is-set{
    color:#007f3a;
    background:#eaf6ef;
    border-color:#cfe8da;
}

/* ========== 版本字段勾选视图 ========== */
.vf-top{
    border:1px solid #e4e9f2;
    background:#fafcff;
    border-radius:10px;
    padding:12px 14px;
    margin-bottom:14px;
}
.vf-top-line{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}
.vf-top-title{ font-size:14px; font-weight:500; color:#1f2121; }
.vf-top-title b{ color:#007f3a; }
.vf-top-sel{ font-size:13px; color:#6b7686; }
.vf-top-sel b{ color:#007f3a; font-size:15px; }
.vf-top-actions{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:10px;
}
.vf-groups{
    display:flex;
    flex-direction:column;
    gap:12px;
    /* 滚动交给弹窗 modal-body（modal-dialog-scrollable），此处不再单独限高，
       避免内层裁剪造成字段内容被遮挡 */
    padding-right:4px;
}
.vf-group{
    border:1px solid #e4e9f2;
    border-radius:10px;
    overflow:hidden;
}
.vf-group-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:8px 12px;
    background:#f4f8f5;
    border-bottom:1px solid #e6efe9;
}
.vf-group-label{
    display:inline-flex;
    align-items:center;
    gap:7px;
    font-size:13px;
    font-weight:500;
    color:#1f2121;
    cursor:pointer;
    margin:0;
}
.vf-group-label input{ cursor:pointer; margin:0; }
.vf-items{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:2px 10px;
    padding:10px 12px;
}
.vf-item{
    display:flex;
    align-items:center;
    gap:7px;
    font-size:13px;
    color:#37404d;
    padding:4px 6px;
    border-radius:6px;
    cursor:pointer;
    margin:0;
    min-width:0;
}
.vf-item:hover{ background:#f4f8f5; }
.vf-item input{ cursor:pointer; margin:0; flex:none; }
.vf-item-label{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.vf-item-key{
    font-size:11px;
    color:#9aa3b0;
    margin-left:auto;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    max-width:110px;
}
.vf-foot{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
    margin-top:14px;
    padding-top:14px;
    border-top:1px solid #e4e9f2;
}
@media (max-width:900px){
    .vf-items{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
/* 版本字段勾选：按页面分段（护照数据页 / 条码录入页），两段各有一套全选/清空
   （弹窗已改为 modal-dialog-scrollable，整页统一滚动，分段不再单独限高） */
.vf-sec{ margin-bottom:18px; }
.vf-sec:last-of-type{ margin-bottom:0; }
.vf-sec-head{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
    padding:8px 12px;
    margin-bottom:10px;
    border-radius:10px;
    background:#eaf6ef;
    border:1px solid #cfe8da;
}
.vf-sec-title{
    display:inline-flex;
    align-items:center;
    gap:7px;
    font-size:13.5px;
    font-weight:600;
    color:#1f2121;
}
.vf-sec-title i{ color:#007f3a; font-size:15px; }
.vf-sec-hint{ font-size:12.5px; color:#6b7686; }
.vf-sec-hint b{ color:#007f3a; font-size:13px; }
.vf-sec-acts{ display:flex; gap:8px; margin-left:auto; }
/* 编辑表单顶部：本版本有字段被隐藏时的提示 */
.vf-notice{
    margin:0 0 16px;
    padding:10px 14px;
    background:#f4f8f5;
    border:1px solid #e2ece6;
    border-radius:10px;
    font-size:13px;
    color:#4b5563;
    line-height:1.7;
}
.vf-notice i{ color:#007f3a; margin-right:6px; }
.vf-notice b{ color:#1f2121; }

/* ========== 分组管理弹窗 + 编辑页分组分区 ========== */
#groupsModal .modal-body{
    max-height:66vh;
    overflow-y:auto;
}
/* 编辑页里按分组显示的小标题（左侧蓝色竖条） */
.field-group-title{
    display:flex;
    align-items:center;
    gap:6px;
    margin:22px 0 12px;
    padding-left:10px;
    border-left:3px solid #007f3a;
    color:#007f3a;
    font-weight:600;
    font-size:14px;
}
/* 未分组分区标题：统一排在表单最下方，用灰色虚线条区分于正式分组 */
.field-group-title .field-group-title-none{
    color:#8a94a6;
    font-weight:600;
}
.field-group-title:has(.field-group-title-none){
    border-left:3px dashed #c8cfda;
}

/* ========== 系统固有字段（字段管理里的「系统」标记 / 锁定提示） ========== */
.fm-table .sys-tag{
    display:inline-block;
    margin-left:6px;
    padding:1px 6px;
    border-radius:10px;
    background:#eaf6ef;
    color:#007f3a;
    font-size:11px;
    vertical-align:middle;
}
.fm-table tr.fm-sys-row td{ background:#fbfcfe; }
/* 「有数据」标记：字段已有数据 → 不可删除、字段ID/类型不可改 */
.fm-table .data-tag{
    display:inline-block;
    margin-left:6px;
    padding:1px 6px;
    border-radius:10px;
    background:#fff4e5;
    color:#a15c00;
    font-size:11px;
    vertical-align:middle;
}
/* 被规范锁定的操作按钮（禁用态） */
.op-btn[disabled]{
    color:#bbb;
    cursor:not-allowed;
}
.op-btn[disabled]:hover{ background:transparent; }
/* 编辑「已有数据」字段时，字段ID / 字段类型 呈锁定观感 */
#fmFormView.fm-data-mode #fmKey,
#fmFormView.fm-data-mode #fmType{
    background:#f4f6fa;
    color:#8a97ab;
    cursor:not-allowed;
}
/* 字段管理列表的分组分隔行（列表按分组分段显示） */
.fm-table tr.fm-group-sep td{
    background:#eaf6ef;
    color:#007f3a;
    font-weight:600;
    font-size:12.5px;
    padding:6px 10px;
}
.fm-table tr.fm-group-sep i{ margin-right:4px; }
/* 型号数据编辑：按分组显示的组标题（录入表单 / 版本管理勾选区通用） */
.be-group-head{
    display:flex; align-items:center; gap:6px;
    margin:16px 0 8px; padding:5px 10px;
    border-left:4px solid #007f3a; background:#f1faf5;
    border-radius:4px; font-weight:600; color:#007f3a; font-size:13.5px;
}
.be-group-head .be-gh-en{ color:#8a97ab; font-weight:400; font-size:12px; }
.be-group-head i{ font-size:14px; }
/* ========== 字段编辑弹窗：按类型分组的区块标题（2026-10-28） ========== */
.fe-sec{
    display:flex; align-items:center; gap:6px;
    margin:14px 0 8px; padding:5px 10px;
    border-left:4px solid #007f3a; background:#f1faf5;
    border-radius:4px; font-weight:600; color:#007f3a; font-size:13.5px;
}
.fe-sec i{ font-size:14px; }
#fieldEditModal .modal-body .row:first-of-type{ margin-top:0; }
/* ========== 字段/分组管理：前台显示 + 管控 两列（2026-09-18） ========== */
.fm-table .fm-flag{
    width:84px;
    white-space:nowrap;
    text-align:center;
}
.fm-table td.fm-flag .badge-on,
.fm-table td.fm-flag .badge-off{ font-size:12.5px; white-space:nowrap; }
/* 「受控」标记（前台显示列里区分普通/受控字段） */
.fm-table .badge-ctl{
    display:inline-block;
    padding:1px 8px;
    border-radius:10px;
    background:#fff1f0;
    color:#c0392b;
    font-size:12px;
    font-weight:600;
    white-space:nowrap;
}
.sys-notice{
    background:#fafafa;
    border:1px solid #dce2ec;
    border-radius:10px;
    padding:10px 12px;
    margin-bottom:14px;
    color:#1f2121;
    font-size:13px;
    line-height:20px;
}
.sys-notice i{ color:#007f3a; margin-right:4px; }
#fmFormView.fm-sys-mode .form-label{ color:#8a97ab; }

/* ========== 后台主色覆盖：绿 #007f3a（仅后台生效，前台 index.php 仍为蓝 #164194） ========== */
/* 顶部圆角卡片：白底 → 绿底（style.css 里 .header-card 是白底，admin.css 后加载，此处覆盖）
   卡片转绿后内部元素必须反白，否则同色系会看不清 */
.header-card{ background:#007f3a; }
.logo{ color:#fff; }                              /* 原为前台蓝 #164194（style.css） */
.lang-select{ color:rgba(255,255,255,.85); }      /* 原为 #555 */
/* 卡片内的顶部按钮反白：白底 + 绿字，悬停用极浅绿（原深蓝 #0f2f6e 悬停已全部改绿） */
.header-actions .btn-add{ background:#fff; color:#007f3a; }
.header-actions .btn-add:hover{ background:#e6f4ec; }

/* ---------- 原生控件去蓝（2026-09-18）----------
   此前只改了 bootstrap 的 .form-control / .form-select 聚焦环，
   但下面两类控件的「选中/高亮色」是由浏览器（系统强调色）绘制的，
   CSS 里从未声明过，所以看起来仍是蓝色：
     1) 原生 <input type="checkbox">（字段管理批量的复选框 / 表头全选框）
     2) 原生 <select> 展开后的选项高亮
   统一改为主题绿。 */
input[type="checkbox"],
input[type="radio"],
input[type="range"],
progress,
select{
    accent-color:#007f3a;                    /* 勾中时：系统蓝 → 绿底白勾 */
}
select option{
    background:#fff;
    color:#1f2121;
}
/* 当前选中项：Chrome/Edge 会忽略 background-color 而直接画系统高亮色，
   必须用渐变覆盖才生效；option:hover 仅 Firefox 支持，Chrome 的悬停高亮由系统绘制、无法用 CSS 改 */
select option:checked,
select option:hover,
select option:focus{
    background:linear-gradient(#e9ecef,#e9ecef);
    color:#1f2121;
}

/* ========== 条码录入页（barcode_edit.php） ========== */
/* 顶部信息条：型号 / 版本号（多版本可切换）/ 记录数 */
.bc-head-card{ margin-bottom:12px; }
.bc-head{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:10px 26px;
}
.bc-head-item{
    display:flex;
    align-items:center;
    gap:8px;
    font-size:14px;
    color:#1f2121;
}
.bc-head-item .field-hint{ white-space:nowrap; }
.bc-ver-select{
    width:auto;
    min-width:120px;
    height:32px;
    padding:2px 8px;
    font-size:13px;
}
/* 新增条码时，尚未生成的系统字段（UID（14位码）/ ID / 创建时间）的占位观感 */
.field-value.bc-pending{
    color:#a6adba;
    font-style:italic;
    background:#fbfcfe;
}
@media (max-width:560px){
    .bc-head{ flex-direction:column; align-items:flex-start; gap:8px; }
}
/* 「系统」标记：条码列表的表头里也用（.fm-table 内已有同名规则，此处覆盖全域） */
.sys-tag{
    display:inline-block;
    margin-left:6px;
    padding:1px 6px;
    border-radius:10px;
    background:#eaf6ef;
    color:#007f3a;
    font-size:11px;
    font-weight:400;
    vertical-align:middle;
}

/* ---------- 下拉弹出层彻底去蓝：启用可定制下拉（base-select）----------
   原生 <select> 展开后的列表由浏览器自绘，鼠标划过/当前项的高亮用的是系统强调色（蓝），
   靠 option 的 background 覆盖不干净（Chrome 只认 background-color 以外的 hack）。
   Chrome/Edge 135+ 支持 appearance:base-select + ::picker(select)，可完全接管下拉外观。
   用 @supports 包住：不支持的浏览器（如 Firefox）自动回退到原生外观 + 上面的兜底规则，零副作用。
   注：下拉仍是原生 <select> 元素，表单提交、键盘操作、disabled 均不受影响。 */
@supports (appearance: base-select){
    select,
    .form-select,
    select.form-control,
    select::picker(select){
        appearance:base-select !important;   /* 覆盖任何 appearance:none，确保下拉可定制、去除系统蓝高亮 */
    }
    select::picker(select){
        margin-top:4px;
        padding:4px;
        border:1px solid #dce2ec;
        border-radius:10px;
        background:#fff;
        box-shadow:0 8px 24px rgba(0,0,0,.12);
    }
    select option{
        padding:7px 10px;
        border-radius:6px;
        background:#fff;
        color:#1f2121;
    }
    /* 悬停 / 聚焦 / 当前选中：一律浅灰底 + 深字，去掉系统蓝高亮 */
    select option:hover,
    select option:focus,
    select option:checked{
        background:#e9ecef;
        color:#1f2121;
    }
    select option::checkmark{
        color:#007f3a;                       /* 选中项的勾选标记 */
    }
    select::picker-icon{
        color:#007f3a;                       /* 触发按钮右侧的箭头 */
    }
    select:disabled{
        color:#8a97ab;                       /* 锁定态（字段管理里被禁用的下拉） */
    }
}

/* ========== 分组图标选择器（分组管理弹窗内，图标全部本地，不外链） ========== */
/* 分组名 / 分区标题前的小图标 */
.group-ic{ color:#007f3a; margin-right:6px; vertical-align:-1px; }
/* 图标选择网格 */
.icon-picker{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    max-height:248px;
    overflow:auto;
    border:1px solid #e4e9f2;
    border-radius:12px;
    padding:10px;
    background:#fafafa;
}
.icon-picker .ip-item{
    width:42px;
    height:42px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:20px;
    color:#1f2121;
    background:#fff;
    border:1px solid #e4e9f2;
    border-radius:10px;
    cursor:pointer;
    transition:all .12s ease;
}
.icon-picker .ip-item:hover{
    border-color:#007f3a;
    color:#007f3a;
    background:#e9f6ee;
}
.icon-picker .ip-item.selected{
    border-color:#007f3a;
    background:#007f3a;
    color:#fff;
    box-shadow:0 0 0 3px rgba(0,127,58,.18);
}
#gmIconPreview{ font-size:18px; color:#007f3a; vertical-align:-2px; margin-right:4px; }
#gmIconName{ font-family:"Consolas","Courier New",monospace; color:#1f2121; }

/* ========== 后台登陆页（RyderPass.html 登录视图） ==========
   版式：整屏灰底居中一张圆角卡片；绿色品牌头与表单同属一张卡片，
   不再有顶部独立的长条 header-card。 */
#loginView{
    position:fixed;
    inset:0;
    z-index:5;
    display:flex;
    align-items:center;
    justify-content:center;
    /* 整个登录控件上移：卡片是 .login-card{margin:auto} 在 flex 内容盒内居中，
       加大下方内边距会把内容盒中心抬高（多出 96px → 上移 48px）。
       不用 transform，避免小屏 overflow:auto 时出现滚动区域错位。 */
    padding:24px 16px 120px;
    background:#eff0f4;
    overflow:auto;
}
.login-card{
    width:100%;
    max-width:420px;
    margin:auto;
    background:#fff;
    border-radius:16px;
    box-shadow:0 12px 32px rgba(16,24,40,.10), 0 2px 6px rgba(16,24,40,.04);
    overflow:hidden;
}
.login-card-head{
    background:#007f3a;
    padding:22px 24px 20px;
}
.login-brand{
    font-size:30px;
    font-weight:800;
    line-height:1.15;
    letter-spacing:.5px;
    color:#fff;
}
.login-brand-sub{
    margin-top:5px;
    font-size:13px;
    color:rgba(255,255,255,.85);
    letter-spacing:.3px;
}
/* 登录页品牌区版本号：与「电池护照后台」同行显示，绿色胶囊徽标 */
.login-brand-ver{
    display:inline-block;
    margin-left:6px;
    padding:1px 9px;
    border-radius:24px;
    background:rgba(61,220,132,.16);
    border:1px solid rgba(61,220,132,.5);
    color:#eafff2;
    font-size:12px;
    letter-spacing:.02em;
    vertical-align:middle;
}
.login-card-body{ padding:22px 24px 24px; }
.login-box-head{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:20px;
}
.login-box-head > i{
    font-size:28px;
    line-height:1;
    color:#007f3a;
}
.login-box-title{ font-size:18px; font-weight:600; color:#1f2121; }
.login-box-sub{ font-size:12.5px; color:#8a94a6; margin-top:3px; }
.login-field{ margin-bottom:14px; }
.login-label{ display:block; font-size:13px; color:#4a5568; margin-bottom:6px; }
#loginView .form-control{ height:40px; padding:0 12px; }
.login-submit{
    width:100%;
    height:42px;
    margin-top:8px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    border:0;
    border-radius:8px;
    background:#007f3a;
    color:#fff;
    font-size:14px;
    font-weight:600;
    cursor:pointer;
    transition:background .2s;
}
.login-submit:hover{ background:#00672f; }
.login-submit:disabled{ opacity:.7; cursor:default; }
#loginMsg:empty, #loginErr:empty{ display:none; }
#loginMsg .admin-alert, #loginErr .admin-alert{ margin-bottom:14px; }

/* ========== 后台顶部导航 / 当前用户（admin.php 等） ========== */
/* 头部第二行：左侧导航 + 右侧当前用户 / 退出 */
.header-nav-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    flex-wrap:wrap;
    margin-top:14px;
}
.admin-nav{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
}
.admin-nav a{
    display:inline-flex;
    align-items:center;
    gap:6px;
    height:32px;
    padding:0 14px;
    border-radius:20px;
    background:rgba(255,255,255,.15);
    border:1px solid rgba(255,255,255,.75);
    color:#fff;
    font-size:13px;
    text-decoration:none;
    transition:background .2s;
}
.admin-nav a:hover{ background:rgba(255,255,255,.28); }
.admin-nav a.active{ background:#fff; color:#007f3a; }
.admin-user{
    display:inline-flex;
    align-items:center;
    gap:8px;
    color:rgba(255,255,255,.9);
    font-size:13px;
}
.admin-user .au-name{ font-weight:600; color:#fff; }
.admin-user a{ color:rgba(255,255,255,.9); text-decoration:underline; }

/* ========== 用户管理 / 角色管理列表 ========== */
.col-role{ white-space:nowrap; }
.badge-role{
    display:inline-block;
    padding:2px 10px;
    border-radius:12px;
    background:#eaf6ef;
    color:#007f3a;
    font-size:12px;
}
.badge-super{
    display:inline-block;
    margin-left:6px;
    padding:2px 8px;
    border-radius:12px;
    background:#007f3a;
    color:#fff;
    font-size:11px;
    vertical-align:1px;
}
.badge-on{ color:#007f3a; font-weight:600; }
.badge-off{ color:#8a94a6; }
.badge-req{ color:#c0392b; font-weight:600; }
.req-star{ color:#c0392b; font-weight:700; margin-left:2px; }

/* ========== 用户管理：账号状态 / 登录锁定倒计时 ========== */
.col-status{ min-width:158px; }
.badge-status{
    display:inline-block;
    padding:2px 9px;
    border-radius:12px;
    font-size:12px;
    line-height:1.65;
    white-space:nowrap;
}
.badge-status-on{ background:#eaf6ef; color:#007f3a; font-weight:600; }
.badge-status-off{ background:#f1f3f7; color:#8a94a6; }
.badge-status-lock{ background:#fff2e6; color:#b45309; font-weight:600; }
.lock-line{ margin-top:5px; display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.lock-countdown{
    font-variant-numeric:tabular-nums;
    font-weight:700;
    color:#b45309;
    font-size:12.5px;
}
.lock-hint{ margin-top:4px; font-size:12px; }

/* ========== 角色权限：后台开关 + 前台字段勾选 ========== */
.perm-block{
    border:1px solid #e4e9f2;
    border-radius:12px;
    padding:14px;
    margin-bottom:14px;
    background:#fafbfd;
}
.perm-switch{
    display:flex;
    align-items:center;
    gap:8px;
    font-size:13.5px;
    color:#1f2121;
    cursor:pointer;
}
.perm-switch input{ width:16px; height:16px; }
/* 只读角色提示（头部右侧） */
.perm-switch.perm-readonly{
    cursor:default;
    color:#fff;
    background:rgba(255,255,255,.18);
    border:1px solid rgba(255,255,255,.5);
    border-radius:999px;
    padding:6px 14px;
    font-size:13px;
    gap:6px;
}
.perm-group{ margin-bottom:14px; }
.perm-group-title{
    display:flex;
    align-items:center;
    gap:6px;
    margin:0 0 8px;
    padding-left:8px;
    border-left:3px solid #007f3a;
    color:#007f3a;
    font-weight:600;
    font-size:13px;
}
.perm-group-title.perm-none{ border-left-color:#c8cfda; color:#8a94a6; }
.perm-fields{
    display:flex;
    flex-wrap:wrap;
    gap:8px 18px;
}
.perm-field{
    display:flex;
    align-items:center;
    gap:6px;
    font-size:13px;
    color:#1f2121;
    cursor:pointer;
}
.perm-field input{ width:15px; height:15px; }
.perm-tools{ margin-bottom:10px; font-size:12.5px; }
.perm-tools a{ color:#007f3a; text-decoration:none; margin-right:14px; }
.perm-tools a:hover{ text-decoration:underline; }
#roleFormView .modal-body{ max-height:68vh; overflow-y:auto; }

/* 角色管理弹窗：列数最多（含「版本审核 / 版本反审核」），比 Bootstrap 的 modal-xl（1140px）再放宽；
   视口不足时用 min() 收敛到 96vw，不会横向溢出。 */
#rolesModal .modal-dialog{
    max-width:min(1400px, 96vw);
}
/* 列多时不再硬挤：表格给出最小宽度，超出部分在弹窗内横向滚动 */
#rolesModal .modal-body{ overflow-x:auto; }
#rolesModal .admin-table{ min-width:1080px; }

/* ========== admin.php 头部：登录信息 + 用户管理 / 角色管理（放在「新增电池型号」左侧） ========== */
.header-actions .admin-user{ margin-right:6px; }
.header-actions .btn-head-ghost{
    display:inline-flex;
    align-items:center;
    gap:6px;
    height:36px;
    padding:0 14px;
    border-radius:24px;
    background:rgba(255,255,255,.15);
    border:1px solid rgba(255,255,255,.75);
    color:#fff;
    font-size:13px;
    cursor:pointer;
    transition:background .2s;
}
.header-actions .btn-head-ghost:hover{ background:rgba(255,255,255,.28); }
.header-actions .btn-head-ghost:focus,
.header-actions .btn-head-ghost:focus-visible{
    outline:2px solid rgba(255,255,255,.85);
    outline-offset:2px;
}

/* ========== 系统版本号徽标 + 更新履历弹窗（后台三页共用） ========== */
/* 徽标可在两个位置：头部右侧操作区 / 副标题「电池型号管理后台…」右侧，样式通用 */
.ver-badge{
    display:inline-flex;
    align-items:center;
    gap:5px;
    height:22px;
    padding:0 10px;
    margin-left:2px;
    vertical-align:middle;
    border-radius:24px;
    background:rgba(255,255,255,.14);
    border:1px solid rgba(255,255,255,.55);
    color:#fff;
    font-size:12px;
    line-height:1;
    letter-spacing:.02em;
    cursor:pointer;
    transition:background .2s;
}
.ver-badge:hover{ background:rgba(255,255,255,.26); }
.ver-badge:focus,
.ver-badge:focus-visible{
    outline:2px solid rgba(255,255,255,.85);   /* 聚焦环用白色，保持顶栏绿底反白、不出现蓝环 */
    outline-offset:2px;
}
#appVerModal .vl-item + .vl-item{
    margin-top:16px;
    padding-top:16px;
    border-top:1px solid #eef1f5;
}
#appVerModal .vl-head{
    display:flex;
    align-items:baseline;
    gap:10px;
    margin-bottom:8px;
}
#appVerModal .vl-ver{ font-size:15px; font-weight:700; color:#007f3a; }
#appVerModal .vl-date{ font-size:12px; color:#8a97ab; }
#appVerModal .vl-list{ margin:0; padding-left:20px; }
#appVerModal .vl-list li{ font-size:13px; color:#333; line-height:1.9; }
#appVerModal .modal-footer{ justify-content:space-between; }
#appVerModal .vl-cur{ font-size:12px; color:#8a97ab; }

/* ========== 弹窗内管理面板（用户 / 角色）：列表 ↔ 表单 ↔ 删除 三视图 ========== */
.mg-toolbar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:12px;
    flex-wrap:wrap;
}
.mg-tip{ font-size:13px; color:#5a6060; }
.mg-tip b{ color:#007f3a; }
.mg-toolbar .btn-add{
    display:inline-flex;
    align-items:center;
    gap:6px;
    background:#007f3a;
    color:#fff;
    border:none;
    border-radius:24px;
    padding:7px 16px;
    font-size:13px;
    cursor:pointer;
    transition:background .2s;
}
.mg-toolbar .btn-add:hover{ background:#00632e; }
.mg-table-wrap{
    border:1px solid #e6eaf0;
    border-radius:12px;
    overflow:auto;
    max-height:56vh;
}
.mg-table-wrap .admin-table{ margin:0; }
.mg-form-title{
    font-size:15px;
    font-weight:600;
    color:#007f3a;
    margin-bottom:14px;
}
.mg-form-title.text-danger{ color:#d23f3f; }
.mg-actions{
    display:flex;
    justify-content:flex-end;
    gap:8px;
    margin-top:20px;
    padding-top:14px;
    border-top:1px solid #eef1f6;
}
.mg-fields-wrap{ max-height:38vh; overflow:auto; padding-right:4px; }

/* ========== 只读模式（只读角色查看 battery_edit.php / barcode_edit.php） ========== */
/* 只读提示条 */
.ro-notice{
    display:flex;
    align-items:center;
    gap:8px;
    padding:10px 14px;
    margin-bottom:14px;
    border-radius:10px;
    background:#f0f8f3;
    border:1px solid #cfe8da;
    color:#2f4a3a;
    font-size:13px;
    line-height:1.7;
}
.ro-notice i{ color:#007f3a; font-size:15px; }
.ro-notice b{ color:#1f2121; }
/* 审核锁定提示：沿用只读提示的版式，但用橙红强调「不可修改」 */
.ro-notice.lock-notice{
    background:#fff6ec;
    border-color:#f3d3b0;
    color:#8a4b16;
}
.ro-notice.lock-notice i{ color:#d97706; }
.ro-notice.lock-notice b{ color:#8a4b16; }
/* 版本列表里的「已审核」徽标 */
.vm-reviewed{
    display:inline-flex;
    align-items:center;
    gap:3px;
    padding:2px 8px;
    border-radius:20px;
    background:#fff1e6;
    border:1px solid #f3cfa6;
    color:#c2690b;
    font-size:12px;
    white-space:nowrap;
}
.vm-reviewed i{ font-size:12px; }
/* 新增版本的两个按钮容器 */
.vm-add-btns{ display:flex; gap:10px; flex-wrap:wrap; margin-top:8px; }
/* 新增大版本：绿色描边按钮（与小版本实心绿形成主次区分） */
.vm-btn-major{
    background:#fff;
    border:1px solid #007f3a;
    color:#007f3a;
}
.vm-btn-major:hover{ background:#eaf6ef; border-color:#00632e; color:#00632e; }
/* 字段勾选视图的锁定提示 */
.vf-lock-tip{
    margin-top:10px;
    padding:8px 12px;
    border-radius:8px;
    background:#fff6ec;
    border:1px solid #f3d3b0;
    color:#8a4b16;
    font-size:13px;
}
.vf-lock-tip i{ color:#d97706; }
/* 只读控件：灰底 + 禁用手型光标，明确「不可编辑」 */
.form-control-ro{
    background:#f5f7fa !important;
    color:#3a4a63 !important;
    cursor:default;
}
.form-control-ro:focus{
    box-shadow:none;
    border-color:#dfe5ee;
}

/* ===== 文件型字段（图片 / PDF）：预览 + 上传 + 移除（2026-09-18） ===== */
.ff-wrap{ display:flex; flex-direction:column; gap:8px; }
.ff-cur{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
/* 图片缩略图：点击在新窗口看原图 */
.ff-thumb-link{
    display:inline-block;
    line-height:0;
    border-radius:8px;
    overflow:hidden;
    border:1px solid #dfe5ee;
    background:#f7f9fc;
}
.ff-thumb{
    display:block;
    max-width:180px;
    max-height:130px;
    width:auto;
    height:auto;
    object-fit:contain;
}
.ff-thumb-link:hover{ border-color:#b9e0c9; }
/* PDF：文件名 + 查看链接 */
.ff-file{
    display:inline-flex;
    align-items:center;
    gap:6px;
    max-width:100%;
    padding:6px 12px;
    border-radius:8px;
    background:#f0f8f3;
    border:1px solid #cfe8da;
    color:#007f3a;
    font-size:13px;
    text-decoration:none;
    word-break:break-all;
}
.ff-file i{ font-size:15px; color:#c0392b; }
.ff-file:hover{ background:#e6f4eb; border-color:#b9e0c9; color:#00632e; }
.ff-meta{ font-size:12px; color:#8a94a6; word-break:break-all; }
.ff-empty{
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:8px 12px;
    border:1px dashed #d7dee9;
    border-radius:8px;
    background:#fafbfd;
    color:#9aa4b5;
    font-size:13px;
}
.ff-empty i{ font-size:15px; }
/* 上传控件：文件输入在 Bootstrap 下自带按钮样式，这里只调紧凑度
   注意：类名必须是 .ff-input，不能复用 .ff-file —— 后者是 PDF 链接的样式，
   两者共用会让文件输入框被套上链接的蓝底样式（曾踩过）。 */
.ff-input.form-control{ height:auto; padding:6px 8px; font-size:13px; }
.ff-del{
    display:inline-flex;
    align-items:center;
    gap:6px;
    font-size:13px;
    color:#b4241c;
    cursor:pointer;
    user-select:none;
}
.ff-del input{ margin:0; cursor:pointer; }
.ff-picked{
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:5px 10px;
    border-radius:8px;
    background:#eefaf2;
    border:1px solid #cdebd9;
    color:#007f3a;
    font-size:12.5px;
    word-break:break-all;
}
.ff-type-tip{ line-height:1.85; }
/* 后台主色为绿：这里的 mono 路径文本曾用蓝 #2b5fd9，已统一为绿 */
.ff-type-tip .mono,
.field-hint .mono{
    font-family:"Consolas","Courier New",monospace;
    color:#007f3a;
    word-break:break-all;
}

/* ========== 可信凭证（条码列表新增列 + 只读查看弹窗） ==========
   凭证的四项信息（凭证UID / 签名json / 签名哈希码 / 签名时间）
   全部由系统签发时生成，界面上只读展示、不提供编辑入口。 */
.admin-table .col-cred{
    width:210px;
    white-space:nowrap;
}
.cred-badge{
    display:inline-block;
    padding:2px 9px;
    border-radius:10px;
    font-size:12px;
    line-height:1.7;
    vertical-align:middle;
}
.cred-badge.ok{                  /* 已签发且与当前数据一致 */
    background:#eefaf2;
    border:1px solid #cdebd9;
    color:#007f3a;
}
.cred-badge.stale{               /* 已签发，但签发后数据变了 */
    background:#fff6e6;
    border:1px solid #f5dfb2;
    color:#a86a00;
}
.cred-badge.none{                /* 尚未签发 */
    background:#f2f4f8;
    border:1px solid #e2e7f0;
    color:#8a94a6;
}
.col-cred .op-btn{ margin-left:4px; }
/* 凭证列：状态徽标与对应按钮（签发/重签/查看）成组，按钮稳定位于徽标右边 */
.cred-inline{ display:inline-flex; align-items:center; flex-wrap:wrap; gap:6px; }

/* ========== 条码列表工具条（凭证签发概览 + 批量签发） ========== */
.bc-toolbar{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    flex-wrap:wrap;
    gap:12px;
    padding:0 0 14px;
    margin-bottom:4px;
    border-bottom:1px solid #eef1f6;
}
.bc-toolbar-info{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px 12px;
    min-width:0;
}
.bc-tb-title{
    font-size:14px;
    font-weight:500;
    color:#1f2121;
}
.bc-tb-title i{ color:#007f3a; margin-right:5px; }
.bc-tb-stat{
    font-size:13px;
    color:#5f6b7d;
}
.bc-tb-stat b{ color:#1f2121; }
.bc-tb-stat.ok b{ color:#0f7a4a; }
.bc-tb-stat.warn b{ color:#c0392b; }
.bc-tb-stat.none b{ color:#8a93a1; }
.bc-tb-hint{
    flex-basis:100%;
    font-size:12px;
    color:#8a93a1;
    line-height:1.7;
}
.bc-tb-hint b{ color:#5f6b7d; }
.bc-bulk-btn{
    display:inline-flex;
    align-items:center;
    gap:6px;
    background:#007f3a;
    color:#fff;
    border:none;
    border-radius:24px;
    padding:7px 16px;
    font-size:13px;
    cursor:pointer;
    white-space:nowrap;
    transition:background .2s;
}
.bc-bulk-btn:hover{ background:#00632e; }
.bc-bulk-btn[disabled]{
    background:#007f3a;
    opacity:.5;
    cursor:not-allowed;
    box-shadow:none;
}
.bc-bulk-btn[disabled]:hover{ background:#007f3a; }
@media (max-width:760px){
    .bc-toolbar{ flex-direction:column; }
    .bc-bulk-btn{ width:100%; justify-content:center; }
}

.cred-note{
    display:flex;
    align-items:center;
    gap:6px;
    padding:9px 12px;
    margin-bottom:14px;
    border-radius:10px;
    background:#f4f7fd;
    border:1px solid #e2eaf7;
    color:#33507d;
    font-size:13px;
    line-height:1.7;
}
.cred-grid{
    display:flex;
    flex-wrap:wrap;
    gap:14px;
}
.cred-item{
    flex:1 1 240px;
    min-width:0;
}
.cred-item.cred-full{ flex:1 1 100%; }
.cred-label{
    display:block;
    margin-bottom:6px;
    color:#1f2121;
    font-size:13px;
    font-weight:600;
}
.cred-val{
    padding:9px 12px;
    border-radius:10px;
    background:#fafbfd;
    border:1px solid #e4e9f2;
    color:#1f2121;
    font-size:13.5px;
    line-height:1.7;
    word-break:break-all;        /* 19 位UID / 64 位哈希在窄屏也要能折行 */
}
.cred-val.mono,
.cred-json.mono{
    font-family:"Consolas","Courier New",monospace;
    letter-spacing:0.5px;
}
.cred-json{
    margin:0;
    padding:12px;
    max-height:340px;
    overflow:auto;
    border-radius:10px;
    background:#fafbfd;
    border:1px solid #e4e9f2;
    color:#1f2121;
    font-size:12.5px;
    line-height:1.65;
    white-space:pre;
    tab-size:2;
}
#credStaleTip{ line-height:1.7; }
@media (max-width:560px){
    .admin-table .col-cred{ width:auto; }
}

/* ===== 可信凭证变更记录（点「数据已变更」/「记录 N」查看） ===== */
.cc-clickable{ cursor:pointer; }
.cc-clickable:hover{ opacity:.85; }
.cc-link{
    margin-left:6px;
    font-size:12px;
    color:#007f3a;
    text-decoration:none;
    border-bottom:1px dashed #8fcfa9;
    white-space:nowrap;
}
.cc-link:hover{ color:#00632e; border-bottom-color:#00632e; }
/* 当前未签入的变更（凭证失效时实时对比，未落库） */
.cc-now{
    margin-bottom:14px;
    padding:10px 12px;
    border:1px solid #f0cdc5;
    background:#fdf7f5;
    border-radius:10px;
}
.cc-now-title{
    font-weight:600;
    color:#c0392b;
    font-size:13px;
    margin-bottom:8px;
}
.cc-now-title i{ margin-right:2px; }
/* 明细段落与字段行 */
.cc-sec{ margin-bottom:8px; }
.cc-sec-title{ font-size:12px; color:#5a6b7f; font-weight:600; margin:6px 0; }
.cc-rows{ display:flex; flex-direction:column; gap:6px; }
.cc-row{
    display:flex;
    gap:10px;
    align-items:baseline;
    background:#fafafa;
    border:1px solid #eef0f3;
    border-radius:8px;
    padding:6px 10px;
}
.cc-row .cc-k{
    min-width:170px;
    max-width:260px;
    font-size:13px;
    color:#1f2121;
    word-break:break-all;
}
.cc-row .cc-k .mono{ color:#8a97ab; font-size:11px; margin-left:5px; }
.cc-row .cc-v{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:13px; color:#1f2121; }
.cc-val{
    padding:1px 8px;
    border-radius:6px;
    background:#fff;
    border:1px solid #e4e9f2;
    word-break:break-all;
    max-width:420px;
}
.cc-val.old{ background:#fdeeec; border-color:#f3d3cf; color:#a94442; text-decoration:line-through; }
.cc-val.new{ background:#e9f6ee; border-color:#bfe3cd; color:#00632e; }
.cc-arrow{ color:#8a97ab; font-size:12px; }
.cc-tag{ font-size:11px; padding:1px 8px; border-radius:10px; white-space:nowrap; }
.cc-tag.add{ background:#e9f6ee; color:#00632e; }
.cc-tag.del{ background:#fdeeec; color:#a94442; }
/* 历史记录列表 */
.cc-sec-head2{ font-weight:600; font-size:13px; color:#1f2121; margin:12px 0 8px; }
.cc-item{
    border:1px solid #e4e9f2;
    border-radius:10px;
    padding:10px 12px;
    margin-bottom:10px;
    background:#fff;
}
.cc-item-head{
    display:flex;
    align-items:center;
    gap:8px;
    font-size:13px;
    font-weight:600;
    color:#1f2121;
    margin-bottom:6px;
    flex-wrap:wrap;
}
.cc-time{ font-weight:400; color:#8a97ab; font-size:12px; }
.cc-scope{ font-size:11px; padding:1px 8px; border-radius:10px; white-space:nowrap; }
.cc-scope.pf{ background:#e9f6ee; color:#00632e; }
.cc-scope.bc{ background:#f1f3f7; color:#4a5a75; }
.cc-share{ font-size:11px; color:#8a97ab; font-weight:400; }
.cc-empty{ color:#8a97ab; font-size:13px; padding:8px 2px; line-height:1.7; }

/* ========== 系统授权有效期预警徽标（副标题右侧，≤30 天显示） ========== */
.lic-warn{
    display:inline-flex;
    align-items:center;
    gap:4px;
    height:22px;
    padding:0 10px;
    margin-left:6px;
    border-radius:22px;
    vertical-align:middle;
    font-size:11px;
    background:#fff4e0;
    border:1px solid #f0c36d;
    color:#a15c00;
    white-space:nowrap;
}
.lic-warn.lic-warn-urgent{ background:#fdecec; border-color:#e6a5a5; color:#c0392b; }

/* ========== 后台布局：左侧菜单栏 + 右侧内容（2026-10-27） ==========
   三页（RyderPass.html / admin_users.html / admin_roles.html）共用同一套骨架：
   <div class="admin-shell"> <aside class="admin-sidebar">…</aside> <main class="admin-main">…</main> </div>
   沿用原设计的「圆角卡片」语言：左侧菜单与右侧内容都是浮在灰底上的圆角卡片（原 header-card 即 16px 圆角 + margin），
   而不是通栏的硬直角条，保持与原后台一致的视觉观感。 */
/* 全局归零，避免浏览器默认 body margin 造成「上/左/右比下多约 8px」的错位 */
html, body{ margin:0; padding:0; }
/* 固定整屏高度；「外边框边距」与「菜单栏↔内容栏间距」绑定为同一宽度（--admin-gap），
   四边外边距 + 中间间距完全一致，左右上下对齐。 */
.admin-shell{
    display:flex;
    height:100vh;
    box-sizing:border-box;
    --admin-gap:14px;
    padding:var(--admin-gap);
    gap:var(--admin-gap);
    overflow:hidden;
    background:#eef1f5;
}
.admin-sidebar{
    width:230px;
    flex:0 0 230px;
    background:#007f3a;
    color:#fff;
    border-radius:16px;
    display:flex;
    flex-direction:column;
    align-self:stretch;
    height:100%;
    overflow:hidden;
}
.admin-main{
    flex:1;
    min-width:0;
    display:flex;
    flex-direction:column;
    background:#fff;
    border:1px solid #e4e9f2;
    border-radius:16px;
    overflow:hidden;
    min-height:0;
}
/* 顶部工具条（右栏头部） */
.admin-topbar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    flex-wrap:wrap;
    padding:16px 22px;
    background:#fff;
    border-bottom:1px solid #e4e9f2;
}
.tb-title{ font-size:17px; font-weight:700; color:#1f2121; line-height:1.2; }
.tb-sub{ font-size:12.5px; color:#8a94a6; margin-top:3px; }
.tb-actions{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
/* 顶栏「新增」主按钮（绿色胶囊）：RyderPass.html / admin_users / admin_roles 等页面的新增入口。
   原先的通用 .btn-add 样式只挂在 .header-actions / .fm-top 等旧容器下，
   侧栏布局里按钮在 .tb-actions 内无样式，故在此补齐，与 .header-actions .btn-add 一致。 */
.tb-actions .btn-add{
    background:#007f3a;
    color:#fff;
    border:none;
    border-radius:24px;
    padding:8px 18px;
    font-size:14px;
    display:inline-flex;
    align-items:center;
    gap:6px;
    cursor:pointer;
    transition:background 0.2s;
}
.tb-actions .btn-add:hover{ background:#00632e; }
.tb-actions .btn-add i{ font-size:15px; }
/* 顶栏「刷新」按钮：白底绿边，与绿色「新增」主按钮配对 */
.tb-actions .btn-refresh{
    background:#fff;
    color:#007f3a;
    border:1px solid #007f3a;
    border-radius:24px;
    padding:8px 18px;
    font-size:14px;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    gap:6px;
}
.tb-actions .btn-refresh:hover{ background:#e9f6ee; }
.tb-actions .btn-refresh i{ font-size:15px; }
.tb-actions .btn-refresh:disabled{ opacity:.6; cursor:default; }
/* 右栏内容区 */
.admin-content{ flex:1; padding:18px 22px; overflow:auto; position:relative; }

/* ========== 字段设置：标签页（电池型号 / 条码录入） ========== */
.fs-tabs{
    display:flex;
    gap:8px;
    margin-bottom:14px;
    flex-wrap:wrap;
}
.fs-tab{
    display:inline-flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:2px;
    min-height:48px;
    padding:6px 18px;
    border-radius:10px;
    background:#f4f7f5;
    border:1px solid #e4e9f2;
    color:#4a5563;
    font-size:14px;
    cursor:pointer;
    transition:all .15s;
}
.fs-tab-top{ display:inline-flex; align-items:center; gap:6px; font-size:14px; }
.fs-tab-tbl{
    font-size:10px;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Courier New", monospace;
    letter-spacing:.2px;
    color:#8a94a6;
    line-height:1.2;
}
.fs-tab:hover{ background:#e9f6ee; border-color:#cfe8da; color:#007f3a; }
.fs-tab:hover .fs-tab-tbl{ color:#0a8a44; }
.fs-tab.active{
    background:#007f3a;
    border-color:#007f3a;
    color:#fff;
    font-weight:600;
}
.fs-tab.active .fs-tab-tbl{ color:#d7f2e2; }

/* ========== 字段设置：筛选栏（2026-10-28） ========== */
.fs-filter{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    align-items:center;
    margin-bottom:12px;
}
.fs-filter .fsf-search{ position:relative; flex:1; min-width:220px; }
.fs-filter .fsf-search i{
    position:absolute; left:11px; top:50%; transform:translateY(-50%);
    color:#9aa6b8; font-size:14px; pointer-events:none;
}
.fs-filter .fsf-search .form-control{ padding-left:32px; height:38px; }
.fs-filter .fsf-select{ width:auto; min-width:130px; height:38px; }
.fs-filter .fsf-reset{
    display:inline-flex; align-items:center; gap:5px;
    height:38px; padding:0 14px;
    border:1px solid #d8dee8; background:#fff; border-radius:8px;
    color:#3a4a63; cursor:pointer; font-size:13px;
}
.fs-filter .fsf-reset:hover{ background:#f3f6fb; border-color:#c5cedb; }

/* ========== 字段设置：列表表头（列标题）滚动时固定（2026-10-28） ========== */
.fm-table thead th{
    position:sticky; top:0; z-index:3;
    background:#fafafa;
    box-shadow:0 1px 0 #e4e9f2;   /* 滚动时与下方行分隔，避免透出 */
}

/* ========== 列表内嵌编辑 / 查看（RyderPass.html 右侧内容区嵌入 battery_edit.html） ========== */
/* 编辑 / 查看视图：绝对铺满右栏内容区，盖住列表，返回即恢复 */
.embed-view{
    position:absolute;
    inset:0;
    display:flex;
    flex-direction:column;
    background:#fff;
    z-index:6;
}
.embed-backbar{
    display:flex;
    align-items:center;
    gap:12px;
    padding:13px 22px;
    border-bottom:1px solid #e4e9f2;
    flex:0 0 auto;
    background:#fff;
}
.btn-back{
    display:inline-flex;
    align-items:center;
    gap:6px;
    background:#fff;
    color:#007f3a;
    border:1px solid #007f3a;
    border-radius:24px;
    padding:6px 16px;
    font-size:13px;
    cursor:pointer;
    transition:background .15s;
}
.btn-back:hover{ background:#e9f6ee; }
.embed-title{ font-size:15px; font-weight:600; color:#1f2121; }
.embed-frame{
    flex:1;
    min-height:0;
    width:100%;
    border:none;
    background:#fff;
}

/* 内嵌模式（embed=1）：隐藏 battery_edit.html 自身的顶部卡片，融入右栏 */
body.embed{ background:#fff; overflow:hidden; }
body.embed .page-wrap{ height:100%; padding:0; margin:0; background:transparent; }
body.embed .header-card{ display:none; }
body.embed .scroll-container{ padding:16px 22px 22px; }
/* admin-shell 类内容页（电池型号/档案/批次/字段/用户/角色）内嵌时隐藏自身侧边栏，铺满右侧 */
body.embed .admin-sidebar{ display:none !important; }
body.embed .admin-shell{ padding:0; gap:0; }
body.embed .admin-main{ border:none; border-radius:0; }

/* 只读查看模式（view=1）：字段不可编辑、隐藏所有操作按钮 */
body.view .list-card .btn{ display:none !important; }
body.view .fld,
body.view .fld-file{ pointer-events:none; background:#f5f7fa !important; color:#3a4a63; }
body.view .fld-file{ display:none; }

/* 侧边栏：品牌区（两行字居中 + 放大） */
.sb-brand{
    padding:22px 20px 18px;
    border-bottom:1px solid rgba(255,255,255,.15);
    text-align:center;
}
.sb-logo{ font-size:26px; font-weight:800; color:#fff; letter-spacing:1px; }
.sb-sub{ font-size:15px; color:rgba(255,255,255,.85); margin-top:6px; }
/* 侧边栏顶部品牌区版本号：与「电池护照后台」同行显示，绿色胶囊徽标（沿用侧边栏绿底反白） */
.sb-brand-ver{
    display:inline-block;
    margin-left:6px;
    padding:1px 9px;
    border-radius:24px;
    background:rgba(61,220,132,.16);
    border:1px solid rgba(61,220,132,.5);
    color:#eafff2;
    font-size:12px;
    letter-spacing:.02em;
    font-family:inherit;
    vertical-align:middle;
}
/* 侧边栏：导航 */
.sb-nav{
    flex:1;
    padding:14px 12px;
    display:flex;
    flex-direction:column;
    gap:4px;
    overflow:auto;
}
.sb-link{
    display:flex;
    align-items:center;
    gap:10px;
    padding:10px 14px;
    border-radius:10px;
    color:rgba(255,255,255,.92);
    font-size:14px;
    text-decoration:none;
    transition:background .15s, color .15s;
}
.sb-link i{ font-size:17px; }
.sb-link:hover{ background:rgba(255,255,255,.15); color:#fff; }
.sb-link.active{ background:#fff; color:#007f3a; font-weight:600; }
/* 侧边栏：功能区分隔横线（仅超管可见的「字段设置」组前显示），用于区分业务数据区与系统配置区 */
.sb-sep{ height:1px; background:rgba(255,255,255,.18); margin:8px 12px; }
/* 侧边栏：底部用户 + 退出 */
.sb-footer{
    border-top:1px solid rgba(255,255,255,.15);
    padding:14px 16px;
}
.sb-user{ display:flex; align-items:center; gap:10px; margin-bottom:12px; }
.sb-user > i{ font-size:30px; color:rgba(255,255,255,.95); }
.sb-user-meta{ min-width:0; }
.sb-user-name{ font-size:14px; font-weight:600; color:#fff; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sb-user-role{ font-size:12px; color:rgba(255,255,255,.8); }
.sb-logout{
    display:flex;
    align-items:center;
    gap:8px;
    padding:9px 14px;
    border-radius:10px;
    background:rgba(255,255,255,.14);
    border:1px solid rgba(255,255,255,.4);
    color:#fff;
    font-size:13px;
    text-decoration:none;
    transition:background .15s;
}
.sb-logout:hover{ background:rgba(255,255,255,.26); }
.sb-logout i{ font-size:16px; }
.sb-version{
    display:flex; align-items:center; gap:6px;
    margin-top:12px; padding-top:12px;
    border-top:1px solid rgba(255,255,255,.15);
    font-size:12px; color:rgba(255,255,255,.82);
}
.sb-version-dot{ width:7px; height:7px; border-radius:50%; background:#3ddc84; box-shadow:0 0 0 3px rgba(61,220,132,.22); }
.sb-version a{ color:rgba(255,255,255,.95); text-decoration:underline; cursor:pointer; }
.sb-version a:hover{ color:#fff; }

/* 版本履历弹窗 */
.cl-current{ font-size:14px; margin-bottom:14px; color:#3a4a63; }
.cl-current .cl-ver{ font-weight:700; color:#0a7d3e; }
.cl-list{ display:flex; flex-direction:column; gap:14px; max-height:56vh; overflow:auto; padding-right:4px; }
.cl-item{ border-left:3px solid #0a7d3e; padding:2px 0 2px 12px; }
.cl-item-head{ display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; }
.cl-item-head .cl-ver{ font-weight:700; color:#0a7d3e; }
.cl-item-head .cl-date{ font-size:12px; color:#8a94a6; }
.cl-item-head .cl-title{ font-weight:600; color:#2a3b56; }
.cl-items{ margin:6px 0 0; padding-left:18px; }
.cl-items li{ margin:3px 0; color:#4a5a73; font-size:13.5px; }
.cl-foot{ margin-top:14px; font-size:12px; color:#9aa6b8; text-align:right; }

/* 窄屏：侧边栏改为顶部横向卡片，主内容占满（允许整页滚动） */
@media (max-width:760px){
    .admin-shell{ flex-direction:column; height:auto; min-height:100vh; overflow:visible; gap:var(--admin-gap); }
    .admin-sidebar{
        position:static;
        width:100%;
        flex:0 0 auto;
        height:auto;
        flex-direction:row;
        flex-wrap:wrap;
        align-items:center;
    }
    .sb-brand{ border-bottom:none; padding:14px 16px; }
    .sb-nav{
        flex-direction:row;
        flex-wrap:wrap;
        padding:8px 12px;
        flex:1 1 100%;
        order:3;
    }
    .sb-footer{
        border-top:none;
        margin-left:auto;
        display:flex;
        align-items:center;
        gap:10px;
        padding:10px 14px;
    }
    .sb-user{ margin-bottom:0; }
    .sb-logout{ padding:7px 12px; }
    .sb-sep{ width:1px; height:24px; margin:0 8px; background:rgba(255,255,255,.18); }
}

/* ---------- 触屏点按高亮：系统浅蓝闪块 → 透明（与前台 style.css 一致） ---------- */
*{
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}

/* ---------- 多语种·翻译管理语种标签：横向排列的胶囊样式（synco.css 未提供 .nav flex） ---------- */
.i18n-tabs {
    list-style: none;
    padding: 0;
    margin: 0 0 10px;
    border-bottom: none;
}
.i18n-tabs .nav-item { margin: 0 6px 6px 0; }
.i18n-tabs .nav-link {
    display: inline-block;
    padding: 5px 14px;
    border: 1px solid #d4e3da;
    border-radius: 999px;
    color: #007f3a;
    background: #f3f9f5;
    font-size: 13px;
    line-height: 1.4;
    cursor: pointer;
    white-space: nowrap;
    transition: background .15s, color .15s, border-color .15s;
}
.i18n-tabs .nav-link:hover { background: #e6f3ec; }
.i18n-tabs .nav-link.active {
    background: #007f3a;
    color: #fff;
    border-color: #007f3a;
    font-weight: 600;
}

/* ========== 非超管只读模式（系统设置/字段设置/用户管理/数据对接）==========
 * 这些模块对「非超级管理员」可见但只读：隐藏一切新增/编辑/删除操作控件。
 * 角色管理(权限控制)的只读逻辑更细（受控字段权限可编辑），单独在页面内处理，不挂此类。 */
body.ro-mode .op-btn,
body.ro-mode .btn-add,
body.ro-mode [data-ro-hide] { display: none !important; }

.ro-banner {
    display: inline-block;
    margin-left: 10px;
    padding: 2px 10px;
    font-size: 12px;
    color: #8a6d3b;
    background: #fdf6e3;
    border: 1px solid #f0e0b8;
    border-radius: 999px;
    vertical-align: middle;
}