/* ============================================================
   ROFilter base.css — 全局基础：变量 / reset / 通用组件 / 登录页
   风格：ro-membrane（深蓝 #002f5d + 浅灰蓝底 #f4f7f9 + 白卡片圆角 + 橙色激活 #f39c12）
   ============================================================ */

:root {
  --c-primary: #002f5d;        /* ro-membrane 深蓝 */
  --c-primary-dark: #002548;
  --c-head-bg: #eef4fa;       /* 表头浅蓝 */
  --c-head-bg2: #dce9f5;
  --c-border: #b9cfe4;        /* 浅蓝边框 */
  --c-border-light: #d5e2ee;
  --c-bg-soft: #f4f7f9;       /* 只读/自动值底色 */
  --c-text: #1a2733;
  --c-text-sub: #5a6b7b;
  --c-readonly: #eef2f6;      /* 只读输入背景 */
  --c-warn: #c0392b;
  --c-ok: #1e7e34;
  --c-link: #005596;
  --c-accent: #f39c12;        /* 橙色激活 */
  --fs: 12px;                 /* 工程软件紧凑字号 */
  --row-h: 24px;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

body {
  font-family: "Segoe UI", "Microsoft YaHei", Tahoma, sans-serif;
  font-size: var(--fs);
  color: var(--c-text);
  background: #f4f7f9;  /* 页面整体底色（浅灰蓝，ro-membrane 风格） */
  min-width: 1180px;
}

input, select, button, textarea { font-family: inherit; font-size: var(--fs); }
input[type=text], input[type=number], input[type=password], input[type=date],
input[type=email], input[type=url], input[type=tel], input[type=search] {
  border: 1px solid var(--c-border);
  background: #fff;
  padding: 2px 4px;
  height: var(--row-h);
  border-radius: 2px;
  color: var(--c-text);
  width: 118px;   /* 全局紧凑默认宽：未显式指定宽度的独立输入框统一收窄；表格/局部样式（width:100% 或定宽）不受影响 */
  max-width: 100%;
  box-sizing: border-box;
}
input:focus, select:focus { outline: 1px solid var(--c-primary); }
/* 只读 / 自动计算值：靠「浅灰底 + 淡左边框」与可编辑框区分，不用斜体、颜色也不压深 */
input[readonly], input.auto, input:disabled {
  background: #f6f8fb;
  color: #6f7f92;
  border-color: #dde5ee;
  border-left: 2px solid #b9cde3;
}
/* 可编辑框：明确的白底，聚焦时淡蓝高亮（与只读形成对比但不刺眼） */
input:not([readonly]):not(:disabled):not([type="checkbox"]):not([type="radio"]):not(.auto) {
  background: #fff;
}
input:not([readonly]):not(:disabled):not([type="checkbox"]):not([type="radio"]):focus {
  outline: none;
  border-color: #4a90d9;
  box-shadow: 0 0 0 2px rgba(74, 144, 217, .14);
}
/* 自动计算值旁边的单位文字也弱化 */
.auto ~ .unit-sel, .auto ~ .unit { color: #90a0b0; }
select { border: 1px solid var(--c-border); height: var(--row-h); background: #fff; border-radius: 2px; padding: 0 2px; }
label { user-select: none; }

/* ---------- 通用按钮（白卡片圆角风格，激活橙） ---------- */
.btn {
  display: inline-block;
  padding: 4px 14px;
  border: 1px solid var(--c-border);
  background: linear-gradient(#ffffff, #e8f1fb);
  color: var(--c-primary-dark);
  cursor: pointer;
  border-radius: 6px;
  height: 26px;
  transition: all .12s;
}
.btn:hover { background: linear-gradient(#ffffff, #d8e9fa); }
.btn:active { background: #d0e4f7; }
.btn.primary {
  background: linear-gradient(#f5a623, #e8920c);
  border-color: #d9850a;
  color: #fff;
  box-shadow: 0 1px 3px rgba(243,156,18,.35);
}
.btn.primary:hover { background: linear-gradient(#f7b130, #e8920c); }
.btn.block { display: block; width: 100%; }
.btn.on { background: #f39c12; color: #fff; border-color: #e08a06; }
.btn.danger { color: #b02a1e; border-color: #d9a09a; }

/* ---------- ROFILTER 表格（核心组件） ---------- */
.rofilter-table {
  border-collapse: collapse;
  width: 100%;
  background: #fff;
}
.rofilter-table th, .rofilter-table td {
  border: 1px solid var(--c-border-light);
  padding: 1px 5px;
  height: 27px;
  vertical-align: middle;
  white-space: nowrap;
}
.rofilter-table th {
  /* 需求：全系统表头统一深藏蓝渐变 + 白字（同阳/阴离子表标题栏模式） */
  background: linear-gradient(#0a4d8c, #002f5d);
  color: #fff;
  font-weight: 600;
  text-align: left;
}
.rofilter-table .rowhead {
  background: var(--c-head-bg);
  font-weight: 600;
  color: #123c5e;
}
.rofilter-table input[type=number], .rofilter-table input[type=text] { width: 100%; border: 1px solid #b9cee4; }

/* 表格内的小单位下拉 */
.unit-sel { border: 1px solid #b9cee4; height: 22px; font-size: 11px; }

/* S / # 标记（rofilter.cn: S=系统算, #=可输入） */
.mark-s, .mark-i {
  display: inline-block; width: 14px; text-align: center;
  font-weight: bold; font-size: 10px; cursor: default;
}
.mark-s { color: #7a52c7; }   /* S 紫 */
.mark-i { color: #999; }       /* # 灰 */

/* ---------- 通用工具类 ---------- */
.hidden { display: none !important; }

/* 单位列（参数名后一列）：浅蓝灰底色高亮 / 文字居中 / 固定合适宽度 */
.rofilter-table td.unit-td {
  background: #eef3f8;
  color: #3d5773;
  text-align: center;
  font-size: 11px;
  white-space: nowrap;
  min-width: 78px;
}

/* 必填项空值高亮（未输入/非法时黄橙底色警示，输入合法值后恢复） */
input.req-empty, select.req-empty {
  background: #fff3cd !important;
  border: 1.5px solid #e6a817 !important;
}
input.req-empty:focus { outline: 2px solid rgba(230,168,23,.35); }
.mt8 { margin-top: 8px; }
.mt16 { margin-top: 16px; }
.w40 { width: 40px; } .w60 { width: 60px; } .w70 { width: 70px; }
.w80 { width: 80px; } .w90 { width: 90px; } .w110 { width: 110px; }
.w120 { width: 120px; } .w150 { width: 150px; }
.txt { padding: 2px 5px; border: 1px solid var(--c-border); height: 24px; border-radius: 2px; }
.link-btn { color: var(--c-link); cursor: pointer; text-decoration: underline; }
.link-btn:hover { color: #d35400; }
.chk-line { display: inline-flex; align-items: center; gap: 4px; margin-right: 12px; cursor: pointer; }
.chk-line input { margin: 0; }

/* 警告条 */
.warn-box {
  border: 1px solid #e8b4ad;
  background: #fdf0ee;
  color: #8a2e22;
  padding: 5px 10px;
  margin-top: 6px;
  border-radius: 3px;
}
.warn-box b { color: #a93226; }

/* 计算摘要 pre */
.summary-box {
  background: var(--c-bg-soft);
  border: 1px solid var(--c-border-light);
  padding: 10px 14px;
  font-family: Consolas, "Courier New", monospace;
  font-size: 12px;
  line-height: 1.7;
  border-radius: 3px;
  white-space: pre-wrap;
}

/* ---------- toast（屏幕居中醒目提示） ---------- */
.toast {
  position: fixed;
  bottom: 12%; top: auto; left: 50%;
  transform: translateX(-50%);
  background: rgba(18, 43, 70, .9);
  color: #fff;
  padding: 12px 26px;
  border-radius: 12px;
  z-index: 3200;
  box-shadow: 0 10px 34px rgba(0, 20, 40, .4);
  border: 1px solid rgba(255,255,255,.14);
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  max-width: 78%;
  font-size: 13.5px;
  font-weight: 600;
  line-height: 1.6;
  text-align: center;
  animation: toast-in .25s ease;
}
/* 校验拦截警示：橙红醒目 */
.toast.toast-warn {
  background: linear-gradient(#e75a3a, #d14222);
  border-color: #b5381d;
  font-size: 14.5px;
  box-shadow: 0 8px 34px rgba(200, 60, 20, .5);
}
/* 成功提示：绿色 */
.toast.toast-ok {
  background: linear-gradient(rgba(45,154,85,.94), rgba(30,126,64,.96));
  border-color: #156b34;
  box-shadow: 0 10px 32px rgba(20, 120, 60, .4);
}
@keyframes toast-in {
  from { opacity: 0; transform: translateX(-50%) translateY(14px); }
  to { opacity: 1; transform: translateX(-50%) translateY(0); }
}

/* ---------- 页脚：版权声明 + ICP 备案号（工信部要求：网页底部展示，链接至备案系统） ---------- */
.icp-footer {
  display: block; text-align: center;
  padding: 14px 16px 18px;
  font-size: 13px;
  color: #6b7a8a;
  letter-spacing: .3px;
}
.icp-footer .icp-row { font-size: 13px; line-height: 1.9; }
.icp-footer .icp-copy { color: #5f6d7c; }
/* 版权主体可点击发信 */
.icp-footer .icp-mail {
  color: #5f6d7c; text-decoration: none;
  border-bottom: 1px dotted #a9b8c6;
}
.icp-footer .icp-mail:hover { color: #1c5c9c; border-bottom-color: #1c5c9c; }
/* 工程免责提示：与版权行同字号，弱化颜色 */
.icp-footer .icp-note { color: #6b7a8a; }
/* 分隔点由后项 ::before 携带：窄屏换行时点始终跟随链接，不在行尾孤立 */
/* 备案号连同图标整体不换行：窄屏只允许在两条备案之间折行，避免编号被拆成两截 */
.icp-footer .icp-beian { white-space: nowrap; }
.icp-footer .icp-beian::before {
  content: "·";
  margin-right: 4px;
  margin-left: 0;
  color: #c0cbd6;
}
.icp-footer a { color: #6b7a8a; text-decoration: none; transition: color .15s; }
.icp-footer a:hover { color: #4a7bb5; text-decoration: underline; }
/* 登录页页脚：fixed 于视口底部居中，不参与登录卡片的 flex 居中布局 */
.icp-footer.icp-fixed {
  position: fixed; left: 0; right: 0; bottom: 8px;
  padding: 0 16px; z-index: 101;
}
/* 矮屏（笔记本小窗/手机横屏）：为固定页脚预留空间，避免遮挡卡片底部按钮 */
@media (max-height: 700px) {
  .login-screen { align-items: flex-start; padding-top: 18px; padding-bottom: 136px; overflow-y: auto; }
}

/* ---------- 登录页（深蓝头部 + 白卡片圆角） ---------- */
.login-screen {
  position: fixed; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: #f4f7f9;
  z-index: 100;
}
.login-card {
  width: 380px;
  background: #fff;
  border: 1px solid var(--c-border-light);
  border-top: 4px solid #002f5d;
  padding: 34px 36px 26px;
  border-radius: 12px;
  box-shadow: 0 8px 32px rgba(0, 47, 93, .16);
  position: relative;
}
/* 登录页语言切换按钮（卡片右上角）
   双类选择器提高特异性：layout.css 的 .banner-btn（白字/近白底）后加载会覆盖
   单类 .login-lang-btn，导致登录卡片上白字白底不可见 —— 特异性 0,2,0 > 0,1,0 确保胜出 */
.banner-btn.login-lang-btn {
  position: absolute;
  top: 10px; right: 10px;
  height: 24px; padding: 0 10px;
  font-size: 11px;
  background: #eef3f8;
  border: 1px solid #b9cee4;
  border-radius: 3px;
  color: #123c5e;
  cursor: pointer;
}
.banner-btn.login-lang-btn:hover { background: #dceaf7; }
.login-logo {
  font-size: 32px; font-weight: 800; letter-spacing: 1px;
  color: #002f5d; text-align: center;
  display: flex; align-items: center; justify-content: center; gap: 10px;
}
/* 品牌标识：青绿渐变水滴 + RO/Filter 双色字标（无外部字体依赖，全站一致） */
.rf-mark { display: block; width: 26px; height: 26px; flex: 0 0 auto; color: inherit; }
.rf-word {
  display: inline-flex; align-items: baseline; line-height: 1; white-space: nowrap;
  font-family: "Segoe UI Semibold", "Segoe UI", "Helvetica Neue", Arial, system-ui, sans-serif;
  font-size: 16px; letter-spacing: .2px; color: inherit;
}
/* RO：加粗 + 青绿渐变（不支持渐变文字时回退纯色） */
.rf-word b {
  font-weight: 800; letter-spacing: -.25px; color: #10A79B;
  background-image: linear-gradient(135deg, #2ED9A8 0%, #14B3A5 48%, #0B8F92 100%);
  -webkit-background-clip: text; background-clip: text;
}
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .rf-word b { color: transparent; }
}
/* Filter：细体，颜色跟随容器（深底白、浅底墨） */
.rf-word i {
  font-style: normal; font-weight: 300; letter-spacing: .65px;
  margin-left: 3px; color: inherit;
}
.login-logo .rf-mark { width: 44px; height: 44px; }
.login-logo .rf-word { font-size: 27px; }
.login-sub {
  display: flex; flex-direction: column; align-items: center; gap: 2px;
  margin: 4px 0 22px;
}
/* 中文主行（以中文为准） */
.login-sub .ls-cn { font-size: 13px; font-weight: 600; color: #2c4a66; letter-spacing: 1px; }
/* 英文副行（小字弱化） */
.login-sub .ls-en { font-size: 10.5px; color: var(--c-text-sub); letter-spacing: .4px; }
.login-card input { width: 100%; margin-bottom: 12px; height: 34px; padding: 4px 8px; }
.login-card .btn { width: 100%; height: 36px; font-size: 14px; }
/* 登录验证码：输入框 + 图形，同一行等高；点击图片可更换 */
.login-captcha-row { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.login-captcha-row input { flex: 1 1 auto; min-width: 0; margin-bottom: 0 !important; letter-spacing: 3px; text-transform: uppercase; }
.login-captcha-row .captcha-img {
  flex: 0 0 auto; width: 118px; height: 36px; border: 1px solid var(--c-border);
  border-radius: 4px; background: #f3f7fb; cursor: pointer; user-select: none; object-fit: contain;
}
.login-captcha-row .captcha-img:active { opacity: .75; }
.login-error { color: var(--c-warn); min-height: 18px; text-align: center; margin-top: 6px; font-size: 12px; }
.login-hint { text-align: center; color: var(--c-text-sub); font-size: 11px; margin-top: 10px; }
/* 品牌专属入口：登录页品牌 logo 图 + 入驻注册链接 */
.login-logo img.login-brand-img {
  max-height: 56px; max-width: 210px; vertical-align: middle; margin-right: 8px;
  display: inline-block; object-fit: contain;
}
.login-reg { text-align: center; color: var(--c-text-sub); font-size: 11.5px; margin-top: 12px; }
.login-reg a { color: var(--c-link); text-decoration: none; font-weight: 600; }
.login-reg a:hover { text-decoration: underline; }

/* 公安备案图标：与文字基线对齐，宽度按原图 36x40 等比缩到 18x20
   （选择器不限定 .icp-footer，站点页脚 site-footer 同样复用该类） */
.beian-ico {
  width: 18px;
  height: 20px;
  margin-right: 4px;
  vertical-align: -4px;
  display: inline-block;
}

/* ICP 备案图标（SVG 自绘：政务蓝印章 + 「备」字），方形，与公安备案 png 视觉重量相当 */
.beian-icp-ico {
  width: 18px;
  height: 18px;
  margin-right: 4px;
  vertical-align: -3px;
  display: inline-block;
}

/* 已标定元件徽章：绿色盾形对勾，用于元件列表 / 推荐弹窗 / 后台元件表 */
.calib-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 15px;
  height: 15px;
  margin-right: 4px;
  flex: none;
  color: #12a05a;
  vertical-align: -2px;
  cursor: help;
}
.calib-badge svg { display: block; }
.calib-badge:hover { color: #0b7d44; }
.adv-check { display: inline-flex; align-items: center; gap: 6px; }
.adv-check input[type="checkbox"] { width: 15px; height: 15px; accent-color: #12a05a; }
.adv-check span { font-size: 12px; color: var(--c-text-sub, #666); }
.calib-state {
  display: inline-block;
  margin-left: 6px;
  padding: 0 6px;
  font-size: 10px;
  line-height: 15px;
  border-radius: 8px;
  vertical-align: 1px;
  background: #e6f6ec;
  color: #0f7a45;
  border: 1px solid #bfe6cf;
  white-space: nowrap;
}
.calib-state.off { background: #f2f3f5; color: #7a8189; border-color: #e0e3e7; }

/* ============================================================
   全站数字对齐（系统选项 → 界面显示 → 数字对齐）
   此前各页面各自写 text-align：分析页离子框左对齐、后处理离子框右对齐、
   设计基础右对齐，同一套数据在不同页读起来手感完全不同。
   这里统一收口到 body[data-align]，用 !important 覆盖各页局部规则。
   只作用于输入框与数值单元格，不碰说明文字、表头与文本域。
   ============================================================ */
body[data-align="left"]   { --num-align: left; }
body[data-align="center"] { --num-align: center; }
body[data-align="right"]  { --num-align: right; }

body[data-align] input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="color"]):not([type="range"]):not([type="button"]):not([type="submit"]):not([type="reset"]),
body[data-align] td.num,
body[data-align] th.num,
body[data-align] .num,
body[data-align] .cell-num,
body[data-align] .res-val,
body[data-align] .kv-num {
  text-align: var(--num-align, right) !important;
}

/* 双语文案显隐：跟随 <html lang> 切换（i18n.js 切换语言时会同步该属性）
   .i18n-cn 中文段、.i18n-en 英文段，两者可并存于同一容器 */
html[lang="en"] .i18n-cn { display: none !important; }
html[lang="zh-CN"] .i18n-en, html:not([lang]) .i18n-en { display: none !important; }