@charset "utf-8";
/* ============================================================================
 * gudong.pro · H5 统一视觉层  h5-ui.css
 * 版本：v1（2026-11-03）  主色：藏青 #16365F
 * ----------------------------------------------------------------------------
 * 设计语言：藏青立骨、米金点睛、灰阶承载信息。
 * 使用方式：header_m.php 统一引入，全站 H5 自动生效；
 *          结构改造页（案件页/委托详情/委托三页）另用 .gd-* 组件类。
 * 原则：只覆盖颜色、圆角、投影、字重等"皮肤"，不改布局尺寸与 DOM 结构，
 *      避免影响各页既有 JS 与表单交互。
 * ========================================================================== */

:root{
  --gd-navy:#16365F;
  --gd-navy-2:#1E4874;
  --gd-navy-deep:#122B4D;
  --gd-gold:#C7A96B;
  --gd-gold-bg:#FBF6EC;
  --gd-gold-line:#EFE2C6;
  --gd-gold-text:#7A5B1E;
  --gd-ink:#0F1B2D;
  --gd-ink2:#5A6779;
  --gd-ink3:#9AA5B4;
  --gd-line:#E7ECF2;
  --gd-line2:#EFF3F8;
  --gd-bg:#F4F6FA;
  --gd-green:#1F6F54;
  --gd-amber:#B45309;
  --gd-red:#B3261E;
  --gd-radius-card:14px;
  --gd-radius-btn:12px;
  --gd-shadow-card:0 1px 2px rgba(16,32,56,.04), 0 10px 24px -16px rgba(16,32,56,.22);
}

/* ---------------------------------------------------------------------------
 * 1. 主题变量：一次换掉全站主色（weui 通过 CSS 变量取色）
 * ------------------------------------------------------------------------- */
body, html body{
  --weui-BRAND:#16365F !important;
  --weui-LINK:#16365F !important;
  --weui-BG:#F4F6FA !important;
  --weui-BG-0:#F4F6FA !important;
  --weui-BG-1:#F4F6FA !important;
  --weui-BG-2:#FFFFFF !important;
  --weui-BG-3:#FFFFFF !important;
  --weui-BG-COLOR-ACTIVE:#EFF3F8 !important;
  /* 不覆盖 --weui-FG-* ：各页正文颜色依赖它，改了会让既有页面文字整体变浅
     （实测：委托详情时间线文字从 #000 变灰，可读性下降）。文字色由各页自己控制。 */
  background-color:#F4F6FA;
}

/* ---------------------------------------------------------------------------
 * 2. 按钮
 * ------------------------------------------------------------------------- */
.weui-btn{
  border-radius:var(--gd-radius-btn) !important;
  font-weight:500;
  letter-spacing:.5px;
}
.weui-btn_primary{
  background:linear-gradient(180deg,#1E4874 0%, #16365F 100%) !important;
  box-shadow:0 8px 18px -10px rgba(22,54,95,.6), inset 0 1px 0 rgba(255,255,255,.12);
}
.weui-btn_primary:not(.weui-btn_disabled):active{
  background:var(--gd-navy-deep) !important;
}
.weui-btn_default{
  background:#fff !important;
  border:1px solid var(--gd-line) !important;
  color:var(--gd-ink2) !important;
  box-shadow:none;
}
.weui-btn_warn{
  background:#fff !important;
  border:1px solid #F2D6D3 !important;
  color:var(--gd-red) !important;
}

/* ---------------------------------------------------------------------------
 * 3. 卡片 / 列表容器
 * ------------------------------------------------------------------------- */
.weui-cells{
  margin:12px 16px !important;
  border-radius:var(--gd-radius-card);
  background:#fff;
  box-shadow:var(--gd-shadow-card);
  overflow:hidden;
}
/* 去掉 weui 默认的上下贯通细线（与圆角冲突） */
.weui-cells:before,
.weui-cells:after{ display:none !important; }

.weui-cell{ padding:14px 16px; }
.weui-cell:before{ border-top:1px solid var(--gd-line2) !important; left:16px !important; right:16px !important; }
.weui-cells__title{
  color:var(--gd-ink3) !important;
  font-size:12.5px !important;
  font-weight:400 !important;
  padding:14px 20px 6px !important;
}
.weui-label{ font-size:13px !important; color:#8B95A5 !important; width:auto !important; }
.weui-input{ font-size:15px !important; color:var(--gd-ink); }
.weui-input::placeholder{ color:#B6BFCC; }

/* ---------------------------------------------------------------------------
 * 4. 标题 / 文本层级
 * ------------------------------------------------------------------------- */
.weui-form__title,
.page-title{
  font-size:20px !important;
  font-weight:600 !important;
  color:var(--gd-navy) !important;
  letter-spacing:.3px;
}
.weui-form__desc,
.weui-cells__tips{ color:var(--gd-ink3) !important; font-size:12px !important; line-height:1.7; }
.weui-link{ color:var(--gd-navy) !important; }

/* ---------------------------------------------------------------------------
 * 5. 底部导航
 * ------------------------------------------------------------------------- */
.weui-tabbar{
  border-top:1px solid var(--gd-line);
  background:rgba(255,255,255,.96) !important;
  -webkit-backdrop-filter:saturate(180%) blur(12px);
  backdrop-filter:saturate(180%) blur(12px);
}
.weui-tabbar__label{ font-size:10.5px !important; color:#A6B0BE !important; letter-spacing:.2px; }
.weui-tabbar__item.weui-bar__item_on .weui-tabbar__label{ color:var(--gd-navy) !important; font-weight:500; }

/* ---------------------------------------------------------------------------
 * 6. 页脚
 * ------------------------------------------------------------------------- */
.weui-footer__text{ font-size:11px !important; color:#B3BCC8 !important; line-height:1.9; }
.weui-footer__link{ color:var(--gd-ink2) !important; font-size:12px; }

/* ---------------------------------------------------------------------------
 * 7. 通用小组件（结构改造页共用）
 * ------------------------------------------------------------------------- */

/* 返回栏：sticky，滚动不消失。流程页替代 tabbar 承担"退得出"的责任 */
.gd-topbar{
  position:sticky; top:0; z-index:20;
  display:flex; align-items:center; height:44px; padding:0 12px;
  background:rgba(244,246,250,.94);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
}
.gd-topbar a{
  display:inline-flex; align-items:center; gap:4px;
  font-size:14px; color:var(--gd-ink2); text-decoration:none; letter-spacing:.2px; padding:6px 4px;
}
.gd-topbar a svg{ width:16px; height:16px; }

/* 步骤条：done=金底对勾，cur=藏青实心，未到=浅灰 */
.gd-steps{ display:flex; align-items:center; margin:0 16px; }
.gd-steps .sp{ display:flex; align-items:center; gap:6px; flex:none; }
.gd-steps .sp i{
  width:18px; height:18px; border-radius:50%; background:#DCE3EC; color:#fff;
  font-size:11px; font-style:normal; font-weight:600;
  display:flex; align-items:center; justify-content:center;
}
.gd-steps .sp span{ font-size:11.5px; color:var(--gd-ink3); white-space:nowrap; }
.gd-steps .sp.on i{ background:var(--gd-navy); }
.gd-steps .sp.on span{ color:var(--gd-navy); font-weight:500; }
.gd-steps .sp.ok i{ background:var(--gd-gold); }
.gd-steps .sp.ok span{ color:var(--gd-ink2); }
.gd-steps .ln{ flex:1 1 auto; height:1px; background:#E3E9F1; margin:0 6px; }

/* 卡片（自定义结构用，与 .weui-cells 视觉一致） */
.gd-card{
  margin:12px 16px 0; background:#fff; border-radius:var(--gd-radius-card);
  box-shadow:var(--gd-shadow-card); overflow:hidden;
}
.gd-card__hd{ padding:15px 16px 6px; font-size:14px; font-weight:600; letter-spacing:.2px; }
.gd-card__hd small{ font-weight:400; font-size:12px; color:var(--gd-ink3); margin-left:6px; }

/* 状态标签：描边 + 浅底，不用实心色块 */
.gd-tag{
  display:inline-block; font-size:11px; line-height:1; padding:4px 7px; border-radius:5px;
  color:var(--gd-gold-text); background:var(--gd-gold-bg); border:1px solid var(--gd-gold-line);
  white-space:nowrap;
}
.gd-tag--ok{ color:var(--gd-green); background:#F1F7F4; border-color:#D8E8E0; }
.gd-tag--gray{ color:#6B7787; background:#F2F5F9; border-color:var(--gd-line); }
.gd-tag--warn{ color:var(--gd-amber); background:#FDF6EC; border-color:#F3E2C7; }

/* 分段控件：浅灰槽 + 白色胶囊，替代"蓝灰实心按钮" */
.gd-seg{ display:flex; background:#EAEEF4; border-radius:11px; padding:3px; }
.gd-seg a{
  flex:1 1 0; text-align:center; height:34px; line-height:34px; border-radius:9px;
  font-size:13.5px; color:var(--gd-ink2); text-decoration:none;
}
.gd-seg a.on{
  background:#fff; color:var(--gd-navy); font-weight:600;
  box-shadow:0 1px 2px rgba(16,32,56,.06), 0 3px 10px -6px rgba(16,32,56,.28);
}

/* 提示条：米金底，替代整段红色加粗 */
.gd-tip{
  display:flex; gap:9px; align-items:flex-start;
  margin:12px 16px 0; padding:11px 13px;
  background:var(--gd-gold-bg); border:1px solid var(--gd-gold-line); border-radius:11px;
}
.gd-tip svg{ width:15px; height:15px; flex:none; margin-top:1px; color:#B08A3E; }
.gd-tip p{ margin:0; font-size:12px; line-height:1.6; color:var(--gd-gold-text); }