/* how-search.css — 全局搜索页样式 */

.search-scopes { display: flex; gap: 8px; margin-bottom: 16px; }
.search-scopes__btn { padding: 6px 16px; border: 1px solid #E5E5EA; border-radius: 6px; background: #FFFFFF; color: #666666; cursor: pointer; font-size: 14px; }
.search-scopes__btn--active { background: #007AFF; color: #FFFFFF; border-color: #007AFF; }
.search-input-wrap { display: flex; gap: 8px; margin-bottom: 16px; }
.search-input { flex: 1; padding: 8px 12px; border: 1px solid #E5E5EA; border-radius: 6px; font-size: 14px; }
.search-result { background: #FFFFFF; border: 1px solid #E5E5EA; border-radius: 8px; padding: 16px; margin-bottom: 12px; cursor: pointer; }
.search-result__title { font-size: 15px; font-weight: 600; color: #333333; margin-bottom: 4px; }
.search-result__title mark { background: #FFF3B0; padding: 0 2px; border-radius: 2px; }
.search-result__desc { font-size: 13px; color: #666666; margin-bottom: 4px; }
.search-result__desc mark { background: #FFF3B0; padding: 0 2px; border-radius: 2px; }
.search-result__type { display: inline-block; padding: 2px 8px; background: #F5F5F7; color: #666666; font-size: 11px; border-radius: 4px; }
.global-search { position: relative; }
.global-search__input { width: 100%; padding: 8px 12px; border: 1px solid #E5E5EA; border-radius: 6px; font-size: 14px; }
.global-search__suggest { position: absolute; top: 100%; left: 0; right: 0; background: #FFFFFF; border: 1px solid #E5E5EA; border-radius: 6px; box-shadow: 0 2px 8px rgba(0,0,0,0.1); z-index: 100; max-height: 300px; overflow-y: auto; }
.global-search__suggest-item { padding: 8px 12px; cursor: pointer; display: flex; align-items: center; gap: 8px; }
.global-search__suggest-item:hover { background: #F5F5F7; }
.global-search__suggest-source { font-size: 11px; color: #9E9E9E; background: #F5F5F7; padding: 1px 6px; border-radius: 3px; }
.rec-card { background: #FFFFFF; border: 1px solid #E5E5EA; border-radius: 8px; padding: 16px; margin-bottom: 12px; position: relative; }
.rec-card__title { font-size: 15px; font-weight: 600; color: #333333; cursor: pointer; margin-bottom: 4px; }
.rec-card__reason { font-size: 12px; color: #007AFF; margin-bottom: 8px; }
.rec-card__dismiss { position: absolute; top: 12px; right: 12px; background: none; border: none; color: #9E9E9E; font-size: 12px; cursor: pointer; }
.rec-card__dismiss:hover { color: #FF3B30; }