/* search.css */

#search-overlay {
  position:fixed; inset:0;
  background:var(--white);
  z-index:500;
  display:flex; flex-direction:column;
  transform:translateY(-100%);
  transition:transform 0.3s var(--ease-slide);
}
#search-overlay.open { transform:translateY(0); }

#search-bar-wrap {
  display:flex; align-items:center; gap:10px;
  padding:12px 14px;
  border-bottom:1.5px solid var(--border);
  padding-top:max(12px, env(safe-area-inset-top));
  flex-shrink:0;
}
#search-bar-wrap svg { color:var(--mid); flex-shrink:0; }
#search-input { flex:1; font-size:1rem; font-weight:500; color:var(--ink); }
#search-input::placeholder { color:#bbb; }
#search-cancel { font-size:0.8rem; font-weight:700; color:var(--active); padding:4px 0 4px 8px; white-space:nowrap; }

#search-results-wrap { flex:1; overflow-y:auto; -webkit-overflow-scrolling:touch; }
#search-results { display:flex; flex-direction:column; }

.search-result {
  display:flex; align-items:center; gap:12px;
  padding:12px 16px; border-bottom:1px solid var(--border);
  cursor:pointer; transition:background 0.12s;
  -webkit-tap-highlight-color:transparent;
}
.search-result:active { background:var(--light); }

.sr-thumb {
  width:50px; height:50px; border-radius:8px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center; font-size:1.4rem;
}
.sr-text { flex:1; min-width:0; }
.sr-tag { font-size:0.58rem; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; margin-bottom:3px; }
.sr-title { font-family:var(--font-display); font-size:0.88rem; font-weight:700; line-height:1.3; color:var(--ink); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.sr-title strong { background:rgba(255,220,0,0.35); border-radius:2px; }
.sr-meta { font-size:0.6rem; color:var(--mid); margin-top:3px; }

#search-empty {
  padding:60px 20px; text-align:center; color:var(--mid);
  font-family:var(--font-ui);
}
.se-icon { font-size:2.5rem; margin-bottom:10px; }
#search-empty p { font-size:0.9rem; }