/* =============================================================
   TG Search · 款式 A（导航内嵌搜索胶囊）
   新建文件 2026-10-12，不改动 main.css
   规则：所有类名以 tg-srch- 前缀隔离；只覆盖导航字号/间距，不碰其他任何现有样式
   ============================================================= */

/* ---------- 1. 为搜索入口腾空间（原导航在 1170px 容器里零余量） ---------- */
/* 仅把 font-size 20px→18px、padding 24px→16px，其余断点完全保持原值 */
header .nav a{font-size:18px}
header .nav>li>a{padding:2px 16px}
@media (max-width:1200px){
  header .nav a{font-size:18px}
  header .nav>li>a{padding:2px 10px}
}
@media (max-width:992px){
  header .nav a{font-size:15px}
  header .nav>li>a{padding:2px 5px}
}

/* ---------- 2. 搜索组件 ---------- */
/* 线上 .container 无 flex，form 会换行 → 用绝对定位悬浮在导航右端（bootstrap .navbar 自带 position:relative） */
.tg-srch{position:absolute;right:15px;top:12px;margin:0;z-index:1001;font-family:Arial,'Helvetica Neue',sans-serif}
/* 默认即展开态（用户要求：打开页面就看到搜索框）。
   .on 现在只负责建议面板的显隐，胶囊本身常驻展开。 */
.tg-srch-box{display:flex;align-items:center;gap:9px;height:44px;width:322px;padding:0 14px;border-radius:999px;
  background:#fff;border:1px solid #4E8B6D;cursor:text;overflow:hidden;
  box-shadow:0 6px 22px rgba(22,48,31,.16);
  transition:background .2s,border-color .2s,box-shadow .2s}
.tg-srch-box:hover{background:#fff}
.tg-srch-ic{width:17px;height:17px;flex:0 0 auto;margin:0;color:#3C7358;transition:color .2s}
.tg-srch-box input{display:block;flex:1 1 auto;min-width:0;width:0;border:none;outline:none;background:transparent;
  font-family:inherit;font-size:14.5px;color:#1B2A22;letter-spacing:.2px;cursor:text;padding:0 2px}
.tg-srch-box input::placeholder{color:#A9B7B0}
.tg-srch-kbd{flex:0 0 auto;display:block;font-size:11px;color:#8B9A92;border:1px solid #E1EAE5;
  border-radius:5px;padding:1px 6px;line-height:1.5}

/* 建议面板 */
.tg-srch-panel{position:absolute;top:54px;right:0;width:368px;background:#fff;border-radius:14px;
  border:1px solid #E1EAE5;box-shadow:0 22px 50px rgba(22,48,31,.18);overflow:hidden;
  opacity:0;visibility:hidden;transform:translateY(-8px);
  transition:opacity .2s,transform .22s,visibility .2s;z-index:1000}
.tg-srch.on .tg-srch-panel{opacity:1;visibility:visible;transform:translateY(0)}
.tg-srch-sec{padding:14px 16px 10px}
.tg-srch-sec+.tg-srch-sec{border-top:1px solid #E1EAE5}
.tg-srch-sec h4{font-size:11.5px;font-weight:600;letter-spacing:1px;text-transform:uppercase;color:#8B9A92}
.tg-srch-list{list-style:none;margin:0;padding:0}
.tg-srch-list li{display:flex;align-items:center;gap:11px;padding:9px 8px;margin:0 -8px;border-radius:9px;
  cursor:pointer;transition:background .15s}
.tg-srch-list li:hover,.tg-srch-list li.sel{background:#F4F9F6}
.tg-srch-thumb{width:40px;height:40px;border-radius:8px;flex:0 0 auto;
  background:linear-gradient(130deg,#E6EFE9,#D6E3DB);display:flex;align-items:center;justify-content:center}
.tg-srch-thumb svg{width:18px;height:18px;color:#9DB3A8}
.tg-srch-list .t{flex:1 1 auto;min-width:0}
.tg-srch-list .t b{display:block;font-size:13.5px;font-weight:500;color:#1B2A22;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tg-srch-list .t b em{font-style:normal;color:#3C7358}
.tg-srch-list .t i{display:block;font-style:normal;font-size:11.5px;color:#8B9A92;margin-top:1px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tg-srch-list .go{width:15px;height:15px;flex:0 0 auto;color:#B9C8C0}

/* 热词 */
.tg-srch-hot{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}
.tg-srch-hot span{font-size:12.5px;color:#2F5C48;background:#F4F9F6;border:1px solid #E1EAE5;
  border-radius:999px;padding:5px 11px;cursor:pointer;transition:.18s}
.tg-srch-hot span:hover{background:#3C7358;color:#fff;border-color:#3C7358}

.tg-srch-all{display:flex;align-items:center;justify-content:center;gap:7px;padding:12px;background:#F4F9F6;
  border-top:1px solid #E1EAE5;font-size:13px;color:#2F5C48;cursor:pointer;transition:.18s;text-decoration:none}
.tg-srch-all:hover{background:#E8F2ED;color:#2F5C48}
.tg-srch-all svg{width:14px;height:14px}
.tg-srch-empty{padding:26px 16px;text-align:center;color:#8B9A92;font-size:13px}

/* ---------- 3. 移动端：本期先不显示（线上 header 在 ≤768px 整体隐藏） ---------- */
@media (max-width:768px){
  .tg-srch{display:none}
}