/* ═══════════════════════════════════════════════════════════
   SETTINGS · GLOBAL SEARCH (v33, 2026-05-13)
   ───────────────────────────────────────────────────────────
   全站設定搜尋 — top-level，所有 tab 共用。input + spotlight
   results list 跨 tab 顯示 jump-to-setting hits。
   從 settings.css 拆出（v46，2026-05-13）。
   ═══════════════════════════════════════════════════════════ */

.settings-search {
  position: relative;
  max-width: 760px;
  margin: 24px auto 14px;
  padding: 0 24px;
}
.settings-search-icon {
  /* parent .settings-search 有 padding: 0 24px，所以 left 要加上 padding */
  position: absolute; left: 40px; top: 50%; transform: translateY(-50%);
  opacity: 0.7; pointer-events: none;
  color: var(--text-muted);
}
.settings-search-input {
  width: 100%;
  background: var(--bg-surface);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  color: var(--text-primary);
  padding: 14px 40px 14px 44px;
  font-size: 16px;
  font-family: inherit;
  transition: border-color var(--trans-fast), box-shadow var(--trans-fast);
}
.settings-search-input:focus {
  outline: none;
  border-color: var(--accent-ring);
  box-shadow: 0 0 0 3px var(--accent-subtle);
}
.settings-search-input::placeholder { color: var(--text-muted); }
.settings-search-clear {
  position: absolute; right: 10px; top: 50%; transform: translateY(-50%);
  width: 26px; height: 26px; border-radius: 50%;
  background: var(--bg-elevated); color: var(--text-muted);
  cursor: pointer; border: 0;
  display: inline-flex; align-items: center; justify-content: center;
}
.settings-search-clear:hover { background: var(--bg-overlay); color: var(--text-primary); }
.settings-search-results {
  max-width: 760px;
  margin: 0 auto 24px;
}
.settings-search-list { display: flex; flex-direction: column; gap: 4px; }
.settings-search-hit {
  display: flex; align-items: center; gap: 12px;
  width: 100%; text-align: left;
  padding: 10px 14px;
  background: var(--bg-surface);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  color: var(--text-primary); cursor: pointer;
  transition: all var(--trans-fast);
}
.settings-search-hit:hover {
  border-color: var(--accent-ring);
  background: var(--accent-subtle);
  transform: translateX(2px);
}
.settings-search-hit-icon {
  width: 28px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--text-secondary);
}
.settings-search-hit-icon .ico { width: 18px; height: 18px; }
.settings-search-hit-body { flex: 1; min-width: 0; }
.settings-search-hit-title {
  display: flex; align-items: center; gap: 8px;
  font-size: 14px; font-weight: 500;
  margin-bottom: 2px;
}
.settings-search-hit-desc {
  font-size: 12px; color: var(--text-muted);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.settings-search-hit-arrow {
  color: var(--text-muted); opacity: 0.5;
  transition: all var(--trans-fast);
}
.settings-search-hit:hover .settings-search-hit-arrow {
  opacity: 1; color: var(--accent); transform: translateX(2px);
}

/* ═══════════════════════════════════════════════════════════
   📱 MOBILE — < 760px
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 760px) {
  /* v33: 全站設定搜尋手機 — input 字大一點不被 iOS 放大、padding 收緊 */
  .settings-search { margin: 8px 12px 12px; padding: 0; }
  .settings-search-icon { left: 14px; }
  .settings-search-input { font-size: 16px; padding: 12px 36px 12px 40px; }
  .settings-search-results { padding: 0 12px; margin: 0 0 16px; }
  .settings-search-hit { padding: 10px 12px; gap: 10px; }
}