/* ============================================
   体检项目管理系统 H5 样式
   ============================================ */
* { margin:0; padding:0; box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
html,body { height:100%; }
body {
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Helvetica Neue", "Microsoft YaHei", sans-serif;
  font-size: 14px;
  color: #333;
  background: #f5f5f5;
  overflow: hidden;
}
input, button, textarea { font-family: inherit; outline: none; border: none; background: transparent; }

:root {
  --primary: #1ec792;
  --primary-dark: #16a578;
  --primary-light: #d8f5e9;
  --red: #ff5757;
  --orange: #ff8a3c;
  --gray-1: #f5f5f5;
  --gray-2: #ebebeb;
  --gray-3: #d8d8d8;
  --gray-5: #999;
  --gray-7: #666;
  --gray-9: #333;
  --shadow: 0 2px 8px rgba(0,0,0,.06);
}

.app {
  position: relative;
  width: 100%;
  max-width: 480px;
  margin: 0 auto;
  height: 100vh;
  background: #fff;
  overflow: hidden;
}

/* ===== 视图切换 ===== */
.view {
  position: absolute;
  inset: 0;
  display: none;
  flex-direction: column;
  background: #fff;
}
.view.active { display: flex; }

/* ===== 顶部栏 ===== */
.topbar {
  display: flex;
  align-items: center;
  height: 48px;
  padding: 0 14px;
  background: linear-gradient(135deg, #1ec792 0%, #16b884 100%);
  box-shadow: 0 1px 0 rgba(0, 0, 0, .04);
  flex-shrink: 0;
  position: relative;
  z-index: 5;
}
.topbar-left { width: 36px; cursor: pointer; flex-shrink: 0; }
.topbar-title { position: absolute; left: 0; right: 0; text-align: center; font-size: 17px; font-weight: 700; color: #fff; letter-spacing: .5px; pointer-events: none; }
.topbar-right { display: flex; gap: 16px; align-items: center; margin-left: auto; }
.top-icon { font-size: 20px; color: #fff; cursor: pointer; line-height: 1; opacity: .95; }
.icon-back::before {
  content: "‹";
  font-size: 38px;
  color: #ffffff;
  line-height: 1;
}

/* ===== 头部品牌+搜索 ===== */
.head-bar {
  display: flex;
  align-items: center;
  padding: 8px 12px;
  gap: 10px;
  background: #fff;
  flex-shrink: 0;
}
.brand {
  font-size: 22px;
  font-weight: 900;
  font-style: italic;
  background: linear-gradient(135deg, #1ec792 30%, #16a578 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: 1px;
}
.search {
  flex: 1;
  display: flex;
  align-items: center;
  height: 34px;
  padding: 0 12px;
  background: #f5f5f5;
  border-radius: 17px;
  gap: 6px;
}
.search input { flex: 1; font-size: 13px; color: #333; }
.search input::placeholder { color: #999; }

/* ===== 套餐Tab ===== */
.package-tabs {
  display: flex;
  border-bottom: 1px solid #eee;
  flex-shrink: 0;
}
.pt {
  flex: 1;
  text-align: center;
  padding: 10px 0;
  font-size: 13px;
  color: #666;
  cursor: pointer;
  position: relative;
}
.pt.active { color: #1ec792; font-weight: 600; }
/* 层级标签右上角：已选数量角标 */
.pt-badge {
  position: absolute;
  left: 50%;
  top: 2px;
  transform: translateX(15px);
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  box-sizing: border-box;
  background: #ff0202;
  color: #fff;
  font-size: 10px;
  font-weight: 600;
  font-style: normal;
  line-height: 16px;
  text-align: center;
  border-radius: 8px;
  pointer-events: none;
}
.pt.active::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 24px;
  height: 2px;
  background: #1ec792;
  border-radius: 2px;
}

/* ===== 主体两列 ===== */
.body-wrap {
  flex: 1;
  display: flex;
  overflow: hidden;
  background: #fff;
}

/* 左分类导航 */
/* ===== 两级分类导航 ===== */
.cat-nav {
  width: 96px;
  background: #fff;
  overflow-y: auto;
  flex-shrink: 0;
  -webkit-overflow-scrolling: touch;
}
/* 一级分类：图标在上、文字在下，展开时主题色文字 + 左侧色条 */
.cat-parent-txt {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  height: 72px;
  padding: 0 4px;
  box-sizing: border-box;
  background: #fff;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.cat-parent.open > .cat-parent-txt::before {
  content: "";
  position: absolute;
  left: 0; top: 12px; bottom: 12px;
  width: 3px;
  background: var(--primary);
  border-radius: 0 3px 3px 0;
}
/* 二级分类：浅灰圆角块，图标在上、文字在下 */
.cat-children {
  background: #fff;
  padding: 0 6px 8px;
}
.cat-children .cat-item {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  height: 72px;
  margin-top: 6px;
  padding: 0 4px;
  box-sizing: border-box;
  border-radius: 8px;
  background: #f5f6f8;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.cat-children .cat-item.active { background: var(--primary-light); }
.cat-empty { padding: 12px 0; font-size: 12px; color: #bbb; text-align: center; }

.cat-icon {
  display: block;
  width: 24px;
  height: 24px;
  object-fit: contain;
  flex-shrink: 0;
}
.cat-parent-txt .cat-icon { width: 26px; height: 26px; }
.cat-txt {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  max-width: 100%;
  font-size: 12px;
  line-height: 1.25;
  color: #666;
  text-align: center;
  word-break: break-all;
}
/* 名称超过2行的内容做省略，避免高度参差 */
.cat-children .cat-item .cat-txt { height: 30px; }
/* 一级文字更醒目 */
.cat-parent-txt .cat-txt { font-size: 13px; font-weight: 600; color: #333; }
.cat-parent.open .cat-parent-txt .cat-txt { color: var(--primary); }
/* 二级选中态：文字变主题色加粗 */
.cat-children .cat-item.active .cat-txt { color: var(--primary); font-weight: 600; }
/* 圆形角标（右上角） */
.cat-badge {
  position: absolute;
  top: 4px;
  right: 4px;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  background: #ff0202;
  color: #fff;
  font-size: 10px;
  line-height: 16px;
  text-align: center;
  border-radius: 8px;
  box-shadow: 0 1px 4px rgba(30, 199, 146, .35);
}

/* 右项目列表 */
.item-list {
  flex: 1;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 0 14px 80px;
}
.section-title {
  font-size: 13px;
  font-weight: 600;
  color: #333;
  padding: 14px 0 8px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.section-title .rec-tag {
  background: #ffeae5;
  color: #ff5757;
  font-size: 10px;
  padding: 1px 5px;
  border-radius: 3px;
  font-weight: 500;
}
.section-hot-banner {
  text-align: center;
  background: var(--primary-light);
  color: var(--primary-dark);
  font-size: 12px;
  padding: 6px 0;
  margin: 12px 0 6px;
  border-radius: 4px;
}

/* ===== 分区标题（▪ 重点推荐（15）▪）+ 体检评估卡片 ===== */
.section-pill {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin: 12px 0 8px;
  padding: 8px 0;
  background: var(--primary-light);
  color: var(--primary-dark);
  font-size: 14px;
  font-weight: 700;
  border-radius: 6px;
  letter-spacing: .5px;
}
.section-pill i {
  width: 5px;
  height: 5px;
  border-radius: 1px;
  background: var(--primary-dark);
  font-style: normal;
  flex-shrink: 0;
}

.assess-card {
  margin: 4px 0 8px;
  border-radius: 14px;
  overflow: hidden;
  background: linear-gradient(135deg, #22cb96 0%, #12b07f 100%);
  box-shadow: 0 6px 16px rgba(30, 199, 146, .22);
}
.assess-top { padding: 14px 14px 12px; }
.assess-title {
  font-size: 13px;
  font-weight: 700;
  color: #fff;
  line-height: 1.45;
}
.assess-sub {
  margin-top: 6px;
  font-size: 12px;
  color: rgba(255, 255, 255, .88);
  letter-spacing: .3px;
  font-weight: 300;
}
.assess-body {
  background: #fff;
  margin: 0 6px 6px;
  padding: 12px 14px 8px;
  border-radius: 10px;
}
.assess-row { display: flex; align-items: center; gap: 10px; }
.assess-label {
  flex-shrink: 0;
  font-size: 13px;
  color: #333;
  letter-spacing: .5px;
}
.assess-right { flex: 1; min-width: 0; }
.assess-bar {
  position: relative;
  height: 12px;
  border-radius: 6px;
  background: linear-gradient(90deg,
    #ff5a5a 0%, #ff5a5a 36%,
    #ff9f2e 40%, #ff9f2e 66%,
    #8ed14f 70%, #8ed14f 100%);
}
.assess-knob {
  position: absolute;
  top: 50%;
  width: 16px;
  height: 16px;
  margin-left: -8px;
  border-radius: 50%;
  background: #fff;
  border: 3px solid #ff7a3d;
  transform: translateY(-50%);
  box-shadow: 0 1px 5px rgba(0, 0, 0, .18);
  box-sizing: border-box;
}
.assess-scale {
  display: flex;
  justify-content: space-between;
  margin-top: 6px;
  padding: 0 2px;
  font-size: 12px;
  color: #999;
}

.item-card {
  padding: 12px 0;
  border-bottom: 1px dashed #eee;
  display: flex;
  align-items: flex-start;
  gap: 8px;
  cursor: pointer;
}
.item-card-main { flex: 1; min-width: 0; }
.item-name {
  font-size: 15px;
  font-weight: 600;
  color: #222;
  margin-bottom: 4px;
}
.item-desc {
  font-size: 12px;
  color: #888;
  line-height: 1.5;
  margin-bottom: 6px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.item-price {
  font-size: 15px;
  font-weight: 600;
  color: #222;
}

/* ===== 所属层级标签 ===== */
.lv-tag {
  display: inline-block;
  margin-left: 6px;
  padding: 0 5px;
  font-size: 10px;
  line-height: 16px;
  border-radius: 3px;
  font-weight: 400;
  vertical-align: middle;
}
.lv-base { color: #1ec792; background: #e6f9f2; }
.lv-ext  { color: #ff9f2e; background: #fff5e6; }
.lv-opt  { color: #8a8f99; background: #f2f4f7; }

/* ===== 顶部右上角入口 ===== */
.top-link {
  font-size: 13px;
  color: #1ec792;
  cursor: pointer;
}

/* ===== 套餐列表 ===== */
.pkg-tabs {
  display: flex;
  border-bottom: 1px solid #eee;
  flex-shrink: 0;
}
.gt {
  flex: 1;
  text-align: center;
  padding: 10px 0;
  font-size: 13px;
  color: #666;
  cursor: pointer;
}
.gt.active { color: #1ec792; font-weight: 600; }

.pkg-list {
  flex: 1;
  overflow-y: auto;
  background: #f5f5f5;
  padding: 10px 12px 20px;
  -webkit-overflow-scrolling: touch;
}
.pkg-card {
  background: #fff;
  border-radius: 10px;
  padding: 14px;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 10px;
  box-shadow: 0 1px 4px rgba(0, 0, 0, .04);
  cursor: pointer;
}
.pkg-card-main { flex: 1; min-width: 0; }
.pkg-name {
  font-size: 15px;
  font-weight: 600;
  color: #222;
  line-height: 1.35;
}
.pkg-tags {
  margin-top: 6px;
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.pkg-sub {
  font-size: 11px;
  color: #1ec792;
  background: #e6f9f2;
  padding: 1px 6px;
  border-radius: 3px;
}
.pkg-tag {
  font-size: 11px;
  color: #ff9f2e;
  background: #fff5e6;
  padding: 1px 6px;
  border-radius: 3px;
}
.pkg-meta { margin-top: 6px; font-size: 11px; color: #999; }
.pkg-price-box { text-align: right; flex-shrink: 0; }
.pkg-price { font-size: 17px; font-weight: 600; color: #ff5757; }
.pkg-old {
  font-size: 12px;
  color: #bbb;
  text-decoration: line-through;
  margin-top: 2px;
}
.pkg-empty { text-align: center; color: #999; padding: 40px 0; }

/* ===== 套餐详情 ===== */
.pkg-detail {
  flex: 1;
  overflow-y: auto;
  background: #f5f6f8;
  padding-bottom: 16px;
  -webkit-overflow-scrolling: touch;
}

/* 封面 */
.pd-cover { width: 100%; height: 230px; background: #eef1f4; overflow: hidden; }
.pd-cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pd-cover-ph {
  width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center;
  font-size: 56px; background: linear-gradient(135deg, #e6f7f0, #d8f5e9);
}

/* 通用白块 */
.pd-block { background: #fff; padding: 14px; margin-bottom: 10px; }

/* 价格区 */
.pd-price-row { display: flex; align-items: baseline; gap: 6px; }
.pd-cur { color: #ff3b3b; font-size: 16px; font-weight: 700; }
.pd-price { color: #ff3b3b; font-size: 30px; font-weight: 800; line-height: 1; }
.pd-old { color: #aaa; font-size: 14px; text-decoration: line-through; }
.pd-sales { margin-left: auto; font-size: 13px; color: #999; }
.pd-promo {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 10px;
  padding: 3px 10px;
  border: 1px solid #ff5757;
  border-radius: 4px;
  font-size: 12px;
  color: #ff5757;
}
.pd-promo-txt { color: #ff5757; }
.pd-title-row {
  margin-top: 12px;
  display: flex;
  align-items: flex-start;
  gap: 8px;
}
.pd-coupon {
  flex-shrink: 0;
  margin-top: 2px;
  padding: 2px 6px;
  background: #ff3b3b;
  color: #fff;
  font-size: 11px;
  border-radius: 3px;
}
.pd-title { font-size: 17px; font-weight: 700; color: #1a1a1a; line-height: 1.4; }
.pd-feature {
  margin-top: 10px;
  font-size: 13px;
  color: #666;
  display: flex;
  align-items: center;
  gap: 6px;
}
.pd-feat-tag {
  color: var(--primary);
  font-weight: 700;
  font-size: 13px;
}

/* 医院信息 */
.pd-hos-row { display: flex; align-items: center; }
.pd-hos-name { font-size: 16px; font-weight: 600; color: #222; }
.pd-hos-arrow { margin-left: auto; color: #c8c8c8; font-size: 22px; }
.pd-hos-addr {
  margin-top: 8px;
  font-size: 13px;
  color: #888;
  line-height: 1.6;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Tab 栏 */
.pd-tabs {
  display: flex;
  gap: 18px;
  background: #fff;
  padding: 12px 14px 0;
  margin-bottom: 0;
  overflow-x: auto;
  scrollbar-width: none;
  border-bottom: 1px solid #f0f0f0;
}
.pd-tabs::-webkit-scrollbar { display: none; }
.pd-tab {
  flex-shrink: 0;
  position: relative;
  padding-bottom: 10px;
  font-size: 15px;
  color: #666;
  cursor: pointer;
  white-space: nowrap;
}
.pd-tab.active { color: #1a1a1a; font-weight: 700; }
.pd-tab.active::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: 26px;
  height: 3px;
  border-radius: 2px;
  background: var(--primary);
}
.pd-panel { background: #f5f6f8; padding: 14px 0 0; }
.pd-empty { text-align: center; color: #999; padding: 40px 0; font-size: 13px; }

/* 小节标题 */
.pd-h2 {
  font-size: 17px;
  font-weight: 700;
  color: #1a1a1a;
  margin: 4px 14px 12px;
}

/* 适用人群两列卡片 */
.pd-crowd { display: flex; gap: 10px; padding: 0 14px; }
.pd-crowd-card {
  flex: 1;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 1px 4px rgba(0, 0, 0, .04);
}
.pd-crowd-card .pd-cc-title {
  padding: 10px 12px;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
}
.pd-crowd-card.green .pd-cc-title { background: var(--primary); }
.pd-crowd-card.orange .pd-cc-title { background: #ffab5e; }
.pd-crowd-card ul { padding: 10px 12px 12px 26px; }
.pd-crowd-card li {
  font-size: 13px;
  color: #444;
  line-height: 1.9;
  list-style: disc;
}

/* 重点筛查网格 */
.pd-grid {
  display: flex;
  flex-wrap: wrap;
  background: #fff;
  margin: 0 14px;
  border-radius: 10px;
  padding: 6px 0 10px;
}
.pd-grid-item {
  width: 33.33%;
  padding: 12px 6px;
  text-align: center;
  box-sizing: border-box;
  cursor: pointer;
}
.pd-grid-icon { width: 46px; height: 46px; object-fit: contain; }
.pd-grid-name { margin-top: 6px; font-size: 13px; color: #333; }
.pd-grid-desc {
  margin-top: 4px;
  font-size: 11px;
  color: #999;
  line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* 重点项目卡片 */
.pd-hl-card {
  background: #fff;
  margin: 0 14px 10px;
  padding: 12px 14px;
  border-radius: 10px;
}
.pd-hl-head { display: flex; align-items: center; gap: 8px; }
.pd-hl-ico {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background: #ffe9dc;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  flex-shrink: 0;
}
.pd-hl-name { font-size: 15px; font-weight: 600; color: #222; }
.pd-hl-desc {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px dashed #eee;
  font-size: 13px;
  color: #666;
  line-height: 1.7;
}

/* 检查项目表格 */
.pd-table { margin: 0 14px; background: #fff; border-radius: 10px; overflow: hidden; }
.pd-table table { width: 100%; border-collapse: collapse; }
.pd-table th {
  background: #f6f7f9;
  font-size: 13px;
  color: #333;
  font-weight: 600;
  padding: 10px 12px;
  text-align: left;
}
.pd-table td {
  padding: 12px;
  font-size: 13px;
  color: #555;
  line-height: 1.6;
  border-top: 1px solid #f2f2f2;
  vertical-align: top;
}
.pd-tb-name { color: #222; font-weight: 600; width: 34%; }
.pd-tb-desc { color: #666; }

/* 体检须知 */
.pd-tag-lite {
  display: inline-block;
  margin: 0 14px 12px;
  padding: 5px 14px;
  background: var(--primary);
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  border-radius: 6px 12px 12px 6px;
}
.pd-flow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #fff;
  margin: 0 14px 16px;
  padding: 16px 8px;
  border-radius: 10px;
}
.pd-flow-step { text-align: center; flex-shrink: 0; }
.pd-flow-ico {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  margin: 0 auto;
  border-radius: 50%;
  background: #f1f3f6;
  font-size: 20px;
}
.pd-flow-name { display: block; margin-top: 6px; font-size: 12px; color: #555; }
.pd-flow-arrow { color: #c8c8c8; font-size: 14px; }
.pd-sub-title {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0 14px 8px;
  font-size: 15px;
  font-weight: 700;
  color: #333;
}
.pd-sub-title i {
  width: 4px;
  height: 16px;
  border-radius: 2px;
  background: var(--primary);
  font-style: normal;
}
.pd-notice { background: #fff; margin: 0 14px 16px; padding: 14px; border-radius: 10px; }
.pd-notice p { font-size: 14px; color: #555; line-height: 1.9; margin-bottom: 6px; }
.pd-notice p:last-child { margin-bottom: 0; }
.pd-lines-fold {
  position: relative;
  height: 18px;
  margin: 0 14px 16px;
  cursor: pointer;
}
.pd-lines-fold::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 6px;
  width: 10px;
  height: 10px;
  margin-left: -5px;
  border-right: 2px solid #bbb;
  border-bottom: 2px solid #bbb;
  transform: rotate(45deg);
}

/* ===== 套餐详情底部操作栏 ===== */
.pkg-detail-bar {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  background: #fff;
  border-top: 1px solid #f0f0f0;
}
.pdb-icon {
  width: 46px;
  text-align: center;
  cursor: pointer;
  color: #666;
}
.pdb-ico {
  display: block;
  font-size: 17px;
  color: #666;
  line-height: 1.2;
}
.pdb-icon em { display: block; font-style: normal; font-size: 11px; color: #888; }
.pdb-btns { flex: 1; display: flex; }
.pdb-btn {
  flex: 1;
  height: 44px;
  border: none;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  border-radius: 22px;
}
.pdb-buy {
  background: var(--primary);
  color: #fff;
}
.pdb-btn:active { opacity: .88; }

/* ===== 系统首页 view-home ===== */
.home-scroll {
  flex: 1;
  overflow-y: auto;
  background: #f5f5f5;
  -webkit-overflow-scrolling: touch;
}

.hospital-banner {
  width: 100%;
  height: 180px;
  background: linear-gradient(135deg, #dff3ea 0%, #cfeede 100%);
  overflow: hidden;
  position: relative;
}
.hospital-banner img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hospital-banner::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 64px;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, .18));
}
.banner-placeholder { color: #9cc4b4; text-align: center; line-height: 180px; font-size: 13px; }

.hospital-info-card {
  background: #fff;
  margin: -40px 14px 0;
  border-radius: 16px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, .10);
  position: relative;
  z-index: 2;
  overflow: hidden;
}
.hospital-info-card > .hospital-card + .hospital-address,
.hospital-info-card > .hospital-address + .hospital-time,
.hospital-info-card > .hospital-time + .hospital-ann {
  border-top: 1px solid #f0f0f0;
}
.hospital-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px;
}
.hc-logo {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
  background: #f0f0f0;
  border: 2px solid #fff;
  box-shadow: 0 2px 6px rgba(0, 0, 0, .12);
}
.hc-logo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hc-logo-placeholder { color: #bbb; text-align: center; line-height: 56px; font-size: 11px; }
.hc-info { flex: 1; min-width: 0; }
.hc-name { font-size: 17px; font-weight: 700; color: #1a1a1a; }
.hc-tags { margin-top: 9px; display: flex; gap: 6px; flex-wrap: wrap; }
.hc-tag {
  font-size: 11px;
  padding: 3px 8px;
  border-radius: 4px;
  color: #1ec792;
  background: #e6f9f2;
}
.hc-tag.alt { color: #ff9f2e; background: #fff5e6; }

.hospital-address,
.hospital-time {
  padding: 14px 16px;
  font-size: 14px;
  color: #333;
}
.hospital-address { display: flex; align-items: flex-start; gap: 6px; line-height: 1.6; }
.addr-icon { color: #1ec792; flex-shrink: 0; }

.ht-row { display: flex; align-items: center; gap: 6px; }
.ht-hours { font-size: 13px; color: #666; margin-top: 4px; padding-left: 24px; line-height: 1.6; }
.ht-hours:empty { display: none; }
.ht-icon { color: #1ec792; }
.ht-label { color: #222; font-weight: 500; }
.ht-link { margin-left: auto; color: #1ec792; cursor: pointer; font-size: 12px; }
.hc-features { margin-top: 10px; display: flex; gap: 6px; flex-wrap: wrap; }
.hc-features:empty { display: none; }
.hc-feature { font-size: 11px; padding: 2px 7px; border-radius: 3px; color: #ff9f2e; background: #fff5e6; }

/* 公告横向滚动 */
.hospital-ann {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 14px 16px;
  cursor: pointer;
  min-height: 48px;
}
.ann-icon { color: #ff7a1a; font-size: 16px; flex-shrink: 0; }
.ann-marquee { flex: 1; overflow: hidden; min-width: 0; }
.ann-track {
  display: inline-flex;
  white-space: nowrap;
  animation: ann-scroll 22s linear infinite;
}
.ann-text { color: #ff7a1a; font-size: 13px; }
@keyframes ann-scroll {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

.promo-banner {
  margin: 12px;
  border-radius: 10px;
  background: linear-gradient(135deg, #c9eed5 0%, #9ed7b6 100%);
  padding: 20px 16px;
  color: #1f6e4e;
  position: relative;
  overflow: hidden;
}
.promo-banner::after {
  content: "🩺";
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 50px;
  opacity: .25;
}
.promo-title { font-size: 22px; font-weight: 700; }
.promo-sub { margin-top: 6px; font-size: 12px; opacity: .85; }
/* 图片模式：隐藏文字与装饰，铺满图片 */
.promo-banner.has-image { padding: 0; background: none; }
.promo-banner.has-image::after { display: none; }
.promo-banner.has-image .promo-title,
.promo-banner.has-image .promo-sub { display: none; }
.promo-img { width: 100%; display: block; border-radius: 40px; }

/* ===== 首页：内嵌套餐列表 ===== */
.home-scroll { padding-bottom: 180px; }
.home-scroll-pad { height: 8px; }

.home-packages {
  background: #f5f5f5;
  margin-top: -6px;
}
.hp-sortbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 14px;
  background: #fff;
  border-bottom: 1px solid #f0f0f0;
}
.hp-sort { display: flex; gap: 18px; }
.hps {
  font-size: 15px;
  color: #777;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 2px;
}
.hps.active { color: #1a1a1a; font-weight: 700; }
.hps-arrow { font-size: 12px; color: #aaa; font-style: normal; }
.hps.active .hps-arrow { color: #1ec792; }
.hps-compare {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 13px;
  color: #333;
  cursor: pointer;
}
.hps-compare .vs-icon {
  display: inline-block;
  width: 18px; height: 18px;
  color: #fff;
  border-radius: 4px;
  font-size: 11px;
  text-align: center;
  line-height: 18px;
}

.hp-cats {
  display: flex;
  gap: 10px;
  padding: 10px 14px;
  overflow-x: auto;
  background: #fff;
  border-bottom: 1px solid #f0f0f0;
  scrollbar-width: none;
}
.hp-cats::-webkit-scrollbar { display: none; }
.hp-cat {
  flex-shrink: 0;
  padding: 6px 16px;
  border-radius: 18px;
  background: #f4f4f4;
  color: #555;
  font-size: 13px;
  cursor: pointer;
  white-space: nowrap;
}
.hp-cat.active { background: #cfeede; color: #1f6e4e; font-weight: 600; }

.hp-list { padding: 10px 12px; display: flex; flex-direction: column; gap: 10px; }
.hp-empty { text-align: center; color: #999; padding: 30px 0; font-size: 13px; }
.hp-card {
  background: #fff;
  border-radius: 12px;
  padding: 12px;
  display: flex;
  gap: 12px;
  box-shadow: 0 1px 4px rgba(0, 0, 0, .04);
  cursor: pointer;
}
.hp-cover {
  width: 110px;
  height: 130px;
  border-radius: 8px;
  overflow: hidden;
  flex-shrink: 0;
  background: linear-gradient(135deg, #ffd9c2, #ffb38a);
  position: relative;
}
.hp-cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hp-cover-ph {
  width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center;
  font-size: 48px; opacity: .85;
}
.hp-body { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.hp-title-row {
  display: flex;
  align-items: flex-start;
  gap: 6px;
}
.hp-badge-sale {
  background: #ff3b3b;
  color: #fff;
  font-size: 10px;
  padding: 2px 5px;
  border-radius: 3px;
  flex-shrink: 0;
  margin-top: 2px;
}
.hp-title {
  font-size: 14px;
  font-weight: 600;
  color: #222;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.hp-tags {
  margin-top: 6px;
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
}
.hp-tag {
  font-size: 10px;
  padding: 2px 6px;
  border-radius: 3px;
  background: #fff5e6;
  color: #ff7a1a;
  border: 1px solid #ffd9b8;
}
.hp-tag.gray { background: #f4f4f4; color: #666; border-color: #e6e6e6; }
.hp-tag.orange { background: #ff7a1a; color: #fff; border-color: #ff7a1a; }
.hp-bottom {
  margin-top: auto;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  padding-top: 6px;
}
.hp-price-row { display: flex; align-items: baseline; gap: 6px; }
.hp-price { color: #ff3b3b; font-size: 18px; font-weight: 700; }
.hp-old { color: #aaa; font-size: 12px; text-decoration: line-through; }
.hp-sales { color: #999; font-size: 12px; }
.hp-promo {
  margin-top: 4px;
  font-size: 11px;
  color: #ff3b3b;
  display: flex;
  align-items: center;
  gap: 4px;
}
.hp-promo::before {
  content: "🎁";
  font-size: 11px;
}

/* ===== 首页浮动：定制提示 + 个性化体检 FAB ===== */
.home-tip {
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  bottom: 130px;
  z-index: 19;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 14px;
  background: rgba(0, 0, 0, .72);
  color: #fff;
  border-radius: 22px;
  font-size: 13px;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(0, 0, 0, .2);
  max-width: 88%;
}
.home-tip .ht-text { white-space: nowrap; }
.home-tip .ht-close {
  width: 18px; height: 18px;
  display: inline-flex; align-items: center; justify-content: center;
  background: rgba(255, 255, 255, .2);
  border-radius: 50%;
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
}

.home-fab {
  position: fixed;
  left: 14px;
  right: 14px;
  bottom: 60px;
  z-index: 18;
  background: linear-gradient(135deg, #1ec792 0%, #16b884 100%);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px;
  border-radius: 10px;
  font-size: 16px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 6px 18px rgba(30, 199, 146, .42);
  letter-spacing: 1px;
}
.home-fab svg { flex-shrink: 0; fill: currentColor; }

/* 底部 Tab */
.home-tabbar {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 30;
  height: 50px;
  background: #fff;
  border-top: 1px solid #eee;
  display: flex;
}

/* ===== 我的（个人中心） ===== */
.mine-scroll {
  flex: 1;
  overflow-y: auto;
  background: #f5f6f8;
  padding: 8px 14px 70px;
  -webkit-overflow-scrolling: touch;
}
.mine-user {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 2px 20px;
  cursor: pointer;
}
.mine-avatar {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 1px 6px rgba(0, 0, 0, .06);
}
.mine-uname { font-size: 23px; font-weight: 700; color: #1a1a1a; }
.mine-cards { display: flex; gap: 12px; }
.mine-card {
  position: relative;
  flex: 1;
  display: flex;
  align-items: center;
  gap: 10px;
  background: #fff;
  border-radius: 12px;
  padding: 16px 14px;
  overflow: hidden;
  box-shadow: 0 1px 6px rgba(0, 0, 0, .05);
  cursor: pointer;
}
.mine-card-mark {
  position: absolute;
  right: 8px;
  top: 12px;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: 1px;
  color: #f2f3f5;
}
.mine-card-ico {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 42px;
  height: 42px;
  border-radius: 10px;
  font-size: 22px;
}
.mine-card-ico > svg,
.mine-card-ico > .icon {
  width: 100%;
  height: 100%;
  display: block;
}
.mine-card-ico.green { background: #fff1e6; }
.mine-card-ico.blue { background: #eaf1ff; }
.mine-card-name {
  flex: 1;
  min-width: 0;
  margin-top: 0;
  font-size: 20px;
  font-weight: 700;
  color: #1a1a1a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mine-list {
  margin-top: 14px;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 1px 6px rgba(0, 0, 0, .05);
  overflow: hidden;
}
.mine-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px;
  border-bottom: 1px solid #f4f5f7;
  cursor: pointer;
}
.mine-row:last-child { border-bottom: none; }
.mine-ico { width: 24px; height: 24px; flex-shrink: 0; }
.mine-name { flex: 1; font-size: 16px; color: #222; }
.mine-arrow { color: #c8c8c8; font-size: 20px; line-height: 1; }

/* ===== 企业团检合作报名 ===== */
.group-scroll {
  flex: 1;
  overflow-y: auto;
  background: #f2f7f5;
  padding-bottom: 30px;
  -webkit-overflow-scrolling: touch;
}
.group-hero {
  position: relative;
  padding: 22px 20px 0;
  background: linear-gradient(150deg, #d8f7ea 0%, #b9efd8 45%, #98e6c6 100%);
  border-bottom-left-radius: 26px;
  border-bottom-right-radius: 26px;
  overflow: hidden;
}
.group-hero-title {
  font-size: 26px;
  font-weight: 800;
  color: #16a578;
  text-align: center;
  letter-spacing: 1px;
}
.group-hero-sub {
  margin-top: 10px;
  font-size: 14px;
  color: #2c8f6d;
  text-align: center;
}
.group-hero-illu { margin-top: 10px; height: 120px; }

.group-card {
  position: relative;
  margin: -14px 16px 0;
  padding: 20px 18px 18px;
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 4px 16px rgba(22, 165, 120, .08);
}
.group-field { margin-bottom: 18px; }
.group-field label {
  display: block;
  margin-bottom: 10px;
  font-size: 16px;
  font-weight: 700;
  color: #222;
}
.group-field input {
  width: 100%;
  height: 50px;
  padding: 0 14px;
  border: 1px solid #dfe3e8;
  border-radius: 10px;
  font-size: 15px;
  color: #222;
  background: #fff;
  box-sizing: border-box;
  outline: none;
}
.group-field input::placeholder { color: #b9bfc7; }
.group-field input:focus { border-color: var(--primary); }
.group-code-row { display: flex; align-items: center; gap: 10px; }
.group-code-row input { flex: 1; }
.group-code-btn {
  flex-shrink: 0;
  height: 50px;
  padding: 0 16px;
  border: 1px solid var(--primary);
  border-radius: 25px;
  background: #fff;
  color: var(--primary);
  font-size: 14px;
  white-space: nowrap;
  cursor: pointer;
}
.group-code-btn:disabled { color: #b9bfc7; border-color: #dfe3e8; cursor: default; }
.gc-arrow { font-weight: 700; }

.group-agree {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 0 2px;
  font-size: 14px;
  color: #666;
  cursor: pointer;
}
.group-agree a { color: var(--primary); text-decoration: none; }
.group-check {
  position: relative;
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  border: 1.5px solid #cfd5db;
  border-radius: 50%;
  box-sizing: border-box;
  transition: all .2s;
}
.group-agree.checked .group-check { background: #7fd3b4; border-color: #7fd3b4; }
.group-agree.checked .group-check::after {
  content: "";
  position: absolute;
  left: 6px;
  top: 3px;
  width: 5px;
  height: 9px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(45deg);
}

.group-submit {
  display: block;
  width: calc(100% - 32px);
  margin: 22px 16px 0;
  height: 54px;
  border: none;
  border-radius: 27px;
  background: linear-gradient(90deg, #6fdcae 0%, #1ec792 100%);
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 2px;
  box-shadow: 0 6px 16px rgba(30, 199, 146, .28);
  cursor: pointer;
}
.group-submit:active { opacity: .9; }
.group-submit:disabled { opacity: .6; box-shadow: none; }
.group-tip {
  margin: 14px 16px 0;
  font-size: 12px;
  color: #9aa4ae;
  text-align: center;
}

/* ===== 投诉建议 ===== */
.fb-scroll {
  flex: 1;
  overflow-y: auto;
  background: #f5f6f8;
  padding: 14px 0 20px;
  -webkit-overflow-scrolling: touch;
}
.fb-section {
  background: #fff;
  margin: 0 0 12px;
  padding: 16px;
}
.fb-label {
  font-size: 16px;
  font-weight: 700;
  color: #1a1a1a;
  margin-bottom: 12px;
}
.fb-label-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}
.fb-label-row .fb-label { margin-bottom: 0; }
.fb-counter { font-size: 13px; color: #a0a6ad; }
.fb-types { display: flex; flex-wrap: wrap; gap: 10px; }
.fb-type {
  padding: 9px 16px;
  border: 1px solid #e2e6ea;
  border-radius: 8px;
  font-size: 14px;
  color: #444;
  background: #fff;
  cursor: pointer;
  transition: all .15s;
}
.fb-type.active {
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
}
.fb-textarea-wrap { position: relative; }
.fb-textarea-wrap textarea {
  width: 100%;
  height: 150px;
  padding: 12px 14px 28px;
  border: none;
  border-radius: 10px;
  background: #f5f6f8;
  font-size: 15px;
  color: #333;
  line-height: 1.7;
  resize: none;
  box-sizing: border-box;
  outline: none;
}
.fb-textarea-wrap textarea::placeholder { color: #b9bfc7; }
.fb-textarea-wrap .fb-counter {
  position: absolute;
  right: 12px;
  bottom: 10px;
}
.fb-images { display: flex; flex-wrap: wrap; gap: 12px; }
.fb-img {
  position: relative;
  width: 88px;
  height: 88px;
  border-radius: 8px;
  overflow: hidden;
  background: #f5f6f8;
}
.fb-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fb-img-del {
  position: absolute;
  right: 2px;
  top: 2px;
  width: 20px;
  height: 20px;
  line-height: 18px;
  text-align: center;
  border-radius: 50%;
  background: rgba(0, 0, 0, .5);
  color: #fff;
  font-size: 14px;
  cursor: pointer;
}
.fb-img-add {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 88px;
  height: 88px;
  border-radius: 8px;
  background: #f5f6f8;
  font-size: 28px;
  color: #c4c9cf;
  cursor: pointer;
}
.fb-input {
  width: 100%;
  height: 48px;
  padding: 0 14px;
  border: none;
  border-radius: 10px;
  background: #f5f6f8;
  font-size: 15px;
  color: #333;
  box-sizing: border-box;
  outline: none;
}
.fb-input::placeholder { color: #b9bfc7; }
.fb-bar {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 14px;
  background: #fff;
  border-top: 1px solid #f0f0f0;
}
.fb-submit {
  flex: 1;
  height: 46px;
  border: none;
  border-radius: 23px;
  background: var(--primary);
  color: #fff;
  font-size: 17px;
  font-weight: 600;
  cursor: pointer;
}
.fb-submit:disabled {
  background: #dfe3e8;
  color: #fff;
  cursor: default;
}

/* ===== 预约记录 / 我的报告 ===== */
.view-records,
.view-reports {
  display: none;
  flex-direction: column;
  background: #f5f6f8;
}
.view-records.active,
.view-reports.active { display: flex; }
.rec-tabs {
  flex-shrink: 0;
  display: flex;
  gap: 10px;
  padding: 12px 14px;
  background: #fff;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border-bottom: 1px solid #f2f3f5;
}
.rec-tab {
  flex-shrink: 0;
  padding: 7px 16px;
  border-radius: 16px;
  background: #f2f3f5;
  font-size: 14px;
  color: #666;
  cursor: pointer;
}
.rec-tab.active {
  background: #eafaf3;
  color: #1ec792;
  font-weight: 600;
}
.rec-scroll {
  flex: 1;
  overflow-y: auto;
  padding: 12px 14px calc(24px + env(safe-area-inset-bottom, 0px));
  -webkit-overflow-scrolling: touch;
}
.rec-empty {
  padding: 70px 0;
  text-align: center;
  font-size: 14px;
  color: #9aa4ae;
}
.rec-card {
  position: relative;
  margin-bottom: 12px;
  padding: 14px 14px 12px;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 1px 6px rgba(0, 0, 0, .05);
  cursor: pointer;
}
.rec-card:active { background: #fafafa; }
.rec-top {
  display: flex;
  align-items: center;
  gap: 8px;
  padding-bottom: 10px;
  border-bottom: 1px dashed #f0f2f4;
}
.rec-name {
  flex: 1;
  min-width: 0;
  font-size: 16px;
  font-weight: 600;
  color: #1a1a1a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rec-status {
  flex-shrink: 0;
  padding: 3px 10px;
  border-radius: 11px;
  font-size: 12px;
  font-weight: 600;
}
.rec-status.st-1 { background: #eaf3ff; color: #2f7fe0; }
.rec-status.st-2 { background: #eafaf3; color: #1ec792; }
.rec-status.st-0 { background: #f2f3f5; color: #9aa4ae; }
.rec-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 9px;
  font-size: 13px;
  color: #8c949c;
}
.rec-row .rec-label { color: #9aa4ae; }
.rec-row .rec-val { color: #444; }
.rec-price { color: #ff5757; font-weight: 700; font-size: 15px; }
.rec-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 10px;
  font-size: 12px;
  color: #b0b7bf;
}
.rec-no { letter-spacing: .3px; }
.rec-report-tag {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 10px;
  border-radius: 11px;
  font-size: 12px;
  font-weight: 600;
  background: #eafaf3;
  color: #1ec792;
}
.rec-report-tag.waiting { background: #f2f3f5; color: #9aa4ae; }
.rec-report-tip {
  margin-top: 10px;
  padding: 10px 12px;
  background: #f7f9fa;
  border-radius: 8px;
  font-size: 12px;
  line-height: 1.7;
  color: #8c949c;
}
.rec-btn {
  display: block;
  width: 100%;
  box-sizing: border-box;
  margin-top: 12px;
  height: 40px;
  line-height: 40px;
  border: none;
  border-radius: 20px;
  background: #eafaf3;
  color: #1ec792;
  font-size: 15px;
  font-weight: 600;
  text-align: center;
  cursor: pointer;
}
.rec-btn:active { opacity: .9; }

/* 预约详情弹层 */
.rd-title {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
  font-size: 18px;
  font-weight: 700;
  color: #1a1a1a;
}
.rd-block {
  margin-bottom: 16px;
  padding: 14px;
  background: #f8fafb;
  border-radius: 10px;
}
.rd-block-title {
  margin-bottom: 10px;
  font-size: 14px;
  font-weight: 600;
  color: #333;
}
.rd-line {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
  font-size: 14px;
  color: #666;
}
.rd-line:last-child { margin-bottom: 0; }
.rd-line .rd-v { color: #1a1a1a; text-align: right; }
.rd-line .rd-v.red { color: #ff5757; font-weight: 700; }
.rd-item {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 9px 0;
  border-bottom: 1px solid #eef1f3;
  font-size: 14px;
  color: #333;
}
.rd-item:last-child { border-bottom: none; }
.rd-item .rd-code { margin-left: 6px; font-size: 12px; color: #a9b0b8; }
.rd-item .rd-price { flex-shrink: 0; color: #666; }

/* 预约详情操作按钮 */
.rd-actions {
  display: flex;
  gap: 12px;
  margin-top: 14px;
}
.rd-actions .rec-btn { margin-top: 0; flex: 1; }
.rd-btn-ghost {
  background: #fff;
  border: 1px solid #1ec792;
  color: #1ec792;
}
.rd-btn-danger {
  background: #fff;
  border: 1px solid #ffd6d6;
  color: #ff5757;
}

/* 改期 / 取消弹层 */
.rs-current {
  padding: 12px 14px;
  margin-bottom: 6px;
  background: #f8fafb;
  border-radius: 10px;
  font-size: 14px;
  line-height: 1.7;
  color: #555;
}
.rs-label {
  margin: 16px 0 10px;
  font-size: 14px;
  font-weight: 600;
  color: #333;
}
.popup--sheet #rsDateStrip,
.popup--sheet #rsTimeSlots { margin: 0; }
.cancel-reasons {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.cancel-reason {
  padding: 9px 15px;
  border: 1px solid #e2e6ea;
  border-radius: 8px;
  background: #fff;
  font-size: 14px;
  color: #444;
  cursor: pointer;
}
.cancel-reason.active {
  background: #fff2f2;
  border-color: #ff5757;
  color: #ff5757;
  font-weight: 600;
}
.cancel-tip {
  margin: 14px 0 16px;
  font-size: 12px;
  line-height: 1.7;
  color: #9aa4ae;
}
.login-submit.cancel-submit {
  background: linear-gradient(90deg, #ff8a8a 0%, #ff5757 100%);
  box-shadow: 0 6px 14px rgba(255, 87, 87, .22);
}

/* 报告预览弹层 */
.popup--report .popup-box { height: 84vh; }
.report-frame {
  width: 100%;
  height: 60vh;
  border: none;
  background: #f5f6f8;
}
.report-img {
  display: block;
  width: 100%;
  border-radius: 8px;
  background: #f5f6f8;
}
.report-actions { margin-top: 14px; }

/* ===== 登录页 ===== */
.view-login {
  display: none;
  flex-direction: column;
  background: #fff;
}
.view-login.active { display: flex; }
.login-wrap {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 0 34px;
}
.login-head {
  padding: 76px 0 0;
  text-align: center;
}
.login-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 96px;
  height: 96px;
  margin: 0 auto 22px;
  border-radius: 50%;
  overflow: hidden;
}
.login-logo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}
.login-logo-fallback { width: 100%; height: 100%; display: none; }
.login-logo.no-img .login-logo-fallback { display: block; }
.login-hosp {
  font-size: 27px;
  font-weight: 700;
  color: #1a1a1a;
  letter-spacing: .5px;
}
.login-sub {
  margin-top: 12px;
  font-size: 15px;
  color: #8c949c;
}
.login-btns {
  margin: 76px 0 0;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.login-btn {
  width: 100%;
  height: 58px;
  border-radius: 29px;
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 1px;
  cursor: pointer;
}
.login-btn-main {
  border: none;
  background: linear-gradient(90deg, #4fd3a5 0%, #1ec792 100%);
  color: #fff;
  box-shadow: 0 6px 14px rgba(30, 199, 146, .22);
}
.login-btn-main:active { opacity: .92; }
.login-btn-ghost {
  border: 1.5px solid #cfd5db;
  background: #fff;
  color: #333;
}
.login-btn-ghost:active { background: #f7f8fa; }
.login-agree {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin: auto 0 46px;
  padding-top: 40px;
  font-size: 14px;
  color: #8c949c;
  cursor: pointer;
}
.login-agree a { color: #1ec792; text-decoration: none; }
.login-check {
  position: relative;
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  border: 1.5px solid #cfd5db;
  border-radius: 50%;
  box-sizing: border-box;
  transition: all .2s;
}
.login-agree.checked .login-check { background: #1ec792; border-color: #1ec792; }
.login-agree.checked .login-check::after {
  content: "";
  position: absolute;
  left: 5.5px;
  top: 2.5px;
  width: 4px;
  height: 8px;
  border-right: 1.8px solid #fff;
  border-bottom: 1.8px solid #fff;
  transform: rotate(45deg);
}

/* 登录弹层表单 */
/* 弹层 body 默认 white-space: pre-wrap（为项目详情富文本设置），
   会把表单里的换行/缩进当成真实空行，需要还原为 normal */
#popupLoginPwd .popup-body,
#popupLoginSms .popup-body,
#popupReschedule .popup-body,
#popupCancel .popup-body {
  white-space: normal;
}
.login-field {
  margin-bottom: 14px;
  line-height: 0;
}
.login-field input {
  display: block;
  width: 100%;
  height: 50px;
  padding: 0 16px;
  border: 1px solid #e2e6ea;
  border-radius: 12px;
  background: #fff;
  font-size: 16px;
  line-height: 48px;
  color: #222;
  box-sizing: border-box;
  outline: none;
}
.login-field input::placeholder { color: #b9bfc7; }
.login-field input:focus { border-color: #1ec792; }
/* 浏览器自动填充时保持统一外观 */
.login-field input:-webkit-autofill,
.login-field input:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 1000px #fff inset;
  -webkit-text-fill-color: #222;
  caret-color: #222;
}
.login-field-code {
  display: flex;
  align-items: center;
  gap: 10px;
}
.login-field-code input { flex: 1; }
.login-code-btn {
  flex-shrink: 0;
  height: 50px;
  padding: 0 14px;
  border: 1px solid #1ec792;
  border-radius: 12px;
  background: #fff;
  color: #1ec792;
  font-size: 14px;
  white-space: nowrap;
  cursor: pointer;
}
.login-code-btn:disabled { color: #b9bfc7; border-color: #e2e6ea; cursor: default; }
.login-note {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  margin: 4px 0 18px;
  padding: 9px 12px;
  border-radius: 8px;
  background: #f2faf6;
  font-size: 13px;
  line-height: 1.7;
  color: #4f6560;
  text-align: left;
}
.login-note-ico {
  flex-shrink: 0;
  width: 15px;
  height: 15px;
  margin-top: 2px;
}
.login-note-ico svg { width: 15px; height: 15px; }
.login-submit {
  width: 100%;
  height: 52px;
  border: none;
  border-radius: 26px;
  background: linear-gradient(90deg, #4fd3a5 0%, #1ec792 100%);
  color: #fff;
  font-size: 17px;
  font-weight: 600;
  cursor: pointer;
}
.login-submit:active { opacity: .92; }
.login-submit:disabled { opacity: .6; }

/* 我的页：登录信息 */
.mine-user-txt { flex: 1; min-width: 0; }
.mine-avatar img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.mine-umobile {
  margin-top: 4px;
  font-size: 13px;
  color: #8c949c;
}

/* ===== 客服中心（检前检后问题咨询） ===== */
.view-service {
  display: none;
  flex-direction: column;
  background: #fff;
}
.view-service.active { display: flex; }
.sv-hero {
  position: relative;
  flex-shrink: 0;
  padding: 30px 16px 34px;
  background: linear-gradient(160deg, #8fc3f5 0%, #6ba8ee 48%, #5b93e8 100%);
  border-bottom-left-radius: 18px;
  border-bottom-right-radius: 18px;
  overflow: hidden;
}
.sv-back {
  position: absolute;
  left: 12px;
  top: 12px;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.sv-back .icon-back { border-color: #fff; }
.sv-hero-title {
  font-size: 25px;
  font-weight: 800;
  color: #fff;
  letter-spacing: 2px;
  text-align: center;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .08);
}
.sv-hero-illu { margin-top: 6px; height: 110px; }

.sv-tabs {
  flex-shrink: 0;
  display: flex;
  gap: 10px;
  padding: 14px 14px 12px;
  overflow-x: auto;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
  border-bottom: 1px solid #f2f3f5;
}
.sv-tabs::-webkit-scrollbar { display: none; }
.sv-tab {
  flex-shrink: 0;
  padding: 8px 16px;
  border-radius: 18px;
  background: #f2f3f5;
  font-size: 14px;
  color: #666;
  cursor: pointer;
}
.sv-tab.active {
  background: #fdf3e0;
  color: #c8922f;
  font-weight: 600;
}

.sv-list {
  flex: 1;
  overflow-y: auto;
  padding: 4px 0 12px;
  -webkit-overflow-scrolling: touch;
}
.sv-item {
  display: flex;
  align-items: center;
  padding: 15px 16px;
  border-bottom: 1px solid #f4f5f7;
  cursor: pointer;
}
.sv-item:active { background: #fafafa; }
.sv-num {
  flex-shrink: 0;
  margin-right: 6px;
  font-size: 16px;
  font-weight: 700;
  color: #1ec792;
}
.sv-q {
  flex: 1;
  font-size: 16px;
  color: #333;
  line-height: 1.5;
}
.sv-arrow {
  flex-shrink: 0;
  margin-left: 8px;
  font-size: 18px;
  color: #c8ccd2;
}
.sv-loading {
  padding: 40px 0;
  text-align: center;
  font-size: 14px;
  color: #9aa4ae;
}

.sv-bottom {
  flex-shrink: 0;
  padding: 10px 14px calc(12px + env(safe-area-inset-bottom, 0px));
  background: #fff;
  border-top: 1px solid #f4f5f7;
}
.sv-actions {
  display: flex;
  gap: 12px;
}
.sv-act {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  height: 46px;
  border-radius: 24px;
  font-size: 16px;
  cursor: pointer;
}
.sv-act svg { width: 19px; height: 19px; }
.sv-act-chat {
  border: none;
  background: #1ec792;
  color: #fff;
  font-weight: 600;
}
.sv-act-chat:active { background: #17b183; }
.sv-act-phone {
  border: 1px solid #b9e6d2;
  background: #fff;
  color: #1ec792;
}
.sv-act-phone:active { background: #f3fbf7; }
.sv-hours {
  margin-top: 10px;
  font-size: 13px;
  color: #8c949c;
  text-align: center;
}

/* 问题答案底部弹层 */
.popup.popup--faq .popup-box { border-radius: 18px 18px 0 0; }
.faq-sheet-head {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 20px 44px 16px 18px;
  flex-shrink: 0;
}
.faq-q-ico { flex-shrink: 0; width: 22px; height: 22px; margin-top: 1px; }
.faq-q-ico svg { width: 22px; height: 22px; }
.faq-sheet-q {
  flex: 1;
  font-size: 19px;
  font-weight: 700;
  color: #1a1a1a;
  line-height: 1.45;
}
.faq-sheet-close {
  position: absolute;
  right: 12px;
  top: 14px;
  width: 28px;
  height: 28px;
  line-height: 26px;
  text-align: center;
  font-size: 22px;
  color: #c0c4c9;
  cursor: pointer;
}
.faq-sheet-body {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.faq-sheet-answer {
  padding: 0 18px 20px;
  font-size: 16px;
  color: #6b7178;
  line-height: 1.85;
  border-bottom: 1px solid #f2f3f5;
}
.faq-vote {
  padding: 20px 18px calc(24px + env(safe-area-inset-bottom, 0px));
}
.faq-vote-tip {
  margin-bottom: 16px;
  font-size: 15px;
  color: #9aa4ae;
  text-align: center;
}
.faq-vote-btns {
  display: flex;
  gap: 14px;
}
.faq-vote-btn {
  flex: 1;
  height: 46px;
  border: 1px solid #dfe3e8;
  border-radius: 23px;
  background: #fff;
  font-size: 16px;
  color: #555;
  cursor: pointer;
}
.faq-vote-btn:active { background: #f7f8fa; }

/* 感谢反馈小弹窗 */
.popup.popup--mini.active {
  display: flex;
  align-items: center;
  justify-content: center;
}
.mini-box {
  position: relative;
  width: 190px;
  padding: 26px 16px 24px;
  background: #fff;
  border-radius: 14px;
  text-align: center;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .14);
  animation: mini-in .22s ease;
}
@keyframes mini-in {
  from { transform: scale(.88); opacity: .4; }
  to { transform: scale(1); opacity: 1; }
}
.mini-ico { width: 48px; height: 48px; }
.mini-text {
  margin-top: 8px;
  font-size: 16px;
  font-weight: 600;
  color: #ff7a45;
}

/* 拨打客服热线确认弹窗 */
.popup.popup--confirm.active {
  display: flex;
  align-items: center;
  justify-content: center;
}
.confirm-box {
  position: relative;
  width: 78%;
  max-width: 320px;
  background: #fff;
  border-radius: 14px;
  overflow: hidden;
  text-align: center;
}
.confirm-main { padding: 26px 18px 22px; }
.confirm-title {
  font-size: 19px;
  font-weight: 600;
  color: #1a1a1a;
}
.confirm-num {
  margin-top: 14px;
  font-size: 17px;
  color: #4a4a4a;
  letter-spacing: .5px;
}
.confirm-btns {
  display: flex;
  border-top: 1px solid #ececec;
}
.confirm-btn {
  flex: 1;
  height: 52px;
  border: none;
  background: #fff;
  font-size: 17px;
  color: #333;
  cursor: pointer;
}
.confirm-btn + .confirm-btn { border-left: 1px solid #ececec; }
.confirm-btn-ok { color: #1ec792; font-weight: 600; }
.confirm-btn:active { background: #f7f8fa; }

/* ===== 隐私协议 ===== */
.privacy-scroll {
  flex: 1;
  overflow-y: auto;
  background: #fff;
  padding: 0 18px 40px;
  -webkit-overflow-scrolling: touch;
}
.privacy-content { font-size: 16px; color: #333; line-height: 1.95; word-break: break-word; }
.privacy-doc-title {
  text-align: center;
  font-size: 21px;
  font-weight: 800;
  color: #1a1a1a;
  margin: 14px 0 20px;
  letter-spacing: 1px;
}
.privacy-content h2,
.privacy-content h3 {
  font-size: 18px;
  font-weight: 700;
  color: #1a1a1a;
  margin: 20px 0 10px;
  line-height: 1.5;
}
.privacy-content p { margin: 0 0 12px; }
.privacy-content b,
.privacy-content strong { font-weight: 700; color: #1a1a1a; }
.privacy-content ul,
.privacy-content ol { padding-left: 22px; margin: 0 0 12px; }
.privacy-content li { margin-bottom: 6px; }
.privacy-content img { max-width: 100%; height: auto; }
.privacy-content a { color: var(--primary); }
.ht-item {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  color: #999;
  gap: 2px;
  cursor: pointer;
}
.ht-item.active { color: #1ec792; }
.ht-item .ht-icon { font-size: 20px; line-height: 1; }

/* 弹层 */
.popup { position: absolute; inset: 0; z-index: 50; display: none; }
.popup.show { display: flex; align-items: center; justify-content: center; }
.popup-mask { position: absolute; inset: 0; background: rgba(0, 0, 0, .5); }
.popup-box {
  position: relative;
  width: 86%;
  max-width: 380px;
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  max-height: 80vh;
}
.popup-header {
  padding: 14px;
  display: flex;
  align-items: center;
  border-bottom: 1px solid #f0f0f0;
}
.popup-header > div:first-child { width: 24px; flex-shrink: 0; }
.popup-title { flex: 1; text-align: center; font-size: 15px; font-weight: 600; }
.popup-close {
  width: 24px;
  height: 24px;
  text-align: center;
  line-height: 22px;
  font-size: 22px;
  color: #999;
  cursor: pointer;
  flex-shrink: 0;
}
.popup-body {
  overflow-y: auto;
  flex: 1;
  font-size: 13px;
  color: #444;
  line-height: 1.8;
  white-space: pre-wrap;
  word-break: break-word;
}
.popup-footer { padding: 12px; border-top: 1px solid #f0f0f0; }
.popup-btn {
  width: 100%;
  height: 40px;
  background: #1ec792;
  color: #fff;
  border: none;
  border-radius: 22px;
  font-size: 14px;
  cursor: pointer;
}
.popup-btn:active { opacity: .85; }

/* ===== 底部弹层（医院简介） ===== */
.popup--sheet.show { display: block; }
/* 底部弹层：从底部弹出、顶部圆角、内容超高时内部滚动 */
.popup--sheet .popup-box {
  position: absolute;
  left: 0;
  right: 0;
  top: auto;
  bottom: 0;
  width: 100%;
  max-width: none;
  max-height: 82vh;
  border-radius: 20px 20px 0 0;
  animation: sheet-up .28s cubic-bezier(.22, .61, .36, 1);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 -4px 20px rgba(0, 0, 0, .12);
}
/* 弹层一律贴到屏幕底部（不再为底部 Tab 留白） */
@keyframes sheet-up {
  from { transform: translateY(100%); }
  to   { transform: translateY(0); }
}
/* 复位：抵消另一套 .popup-body 的绝对定位，让内容区回到 flex 流（保证 footer 在内容下方），并支持内部滚动 */
.popup--sheet .popup-body {
  position: static;
  left: auto; right: auto; bottom: auto;
  max-height: none;
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  display: block;
  animation: none;
}
.popup--sheet .popup-header {
  background: linear-gradient(135deg, #1ec792 0%, #16b884 100%);
  border-bottom: none;
  padding: 18px 16px 16px;
  flex-shrink: 0;
}
.popup--sheet .popup-title { color: #fff; font-size: 20px; font-weight: 700; }
.popup--sheet .popup-close { color: #fff; }
.popup--sheet .popup-body { padding: 16px 18px calc(24px + env(safe-area-inset-bottom, 0px)); }
.popup--sheet .popup-footer { flex-shrink: 0; }
.pi-section { margin-bottom: 18px; }
.pi-section:last-child { margin-bottom: 0; }
.pi-label { font-size: 15px; font-weight: 700; color: #222; margin-bottom: 10px; }
.pi-pills { display: flex; flex-wrap: wrap; gap: 8px; }
.pi-pill {
  display: inline-block;
  background: #fff5e6;
  color: #ff9f2e;
  border: 1px solid #ffd9b8;
  padding: 4px 12px;
  border-radius: 4px;
  font-size: 13px;
}
.pi-text { font-size: 14px; color: #444; line-height: 1.75; white-space: pre-wrap; word-break: break-word; }

/* ===== 公告底部弹层 ===== */
#popupAnn .popup-header {
  background: linear-gradient(135deg, #1ec792 0%, #16b884 100%);
  border-bottom: none;
  padding: 18px 18px 26px;
  justify-content: space-between;
}
#popupAnn .popup-header > div:first-child { width: auto; flex: 0 0 auto; }
#popupAnn .popup-title {
  text-align: left;
  font-size: 20px;
  font-weight: 700;
  color: #fff;
  flex: 0 0 auto;
  pointer-events: auto;
}
#popupAnn .popup-header-deco {
  width: 130px;
  height: 52px;
  background: radial-gradient(ellipse at 70% 50%, rgba(255, 255, 255, .55), transparent 65%);
  flex: 0 0 auto;
}
#popupAnn .popup-body {
  background: #f5f5f5;
  border-radius: 10px;
  padding: 16px 18px;
  margin: 16px 18px 0;
  font-size: 14px;
  color: #333;
  line-height: 1.75;
  white-space: pre-wrap;
  word-break: break-word;
  overflow-y: auto;
}
#popupAnn .popup-footer {
  border-top: none;
  padding: 16px 18px 20px;
  display: flex;
  justify-content: center;
}
#popupAnn .popup-btn {
  width: auto;
  min-width: 55%;
  height: 44px;
  padding: 0 36px;
  border-radius: 22px;
  font-size: 15px;
  font-weight: 600;
}

/* ===== 个性化体检（基本信息表单） ===== */
.cu-scroll { flex: 1; overflow-y: auto; background: #f5f5f5; }
.cu-card { background: #fff; margin: 12px 14px; border-radius: 14px; padding: 4px 16px; }
.cu-row { display: flex; align-items: center; min-height: 56px; border-bottom: 1px solid #f5f5f5; }
.cu-row:last-child { border-bottom: none; }
.cu-label { width: 72px; font-size: 15px; color: #333; flex-shrink: 0; }
.cu-control { flex: 1; display: flex; align-items: center; justify-content: flex-end; gap: 8px; min-width: 0; }
.cu-input { border: none; outline: none; text-align: right; font-size: 15px; color: #333; background: transparent; width: 100%; min-width: 0; }
.cu-input::placeholder { color: #c0c0c0; }
.cu-row.company-row { display: none; }
.cu-row.company-row.show { display: flex; }

.cu-seg { display: inline-flex; gap: 8px; }
.cu-seg-item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 52px;
  height: 34px;
  padding: 0 14px;
  border-radius: 18px;
  background: #f0f0f0;
  color: #666;
  font-size: 13px;
  cursor: pointer;
  transition: background .15s, color .15s;
}
.cu-seg-item.active { background: #eafaf3; color: #1ec792; font-weight: 600; }

.cu-radio { display: inline-flex; gap: 20px; }
.cu-radio-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 15px;
  color: #333;
  cursor: pointer;
}
.cu-radio-item::before {
  content: "";
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 2px solid #d0d0d0;
  background: #fff;
  box-sizing: border-box;
}
.cu-radio-item.active { color: #1ec792; }
.cu-radio-item.active::before {
  border-color: #1ec792;
  background: #1ec792;
  box-shadow: inset 0 0 0 3px #fff;
}

.cu-submit {
  display: block;
  width: calc(100% - 28px);
  margin: 20px 14px 24px;
  height: 50px;
  border: none;
  border-radius: 25px;
  background: linear-gradient(135deg, #1ec792, #16b884);
  color: #fff;
  font-size: 17px;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 6px 18px rgba(30, 199, 146, .4);
}
.cu-submit:active { opacity: .9; }

/* 圆形勾选 */
.check-circle {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 1.5px solid #d8d8d8;
  flex-shrink: 0;
  margin-top: 2px;
  position: relative;
  cursor: pointer;
  transition: all .15s;
}
.check-circle.checked {
  background: var(--primary);
  border-color: var(--primary);
}
.check-circle.checked::after {
  content: "✓";
  position: absolute;
  inset: 0;
  color: #fff;
  font-size: 14px;
  line-height: 19px;
  text-align: center;
}

/* 底部结算栏 */
.bottom-bar {
  height: 60px;
  background: #fff;
  border-top: 1px solid #eee;
  display: flex;
  align-items: center;
  padding: 0 12px;
  gap: 12px;
  flex-shrink: 0;
}
.selected-info { flex: 1; line-height: 1.4; cursor: pointer; }
.sel-line1 { font-size: 12px; color: #666; }
.sel-line1 .arrow { color: #1ec792; }
.sel-line2 { font-size: 12px; color: #333; }
.price-red { color: #ff5757; font-weight: 600; }
.price-red.big { font-size: 18px; font-weight: 700; }
.btn-next {
  background: var(--primary);
  color: #fff;
  height: 40px;
  padding: 0 32px;
  border-radius: 20px;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
}
.btn-next:disabled { background: #b9e6d5; cursor: not-allowed; }

.confirm-bar { justify-content: space-between; }
.pay-info { display: flex; align-items: baseline; gap: 8px; font-size: 13px; color: #666; }

/* ===== 弹层 ===== */
.popup {
  position: absolute;
  inset: 0;
  z-index: 100;
  display: none;
}
.popup.active { display: block; }
.popup-mask {
  position: absolute; inset: 0;
  background: rgba(0,0,0,.45);
}
.popup-body {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  background: #fff;
  border-radius: 14px 14px 0 0;
  max-height: 75vh;
  display: flex;
  flex-direction: column;
  animation: slideUp .25s ease;
  padding: 0;
}
@keyframes slideUp {
  from { transform: translateY(100%); }
  to { transform: translateY(0); }
}
.popup-body-tall { max-height: 85vh; }
.popup-header {
  position: relative;
  padding: 14px 16px;
  border-bottom: 1px solid #f0f0f0;
  text-align: center;
  flex-shrink: 0;
}
.popup-title { font-size: 16px; font-weight: 600; }
.popup-close {
  position: absolute;
  right: 14px; top: 10px;
  font-size: 22px;
  color: #999;
  width: 28px; height: 28px;
  line-height: 34px;
  text-align: center;
  cursor: pointer;
}
.popup-content {
  flex: 1;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 8px 16px 16px;
}
.popup-footer {
  border-top: 1px solid #f0f0f0;
  padding: 12px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-shrink: 0;
}
.popup-price { font-size: 14px; color: #666; }
.popup-price .price-red { font-size: 20px; margin-left: 6px; }

/* 已选项目列表 */
.sel-cat-header {
  display: flex;
  align-items: center;
  padding: 14px 0 10px;
  border-left: 3px solid var(--primary);
  font-weight: 600;
}
.sel-cat-header { padding-left: 10px; }
.sel-cat-header .arrow { margin-left: auto; color: #999; cursor: pointer; font-size: 13px; font-weight: 400; }
.sel-group-body { display: flex; flex-direction: column; }
.sel-group-body.collapsed { display: none; }
.sel-item {
  display: flex;
  align-items: center;
  padding: 12px 0;
  border-bottom: 1px dashed #eee;
}
.sel-item .item-name { margin-bottom: 0; flex: 1; }

/* 项目详情 */
.detail-rec-card {
  background: #fff5ec;
  border-radius: 10px;
  padding: 14px;
  margin-bottom: 18px;
}
.detail-rec-label {
  display: inline-flex;
  align-items: center;
  background: #fff;
  border: 1px solid #ffd9b8;
  border-radius: 14px;
  padding: 2px 12px;
  font-size: 12px;
  color: #ff8a3c;
  font-weight: 600;
  margin-bottom: 10px;
  gap: 4px;
}
.detail-rec-text {
  font-size: 13px;
  color: #555;
  line-height: 1.75;
  white-space: pre-wrap;
  word-break: break-word;
}
.detail-tags-pill {
  display: inline-block;
  border: 1px solid #f5b27a;
  border-radius: 6px;
  padding: 4px 10px;
  margin-top: 10px;
  background: rgba(245, 178, 122, 0.08);
  max-width: 100%;
}
.detail-tags-text {
  font-size: 12px;
  color: #555;
  word-break: break-all;
  line-height: 1.6;
}
.detail-bullet {
  margin-bottom: 16px;
}
.detail-bullet-title {
  font-size: 14px;
  font-weight: 600;
  color: #333;
  margin-bottom: 8px;
}
.detail-text {
  font-size: 13px;
  color: #555;
  line-height: 1.75;
  white-space: pre-wrap;
  word-break: break-word;
  text-align: justify;
}

/* 推荐tip */
.popup-body-tip {
  top: 20%;
  border-radius: 8px;
  margin: 0 14px;
  max-height: none;
  animation: slideDown .25s ease;
}
@keyframes slideDown {
  from { transform: translateY(-30%); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}
.tip-bar {
  background: var(--primary);
  color: #fff;
  padding: 10px 14px;
  border-radius: 8px 8px 0 0;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
}
.tip-bar .popup-close { color: rgba(255,255,255,.7); }
.tip-content {
  background: #4a4a4a;
  color: #fff;
  padding: 14px;
  border-radius: 0 0 8px 8px;
  font-size: 12px;
  line-height: 1.7;
}
.tip-content strong { display: block; margin-bottom: 6px; }
.tip-content div { padding: 2px 0; }

/* ===== 信息确认 ===== */
.confirm-wrap {
  flex: 1;
  overflow-y: auto;
  background: #f5f5f5;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 80px;
}
.card {
  background: #fff;
  margin: 10px 12px;
  border-radius: 10px;
  padding: 14px;
}
.card-title {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 15px;
  font-weight: 600;
  margin-bottom: 10px;
}
.card-link { margin-left: auto; color: #999; font-size: 13px; font-weight: normal; cursor: pointer; }
.card-tip {
  background: #fff5ec;
  color: #ff8a3c;
  font-size: 12px;
  padding: 6px 10px;
  border-radius: 4px;
  margin-bottom: 12px;
}
.card-sub-tip {
  color: #ff8a3c;
  font-size: 12px;
  text-align: center;
  margin-top: 10px;
}

.form-row {
  display: flex;
  align-items: center;
  border-bottom: 1px solid #f0f0f0;
  padding: 12px 0;
}
.form-row:last-child { border-bottom: none; }
.form-row label { width: 80px; color: #333; font-size: 14px; flex-shrink: 0; }
.form-row input {
  flex: 1;
  font-size: 14px;
  color: #333;
  padding: 4px 0;
}
.form-row input::placeholder { color: #ccc; }

.radio-group { display: flex; gap: 20px; flex: 1; }
.radio { display: flex; align-items: center; gap: 6px; cursor: pointer; font-size: 14px; color: #333; }
.radio input { display: none; }
.radio span {
  width: 16px; height: 16px;
  border-radius: 50%;
  border: 1.5px solid #ccc;
  position: relative;
}
.radio input:checked + span {
  border-color: var(--primary);
}
.radio input:checked + span::after {
  content: "";
  position: absolute;
  inset: 3px;
  border-radius: 50%;
  background: var(--primary);
}

/* 日期选择 */
.date-strip {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 6px 0 4px;
  -webkit-overflow-scrolling: touch;
}
.date-item {
  flex-shrink: 0;
  width: 56px;
  height: 64px;
  border: 1.5px solid #e8e8e8;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  background: #fff;
  color: #333;
}
.date-item.disabled {
  background: #f7f7f7;
  color: #ccc;
  cursor: not-allowed;
  border-color: #f0f0f0;
}
.date-item .di-date { font-size: 13px; font-weight: 600; }
.date-item .di-week { font-size: 11px; color: #999; margin-top: 4px; }
.date-item.active {
  background: var(--primary);
  color: #fff;
  border-color: var(--primary);
}
.date-item.active .di-week { color: rgba(255,255,255,.85); }

/* 到检时间：提示 / 时间段 */
.date-tip { color: #2bb673; font-size: 12px; margin-top: 6px; }
.time-title { font-size: 14px; color: #333; margin: 14px 0 8px; }
.time-slots { display: flex; gap: 10px; flex-wrap: wrap; }
.time-slot {
  flex: 1;
  min-width: 120px;
  border: 1.5px solid #e8e8e8;
  border-radius: 8px;
  background: #fff;
  text-align: center;
  padding: 10px 0;
  cursor: pointer;
}
.time-slot .ts-range { font-size: 15px; font-weight: 600; color: #333; }
.time-slot .ts-left { font-size: 12px; color: #999; margin-top: 4px; }
.time-slot.active { border-color: var(--primary); background: #eafaf3; }
.time-slot.disabled {
  background: #f7f8fa;
  border-color: #eef0f3;
  cursor: not-allowed;
}
.time-slot.disabled .ts-range { color: #b6bcc4; }
.time-slot.disabled .ts-left { color: #c8ccd2; }
.time-empty {
  padding: 16px 4px;
  font-size: 13px;
  color: #9aa4ae;
}
.date-loading {
  width: 100%;
  padding: 18px 0;
  font-size: 13px;
  color: #9aa4ae;
  text-align: center;
}
.time-slot.active .ts-range { color: var(--primary); }

/* 只读信息值（预填展示） */
.ro-value { flex: 1; font-size: 14px; color: #333; text-align: left; word-break: break-all; }

/* ===== 全部日期（整月日历） ===== */
#popupCalendar .popup-body { min-height: 70vh; }
.cal-header {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 14px 16px;
  position: relative;
}
.cal-month { font-size: 16px; font-weight: 600; color: #333; }
.cal-next {
  position: absolute;
  right: 16px;
  font-size: 13px;
  color: #666;
  cursor: pointer;
}
.cal-week {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  text-align: center;
  font-size: 13px;
  color: #999;
  padding-bottom: 8px;
  border-bottom: 1px dashed #eee;
}
.cal-grid {
  flex: 1;
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  row-gap: 4px;
  padding: 8px 0 16px;
}
.cal-cell {
  min-height: 52px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  color: #333;
  border-radius: 8px;
}
.cal-cell .cc-day { font-weight: 500; }
.cal-cell .cc-left { font-size: 11px; color: #2bb673; margin-top: 2px; }
.cal-cell.other { color: #ccc; }
.cal-cell.other .cc-left { color: #ccc; }
.cal-cell.disabled { color: #ccc; }
.cal-cell.disabled .cc-left { color: #ccc; }
.cal-cell.today .cc-day { color: var(--primary); font-weight: 700; }
.cal-cell.ok { cursor: pointer; }
.cal-cell.selected { background: var(--primary); }
.cal-cell.selected .cc-day,
.cal-cell.selected .cc-left { color: #fff; }

/* 确认项目列表 */
.confirm-items {
  display: flex;
  flex-wrap: wrap;
  font-size: 14px;
  line-height: 1.9;
}
.confirm-items .ci-item {
  flex: 1 0 60%;
  text-align: right;
  padding-right: 8px;
}
.confirm-items .ci-price {
  flex: 0 0 80px;
  text-align: right;
}
.total-row {
  display: flex;
  justify-content: flex-end;
  align-items: baseline;
  gap: 8px;
  border-top: 1px dashed #eee;
  margin-top: 12px;
  padding-top: 12px;
  font-size: 13px;
  color: #666;
}

/* ===== 预约成功 ===== */
.success-wrap {
  flex: 1;
  min-height: 0; /* 允许 flex 子项收缩，配合滚动 */
  display: flex;
  flex-direction: column;
  align-items: center;
  /* 内容不足时上下留白居中，超长时自动变为顶部对齐，保证顶部内容不被裁切 */
  justify-content: flex-start;
  padding: 24px;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.success-wrap > * { flex-shrink: 0; }
.success-wrap > :first-child { margin-top: auto; }
.success-wrap > :last-child { margin-bottom: auto; }
.success-icon {
  width: 80px; height: 80px;
  border-radius: 50%;
  background: var(--primary);
  color: #fff;
  font-size: 44px;
  line-height: 76px;
  text-align: center;
  margin-bottom: 16px;
}
.success-wrap h2 { font-size: 20px; margin-bottom: 24px; color: #222; }
.success-info {
  background: #f7f7f7;
  border-radius: 10px;
  padding: 16px 24px;
  margin-bottom: 32px;
  width: 100%;
  font-size: 13px;
  line-height: 1.9;
  color: #555;
}
.success-info .si-row { display: flex; justify-content: space-between; }
.success-info .si-row span:first-child { color: #888; }
.success-info .si-row span:last-child { color: #222; font-weight: 500; }

/* PDF 生成区域 */
.success-pdf {
  background: #fff;
  border: 1px solid #eee;
  border-radius: 12px;
  padding: 18px 16px;
  width: 100%;
  box-shadow: 0 2px 10px rgba(0,0,0,.05);
  margin-bottom: 20px;
}
.sp-brand { font-size: 17px; font-weight: 700; text-align: center; color: #1a1a1a; margin-bottom: 12px; letter-spacing: 2px; }
.sp-sec { margin-top: 12px; border-top: 1px dashed #e5e5e5; padding-top: 10px; }
.sp-item { display: flex; justify-content: space-between; font-size: 13px; color: #444; padding: 4px 0; }
.sp-item span:last-child { color: #222; }
.sp-code { font-style: normal; font-size: 11px; color: #999; margin-left: 2px; }
.sp-note { margin-top: 14px; font-size: 11px; color: #aaa; text-align: center; }
.success-wrap .btn-ghost {
  background: #fff;
  color: var(--primary);
  border: 1.5px solid var(--primary);
  box-shadow: none;
  margin-top: 12px;
}

/* ===== Toast ===== */
.toast {
  position: absolute;
  top: 40%;
  left: 50%;
  transform: translateX(-50%);
  background: rgba(0,0,0,.75);
  color: #fff;
  padding: 8px 16px;
  border-radius: 6px;
  font-size: 13px;
  z-index: 200;
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s;
}
.toast.show { opacity: 1; }

/* ===== 开票服务弹层（底部弹层，与公告/医院简介一致） ===== */
.inv-head {
  position: relative;
  flex-shrink: 0;
  padding: 18px 16px 16px;
  background:linear-gradient(135deg, #1ec792 0%, #16b884 100%);
}
.inv-title {
  text-align: center;
  font-size: 17px;
  font-weight: 700;
  color: #1a1a1a;
}
.inv-close {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 32px;
  height: 32px;
  line-height: 30px;
  text-align: center;
  font-size: 28px;
  color: #555;
  cursor: pointer;
}
.inv-list {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 16px 16px 24px;
}
.inv-option {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 16px 14px;
  margin-bottom: 14px;
  border: 1px solid #e3e6ec;
  border-radius: 14px;
  background: #fff;
  cursor: pointer;
  transition: border-color .2s;
}
.inv-option:last-child { margin-bottom: 0; }
.inv-option.selected { border-color: var(--primary); }
.inv-radio {
  position: relative;
  flex-shrink: 0;
  width: 26px;
  height: 26px;
  margin-top: 2px;
  border: 2px solid #d9dde3;
  border-radius: 50%;
  box-sizing: border-box;
  transition: all .2s;
}
.inv-option.selected .inv-radio {
  background: var(--primary);
  border-color: var(--primary);
}
.inv-option.selected .inv-radio::after {
  content: "";
  position: absolute;
  left: 7px;
  top: 3px;
  width: 6px;
  height: 11px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(45deg);
}
.inv-body { flex: 1; min-width: 0; }
.inv-opt-title { font-size: 17px; font-weight: 700; color: #1a1a1a; line-height: 1.4; }
.inv-opt-desc { margin-top: 8px; font-size: 14px; color: #666; line-height: 1.65; }
.inv-opt-desc em { font-style: normal; color: #ff5757; }

/* ===== 响应式 ===== */
@media (max-width: 360px) {
  .cat-nav { width: 76px; }
  .cat-item { font-size: 12px; padding: 14px 6px; }
}