/* ============================================================
   DGA 数字海关 · 舱单进口案例 · 项目级业务样式（app.css）
   基础视觉全部来自设计规范组件库：
     lib/tokens.css（变量） + lib/style.css（组件与状态）
   本文件只补规范未覆盖的业务样式（登录页、业务区块、详情网格等），
   颜色/字号/间距/圆角一律引用 --dga-* 变量，不新增色值。
   ============================================================ */

/* 规范 tokens 未提供的派生值：小/大圆角、语义浅底色、浅蓝描边。
   由规范语义色派生，避免业务样式里散落硬编码色值。 */
:root{
  --dga-radius-sm:4px;
  --dga-radius-lg:8px;
  --dga-soft-primary:var(--dga-primary-soft);
  --dga-soft-primary-border:#a3b8d6;
  --dga-soft-success:#ecf4ec;
  --dga-soft-warning:#fdf2dc;
  --dga-soft-danger:#f7e5e2;
  /* 规范语义色在浅底上做文字时对比度不足（info 2.24 / success 3.05 / warning 2.55 /
     muted 3.71，均低于 4.5），按规范色相加深后用于「浅底色 + 同色系文字」，
     底色仍用规范 --dga-soft-*，仅文字取派生值。 */
  --dga-on-soft-info:#297085;
  --dga-on-soft-success:#3a7937;
  --dga-on-soft-warning:#966201;
  --dga-on-soft-danger:#b82e18;
  --dga-on-soft-muted:#65717e;
  --dga-shadow-card:0 1px 2px rgba(16,24,40,.05),0 1px 3px rgba(16,24,40,.06);
  --dga-soft-warning-border:#f0d48a;
  --dga-soft-danger-border:#f0a89f;
}

/* ---------- 基础 ---------- */
html,body{margin:0;padding:0}
body{background:var(--dga-page-bg)}
[hidden]{display:none !important}
.mono{font-family:'SF Mono',Menlo,Consolas,monospace;font-size:13px;letter-spacing:-.01em}
a{color:var(--dga-primary);text-decoration:none}
a:hover{color:var(--dga-primary-hover)}

/* ---------- 规范组件微调：弹窗 / 抽屉右上角关闭按钮 ----------
   规范只有在 .dga-button / .dga-icon-button / .dga-tab / .dga-menu-button 上声明了
   :focus-visible 焦点环，.dga-modal__close 没有覆盖，于是键盘聚焦（或系统开启
   「全键盘控制」）时会露出浏览器 UA 默认的蓝色焦点框（1px auto #005fcc）。
   企业端与海关端的所有 dialog 共用 .dga-modal__close，这里统一去掉。 */
.dga-modal__close:focus,.dga-modal__close:focus-visible{outline:none}

/* ---------- 应用外壳补充（规范: .dga-app-shell--fixed 顶栏+品牌常显） ---------- */
.dga-app-content{display:flex;flex-direction:column;gap:var(--dga-space)}
.dga-app-content > section{min-width:0}
/* 各视图「内部的」大模块之间同样保持统一间距。
   规范只给了 .dga-app-content 的 gap —— 那作用于 #content 的直接子级（即各视图 section
   之间）；视图内部的模块（统计卡 / 待办 / 预警 / 表格卡片…）若不加，就会彼此贴死。
   用 :not([hidden]) 限定，避免 display 压过 [hidden] 的 UA 规则导致各视图叠着显示。 */
.dga-app-content > section:not([hidden]){display:flex;flex-direction:column;gap:var(--dga-space)}
.dga-app-content > section[hidden]{display:none}
/* 间距已由上面的 gap 统一控制；这些模块自带的同值下边距会让相邻间距翻倍（20px → 40px）。
   只在「视图直接子级」这一层归零，弹窗等场景中的同名类保持原有边距不受影响。 */
.dga-app-content > section:not([hidden]) > .dash-alerts,
.dga-app-content > section:not([hidden]) > .form-card,
.dga-app-content > section:not([hidden]) > .filter-panel,
.dga-app-content > section:not([hidden]) > .ops-toolbar,
.dga-app-content > section:not([hidden]) > .dga-card{margin-bottom:0}
/* DGA 标识随菜单一起滚动：标识已移入 .dga-app-sidebar__scroll 内部（而非固定在其外）。
   规范用 `.dga-app-sidebar > dga-brand` 定位标识，移位后该选择器不再匹配，
   故在此照搬规范原值（下方留白 / 断点下的标识宽度）。 */
.dga-app-shell--fixed .dga-app-sidebar__scroll > dga-brand{margin:0 auto 54px}
.dga-app-shell--fixed .dga-app-sidebar__scroll{margin-right:-20px;padding-right:20px}
@media(max-width:900px){.dga-app-shell--fixed .dga-app-sidebar__scroll > dga-brand{--dga-brand-width:180px}}
@media(max-width:640px){.dga-app-shell--fixed .dga-app-sidebar__scroll > dga-brand{--dga-brand-width:140px;margin:0}}
/* 侧栏底部常显区（通知 + 语言切换）：置于滚动菜单之外，任何导航长度下都可见 */
.dga-app-shell--fixed .dga-app-sidebar > .nav-lang{flex:none;display:flex;flex-direction:column;gap:8px;
  margin-top:8px;padding-top:12px;border-top:1px solid var(--dga-divider-soft)}
.nav-lang dga-select{width:100%}

/* 页头（规范 dga-page-header）：页头是内容区（.dga-app-content，flex + gap:20px）的直接子级，
   规范自带的 margin-bottom:20px 会与 gap 叠加成 40px；与上面同值间距的处理一致，只归零下外边距，
   分界线与内边距保留。 */
.dga-app-content > .dga-page-header{margin-bottom:0}
/* 页头操作区里的规范下拉（申报进度对象切换）定宽，避免拉满整行；窄屏独占一行 */
.dga-page-header__actions > dga-select{width:280px;flex:none}
@media(max-width:900px){.dga-page-header__actions > dga-select{width:100%}}

/* ---------- 业务卡片（规范 .dga-card 之上补标题/主体） ---------- */
.card-h{display:flex;align-items:center;justify-content:space-between;gap:10px;
  margin:-4px 0 16px;padding-bottom:12px;border-bottom:1px solid var(--dga-divider-soft);
  font:700 16px/20px var(--dga-font);color:var(--dga-text)}
.card-h .more{font:400 14px/20px var(--dga-font);color:var(--dga-text-muted);cursor:pointer}
.card-h .more:hover{color:var(--dga-primary)}
.dga-card + .dga-card{margin-top:0}          /* 内容区用 gap 控制间距 */

/* 统计卡 */
.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--dga-space)}
.cards .dga-card{display:flex;flex-direction:column;gap:10px}
.cards .row{display:flex;align-items:center;justify-content:space-between}
.cards .ic{width:38px;height:38px;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;
  background:var(--dga-primary-soft);color:var(--dga-primary)}
.cards .ic.warn{background:var(--dga-soft-warning);color:var(--dga-on-soft-warning)}
.cards .ic.err{background:var(--dga-soft-danger);color:var(--dga-danger)}
.cards .num{font:700 26px/1.1 var(--dga-font);color:var(--dga-text)}
.cards .lab{font-size:14px;color:var(--dga-text-muted)}
.cards .trend{font-size:13px;color:var(--dga-text-muted)}

/* ---------- 表格（规范 .dga-table 之上补业务列样式） ---------- */
.dga-table-wrap{background:white;border-radius:var(--dga-radius)}
.c-table td .mono{font-size:13px}
.c-table tr{cursor:default}
.c-table tr.clickable{cursor:pointer}
td .dga-button--secondary{min-width:0;padding:0 12px}
/* 规范 .dga-table：屏蔽遗留全局 table 规则的渗漏（表头灰底/nowrap、td 13px 字号） */
.dga-table th{background:transparent;white-space:normal}
.dga-table td{font-size:15px}
/* 表内图标操作按钮：32×32 固定规格，图标居中（配合 title 提示） */
.dga-btn-icon.dga-button--secondary{width:32px;min-width:32px;padding:0;justify-content:center;flex:none}
.dga-table .num-cell{text-align:right;font-variant-numeric:tabular-nums}
.dga-table .act-cell{white-space:nowrap;text-align:right}
.dga-table--compact th,.dga-table--compact td{height:38px;padding:6px 12px}
.diff-table .old{color:var(--dga-text-muted);text-decoration:line-through}
.diff-table .new{color:var(--dga-primary);font-weight:700}

/* ---------- 状态与徽章（规范 .dga-badge 之上补状态点） ---------- */
.st-cell{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.dot{display:inline-block;width:7px;height:7px;border-radius:50%;flex:none}
.st-risk-badge{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.risk-text-high{color:var(--dga-danger);font-weight:700}
.risk-text-medium{color:var(--dga-warning);font-weight:700}
.risk-text-low{color:var(--dga-success);font-weight:700}
.badge-hot{margin-left:auto;font:600 12px/20px var(--dga-font);padding:0 8px;border-radius:9px;
  background:var(--dga-danger);color:white;flex:none}

/* ---------- 顶栏语言/通知图标按钮角标 + 原位置下拉弹窗 ---------- */
.tb-badge{position:absolute;top:-5px;right:-5px;min-width:16px;height:16px;padding:0 4px;border-radius:8px;background:var(--dga-danger);color:#fff;font:600 10px/16px var(--dga-font);text-align:center;line-height:16px}
.tb-popover{position:fixed;z-index:1200;min-width:200px;max-width:280px;background:#fff;border:1px solid var(--dga-border);border-radius:8px;box-shadow:0 8px 24px rgba(16,24,40,.16);padding:6px}
.tb-pop-item{display:flex;align-items:center;gap:10px;width:100%;padding:9px 12px;border:0;background:none;border-radius:6px;font-size:13.5px;color:var(--dga-text);cursor:pointer;text-align:left}
.tb-pop-item:hover{background:var(--dga-hover-bg)}
.tb-pop-item.on{color:var(--dga-primary);font-weight:600;background:var(--dga-soft-primary)}
.tb-pop-empty{padding:12px;font-size:13px;color:var(--dga-text-muted);text-align:center}

/* ---------- 筛选工具栏（返回/操作分列，规范 .dga-row 之上） ---------- */
.filter-bar{display:flex;align-items:center;gap:var(--dga-gap);flex-wrap:wrap;
  padding:var(--dga-space);background:white;border-radius:var(--dga-radius);box-shadow:var(--dga-shadow)}
.filter-bar .tb-mono{font-size:13px;color:var(--dga-text-secondary)}
.filter-bar input,.filter-bar select{height:var(--dga-height)}
.filter-bar .dga-input{width:auto;min-width:180px}

/* ---------- 详情信息网格（字段 / 值） ---------- */
.di-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0}
.di-grid.one{grid-template-columns:1fr}
.di{display:flex;gap:14px;padding:9px 0;border-bottom:1px solid var(--dga-divider-soft);min-width:0}
.di .k{color:var(--dga-text-muted);flex:0 0 132px;font-size:14px}
.di .v{color:var(--dga-text-secondary);min-width:0;overflow-wrap:anywhere}
.ri-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0}
.ri-row{display:flex;gap:14px;padding:8px 0;border-bottom:1px solid var(--dga-divider-soft)}
.ri-row .k{color:var(--dga-text-muted);flex:0 0 132px;font-size:14px}
.ri-row .v{color:var(--dga-text-secondary);min-width:0}
.cargo-row{padding:10px 0;border-bottom:1px solid var(--dga-divider-soft)}
.cargo-row .row-h{font-weight:700;color:var(--dga-text);display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.cargo-row .row-h .act{font-weight:400;font-size:12.5px;color:var(--dga-primary);cursor:pointer}
.correction-box{background:var(--dga-soft-warning);border-left:4px solid var(--dga-warning);border-radius:4px;padding:12px 16px}
.correction-box .rh{font:700 15px/20px var(--dga-font);color:var(--dga-text);margin-bottom:6px}
.ins-cmd{background:var(--dga-surface-subtle);border-radius:4px;padding:14px 16px}
.ins-cmd .rh{color:var(--dga-text-muted);font-size:14px}
.ins-cmd .no{color:var(--dga-primary);font-weight:700}
.version-box{background:var(--dga-surface-subtle);border-radius:4px;padding:10px 14px;font-size:14px;color:var(--dga-text-secondary);margin-bottom:14px}

/* ---------- 审核状态步骤条（横向 Steps，海关端详情页）----------
   设计规范组件库**未提供**「审核节点」组件，故沿用重构前端展示层之前的自研样式：
   圆点在上、标签与时间在下、步骤之间用横向连线衔接，窄屏可横向滚动。
   仅把配色由旧品牌令牌换成规范令牌（--dga-*），版式与尺寸保持原样。 */
.audit-steps{display:flex;align-items:flex-start;overflow-x:auto;padding:8px 0;margin-top:16px}
.audit-step{display:flex;flex-direction:column;align-items:center;min-width:96px;flex:0 0 auto;text-align:center}
.audit-step .dot{width:16px;height:16px;border-radius:50%;border:2px solid var(--dga-border);background:var(--dga-surface);box-sizing:border-box}
.audit-step.done .dot{background:var(--dga-primary);border-color:var(--dga-primary)}
.audit-step.cur .dot{border-color:var(--dga-primary);box-shadow:0 0 0 4px rgba(25,70,136,.14)}
.audit-step.warn .dot{background:var(--dga-warning);border-color:var(--dga-warning)}
.audit-step.err .dot{background:var(--dga-danger);border-color:var(--dga-danger)}
.audit-step .lbl{font-size:12.5px;color:var(--dga-text);margin-top:7px;font-weight:500;white-space:nowrap}
.audit-step .tm{font-size:11px;color:var(--dga-text-muted);margin-top:2px;white-space:nowrap}
.audit-conn{flex:1;min-width:18px;height:2px;background:var(--dga-border);margin-top:7px}
.audit-conn.done{background:var(--dga-primary)}

/* ---------- 预警 / 待办 ---------- */
.warn-panel{border-left:4px solid var(--dga-danger);background:var(--dga-soft-danger);border-radius:4px;padding:12px 16px}
.warn-panel b{color:var(--dga-danger)}
.warn-panel p{margin:6px 0 0;color:var(--dga-text-secondary);font-size:14px}
.dash-todo-row{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--dga-divider-soft)}
.dash-todo-row:last-child{border-bottom:0}
.dash-todo-row .ic{width:32px;height:32px;border-radius:6px;flex:none;display:inline-flex;align-items:center;justify-content:center;
  background:var(--dga-primary-soft);color:var(--dga-primary)}
.dash-todo-row .info{min-width:0;flex:1}
.dash-todo-row .info b{display:block;font-size:15px;color:var(--dga-text)}
.dash-todo-row .info p{margin:2px 0 0;font-size:13px;color:var(--dga-text-muted)}
.alert-row{display:flex;align-items:flex-start;gap:12px;padding:12px 0;border-bottom:1px solid var(--dga-divider-soft)}
.alert-row:last-child{border-bottom:0}

/* ---------- 空态 ---------- */
.empty{padding:40px 20px;text-align:center;color:var(--dga-text-muted);font-size:15px}

/* ---------- 占位页 ---------- */
.ph-card{background:white;border-radius:var(--dga-radius);box-shadow:var(--dga-shadow);padding:var(--dga-space)}
.ph-head{display:flex;align-items:center;gap:16px;padding-bottom:16px;border-bottom:1px solid var(--dga-divider-soft)}
.ph-ic{width:48px;height:48px;border-radius:8px;flex:none;display:inline-flex;align-items:center;justify-content:center;
  background:var(--dga-primary-soft);color:var(--dga-primary)}
.ph-title h2{margin:0;font-size:18px}
.ph-title .code{font-size:13px;color:var(--dga-text-muted)}
.ph-body{padding-top:16px}
.ph-body .desc{color:var(--dga-text-secondary);line-height:1.7}
.ph-body .rel{margin-top:12px;font-size:14px;color:var(--dga-text-muted)}
.ph-foot{margin-top:20px}



/* ---------- 状态文字色（规范语义色变量） ---------- */
.s-ok{color:var(--dga-success)}
.s-pending{color:var(--dga-warning)}
.s-risk{color:var(--dga-danger)}
.s-info{color:var(--dga-info)}
.risk-dot-low{background:var(--dga-success)}
.risk-dot-medium{background:var(--dga-warning)}
.risk-dot-high{background:var(--dga-danger)}

/* ---------- 业务流程说明 / 小节 ---------- */
.card-b{padding:0}
.sec-h{font:700 15px/20px var(--dga-font);color:var(--dga-text);margin:16px 0 8px}
.sec-h:first-child{margin-top:0}
.flow-desc{color:var(--dga-text-secondary);margin-bottom:12px}
.flow-list{margin:0;padding-left:20px;color:var(--dga-text-secondary)}
.flow-list li{margin:6px 0}
.acts{white-space:nowrap;text-align:right}
.acts .dga-button + .dga-button{margin-left:6px}
.doc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px}
.doc-item{display:flex;align-items:center;gap:10px;padding:12px 14px;border:1px solid var(--dga-border);border-radius:8px;background:var(--dga-surface-subtle)}
.doc-item .di{color:var(--dga-primary);flex:none;line-height:0}
.doc-item .dt b{display:block;font-size:13.5px;font-weight:600}
.doc-item .ds{display:block;font-size:12px;color:var(--dga-text-secondary);margin-top:2px}
.doc-item.doc-ok{cursor:pointer;transition:border-color .15s}
.doc-item.doc-ok:hover{border-color:var(--dga-primary)}
.doc-item.doc-no{opacity:.55;background:transparent}
.doc-item.doc-no .di{color:var(--dga-text-muted)}
.code{font-size:13px;color:var(--dga-text-muted)}
.desc{color:var(--dga-text-secondary)}

/* ---------- 风险研判 ---------- */
.risk-panel{background:var(--dga-surface-subtle);border-left:4px solid var(--dga-divider-strong);border-radius:4px;padding:12px 16px}
.risk-panel.high{border-left-color:var(--dga-danger);background:var(--dga-soft-danger)}
.risk-panel.medium{border-left-color:var(--dga-on-soft-warning);background:var(--dga-soft-warning)}
.warn-stack{display:flex;flex-direction:column;gap:12px}
.risk-panel .rh{font:700 15px/20px var(--dga-font);color:var(--dga-text)}
.risk-panel ul{margin:6px 0 0;padding-left:20px;color:var(--dga-text-secondary)}
.risk-panel ul li{margin:3px 0}

/* 注：审核步骤条的连线、圆点、标签与时间样式统一在上方「审核状态步骤条」段定义。
   此前这里另有一套「纵向时间轴」写法（竖连线 + 9px 小圆点 + 时间右对齐），
   与重构前的横向 Steps 版式不符，且其 .audit-step .dot{9px} 会覆盖上面的 16px 圆点，
   故一并移除。 */

/* ---------- 内容区栅格 ---------- */
.dga-app-content > .filter-bar + section{min-width:0}

@media (max-width:1100px){
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .di-grid,.ri-grid{grid-template-columns:1fr}
}
@media (max-width:640px){
  .cards{grid-template-columns:1fr}
  .di .k,.ri-row .k{flex:0 0 96px}
  .filter-bar{padding:12px}
}

/* ============================================================
   企业端业务样式（自旧 ui.css / enterprise.css 迁移）
   变量已统一为规范 --dga-*；壳层/导航/顶栏/弹窗/按钮一律不再自研，
   统一由 lib/style.css 的 dga-* 组件提供。
   ============================================================ */
.cards .dga-card{
  border-radius:8px;
  box-shadow:var(--dga-shadow-card);
  padding:var(--dga-space);display:flex;flex-direction:column;gap:10px;}
.cards .dga-card .row{display:flex;align-items:center;justify-content:space-between}
.cards .dga-card .ic{width:38px;height:38px;border-radius:9px;
  background:var(--dga-soft-primary);color:var(--dga-primary);
  display:inline-flex;align-items:center;justify-content:center;}
.cards .dga-card .ic svg{width:19px;height:19px}
.cards .dga-card .ic.warn{background:var(--dga-soft-warning);color:var(--dga-on-soft-warning)}
.cards .dga-card .ic.err{background:var(--dga-soft-danger);color:var(--dga-danger)}
.cards .dga-card .num{font-size:26px;font-weight:700;line-height:1.1;color:var(--dga-text)}
.cards .dga-card .lab{font-size:13px;color:var(--dga-text-muted)}
.cards .dga-card .trend{font-size:11px;color:var(--dga-text-muted)}
table{width:100%;border-collapse:collapse}
th{font-size:13px;font-weight:700;text-align:left;padding:9px var(--dga-space);color:var(--dga-on-soft-muted);background:var(--dga-surface-subtle);white-space:nowrap}
td{padding:11px var(--dga-space);font-size:13px;border-top:1px solid var(--dga-divider-soft);color:var(--dga-text)}
tr:hover td{background:var(--dga-hover-bg)}
tfoot td{background:var(--dga-surface-subtle);font-weight:600}
.tag{display:inline-flex;align-items:center;gap:5px;
  font-size:13px;border-radius:4px;
  padding:2px 9px;font-weight:500;}
.tag .dot{margin-right:0}
.tag-success{background:var(--dga-soft-success);color:var(--dga-on-soft-success)}
.tag-warning{background:var(--dga-soft-warning);color:var(--dga-on-soft-warning)}
.tag-error{background:var(--dga-soft-danger);color:var(--dga-danger)}
.tag-info{background:var(--dga-soft-primary);color:var(--dga-on-soft-info)}
.tag-neutral{background:var(--dga-surface-subtle);color:var(--dga-text-secondary)}
td.acts{white-space:nowrap}
td.acts .btn{margin-right:6px;vertical-align:middle}
.dash-alerts{display:flex;flex-direction:column;gap:10px;margin-bottom:var(--dga-space)}
.alert-card{display:flex;align-items:center;gap:12px;padding:12px var(--dga-space);
  border-radius:var(--dga-radius);border:1px solid var(--dga-soft-warning-border);
  background:var(--dga-soft-warning);}
.alert-card.danger{border-color:var(--dga-soft-danger-border);background:var(--dga-soft-danger)}
.alert-card .ic{font-size:16px;flex:0 0 auto}
.alert-card .body{flex:1;min-width:0}
.alert-card .body b{display:block;font-size:13px;color:var(--dga-text)}
.alert-card .body p{font-size:12.5px;color:var(--dga-text-secondary);margin-top:2px}
.alert-card .btn{flex:0 0 auto}
.form-wrap{width:100%}
.form-card{background:var(--dga-surface);border-radius:8px;
  box-shadow:var(--dga-shadow-card);
  margin-bottom:var(--dga-space);overflow:hidden;}
.form-sec-h{padding:13px var(--dga-space);font-weight:700;font-size:14px;
  background:var(--dga-surface-subtle);border-bottom:1px solid var(--dga-divider-soft);
  display:flex;align-items:center;justify-content:space-between;}
.form-sec-h .code{font-size:11px;font-weight:400;color:var(--dga-text-muted)}
.form-sec-h .act{font-weight:400;font-size:12.5px;color:var(--dga-primary);cursor:pointer}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px 24px;padding:var(--dga-space)}
.form-grid.one{grid-template-columns:1fr}
.f-item{display:flex;flex-direction:column;gap:5px;min-width:0}
.f-item.full{grid-column:1 / -1}
.f-item label{font-size:12.5px;color:var(--dga-text-secondary)}
.f-item label .req{color:var(--dga-danger);margin-left:2px}
.f-item label .fmt{color:var(--dga-text-muted);margin-left:6px;font-size:11px}
.f-item input,.f-item select,.f-item textarea{border:1px solid var(--dga-border);border-radius:4px;
  padding:6px 10px;font-size:13px;font-family:inherit;color:var(--dga-text);background:#fff;
  transition:border-color .15s;}
.f-item input:focus,.f-item select:focus,.f-item textarea:focus{outline:none;border-color:var(--dga-primary)}
.f-item input[readonly],.f-item input:disabled{background:var(--dga-surface-subtle);color:var(--dga-on-soft-muted)}
.f-item input.invalid,.f-item select.invalid{border-color:var(--dga-danger);background:var(--dga-soft-danger)}
.combobox{position:relative;width:100%}
.combobox .cb-input{width:100%;border:1px solid var(--dga-border);border-radius:4px;padding:6px 26px 6px 10px;font-size:13px;font-family:inherit;color:var(--dga-text);background:#fff;transition:border-color .15s}
.combobox .cb-input:focus{outline:none;border-color:var(--dga-primary)}
.combobox .cb-arrow{position:absolute;right:10px;top:50%;transform:translateY(-50%);font-size:9px;color:var(--dga-text-muted);pointer-events:none}
.cb-list{position:absolute;left:0;right:0;top:calc(100% + 4px);max-height:220px;overflow-y:auto;background:#fff;border:1px solid var(--dga-border);border-radius:4px;box-shadow:0 6px 18px rgba(16,24,40,.14);z-index:50}
.cb-item{padding:7px 12px;font-size:12.5px;color:var(--dga-text);cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cb-item:hover{background:var(--dga-soft-primary)}
.cb-empty{padding:8px 12px;font-size:12px;color:var(--dga-text-muted)}
.f-err{font-size:11.5px;color:var(--dga-danger);display:flex;align-items:center;gap:4px}
.f-err .code{font-family:'SF Mono',Menlo,Consolas,monospace;background:var(--dga-soft-danger);border-radius:3px;padding:0 4px}
.f-err-multi{grid-column:1/-1;display:flex;flex-direction:column;gap:6px;background:var(--dga-soft-danger);border:1px solid var(--dga-soft-danger-border);border-radius:4px;padding:10px 12px}
.f-err-multi .t{font-size:12.5px;font-weight:600;color:var(--dga-danger)}
.attach-list{display:flex;flex-wrap:wrap;gap:10px;padding:var(--dga-space);padding-top:4px}
.attach-chip{display:flex;align-items:center;gap:8px;border:1px dashed var(--dga-border);
  border-radius:4px;padding:9px 12px;font-size:12.5px;color:var(--dga-text-secondary);
  cursor:pointer;background:var(--dga-hover-bg);transition:all .15s;}
.attach-chip:hover{border-color:var(--dga-primary);color:var(--dga-primary)}
.attach-chip.on{border-style:solid;border-color:var(--dga-on-soft-success);color:var(--dga-on-soft-success);background:var(--dga-soft-success)}
.attach-chip.on::after{content:"✓";font-weight:700}
.attach-high{margin:4px var(--dga-space) var(--dga-space);font-size:12px;color:var(--dga-on-soft-warning);background:var(--dga-soft-warning);border-radius:4px;padding:8px 12px}
.form-foot{display:flex;align-items:center;gap:12px;padding:12px var(--dga-space);position:sticky;bottom:0;background:var(--dga-surface);border-top:1px solid var(--dga-divider-soft);z-index:2}
.scene-bar{display:flex;align-items:center;gap:10px;padding:12px var(--dga-space);background:var(--dga-soft-primary);border-radius:var(--dga-radius) var(--dga-radius) 0 0;border-bottom:1px solid var(--dga-divider-soft);flex-wrap:wrap}
.scene-bar .lbl{font-size:12.5px;color:var(--dga-text-secondary);font-weight:600}
.scene-bar .tip{flex:1;min-width:220px;font-size:11.5px;color:var(--dga-info)}
/* 演示场景：规范下拉组件（dga-select）定宽 */
.scene-bar dga-select{width:320px;flex:none}
@media(max-width:900px){.scene-bar dga-select{width:100%}}
.progress-wrap{width:100%;display:flex;flex-direction:column;gap:var(--dga-space)}
.tl-steps{display:flex;align-items:flex-start;overflow-x:auto;padding:4px 0}
.tl-step{display:flex;flex-direction:column;align-items:center;min-width:88px;flex:0 0 auto;text-align:center}
.tl-step .dot{width:14px;height:14px;border-radius:50%;border:2px solid var(--dga-border);background:#fff}
.tl-step.done .dot{background:var(--dga-primary);border-color:var(--dga-primary)}
.tl-step.warn .dot{background:var(--dga-warning);border-color:var(--dga-warning)}
.tl-step.err .dot{background:var(--dga-danger);border-color:var(--dga-danger)}
.tl-step.cur .dot{box-shadow:0 0 0 4px rgba(31,79,121,.14)}
.tl-step .lbl{font-size:12.5px;color:var(--dga-text);margin-top:7px;font-weight:500}
.tl-step .tm{font-size:11px;color:var(--dga-text-muted);margin-top:2px}
.tl-step .note{display:inline-block;margin-top:5px;font-size:11px;padding:2px 7px;border-radius:4px;background:var(--dga-soft-success);color:var(--dga-on-soft-success)}
.tl-step .note.warn{background:var(--dga-soft-warning);color:var(--dga-on-soft-warning)}
.tl-step .note.err{background:var(--dga-soft-danger);color:var(--dga-danger)}
.tl-step .note.info{background:var(--dga-soft-primary);color:var(--dga-on-soft-info)}
.tl-conn{flex:1;min-width:18px;height:2px;background:var(--dga-border);margin-top:7px}
.tl-conn.done{background:var(--dga-primary)}
.tl-empty{font-size:12.5px;color:var(--dga-text-muted);padding:6px 0}
.draft-banner{display:flex;align-items:center;gap:12px;padding:10px var(--dga-space);background:var(--dga-soft-primary);border-bottom:1px solid var(--dga-divider-soft);font-size:12.5px}
.draft-banner .t{color:var(--dga-primary);font-weight:600}
.draft-banner .tip{color:var(--dga-text-secondary)}
.amend-list-row{display:flex;align-items:center;gap:12px;padding:12px var(--dga-space);border-top:1px solid var(--dga-divider-soft)}
.amend-list-row:first-of-type{border-top:none}
.amend-list-row .info{flex:1;min-width:0}
.amend-list-row .info b{font-size:13px}
.amend-list-row .info p{font-size:12px;color:var(--dga-text-muted);margin-top:2px}
.amend-form{padding:var(--dga-space);display:flex;flex-direction:column;gap:12px}
.type-row{display:flex;gap:10px;flex-wrap:wrap}
.type-opt{border:1px solid var(--dga-border);border-radius:4px;padding:8px 14px;font-size:12.5px;cursor:pointer;color:var(--dga-text-secondary);background:#fff;transition:all .15s}
.type-opt:hover{border-color:var(--dga-primary);color:var(--dga-primary)}
.type-opt.on{border-color:var(--dga-primary);background:var(--dga-soft-primary);color:var(--dga-primary);font-weight:600}
.type-opt.dis{opacity:.45;cursor:not-allowed;pointer-events:none}
.diff-table{width:100%;border-collapse:collapse}
.diff-table td{padding:8px 10px;font-size:12.5px;border:1px solid var(--dga-divider-soft)}
.diff-table .old{color:var(--dga-danger);background:var(--dga-soft-danger)}
.diff-table .new{color:var(--dga-on-soft-success);background:var(--dga-soft-success)}
.e381-box{border:1px solid var(--dga-soft-danger-border);border-radius:var(--dga-radius);background:var(--dga-soft-danger);padding:14px var(--dga-space);display:flex;flex-direction:column;gap:8px;margin:var(--dga-space) 0}
.e381-box b{font-size:13.5px;color:var(--dga-danger)}
.e381-box p{font-size:12.5px;color:var(--dga-text)}
.detail-tbl{background:var(--dga-hover-bg)}
.detail-tbl th{background:var(--dga-surface-subtle);font-size:11.5px;padding:6px 10px}
.detail-tbl td{font-size:12.5px;padding:7px 10px}
.am-src{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center;font-size:12.5px;color:var(--dga-text-secondary);background:var(--dga-surface-subtle);border:1px solid var(--dga-border);border-radius:4px;padding:10px 12px;margin-bottom:14px}
.am-src .dot{opacity:.4}
.am-picker{max-height:230px;overflow:auto;border:1px solid var(--dga-border);border-radius:4px;padding:10px;margin-bottom:12px}
.am-picker-sec{margin-bottom:10px}
.am-picker-sec:last-child{margin-bottom:0}
.am-picker-sec-t{font-size:12px;font-weight:600;color:var(--dga-text-secondary);margin-bottom:6px}
.am-picker-grid{display:flex;flex-wrap:wrap;gap:6px}
.am-chip{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;padding:4px 10px;border:1px solid var(--dga-border);border-radius:4px;cursor:pointer;user-select:none;color:var(--dga-text-secondary);transition:all .15s}
.am-chip:hover{border-color:var(--dga-primary);color:var(--dga-primary)}
.am-chip.on{border-color:var(--dga-primary);background:var(--dga-soft-primary);color:var(--dga-primary);font-weight:600}
.am-key-tag{font-style:normal;font-size:10px;line-height:1;padding:2px 5px;border-radius:3px;background:var(--dga-soft-warning);color:var(--dga-on-soft-warning);font-weight:600}
.am-items{display:flex;flex-direction:column;gap:10px;margin-bottom:12px}
.am-item{border:1px solid var(--dga-border);border-radius:4px;padding:10px 12px}
.am-item-h{display:flex;align-items:center;gap:8px;font-size:13px;margin-bottom:8px}
.am-item-h b{font-weight:600;color:var(--dga-text)}
.am-item-del{margin-left:auto;background:none;border:none;cursor:pointer;color:var(--dga-text-muted);padding:2px;display:inline-flex}
.am-item-del:hover{color:var(--dga-danger)}
.am-item-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.am-item-grid label{display:block;font-size:11px;color:var(--dga-text-muted);margin-bottom:4px}
.am-old{font-size:13px;padding:7px 10px;background:var(--dga-surface-subtle);border:1px dashed var(--dga-border);border-radius:4px;color:var(--dga-on-soft-muted);word-break:break-all}
.am-new{width:100%;font-size:13px;padding:7px 10px;border:1px solid var(--dga-border);border-radius:4px}
.am-new:focus{outline:none;border-color:var(--dga-primary)}
.am-reason-row{display:grid;grid-template-columns:200px 1fr;gap:10px}
.am-reason-row select{font-size:13px;padding:7px 10px;border:1px solid var(--dga-border);border-radius:4px}
.am-reason-row textarea{font-size:13px;padding:7px 10px;border:1px solid var(--dga-border);border-radius:4px;resize:vertical;min-height:56px}
.am-upload{display:flex;align-items:center;gap:10px}
.am-files{font-size:12.5px;color:var(--dga-text-secondary)}
.am-confirm-note{font-size:12px;color:var(--dga-warning);margin-right:auto;align-self:center}
.am-item-h .am-field-sel{font-size:13px;padding:6px 10px;border:1px solid var(--dga-border);border-radius:4px;min-width:200px;background:#fff;color:var(--dga-text)}
.am-item-h .am-field-sel:focus{outline:none;border-color:var(--dga-primary)}
.pager{display:flex;align-items:center;gap:16px;padding:12px 4px 2px;flex-wrap:wrap}
/* 分页条：左侧页码信息（共 N 条 · 第 c / p 页），右侧换页控件 —— 企业端 / 海关端统一 */
.pager-info{font-size:12px;color:var(--dga-text-muted);margin-right:auto}
/* 弹窗内报文模板切换：规范水平标签 dga-tabs（原自制 .tab-row 已退役） */
.receipt-tabs > .dga-tablist{margin-bottom:12px}
pre.code-block{background:#07182b;color:#9ec7e6;border-radius:var(--dga-radius);padding:14px;font-size:12px;line-height:1.6;overflow-x:auto;font-family:'SF Mono',Menlo,Consolas,monospace}
pre.code-block .k{color:#7ea6c9}
pre.code-block .s{color:#b6eb8f}
.st-risk-badge{display:inline-flex;align-items:center;gap:5px;font-size:12px;white-space:nowrap}
.ops-toolbar{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:8px;margin-bottom:var(--dga-space)}
.op-ic{width:36px;height:36px;border-radius:9px;background:var(--dga-primary-soft);display:flex;align-items:center;
  justify-content:center;color:var(--dga-primary);flex:0 0 auto;}
.op-name{font-size:13.5px;font-weight:600}
.op-desc{font-size:12.5px;color:var(--dga-text-muted);line-height:1.6;margin-bottom:10px}
.op-no{font-size:12px;color:var(--dga-text-muted);margin-bottom:8px}
.op-modal-head{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.op-rows{display:flex;flex-direction:column;gap:10px}
.op-row{display:flex;align-items:flex-start;gap:10px;border:1px solid var(--dga-border);border-radius:8px;padding:10px 12px;background:var(--dga-surface)}
.op-row-desc{font-size:12px;color:var(--dga-text-muted);line-height:1.55;margin-top:3px}
.filter-panel{background:var(--dga-surface);border-radius:8px;
  box-shadow:var(--dga-shadow-card);
  padding:24px;margin-bottom:var(--dga-space);}
.fp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px var(--dga-space)}
.fp-item{display:flex;flex-direction:column;gap:6px;min-width:0}
.fp-item>span{font-size:12px;color:var(--dga-text-secondary)}
.fp-item input,.fp-item select,.fp-item dga-select .dga-input{border:1px solid var(--dga-border);border-radius:4px;
  padding:6px 10px;font-size:13px;width:100%;box-sizing:border-box;font-family:inherit;
  background:var(--dga-surface);}
/* 规范下拉（dga-select）在筛选面板里与原生输入框同高，避免一行内高度不齐 */
.fp-item dga-select{display:block}
.fp-item dga-select .dga-input{height:auto;min-height:0;line-height:1.4}
.fp-item dga-select .dga-select-trigger > span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fp-item input:focus,.fp-item select:focus{outline:none;border-color:var(--dga-primary)}
.fp-range{display:flex;align-items:center;gap:8px}
.fp-range input{flex:1;min-width:0}
.fp-sep{color:var(--dga-text-muted)}
.fp-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:14px;padding-top:12px;border-top:1px solid var(--dga-divider-soft)}
.fp-btns{display:flex;gap:8px}
.q-count{font-size:12px;color:var(--dga-text-muted)}

/* ============================================================
   登录页
   布局/尺寸/定位与重构前完全一致（左 logo 徽章 · 右侧 46% 登录卡片 ·
   左下宣传文案 · 右上语言切换 · 双层背景 + 右侧渐变模糊 + Ken Burns）；
   仅把颜色、圆角、控件高、字体换成设计规范 --dga-* 令牌。
   ============================================================ */
.login-screen{position:relative; min-height:100vh; overflow:hidden; background:#050f1c}
.login-bg-stage{position:absolute; inset:-48px; animation:login-kenburns 36s ease-in-out infinite alternate; will-change:transform}
.login-bg{position:absolute; inset:0; background:url("../assets/login-bg.jpg") center/cover no-repeat}
.login-bg.login-bg-blur{
  filter:blur(26px);
  -webkit-mask-image:linear-gradient(90deg, transparent 55%, #000 78%);
  mask-image:linear-gradient(90deg, transparent 55%, #000 78%);
}
.login-bg-customs{background:url("../assets/login-bg-customs.jpg") center/cover no-repeat}
.login-bg-customs::after{content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(5,14,28,.20) 0%, rgba(5,14,28,0) 34%, rgba(5,14,28,.45) 100%);}
.login-tone{position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(180deg, rgba(5,14,28,.10) 0%, rgba(5,14,28,0) 42%, rgba(5,14,28,.32) 100%),
             linear-gradient(90deg, rgba(5,14,28,0) 0%, rgba(5,14,28,.08) 60%, rgba(5,14,28,.26) 100%);}
.login-tone::after{content:""; position:absolute; inset:0;
  background:radial-gradient(880px 600px at 86% 50%, rgba(5,14,28,.32), transparent 70%);}
.login-topbar{position:absolute; top:34px; left:40px; z-index:30}
.login-logo-chip{display:flex; align-items:center; gap:13px; padding:9px 16px 9px 12px;
  background:var(--dga-surface); border-radius:var(--dga-radius); box-shadow:0 8px 26px rgba(0,0,0,.32);}
.login-logo-chip .brand-logo{height:38px; width:auto; display:block}
.login-logo-chip .sep{width:1px; height:32px; background:var(--dga-border)}
.login-logo-chip .sys{display:flex; flex-direction:column; line-height:1.12}
.login-logo-chip .sys b{color:var(--dga-primary); font-size:15px; letter-spacing:.4px; font-weight:700}
.login-logo-chip .sys span{color:var(--dga-text-secondary); font-size:10px; letter-spacing:1.4px; text-transform:uppercase; margin-top:3px}
.login-panel{position:absolute; top:0; bottom:0; right:0; width:46%; z-index:10;
  display:flex; align-items:center; justify-content:center; padding:0 3vw}
.login-card{width:404px; max-width:100%;
  background:var(--dga-surface); border-radius:var(--dga-radius-lg);
  padding:40px 38px 32px;
  box-shadow:0 1px 2px rgba(16,24,40,.05), 0 1px 3px rgba(16,24,40,.06), 0 28px 70px rgba(0,0,0,.5);}
.login-brand-title .eyebrow{display:flex; align-items:center; gap:10px; color:var(--dga-primary);
  font-size:11px; letter-spacing:2.6px; text-transform:uppercase; font-weight:700; margin-bottom:14px}
.login-brand-title .eyebrow::before{content:""; width:24px; height:2px; background:var(--dga-primary)}
.login-brand-title h1{font-size:26px; font-weight:700; letter-spacing:.5px; color:var(--dga-text); line-height:1.22}
.login-brand-title small{display:block; font-size:12.5px; font-weight:500; color:var(--dga-text-secondary);
  letter-spacing:1.2px; margin-top:7px; text-transform:uppercase; line-height:1.5}
.login-form{display:flex; flex-direction:column; gap:15px; margin-top:30px}
.login-form .fld{display:flex; flex-direction:column; gap:7px}
.login-form .fld label{font-size:12.5px; font-weight:600; color:var(--dga-text); letter-spacing:.4px}
.login-form .fld .wrap{position:relative; display:flex; align-items:center}
.login-form .fld .ico{position:absolute; left:13px; width:16px; height:16px; color:var(--dga-text-muted); z-index:1}
.login-form .fld input{width:100%; height:var(--dga-height); padding:0 12px 0 40px;
  font-size:14px; font-family:inherit; color:var(--dga-text);
  border:1px solid var(--dga-border); border-radius:var(--dga-radius-sm);
  transition:border-color .18s, box-shadow .18s; letter-spacing:.3px;}
.login-form .fld input::placeholder{color:var(--dga-text-muted)}
.login-form .fld input:hover{border-color:var(--dga-border-hover)}
.login-form .fld input:focus{outline:none; border-color:var(--dga-primary); box-shadow:0 0 0 3px rgba(25,70,136,.12)}
.login-btn{height:var(--dga-height); border:none; border-radius:var(--dga-radius-sm);
  background:var(--dga-primary); color:#fff; font-size:15px; font-weight:600; cursor:pointer;
  font-family:inherit; letter-spacing:.18em; transition:background .15s, transform .12s;}
.login-btn:hover{background:var(--dga-primary-hover)}
.login-btn:active{background:var(--dga-primary); transform:translateY(1px)}
.login-btn:disabled{opacity:.7; cursor:wait}
.login-fill{font-size:12px; color:var(--dga-on-soft-info); background:var(--dga-soft-primary);
  border-radius:var(--dga-radius-sm); padding:8px 12px}
.login-hint{margin-top:0; font-size:11.5px; color:var(--dga-text-muted); text-align:center; padding:0 10px}
.login-lang-top{position:absolute; top:34px; right:calc(23vw - 202px); z-index:30; display:flex; align-items:center; gap:10px}
.login-lang-top .lbl{font-size:11px; color:rgba(255,255,255,.62); letter-spacing:1px; text-transform:uppercase}
#loginLangSel{width:150px; height:var(--dga-height); padding:0 36px 0 14px;
  background:var(--dga-soft-primary); border:1px solid var(--dga-soft-primary-border);
  border-radius:var(--dga-radius);
  color:var(--dga-primary); font-size:14px; font-weight:600;
  font-family:inherit; cursor:pointer; letter-spacing:.3px;
  appearance:none; -webkit-appearance:none; -moz-appearance:none;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23194688' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 12px center;
  transition:border-color .15s, box-shadow .15s;}
/* 登录页右上语言切换容器（id 选择器，特异性高于 .login-lang-top——原始即如此） */
#loginLang{display:flex;justify-content:center;gap:8px;margin-top:18px}
#loginLang .lbl{color:#fff;opacity:.5;font-size:12px;align-self:center}

#loginLangSel:hover{border-color:var(--dga-primary)}
#loginLangSel:focus{outline:none; border-color:var(--dga-primary); box-shadow:0 0 0 3px rgba(25,70,136,.12)}
.login-slogan{position:absolute; left:40px; bottom:150px; z-index:30; max-width:46vw; pointer-events:none}
.login-slogan .slogan-line{width:46px; height:3px; border-radius:2px; margin-bottom:18px; background:linear-gradient(90deg,#7ea6c9, rgba(126,166,201,.15))}
.login-slogan .slogan-title{margin:0; font-size:40px; font-weight:700; letter-spacing:1px; line-height:1.25; color:#fff;
  text-shadow:0 1px 3px rgba(0,0,0,.5), 0 3px 12px rgba(0,0,0,.45), 0 10px 30px rgba(0,0,0,.4)}
.login-slogan .slogan-sub{margin:16px 0 0; font-size:16px; font-weight:500; letter-spacing:2px; line-height:1.8;
  color:rgba(255,255,255,.78); text-shadow:0 1px 2px rgba(0,0,0,.6), 0 2px 8px rgba(0,0,0,.45)}
@keyframes login-kenburns{
  0%{transform:scale(1.02) translate(0,0)}
  100%{transform:scale(1.13) translate(-2.4%, -1.4%)}
}
@media (prefers-reduced-motion: reduce){ .login-bg-stage{animation:none} }
@media (max-width:960px){ .login-slogan{display:none} }

/* 海关端登录页角色切换（用户名标签右侧胶囊下拉，位置与尺寸同重构前） */
.fld-lbl-row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.role-select{appearance:none;-webkit-appearance:none;
  font-size:12px; font-weight:600; color:var(--dga-primary);
  background-color:transparent; border:1px solid var(--dga-border); border-radius:14px;
  padding:3px 26px 3px 10px; cursor:pointer; font-family:inherit; max-width:240px;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%23194688' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 8px center;
  transition:border-color .15s, background-color .15s;}
.role-select:hover{border-color:var(--dga-primary); background-color:var(--dga-hover-bg)}
.role-select:focus{outline:none; border-color:var(--dga-primary); box-shadow:0 0 0 3px rgba(25,70,136,.12)}
