/* 搜索框样式 */
.search-box {
    position: absolute;
    right: 20px;
    top: -8px;
    float: right;
    margin-right: 0;
    width: 280px;
    height: 36px;
    border: 1px solid;
    border-radius: 6px;
    background: var(--bg1);
    transition: border-color 0.2s ease;
}

.search-box:hover {
    border-color: var(--brand_blue_light);
}

.search-box:focus-within {
    border-color: var(--brand_blue);
}

.search-input {
    width: 100%;
    height: 34px;
    padding: 0 0 0 12px;
    border: none;
    background: transparent;
    font-size: 14px;
    color: var(--text1);
    outline: none;
    line-height: 34px;
    box-sizing: border-box;
}

.search-input::placeholder {
    color: var(--text3);
}

.search-btn {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    width: 28px;
    height: 28px;
    border: none;
    background: transparent;
    color: var(--text2);
    cursor: pointer;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

.search-btn:hover {
    background: var(--graph_bg_thick);
    color: var(--brand_blue);
}

.search-clear {
    position: absolute;
    right: 38px;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: 20px;
    border: none;
    background: transparent;
    color: var(--text3);
    cursor: pointer;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

.search-clear:hover {
    background: var(--graph_bg_thick);
    color: var(--text1);
}

/* 兼容性样式 - 如果CSS变量不存在时的备用颜色 */
.search-box {
    border-color: #e3e5e7;
}

.search-box:hover {
    border-color: #00a1d6;
}

.search-box:focus-within {
    border-color: #00a1d6;
}

.search-input {
    color: #18191c;
}

.search-input::placeholder {
    color: #9499a0;
}

.search-btn {
    color: #61666d;
}

.search-btn:hover {
    background: #f1f2f3;
    color: #00a1d6;
}

.search-clear {
    color: #9499a0;
}

.search-clear:hover {
    background: #f1f2f3;
    color: #18191c;
}