/* ============================================================
   KING BAIL LAW FIRM · 律师团队页增强
   姓名搜索（支持全拼 / 首字母）+ 分类筛选
   仅 team.html 引入，不影响全站其他页面
   ============================================================ */

  /* ---------- 工具条：左搜索，右筛选 ---------- */
  .team-tools{
    display:flex;flex-wrap:wrap;align-items:flex-start;
    gap:18px 30px;justify-content:space-between;margin-bottom:48px;
  }
  .team-tools .filter-bar{margin-bottom:0}

  /* ---------- 搜索框 ---------- */
  .ls{position:relative;flex:1 1 340px;max-width:452px}
  .ls-field{
    display:flex;align-items:center;gap:11px;height:41px;padding:0 15px;
    background:var(--white);border:1px solid var(--line);
    transition:border-color .35s var(--ease),box-shadow .35s var(--ease);
  }
  .ls-field:hover{border-color:var(--ink-3)}
  .ls.is-open .ls-field,.ls-field:focus-within{border-color:var(--crimson);box-shadow:0 0 0 3px var(--gold-faint)}
  .ls-ico{
    flex:0 0 auto;width:15px;height:15px;fill:none;stroke:var(--ink-3);
    stroke-width:1.9;stroke-linecap:round;transition:stroke .35s;
  }
  .ls.is-open .ls-ico,.ls-field:focus-within .ls-ico{stroke:var(--crimson)}
  .ls input{
    flex:1;min-width:0;height:100%;border:0;outline:0;background:transparent;
    font-family:var(--sans);font-size:13.5px;letter-spacing:.06em;color:var(--ink);
  }
  .ls input::placeholder{color:#A9B2C0;letter-spacing:.08em}
  .ls input::-webkit-search-cancel-button,
  .ls input::-webkit-search-decoration{display:none;-webkit-appearance:none}
  .ls-clear{
    flex:0 0 auto;width:20px;height:20px;padding:0;border:0;background:transparent;
    color:#A9B2C0;font-size:13px;line-height:1;cursor:pointer;
    opacity:0;pointer-events:none;transition:opacity .25s,color .25s;
  }
  .ls.has-q .ls-clear{opacity:1;pointer-events:auto}
  .ls-clear:hover{color:var(--ink)}
  .ls-tip{
    display:flex;align-items:center;gap:8px;margin-top:9px;padding-left:2px;
    font-size:11px;color:#A9B2C0;letter-spacing:.1em;
  }
  .ls-tip em{font-style:normal;color:var(--crimson);letter-spacing:.08em}

  /* ---------- 下拉建议 ---------- */
  .ls-drop{
    position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:60;
    background:var(--white);border:1px solid var(--line);
    box-shadow:0 30px 64px -32px rgba(22,36,61,.42);
    max-height:374px;overflow-y:auto;overscroll-behavior:contain;
    opacity:0;transform:translateY(-6px);pointer-events:none;
    transition:opacity .26s var(--ease),transform .26s var(--ease);
  }
  .ls.is-open .ls-drop{opacity:1;transform:none;pointer-events:auto}
  .ls-item{
    display:flex;align-items:center;gap:14px;padding:11px 15px;
    border-bottom:1px solid var(--line-soft);transition:background .22s;
  }
  .ls-item:last-child{border-bottom:0}
  .ls-item:hover,.ls-item.is-active{background:var(--paper-2)}
  .ls-item img{
    flex:0 0 auto;width:44px;height:44px;background:var(--paper-2);
    object-fit:cover;object-position:50% 18%;
  }
  .ls-txt{flex:1;min-width:0}
  .ls-item b{
    display:block;font-family:var(--serif);font-size:15.5px;
    font-weight:700;letter-spacing:.12em;line-height:1.4;
  }
  .ls-item b mark{background:var(--gold-faint);color:var(--crimson);padding:0 1px}
  .ls-meta{
    margin-top:3px;font-size:11.5px;color:var(--ink-3);letter-spacing:.05em;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  }
  .ls-meta i{font-style:normal;color:var(--crimson);letter-spacing:.1em;margin-right:7px}
  .ls-empty{
    padding:24px 16px;text-align:center;font-size:12.5px;
    color:var(--ink-3);letter-spacing:.08em;line-height:2;
  }
  .ls-empty span{display:block;font-size:11px;color:#B9B4A9}

  /* ---------- 筛选后的卡片与计数 ---------- */
  .member.is-hidden{display:none}
  .count-note.is-empty{color:var(--crimson)}

  /* ---------- 响应式 ---------- */
  @media(max-width:1024px){
    .ls{flex:1 1 300px;max-width:none}
  }
  @media(max-width:640px){
    .team-tools{gap:14px;margin-bottom:34px}
    .ls{flex:1 1 100%;order:-1}
    .ls-tip{display:none}
    .ls-item img{width:38px;height:38px}
  }

  /* ============================================================
     v2 追加（2026-09-29）· A–Z 姓氏索引
     与「姓名搜索」「身份筛选」是三个可叠加的维度
     ============================================================ */
  .tools-row{display:flex;flex-wrap:wrap;gap:16px 38px;justify-content:flex-end;flex:1 1 auto}
  .tool-grp{display:flex;flex-direction:column;gap:9px}
  .tool-lb{
    font-size:10.5px;letter-spacing:.24em;color:#B9B4A9;
    display:flex;align-items:baseline;gap:7px;line-height:1;
  }
  .tool-lb i{font-style:normal;font-size:9px;letter-spacing:.2em;color:#CFC9BC}

  .az-bar{display:flex;flex-wrap:wrap;gap:5px}
  .az-bar button{
    min-width:34px;height:34px;padding:0 6px;font-size:12.5px;letter-spacing:.06em;
    font-family:Arial,Helvetica,sans-serif;
    background:var(--white);border:1px solid var(--line);color:var(--ink-2);
    cursor:pointer;transition:all .3s var(--ease);
  }
  .az-bar button:hover{border-color:var(--ink);color:var(--ink)}
  .az-bar button.on{background:var(--crimson);border-color:var(--crimson);color:#fff}
  .az-bar button[data-a="__all"]{
    min-width:auto;padding:0 16px;font-family:inherit;letter-spacing:.14em;
  }

  @media(max-width:1024px){
    .tools-row{justify-content:flex-start;gap:16px 30px}
  }
  @media(max-width:640px){
    .tools-row{gap:14px 20px;width:100%}
    .tool-lb{font-size:10px;letter-spacing:.2em}
    .az-bar{gap:4px}
    .az-bar button{min-width:30px;height:30px;font-size:11.5px;padding:0 5px}
    .az-bar button[data-a="__all"]{padding:0 12px;font-size:11px}
  }
