/* ===== 향담 전역 검색 (자립형) ===== */

/* 플로팅 버튼 - 우측 하단 */
.hsx-float-btn{
  position:fixed;bottom:88px;right:24px;z-index:9998;
  width:52px;height:52px;border-radius:50%;border:none;
  background:#5B6B52;color:#fff;font-size:22px;
  cursor:pointer;
  box-shadow:0 4px 20px rgba(91,107,82,0.4);
  display:flex;align-items:center;justify-content:center;
  transition:transform .15s, box-shadow .15s;
  font-family:inherit;
}
.hsx-float-btn:hover{transform:scale(1.08);box-shadow:0 6px 28px rgba(91,107,82,0.5)}
.hsx-float-btn:active{transform:scale(0.96)}

/* 오버레이 */
.hsx-overlay{
  position:fixed;inset:0;z-index:100000;
  background:rgba(45,51,40,0.55);
  display:flex;align-items:flex-start;justify-content:center;
  padding:10vh 20px 20px;
  animation:hsxFade .15s ease-out;
}
@keyframes hsxFade{from{opacity:0}to{opacity:1}}

/* 패널 */
.hsx-panel{
  width:620px;max-width:100%;
  max-height:75vh;
  background:var(--bg,#FEFDF9);
  border-radius:14px;
  overflow:hidden;
  display:flex;flex-direction:column;
  box-shadow:0 20px 60px rgba(0,0,0,0.3);
  border:0.5px solid rgba(0,0,0,0.08);
  animation:hsxSlide .18s ease-out;
}
@keyframes hsxSlide{from{transform:translateY(-12px);opacity:0}to{transform:translateY(0);opacity:1}}

/* 헤더 (검색 입력) */
.hsx-head{
  display:flex;align-items:center;gap:10px;
  padding:14px 18px;
  border-bottom:0.5px solid var(--border,#E5E1D6);
}
.hsx-head-icon{font-size:16px;color:var(--txt3,#8b8b7a);flex-shrink:0}
.hsx-input{
  flex:1;border:none;background:transparent;outline:none;
  font-size:15px;color:var(--txt,#2D3328);
  font-family:inherit;
}
.hsx-input::placeholder{color:var(--txt3,#aaa)}
.hsx-esc{
  font-size:10px;color:var(--txt3,#888);
  background:var(--bg2,#F5F1E8);
  padding:3px 8px;border-radius:4px;
  font-family:ui-monospace,monospace;
  flex-shrink:0;
}

/* 본문 (결과 목록) */
.hsx-body{
  flex:1;overflow-y:auto;
  padding:6px 0 10px;
  min-height:80px;
}
.hsx-body::-webkit-scrollbar{width:8px}
.hsx-body::-webkit-scrollbar-thumb{background:rgba(0,0,0,0.12);border-radius:4px}

/* 섹션 헤더 */
.hsx-sec-head{
  padding:10px 18px 5px;
  font-size:10px;font-weight:600;
  color:var(--txt3,#8b8b7a);
  letter-spacing:0.4px;
  display:flex;align-items:center;justify-content:space-between;
}
.hsx-sec-head:not(:first-child){
  margin-top:4px;
  border-top:0.5px solid var(--border,#E5E1D6);
  padding-top:10px;
}
.hsx-clear-btn{
  font-size:10px;background:none;border:none;
  color:var(--txt3,#888);cursor:pointer;
  font-family:inherit;padding:2px 6px;border-radius:3px;
}
.hsx-clear-btn:hover{background:var(--bg2,#F5F1E8);color:var(--txt,#2D3328)}

/* 결과 항목 */
.hsx-item{
  padding:9px 18px;
  display:flex;align-items:center;gap:12px;
  font-size:13px;cursor:pointer;
  transition:background .08s;
  border-left:3px solid transparent;
}
.hsx-item:hover{background:var(--bg2,#F5F1E8)}
.hsx-item.hsx-active{
  background:var(--bg2,#F5F1E8);
  border-left-color:#5B6B52;
}
.hsx-item-icon{font-size:14px;flex-shrink:0;width:18px;text-align:center}
.hsx-item-main{flex:1;min-width:0}
.hsx-item-title{
  color:var(--txt,#2D3328);
  font-weight:500;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.hsx-item-meta{
  font-size:11px;color:var(--txt2,#6b6b5e);
  margin-top:2px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.hsx-sub{color:var(--txt3,#888);font-weight:400;font-size:11px}

/* 매칭 하이라이트 */
.hsx-hl{background:#FAC775;color:#412402;padding:0 2px;border-radius:2px;font-weight:600}

/* 뱃지 */
.hsx-badge{
  font-size:10px;padding:2px 8px;border-radius:10px;
  font-weight:500;flex-shrink:0;
}
.hsx-badge-blue{background:#E6F1FB;color:#0C447C}
.hsx-badge-green{background:#EAF3DE;color:#3B6D11}
.hsx-badge-gray{background:#F1EFE8;color:#5F5E5A}
.hsx-badge-amber{background:#FAEEDA;color:#633806}
.hsx-badge-teal{background:#E1F5EE;color:#0F6E56}

/* 빈 결과 */
.hsx-empty{
  text-align:center;padding:50px 20px;
  color:var(--txt2,#6b6b5e);
}
.hsx-empty-icon{font-size:32px;opacity:0.5;margin-bottom:12px}
.hsx-empty-text{font-size:14px;font-weight:500;color:var(--txt,#2D3328);margin-bottom:6px}
.hsx-empty-hint{font-size:11px;color:var(--txt3,#888)}

/* 풋터 (키보드 힌트) */
.hsx-foot{
  padding:9px 18px;
  border-top:0.5px solid var(--border,#E5E1D6);
  background:var(--bg2,#F5F1E8);
  display:flex;gap:14px;
  font-size:10px;color:var(--txt3,#8b8b7a);
  flex-shrink:0;
}

/* 사용법 문서 모달 */
.hsx-help-overlay{
  position:fixed;inset:0;z-index:100001;
  background:rgba(45,51,40,0.6);
  display:flex;align-items:center;justify-content:center;
  padding:20px;
  animation:hsxFade .15s;
}
.hsx-help-modal{
  background:var(--bg,#FEFDF9);
  border-radius:12px;
  width:680px;max-width:100%;
  max-height:80vh;
  display:flex;flex-direction:column;
  box-shadow:0 20px 60px rgba(0,0,0,0.3);
  border:0.5px solid rgba(0,0,0,0.08);
}
.hsx-help-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 22px;
  border-bottom:0.5px solid var(--border,#E5E1D6);
}
.hsx-help-title{font-size:16px;font-weight:700;color:var(--txt,#2D3328)}
.hsx-help-close{
  background:none;border:none;font-size:18px;
  color:var(--txt3,#888);cursor:pointer;
  width:28px;height:28px;border-radius:4px;
  font-family:inherit;
}
.hsx-help-close:hover{background:var(--bg2,#F5F1E8);color:var(--txt,#2D3328)}
.hsx-help-body{
  flex:1;overflow-y:auto;padding:20px 22px;
  font-size:13px;line-height:1.8;color:var(--txt,#2D3328);
}
.hsx-help-body h3{font-size:14px;font-weight:700;margin:16px 0 8px;color:#5B6B52}
.hsx-help-body ol, .hsx-help-body ul{padding-left:20px;margin:8px 0}
.hsx-help-body li{margin:4px 0}
.hsx-help-body code{background:var(--bg2,#F5F1E8);padding:1px 6px;border-radius:3px;font-size:12px;font-family:ui-monospace,monospace}
.hsx-help-body b{color:#5B6B52}

/* 모바일 */
@media(max-width:640px){
  .hsx-overlay{padding:20px 12px;align-items:flex-start}
  .hsx-panel{max-height:85vh}
  .hsx-float-btn{width:48px;height:48px;font-size:20px;bottom:20px;right:20px}
  .hsx-head{padding:12px 14px}
  .hsx-input{font-size:14px}
  .hsx-item{padding:10px 14px}
}