/**
 * 即时下拉建议样式（配合 assets/js/search-suggest.js）
 * 两处宿主：首页 hero 搜索框 .zpb-hf-search、子比搜索弹层 .search-form
 */

.zpb-suggest-wrap {
    position: relative;
}

.zpb-suggest {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + 8px);
    z-index: 60;
    display: none;
    max-height: 420px;
    overflow-y: auto;
    padding: 6px;
    border-radius: 12px;
    background: var(--main-bg-color, #fff);
    border: 1px solid var(--main-border-color, #eef0f2);
    box-shadow: 0 18px 40px rgba(25, 22, 20, .12);
    text-align: left;
}

.zpb-suggest.is-open {
    display: block;
}

.zpb-suggest-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 10px;
    border-radius: 8px;
    color: var(--main-color, #1f2329);
    text-decoration: none;
    transition: background .2s ease;
}

.zpb-suggest-item:hover,
.zpb-suggest-item:focus {
    background: color-mix(in oklab, var(--theme-color, #f04494) 7%, transparent);
}

.zpb-suggest-type {
    flex: none;
    padding: 1px 8px;
    border-radius: 4px;
    font-size: 11px;
    line-height: 1.7;
    background: color-mix(in oklab, var(--theme-color, #f04494) 12%, var(--main-bg-color, #fff));
    color: var(--theme-color, #f04494);
}

.zpb-suggest-type--book {
    background: color-mix(in oklab, var(--main-color, #1f2329) 7%, var(--main-bg-color, #fff));
    color: var(--muted-color, #5a6472);
}

.zpb-suggest-title {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 13.5px;
}

.zpb-suggest-meta {
    flex: none;
    font-size: 11.5px;
    color: var(--muted-color, #9aa0a6);
}

.zpb-suggest-more {
    display: block;
    padding: 8px 10px 6px;
    font-size: 12.5px;
    color: var(--theme-color, #f04494);
    text-decoration: none;
}

/* 子比搜索弹层里本身是 padding-10，下拉别贴着输入框边 */
.main-search .zpb-suggest {
    top: calc(100% + 2px);
}

@media (max-width: 767px) {
    .zpb-suggest {
        max-height: 60vh;
    }
}

/* ==========================================================================
   地名搜索结果条目（站长 2026-10-02：地名结果样式需要优化）
   条目本身沿用主题 <posts class="posts-item list"> 那套标记，
   地名没有插图，这里给 post-graphic 里的图标一个占位底。
   ========================================================================== */
.zpb-place-thumb {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    aspect-ratio: 1 / 1;
    border-radius: 8px;
    background: color-mix(in oklab, var(--theme-color, #f04494) 8%, var(--main-bg-color, #fff));
    color: var(--theme-color, #f04494);
    font-size: 26px;
}

.posts-item .zpb-place-thumb { min-height: 78px; }
