.site-search{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;margin-left:15px}
.search-toggle{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;color:inherit;-webkit-transition:opacity .2s;transition:opacity .2s}
.search-toggle:hover{opacity:.7}

/* 移动端悬浮搜索按钮 */
.site-search-mobile-btn{position:fixed;bottom:20px;right:20px;width:50px;height:50px;background:#cc493d;color:#fff;border-radius:50%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;cursor:pointer;-webkit-box-shadow:0 4px 12px rgba(0,0,0,.3);box-shadow:0 4px 12px rgba(0,0,0,.3);z-index:99998;-webkit-transition:-webkit-transform .2s;transition:-webkit-transform .2s;transition:transform .2s;transition:transform .2s,-webkit-transform .2s;-webkit-tap-highlight-color:transparent}
.site-search-mobile-btn:active{-webkit-transform:scale(.95);-ms-transform:scale(.95);transform:scale(.95)}

.search-container{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.85);z-index:99999;display:none;-webkit-box-align:start;-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;padding:60px 20px 20px;-webkit-box-sizing:border-box;box-sizing:border-box;overflow-y:auto;-webkit-overflow-scrolling:touch}
.search-container.active{display:flex;animation:fadeIn .2s}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}

.search-body{background:#fff;padding:20px;border-radius:12px;width:100%;max-width:550px;max-height:none;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;position:relative}
.search-body h3{margin:0 0 15px;font-size:18px;text-align:center;color:#333}

.search-input-wrapper{position:relative;width:100%}
.search-input{width:100%;padding:14px 16px;font-size:16px;border:2px solid #e5e5e5;border-radius:8px;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-border-radius:8px}
.search-input:focus{outline:none;border-color:#cc493d}
/* iOS输入框样式修复 */
@supports (-webkit-touch-callout:none){
.search-input{font-size:16px!important}
}

/* 搜索建议下拉框样式 */
.search-suggestions{display:none;position:absolute;top:100%;left:0;right:0;background:#fff;border:2px solid #cc493d;border-top:none;border-radius:0 0 8px 8px;-webkit-box-shadow:0 8px 16px rgba(0,0,0,.15);box-shadow:0 8px 16px rgba(0,0,0,.15);z-index:1001;max-height:300px;overflow-y:auto;margin-top:-2px;-webkit-overflow-scrolling:touch}
.search-suggestions.active{display:block}
.search-suggestion-item{padding:12px 16px;cursor:pointer;border-bottom:1px solid #f0f0f0;-webkit-transition:background .2s;transition:background .2s;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-tap-highlight-color:transparent}
.search-suggestion-item:last-child{border-bottom:none}
.search-suggestion-item:hover{background:#f5f5f5}
.search-suggestion-item svg{flex-shrink:0;margin-right:10px}
.search-suggestion-item span{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.search-results{margin-top:15px;overflow-y:auto;max-height:400px;border-top:1px solid #eee;-webkit-overflow-scrolling:touch}
.result-item{padding:12px;border-bottom:1px solid #f0f0f0;transition:background .2s}
.result-item:hover{background:#f9f9f9}
.result-item a{text-decoration:none;color:inherit;display:block}
.result-title{font-size:15px;font-weight:600;margin-bottom:4px;color:#333}
.result-date{font-size:12px;color:#999}
.result-content{font-size:13px;color:#666;margin-top:6px;line-height:1.5}
.keyword-highlight{color:#cc493d;font-weight:600}

/* 文章详情页关键词高亮样式 */
.site-search-highlight{background:#ffeb3b;color:#cc493d;padding:2px 4px;border-radius:3px;font-weight:600}
.no-results{padding:30px;text-align:center;color:#999}

/* 搜索历史样式 */
.search-history{margin-top:10px;padding:10px;background:#f9f9f9;border-radius:6px;display:none}
.search-history.active{display:block}
.search-history h4{margin:0 0 8px;font-size:13px;color:#666}
.search-history-list{display:flex;flex-wrap:wrap;gap:8px}
.search-history-item{padding:4px 12px;background:#fff;border:1px solid #e5e5e5;border-radius:12px;font-size:12px;color:#666;cursor:pointer;transition:all .2s}
.search-history-item:hover{background:#cc493d;color:#fff;border-color:#cc493d}
.search-history-clear{font-size:12px;color:#999;cursor:pointer;float:right}
.search-history-clear:hover{color:#cc493d}

/* 排序选项样式 */
.search-sort{margin-top:10px;padding:8px 0;border-top:1px solid #eee;border-bottom:1px solid #eee;display:none}
.search-sort.active{display:block}
.search-sort label{margin-right:15px;font-size:13px;color:#666;cursor:pointer}
.search-sort input[type="radio"]{margin-right:4px}
.search-sort input[type="radio"]:checked + span{color:#cc493d;font-weight:600}

/* 加载状态 */
.search-loading{padding:30px;text-align:center;color:#666}
.search-loading::after{
    content:'';
    display:inline-block;width:20px;height:20px;border:2px solid #e5e5e5;border-radius:50%;border-top-color:#cc493d;
    animation:spin 1s ease-in-out infinite;
    margin-left:10px;
    vertical-align:middle
}
@keyframes spin{to{transform:rotate(360deg)}}

/* 分页样式 */
.search-pagination{margin-top:15px;padding-top:15px;border-top:1px solid #eee}
.pagination{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;gap:5px;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}
.page-btn{padding:8px 14px;border:1px solid #ddd;background:#fff;border-radius:6px;cursor:pointer;font-size:14px;-webkit-transition:all .2s;transition:all .2s;touch-action:manipulation;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.page-btn:hover:not(:disabled){background:#f5f5f5;border-color:#cc493d}
.page-btn.active{background:#cc493d;color:#fff;border-color:#cc493d}
.page-btn:disabled{opacity:.5;cursor:not-allowed}
.page-ellipsis{color:#999;padding:0 5px}
.pagination-info{font-size:13px;color:#666;margin-left:8px}

/* 移动端适配 */
@media(max-width:768px){
.site-search{display:none}
.search-container{padding:10px;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center}
.search-body{padding:18px;border-radius:10px;width:95%;max-height:90vh}
.search-input{padding:16px;font-size:16px}
.search-results{max-height:50vh}
.page-btn{padding:10px 16px;font-size:15px;min-width:44px;min-height:44px}
.pagination-info{font-size:13px}
}

/* 平板端适配 */
@media(min-width:769px) and (max-width:1024px){
.search-body{max-width:600px}
}

/* 鸿蒙系统特殊适配 */
@media all and (-webkit-device-pixel-ratio:1) and (device-type:tablet),(device-type:phone){
.search-input{font-size:16px!important}
}

/* Theme match for Riven */
.search-container,
.site-search-mobile-btn{
    --ss-bg-card:#FBF8F2;
    --ss-bg-soft:#F8F4ED;
    --ss-text:#2F2A26;
    --ss-body:#4B433D;
    --ss-muted:#8D8176;
    --ss-line:#E2D8CA;
    --ss-line-soft:#EFE9E0;
    --ss-accent:#6D5641;
    --ss-accent-hover:#5A4634;
    --ss-red:#A64637;
}

.site-search-mobile-btn{
    background:var(--ss-accent);
    color:#FAF6EF;
    border:1px solid rgba(255,248,236,.28);
    box-shadow:0 8px 22px rgba(109,86,65,.22);
}

.search-container{
    background:rgba(47,42,38,.82);
}

.search-body{
    background:var(--ss-bg-card);
    border:1px solid rgba(226,216,202,.9);
    color:var(--ss-body);
    box-shadow:0 18px 48px rgba(80,64,48,.18);
}

.search-body h3{
    color:var(--ss-text);
}

.search-input{
    background:#FFFCF7;
    border-color:var(--ss-line);
    color:var(--ss-text);
}

.search-input:focus{
    border-color:var(--ss-accent);
    box-shadow:0 0 0 3px rgba(109,86,65,.1);
}

.search-suggestions{
    background:#FFFCF7;
    border-color:var(--ss-accent);
    box-shadow:0 10px 22px rgba(80,64,48,.14);
}

.search-suggestion-item{
    border-bottom-color:var(--ss-line-soft);
}

.search-suggestion-item:hover,
.result-item:hover{
    background:#F1E8DC;
}

.search-results,
.result-item,
.search-pagination,
.search-sort{
    border-color:var(--ss-line-soft);
}

.result-title{
    color:var(--ss-text);
}

.result-date,
.no-results,
.pagination-info,
.page-ellipsis{
    color:var(--ss-muted);
}

.result-content,
.search-history h4,
.search-sort label,
.search-loading{
    color:var(--ss-body);
}

.keyword-highlight{
    color:var(--ss-red);
}

.site-search-highlight{
    background:#F1E8DC;
    color:var(--ss-red);
}

.search-history{
    background:var(--ss-bg-soft);
    border:1px solid var(--ss-line-soft);
    border-radius:8px;
}

.search-history-item{
    background:#FFFCF7;
    border-color:var(--ss-line);
    color:var(--ss-body);
}

.search-history-item:hover{
    background:var(--ss-accent);
    border-color:var(--ss-accent);
    color:#FAF6EF;
}

.search-history-clear:hover,
.search-sort input[type="radio"]:checked + span{
    color:var(--ss-red);
}

.search-loading::after{
    border-color:var(--ss-line);
    border-top-color:var(--ss-accent);
}

.pagination{
    gap:8px;
}

.page-btn{
    display:inline-grid;
    place-items:center;
    min-width:38px;
    height:38px;
    padding:0 14px;
    border-color:var(--ss-line);
    border-radius:8px;
    background:var(--ss-bg-soft);
    color:#6B6158;
    font-size:14px;
    line-height:1;
}

.page-btn:hover:not(:disabled){
    border-color:#D8C9B5;
    background:#F1E8DC;
    color:var(--ss-accent-hover);
}

.page-btn.active{
    border-color:var(--ss-accent);
    background:var(--ss-accent);
    color:#FAF6EF;
    box-shadow:0 4px 12px rgba(109,86,65,.16);
}

.page-btn:disabled{
    border-color:#ECE4D9;
    background:#F7F2EA;
    color:#B7ADA2;
    opacity:1;
}

.pagination-info{
    margin-left:2px;
}

@media(max-width:768px){
    .search-container{
        padding:12px;
    }
    .search-body{
        padding:18px;
        border-radius:10px;
    }
    .search-pagination{
        padding-top:14px;
    }
    .pagination{
        gap:7px;
    }
    .page-btn{
        min-width:38px;
        height:38px;
        padding:0 12px;
        font-size:14px;
    }
    .pagination-info{
        line-height:38px;
        margin-left:4px;
    }
}

@media(max-width:450px){
    .search-container{
        padding:10px;
    }
    .search-body{
        width:calc(100% - 20px);
        padding:18px 16px;
    }
    .pagination{
        gap:6px;
    }
    .page-btn{
        min-width:36px;
        height:36px;
        padding:0 10px;
        font-size:14px;
    }
    .pagination .page-btn:first-child{
        display:none;
    }
    .pagination-info{
        line-height:36px;
        margin-left:2px;
    }
}

/* Riven polish */
.search-container{
    background:rgba(47,42,38,.76);
    backdrop-filter:saturate(110%) blur(1px);
}

.search-body{
    max-width:520px;
    padding:18px 18px 20px;
    border-color:rgba(226,216,202,.78);
    border-radius:10px;
    background:linear-gradient(180deg,#FFFCF7 0%,#FBF8F2 100%);
    box-shadow:0 18px 44px rgba(45,35,27,.18),inset 0 1px 0 rgba(255,255,255,.68);
}

.search-body h3{
    margin-bottom:14px;
    font-size:17px;
    font-weight:700;
    letter-spacing:0;
    line-height:1.35;
}

.search-input{
    height:52px;
    padding:0 16px;
    border-width:1px;
    border-color:#D9CDBD;
    border-radius:8px;
    background:rgba(255,253,248,.9);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.72),0 2px 8px rgba(80,64,48,.045);
    color:#2F2A26;
    line-height:52px;
    transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease;
}

.search-input:focus{
    border-color:#8A6D4A;
    background:#FFFCF7;
    box-shadow:0 0 0 3px rgba(138,109,74,.13),inset 0 1px 0 rgba(255,255,255,.72);
}

.search-input::placeholder{
    color:#A89C91;
}

.search-history{
    margin-top:10px;
    padding:10px 12px 11px;
    border-color:#E8DED1;
    border-radius:8px;
    background:rgba(248,244,237,.64);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.42);
}

.search-history h4{
    margin-bottom:9px;
    font-size:13px;
    font-weight:600;
    color:#6B6158;
    line-height:1.2;
}

.search-history-clear{
    color:#A79B91;
    font-weight:400;
}

.search-history-list{
    gap:7px;
}

.search-history-item{
    min-height:28px;
    padding:0 11px;
    border-color:#E3D8CA;
    border-radius:999px;
    background:#FFFCF7;
    color:#7C7168;
    font-size:12px;
    line-height:28px;
    box-shadow:0 2px 6px rgba(80,64,48,.035);
}

.search-results{
    margin-top:15px;
    max-height:390px;
    border-top-color:#E9E0D4;
}

.result-item{
    padding:14px 2px;
    border-bottom-color:#E9E0D4;
}

.result-title{
    font-size:15px;
    line-height:1.5;
}

.result-date{
    margin-top:2px;
    line-height:1.4;
}

.result-content{
    margin-top:7px;
    color:#6B6158;
    font-size:13px;
    line-height:1.65;
}

.no-results{
    min-height:94px;
    padding:36px 12px;
    color:#9B9086;
    font-size:15px;
    line-height:1.6;
}

.search-pagination{
    margin-top:15px;
    padding-top:15px;
    border-top-color:#E9E0D4;
}

.pagination{
    gap:7px;
}

.page-btn{
    min-width:36px;
    height:36px;
    padding:0 12px;
    border-color:#E2D8CA;
    background:rgba(248,244,237,.72);
    color:#6B6158;
    box-shadow:none;
}

.page-btn.active{
    background:#6D5641;
    border-color:#6D5641;
    color:#FAF6EF;
    box-shadow:0 4px 12px rgba(109,86,65,.15);
}

.page-btn:hover:not(:disabled){
    border-color:#D8C9B5;
    background:#F1E8DC;
}

.pagination-info{
    color:#8D8176;
}

@media(max-width:768px){
    .search-container{
        align-items:flex-start;
        padding:48px 14px 18px;
    }
    .search-body{
        width:100%;
        max-width:430px;
        padding:17px 16px 19px;
        border-radius:9px;
    }
    .search-body h3{
        margin-bottom:13px;
        font-size:17px;
    }
    .search-input{
        height:50px;
        padding:0 14px;
        line-height:50px;
    }
    .search-history{
        padding:10px 11px;
    }
    .search-results{
        max-height:calc(100vh - 330px);
        min-height:96px;
    }
    .no-results{
        min-height:80px;
        padding:32px 10px;
    }
    .page-btn{
        min-width:36px;
        height:36px;
        padding:0 11px;
    }
    .pagination-info{
        line-height:36px;
    }
}

@media(max-width:450px){
    .search-container{
        padding:48px 15px 18px;
    }
    .search-body{
        width:100%;
        padding:17px 15px 18px;
    }
    .search-results{
        max-height:calc(100vh - 320px);
    }
    .page-btn{
        min-width:34px;
        height:34px;
        padding:0 10px;
    }
    .pagination-info{
        line-height:34px;
    }
}

/* Empty state and pagination tightening */
.search-results:has(.no-results){
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:112px;
}

.no-results{
    width:100%;
    min-height:0;
    padding:20px 12px;
    color:#9C9188;
    font-size:14px;
    text-align:center;
}

.no-results::before{
    content:'';
    display:block;
    width:32px;
    height:32px;
    margin:0 auto 9px;
    border:1px solid #E2D8CA;
    border-radius:50%;
    background:
        linear-gradient(45deg, transparent 45%, #B7ADA2 46%, #B7ADA2 54%, transparent 55%) 20px 21px/9px 9px no-repeat,
        radial-gradient(circle at center, transparent 45%, #B7ADA2 47%, #B7ADA2 54%, transparent 56%);
    opacity:.58;
    box-sizing:border-box;
}

.search-pagination .pagination{
    align-items:center;
}

.search-pagination:empty{
    display:none;
}

.search-pagination .page-btn{
    box-sizing:border-box;
    min-height:0;
    height:34px;
    min-width:34px;
    padding:0 11px;
    line-height:32px;
}

.search-pagination .pagination-info{
    height:34px;
    line-height:34px;
}

@media(max-width:768px){
    .search-results:has(.no-results){
        min-height:104px;
    }
    .no-results{
        padding:18px 10px;
    }
    .search-pagination .page-btn{
        height:34px;
        min-height:0;
        min-width:34px;
        padding:0 10px;
        line-height:32px;
    }
    .search-pagination .pagination-info{
        height:34px;
        line-height:34px;
    }
}

@media(max-width:450px){
    .search-results:has(.no-results){
        min-height:96px;
    }
    .no-results::before{
        width:30px;
        height:30px;
        margin-bottom:8px;
    }
    .search-pagination .page-btn{
        height:32px;
        min-width:32px;
        line-height:30px;
    }
    .search-pagination .pagination-info{
        height:32px;
        line-height:32px;
    }
}
