* {
    box-sizing: border-box;
    margin:0;
    padding:0;
}
html,body{
    height:100%;
    overflow:hidden;
}
body {
    background-color: #eff0f4;   /* 页面底色（原 #edf2fb） */
    font-family: "Microsoft YaHei", PingFang SC, sans-serif;
    font-size:14px;
    color:#333;
    padding:12px;
}
.page-wrap{
    height:100%;
    display:flex;
    flex-direction:column;
}
.header-card{
    background:#007f3a;                          /* 原 #ffffff：顶部圆角卡片改绿底，与后台统一 */
    border-radius:16px;
    padding:16px;
    margin-bottom:12px;
    transition: all 0.3s ease;
    position: relative;
    flex:0 0 auto;
    z-index:98;
}
/* 顶部第 2 块：与上方深绿块同色 #007f3a（登陆/语言 + 电池标签面板，置于滚动区内、随内容一起滚动；固定区止于上方深绿块下沿） */
.header-sub{
    background:#007f3a;
    border-radius:16px;
    padding:16px;
    margin-bottom:12px;
    position:relative;
    z-index:1;
}
.header-sub-actions{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:12px;
}
/* 第 1 块内：logo 与徽标同行居中 */
.header-card .header-top{ margin-bottom:0; align-items:center; }
/* 第 2 块内的登陆 / 语言按钮沿用顶部深绿块默认的「半透明白底反白」样式，无需浅绿块时的白底绿字覆盖 */
.header-card.scrolled{
    padding:10px 16px;
    border-radius:16px;
    box-shadow:0 2px 8px rgba(0,0,0,0.08);
}
/* 试算收缩后几何时临时关闭过渡：必须连子元素一起关，
   否则读到的是动画中间值（.logo 的 font-size、.header-top 的 margin 各自有过渡） */
.header-card.no-anim,
.header-card.no-anim *{
    transition:none !important;
}
.header-card.scrolled .lang-select,
.header-card.scrolled .login-btn,
.header-card.scrolled .role-tip{
    display:none;
}
.header-top{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    margin-bottom:16px;
    transition: margin 0.3s ease;
}
.header-card.scrolled .header-top{
    margin-bottom:0;
    align-items:center;
}
.logo{
    font-size:32px;
    font-weight:bold;
    color:#fff;                                  /* 原 #164194：绿底上反白 */
    transition: font-size 0.3s ease;
}
.header-card.scrolled .logo{
    font-size:24px;
}
.lang-select{
    position:relative;
    display:inline-flex;
    align-items:center;
    margin-top:4px;
}
/* 语言下拉按钮（绿底顶栏内：半透明白底 + 反白） */
.lang-select .lang-btn{
    display:inline-flex;
    align-items:center;
    gap:6px;
    border:1px solid rgba(255,255,255,.35);
    background:rgba(255,255,255,.12);
    color:rgba(255,255,255,.92);
    font-size:12px;
    line-height:1;
    padding:6px 10px;
    border-radius:999px;
    cursor:pointer;
    transition:background .2s, color .2s;
}
.lang-select .lang-btn:hover,
.lang-select .lang-btn:focus-visible{
    background:rgba(255,255,255,.22);
    color:#fff;
    outline:none;
}
.lang-select .lang-caret{
    font-size:10px;
    transition:transform .2s;
}
.lang-select.is-open .lang-caret{ transform:rotate(180deg); }
/* 下拉面板：白底、深色字，右上对齐弹出 */
.lang-select .lang-menu{
    display:none;
    position:absolute;
    top:calc(100% + 6px);
    right:0;
    z-index:1200;
    min-width:132px;
    background:#fff;
    border-radius:10px;
    box-shadow:0 8px 24px rgba(0,0,0,.16);
    padding:6px;
    margin:0;
    list-style:none;
}
.lang-select.is-open .lang-menu{ display:block; }
.lang-select .lang-opt{
    display:flex;
    align-items:center;
    gap:8px;
    color:#1f2121;
    font-size:13px;
    text-decoration:none;
    padding:8px 10px;
    border-radius:8px;
    white-space:nowrap;
    transition:background .15s, color .15s;
}
.lang-select .lang-opt:hover{
    background:#e9f6ee;
    color:#007f3a;
}
.lang-select .lang-opt.is-on{
    color:#007f3a;
    font-weight:700;
    background:#e9f6ee;
}
.lang-select .lang-opt .bi-invisible{ visibility:hidden; }  /* 未选中项用隐形勾占位对齐 */
/* 按条码查看时，「当前查看角色」白底面板内展示 产品条码 / 制造日期 / 产品型号 / 护照版本（文字深色，因面板为白底） */
.bc-head-rows{
    margin-top:8px;
    display:flex;
    flex-wrap:wrap;                 /* 每行两个字段：产品条码 / 制造日期，产品型号 / 护照版本 */
    gap:8px 18px;
}
.bc-head-row{
    flex:0 0 calc(50% - 9px);       /* 固定一行两个 */
    display:flex;
    align-items:baseline;
    gap:8px;
    color:rgba(255,255,255,.95);
    font-size:14px;
}
/* 英文界面标签更长，改为一个字段独占一行 */
.bc-head-rows.is-en .bc-head-row{
    flex:0 0 100%;
}
.bc-head-k{
    flex:none;
    min-width:56px;                 /* 标签等宽，右侧取值左对齐 */
    color:rgba(255,255,255,.7);
    font-size:12px;
}
.bc-head-v{
    font-weight:600;
    word-break:break-all;
}
/* 移入「当前查看角色」白底面板后，覆盖为深色（否则白字在白底不可见） */
.role-tip .bc-head-row{
    color:#1f2121;
    font-size:13px;
}
.role-tip .bc-head-k{
    color:#5a6060;
    font-size:12px;
}
.role-tip .bc-head-v{
    color:#007f3a;
}
.header-card.scrolled .bc-head-rows{
    display:none;
}
/* 头部右侧：仅保留可信徽标，右对齐 */
.header-right{
    display:flex;
    align-items:center;
}
/* 头部左侧：用户登陆 + 简体中文 同行排列（简体中文在用户登陆右边） */
.header-left-actions{
    display:flex;
    align-items:center;
    gap:14px;
    margin-top:6px;
}
/* 用户登陆按钮（绿底上反白，与可信徽标同语言） */
.login-btn{
    display:inline-flex;
    align-items:center;
    gap:6px;
    background:rgba(255,255,255,.15);
    border:1px solid rgba(255,255,255,.75);
    color:#fff;
    padding:4px 14px;
    border-radius:20px;
    font-size:13px;
    cursor:pointer;
    transition:background .2s;
}
.login-btn:hover{
    background:rgba(255,255,255,.28);
}
/* 已登陆：按钮显示为用户名（视觉上稍作区分，点击仍打开弹框） */
.login-btn.is-on{
    background:rgba(255,255,255,.3);
    border-color:#fff;
    font-weight:600;
}
.login-btn .lb-name{
    max-width:130px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
/* 用户登陆弹框（自写，不依赖 Bootstrap JS） */
.login-pop{
    position:fixed;
    inset:0;
    z-index:300;
    background:rgba(0,0,0,.45);
    display:none;
    align-items:center;
    justify-content:center;
    padding:16px;
}
.login-pop.show{
    display:flex;
}
.login-card{
    width:100%;
    max-width:340px;
    background:#fff;
    border-radius:16px;
    overflow:hidden;
    box-shadow:0 10px 30px rgba(0,0,0,.25);
}
.login-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    background:#007f3a;
    color:#fff;
    padding:14px 16px;
    font-size:16px;
    font-weight:600;
}
.login-close{
    font-size:22px;
    line-height:1;
    cursor:pointer;
    opacity:.9;
}
.login-close:hover{
    opacity:1;
}
.login-body{
    padding:18px 16px 20px;
}
.login-tip{
    font-size:12px;
    color:#999;
    text-align:center;
}
/* 已登陆态：弹窗内显示当前用户信息 */
.login-current{
    background:#f4f7fc;
    border:1px solid #dfe6f2;
    border-radius:10px;
    padding:12px 14px;
    margin-bottom:14px;
    font-size:13px;
    color:#1f2121;
}
.login-current .lc-row{ margin-bottom:4px; }
.login-current .lc-row:last-child{ margin-bottom:0; }
.login-current i{ color:#007f3a; margin-right:4px; }
/* 登陆失败 / 成功提示 */
.login-error{
    background:#fdecec;
    border:1px solid #f5c2c2;
    color:#c0392b;
    border-radius:8px;
    padding:8px 12px;
    font-size:12.5px;
}
.login-ok{
    background:#e9f6ee;
    border:1px solid #b9e0c8;
    color:#007f3a;
    border-radius:8px;
    padding:8px 12px;
    font-size:12.5px;
}
/* 超级管理员徽章（前台弹窗也会用到；后台 admin.css 另有同名定义） */
.badge-super{
    display:inline-block;
    margin-left:6px;
    padding:2px 8px;
    border-radius:12px;
    background:#007f3a;
    color:#fff;
    font-size:11px;
    vertical-align:1px;
}
/* 非法查看地址：拒绝页（403，不渲染任何护照数据） */
.bc-reject-wrap{
    min-height:100vh;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:24px 16px;
}
.bc-reject-card{
    width:100%;
    max-width:420px;
    background:#fff;
    border:1px solid #e2e6ee;
    border-radius:16px;
    box-shadow:0 6px 24px #00000014;
    padding:32px 24px;
    text-align:center;
}
.bc-reject-ic{
    font-size:44px;
    color:#d23f3f;
    display:block;
    margin-bottom:12px;
}
.bc-reject-title{
    font-size:17px;
    font-weight:600;
    color:#1f2121;
    margin-bottom:8px;
}
.bc-reject-desc{
    font-size:13px;
    color:#7b8291;
    line-height:1.7;
    margin-bottom:20px;
}
.bc-reject-btn{
    display:inline-block;
    background:#007f3a;
    color:#fff;
    text-decoration:none;
    border-radius:10px;
    padding:9px 26px;
    font-size:13.5px;
}
.bc-reject-btn:hover{ color:#fff; opacity:.9; }
.trust-badge{
    background:#fff;                             /* 绿底上反白：白底绿字（与后台顶部按钮同一套语言） */
    border:1px solid #fff;
    color:#007f3a;                               /* 原 #28b947 绿边绿字 */
    padding:6px 12px;
    border-radius:24px;
    display:inline-flex;
    align-items:center;
    gap:6px;
    cursor:pointer;
    transition: background 0.2s;
    white-space:nowrap;
}
.trust-badge:hover{
    background-color:#e6f4ec;                    /* 原 #f0fff4 */
    border-color:#e6f4ec;
}
/* 头部可信徽标的异常态：签发后数据已变更（红） / 未签发（灰） */
.trust-badge.is-warn{
    color:#c23a3a;
}
.trust-badge.is-warn:hover{
    background-color:#fdeeee;
    border-color:#fdeeee;
}
.trust-badge.is-miss{
    color:#8a8f99;
}
.trust-badge.is-miss:hover{
    background-color:#f1f2f4;
    border-color:#f1f2f4;
}
.role-tip{
    background:rgba(255,255,255,.94);            /* 原 #f0f5ff 浅蓝底：绿底上改成白色内嵌面板 */
    border-radius:12px;
    padding:12px 14px;
    color:#1f2121;                               /* 原 #224488 蓝字 → 近黑 */
    transition: all 0.3s ease;
}
.role-tag{
    display:inline-block;
    border:1px solid #007f3a;                    /* 原 #164194 */
    color:#007f3a;
    padding:2px 8px;
    border-radius:12px;
    margin-left:8px;
    font-size:12px;
}
/* 未扫码时的头部提示（替代原「当前查看角色：公众 未认证」） */
.role-tip-scan{
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:#1f2121;
    font-size:14px;
}
.role-tip-scan i{
    color:#007f3a;
    font-size:15px;
}
.scroll-container{
    flex:1 1 auto;
    overflow-y:auto;
    overflow-x:hidden;
    scrollbar-width:none;          /* Firefox：隐藏滚动条 */
    -ms-overflow-style:none;       /* 旧 Edge/IE：隐藏滚动条 */
}
.scroll-container::-webkit-scrollbar{ display:none; }  /* Chrome/Safari/Edge：隐藏滚动条（滚动仍可用） */
.section-item{
    background:#fff;
    border-radius:16px;
    padding:16px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:12px;
    cursor:pointer;
}
.section-content{
    background:#fff;
    border-radius:0 0 16px 16px;
    padding:0 16px 16px 16px;
    margin-top:-12px;
    margin-bottom:12px;
    display:none;
}
.section-item.open{
    /* 展开时底部改为直角：与下方 .section-content（顶部直角）无缝拼成一张整卡，
       否则卡片底部的 16px 圆角会在两侧各露出一个背景色缺口（即“缺角”） */
    border-radius:16px 16px 0 0;
}
.section-item .arrow{
    transition: transform 0.25s ease;
    font-size:18px;
    color:#666;
}
.section-item.open .arrow{
    transform: rotate(90deg);
}
.section-icon{
    margin-right:10px;
    color:#007f3a;                              /* 原 #164194 */
}
/* ========== 表格默认：手机端单列 ========== */
.info-table{
    width:100%;
    border-collapse: collapse;
    margin:12px 0;
}
.info-table td{
    border:1px solid #e4e9f2;
    padding:10px 12px;
    vertical-align:middle;
}
.info-table td.label{
    background:#fafafa;   /* 表格标签列底（原 #f7f9fd） */
    font-weight:500;
    width:40%;
}
/* 表格内链接（制造商网站地址）：bootstrap 默认蓝 → 主色绿 */
.info-table a{
    color:#007f3a;
}
.info-table a:hover{
    color:#00632e;
}
.tag-controlled{
    background:#ffe680;
    color:#704e00;
    font-size:12px;
    padding:2px 6px;
    border-radius:4px;
    margin-left:6px;
}
.controlled-box{
    background:#f1f3f7;
    color:#888;
    padding:10px 12px;
    border-radius:10px;
    display:block;
}
/* ========== 文件型字段（图片 / PDF）前台展示（2026-09-18） ========== */
/* 图片：缩略图，点击在新窗口看原图 */
.pf-file-img{
    display:inline-block;
    line-height:0;
    border-radius:10px;
    overflow:hidden;
    border:1px solid #e4e9f2;
    background:#fafbfd;
}
.pf-file-img img{
    display:block;
    max-width:220px;
    max-height:170px;
    width:auto;
    height:auto;
    object-fit:contain;
}
.pf-file-img:hover{ border-color:#bfe3cd; }
/* PDF：查看链接 */
.pf-file-link{
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:6px 12px;
    border-radius:10px;
    background:#f4fbf7;
    border:1px solid #cfe9db;
    color:#007f3a;
    font-size:13px;
    text-decoration:none;
}
.pf-file-link:hover{ background:#e9f7f0; border-color:#a9dcc2; color:#00632e; }
/* 附件缺失（被清理 / 目录未同步）：只提示，不暴露裸路径 */
.pf-file-missing{
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:#b26a00;
    font-size:13px;
}
@media (max-width:560px){
    .pf-file-img img{ max-width:100%; max-height:220px; }
}
/* 未扫码时的正文引导（页面已不含任何静态演示数据） */
.scan-guide{
    background:#fff;
    border-radius:16px;
    padding:36px 20px;
    text-align:center;
    color:#1f2121;
}
.scan-guide-ic{
    display:block;
    font-size:46px;
    line-height:1;
    color:#007f3a;
    margin-bottom:14px;
}
.scan-guide-title{
    font-size:17px;
    font-weight:600;
    margin-bottom:8px;
}
.scan-guide-desc{
    font-size:13px;
    color:#6b7075;
    line-height:1.7;
}
.trust-pop{
    position:fixed;
    top:20px;
    left:12px;
    right:12px;
    width:auto;
    background:#fff;
    border:1px solid #dce2ec;
    border-radius:12px;
    box-shadow:0 4px 16px #00000018;
    z-index:99;
    display:none;
}
.pop-header{
    background:#f0fcf4;
    padding:12px 16px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    border-bottom:1px solid #e8eee9;
    border-radius:12px 12px 0 0;
}
.pop-close{
    cursor:pointer;
    color:#666;
    font-size:20px;
}
.pop-body{
    padding:16px;
}
.pop-row{
    display:flex;
    justify-content:space-between;
    padding:6px 0;
    font-size:13px;
}
/* 弹窗右侧的值（凭证UID / 哈希 / 时间）：靠右、可断行、等宽字体展示哈希 */
.pop-val{
    text-align:right;
    word-break:break-all;
    max-width:260px;
    font-family:Consolas, Menlo, monospace;
    font-size:12px;
    color:#333;
}
/* 弹窗底部提示条：校验未通过 / 未签发的引导说明 */
.pop-note{
    margin-top:10px;
    padding:8px 10px;
    background:#f6f7f9;
    border-radius:8px;
    font-size:12.5px;
    color:#555;
    line-height:1.6;
}
.pop-note i{ margin-right:4px; }
/* 校验未通过时弹窗头部转警示色 */
.pop-header.is-warn{
    background:#fdf1f1;
    border-bottom-color:#f3dddd;
}

/* ========= PC大屏 >=768px：一行2组字段 ========= */
@media (min-width:768px) {
    .info-table tr{
        display:table-row;
    }
    .info-table{
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap:1px;
        background:#e4e9f2;
    }
    .info-table tbody{
        display:contents;
    }
    .info-table tr{
        display:contents;
    }
    .info-table td{
        display:block;
        background:#fff;
        border:none;
    }
    .info-table td.label{
        width:auto;
    }
}

/* ================= 主色覆盖（去蓝）：把 Bootstrap / 浏览器默认蓝统一为站点绿 #007f3a ================= */

/* 1) 顶部「用户登陆」按钮：去掉浏览器默认的蓝色聚焦环 */
.login-btn:focus,
.login-btn:focus-visible{
    outline:2px solid rgba(255,255,255,.85);
    outline-offset:2px;
    box-shadow:none;
    background:rgba(255,255,255,.28);
}

/* 2) 弹窗内按钮（原 Bootstrap .btn-primary 为蓝，统一改绿） */
.btn-primary{
    background-color:#007f3a;
    border-color:#007f3a;
    box-shadow:none;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary:first-child:active,
.btn-primary.active{
    background-color:#016c33;
    border-color:#016c33;
}
.btn-primary:focus,
.btn-primary:focus-visible{
    box-shadow:0 0 0 .2rem rgba(0,127,58,.25);
    outline:none;
}
.btn-primary:disabled,
.btn-primary.disabled{
    background-color:#7fb69b;
    border-color:#7fb69b;
}

/* 3) 输入框聚焦：Bootstrap 默认蓝边框 + 蓝光晕 → 绿 */
.form-control:focus,
.form-select:focus{
    border-color:#007f3a;
    box-shadow:0 0 0 .2rem rgba(0,127,58,.18);
    outline:none;
}

/* 4) 原生勾选 / 单选 / 滑块等控件强调色 */
input[type="checkbox"],
input[type="radio"],
input[type="range"],
progress{
    accent-color:#007f3a;
}
.form-check-input:checked{
    background-color:#007f3a;
    border-color:#007f3a;
}

/* 8) 原生 <select> 下拉选择高亮：系统蓝 → 浅灰（前台与后台一致） */
@supports (appearance: base-select){
    select,
    .form-select,
    select.form-control,
    select::picker(select){
        appearance:base-select !important;
    }
    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::picker-icon{ color:#1f2121; }
    select:disabled{ color:#8a97ab; }
}
/* 不支持 base-select 的浏览器：渐变兜底去除系统蓝高亮 */
select option:checked,
select option:hover,
select option:focus{
    background:linear-gradient(#e9ecef,#e9ecef);
    color:#1f2121;
}

/* 5) 正文链接默认蓝 → 绿 */
.page-wrap a{ color:#007f3a; }
.page-wrap a:hover{ color:#016c33; }

/* 6) 文本选中高亮 */
::selection{ background:#cfe9db; color:#1f2121; }

/* 7) 浏览器自动填充（Chrome 会刷成淡蓝底）→ 白底深字 */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active{
    -webkit-box-shadow:0 0 0 1000px #fff inset;
    -webkit-text-fill-color:#1f2121;
    caret-color:#1f2121;
    transition:background-color 9999s ease-in-out 0s;
}

/* ========== 9) 移动端/触屏点按高亮：系统默认浅蓝闪块 → 透明，改用自绘绿色按压反馈 ========== */
*{
    -webkit-tap-highlight-color: rgba(0,0,0,0);   /* 去掉触屏点按时系统绘制的浅蓝色高亮 */
}
.section-item:active{
    background:#eef7f1;                            /* 点分组头时的按压反馈（浅绿） */
}
