/* ==================== 高级搜索模块样式修改 ==================== */

/* 全局规则 - 强制移除搜索框区域内所有元素的边框 */
.search-bg * {
    border: none !important;
    border-color: transparent !important;
    border-style: none !important;
    border-width: 0 !important;
}

.search-warp * {
    border: none !important;
    border-color: transparent !important;
    border-style: none !important;
    border-width: 0 !important;
}
.search-form {
    width: 100%;
    margin: 0 auto;
    margin: 1rem auto;
    border-radius: 2rem;
    background-color: #fff;
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    -webkit-box-shadow: 0 0 0 5px rgba(0,0,0,.1);
    box-shadow: 0 0 0 5px rgba(0,0,0,.1);
}

/* 强制移除所有黑色边框和轮廓 */
.search-bg,
.search-warp,
.search-bg *,
.search-warp *,
.search-bg .search-form,
.search-warp .search-form,
.search-bg form,
.search-warp form,
.search-bg .search-form form,
.search-warp .search-form form,
.search-bg .search-fields,
.search-warp .search-fields,
.search-bg .input-group,
.search-warp .input-group {
    outline: none !important;
    outline-color: transparent !important;
}

/* 移除所有边框 */
.search-bg .search-form,
.search-warp .search-form,
.search-bg form,
.search-warp form,
.search-bg .search-form form,
.search-warp .search-form form,
.search-bg .search-fields,
.search-warp .search-fields,
.search-bg .input-group,
.search-warp .input-group {
    border: none !important;
    border-color: transparent !important;
}

/* Bootstrap input-group-text 移除边框 */
.search-bg .input-group-text,
.search-warp .input-group-text {
    border: none !important;
    background: transparent !important;
    border-color: transparent !important;
}

/* Bootstrap input-group 前后缀按钮移除边框 */
.search-bg .input-group > *,
.search-warp .input-group > * {
    border: none !important;
    border-color: transparent !important;
}

/* Bootstrap .input-prepend, .input-append 移除边框 */
.search-bg .input-prepend,
.search-warp .input-prepend,
.search-bg .input-append,
.search-warp .input-append {
    border: none !important;
    border-color: transparent !important;
}

/* 所有输入框移除边框 */
.search-bg input,
.search-warp input,
.search-bg input[type="text"],
.search-warp input[type="text"],
.search-bg .form-control,
.search-warp .form-control,
.search-bg input.form-control,
.search-warp input.form-control,
.search-bg .search-input,
.search-warp .search-input {
    border: none !important;
    border-color: transparent !important;
    outline: none !important;
    outline-color: transparent !important;
    box-shadow: none !important;
}

/* 所有输入框的所有状态 */
.search-bg input:hover,
.search-bg input:focus,
.search-bg input:active,
.search-bg input:visited,
.search-warp input:hover,
.search-warp input:focus,
.search-warp input:active,
.search-warp input:visited,
.search-bg input[type="text"]:hover,
.search-bg input[type="text"]:focus,
.search-bg input[type="text"]:active,
.search-bg input[type="text"]:visited,
.search-warp input[type="text"]:hover,
.search-warp input[type="text"]:focus,
.search-warp input[type="text"]:active,
.search-warp input[type="text"]:visited,
.search-bg .form-control:hover,
.search-bg .form-control:focus,
.search-bg .form-control:active,
.search-bg .form-control:visited,
.search-warp .form-control:hover,
.search-warp .form-control:focus,
.search-warp .form-control:active,
.search-warp .form-control:visited {
    border: none !important;
    border-color: transparent !important;
    outline: none !important;
    outline-color: transparent !important;
    box-shadow: none !important;
}

/* 搜索框背景容器 */
.search-bg {
    position: relative !important;
    padding: 80px 0 !important;
}

.search-bg .search-warp {
    max-width: 1000px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
}

/* 搜索标题 */
.search-bg .search-title {
    text-align: center !important;
    color: #ffffff !important;
    font-size: 32px !important;
    font-weight: 700 !important;
    margin-bottom: 16px !important;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.2) !important;
}

/* 搜索描述 */
.search-bg .search-desc {
    text-align: center !important;
    color: rgba(255, 255, 255, 0.9) !important;
    font-size: 16px !important;
    margin-bottom: 30px !important;
}

/* 搜索表单 - 关键样式 */
.search-bg .search-form,
.search-warp .search-form {
    max-width: 1000px !important;
    margin: 0 auto 30px !important;
    background: transparent !important;
    padding: 0 !important;
    border: none !important;
    outline: none !important;
}

/* 外层容器无边框 */
.search-bg,
.search-warp {
    border: none !important;
    outline: none !important;
}

/* form标签无边框 */
.search-bg .search-form form,
.search-warp .search-form form,
.search-bg form,
.search-warp form,
.search-bg .search-form > form,
.search-warp .search-form > form {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

/* 确保分类选择框显示 */
.search-bg .search-select,
.search-warp .search-select {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.search-bg .search-select select,
.search-warp .search-select select {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.search-bg .search-form form,
.search-warp .search-form form,
.search-bg form,
.search-warp form {
    display: flex !important;
    align-items: center !important;
    gap: 0 !important;
    background: linear-gradient(90deg, #ff6b6b 0%, #feca57 100%) !important;
    border-radius: 50px !important;
    border: none !important;
    outline: none !important;
    box-shadow: 0 8px 32px rgba(255, 107, 107, 0.25) !important;
    transition: box-shadow 0.3s ease !important;
    padding: 3px !important;
    position: relative !important;
    overflow: hidden !important;
}

/* 所有表单元素移除边框 */
.search-bg form *,
.search-warp form *,
.search-bg .search-form form *,
.search-warp .search-form form * {
    outline: none !important;
}

/* input-group容器 */
.search-bg .input-group,
.search-warp .input-group {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

.search-bg .search-form form:hover,
.search-warp .search-form form:hover {
    box-shadow: 0 12px 40px rgba(255, 107, 107, 0.35) !important;
}

.search-bg .search-form form:focus-within,
.search-warp .search-form form:focus-within {
    box-shadow: 0 0 0 4px rgba(255, 107, 107, 0.2), 0 12px 40px rgba(255, 107, 107, 0.35) !important;
}

/* 分类选择下拉框 */
.search-bg .search-select,
.search-warp .search-select {
    margin: 0 !important;
    position: relative !important;
    z-index: 2 !important;
    display: flex !important;
    align-items: center !important;
}

.search-bg .search-select::after,
.search-warp .search-select::after {
    content: '' !important;
    position: absolute !important;
    right: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 1px !important;
    height: 50% !important;
    background: rgba(255, 255, 255, 0.2) !important;
    z-index: 3 !important;
}

.search-bg .search-select select.form-select,
.search-warp .search-select select.form-select {
    width: 150px !important;
    height: 56px !important;
    background: rgba(255, 255, 255, 0.95) !important;
    border: none !important;
    border-radius: 50px 0 0 50px !important;
    padding: 0 32px 0 20px !important;
    font-size: 15px !important;
    color: #333333 !important;
    cursor: pointer !important;
    -webkit-appearance: none !important;
    appearance: none !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'%3E%3Cpath fill='%23444' d='M5 7L1 3h8z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 16px center !important;
    position: relative !important;
    z-index: 2 !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.search-bg .search-select select.form-select:hover,
.search-warp .search-select select.form-select:hover {
    background: #ffffff !important;
}

.search-bg .search-select select.form-select:focus,
.search-warp .search-select select.form-select:focus {
    outline: none !important;
    box-shadow: none !important;
    background: #ffffff !important;
}

/* 搜索输入区域 */
.search-bg .search-fields,
.search-warp .search-fields {
    display: flex !important;
    flex: 1 !important;
    align-items: center !important;
    gap: 0 !important;
    position: relative !important;
    border: none !important;
}

/* 搜索输入框 - 彻底修复 */
.search-bg .search-fields input[type="text"],
.search-warp .search-fields input[type="text"] {
    flex: 1 !important;
    height: 56px !important;
    background: rgba(255, 255, 255, 0.98) !important;
    border: none !important;
    border-color: transparent !important;
    border-radius: 0 !important;
    padding: 0 24px !important;
    font-size: 16px !important;
    color: #212529 !important;
    min-width: 250px !important;
    margin: 0 !important;
    position: relative !important;
    z-index: 2 !important;
    box-shadow: none !important;
    outline: none !important;
    outline-color: transparent !important;
}

/* 悬停状态 */
.search-bg .search-fields input[type="text"]:hover,
.search-warp .search-fields input[type="text"]:hover {
    border: none !important;
    border-color: transparent !important;
    background: rgba(255, 255, 255, 0.98) !important;
    box-shadow: none !important;
    outline: none !important;
    outline-color: transparent !important;
}

/* 聚焦状态 */
.search-bg .search-fields input[type="text"]:focus,
.search-warp .search-fields input[type="text"]:focus {
    outline: none !important;
    outline-color: transparent !important;
    box-shadow: none !important;
    background: #ffffff !important;
    border: none !important;
    border-color: transparent !important;
}

/* 所有状态移除边框 */
.search-bg .search-fields input[type="text"]:focus:hover,
.search-bg .search-fields input[type="text"]:focus:active,
.search-bg .search-fields input[type="text"]:active,
.search-bg .search-fields input[type="text"]:visited,
.search-warp .search-fields input[type="text"]:focus:hover,
.search-warp .search-fields input[type="text"]:focus:active,
.search-warp .search-fields input[type="text"]:active,
.search-warp .search-fields input[type="text"]:visited {
    border: none !important;
    border-color: transparent !important;
    outline: none !important;
    outline-color: transparent !important;
    box-shadow: none !important;
}

.search-bg .search-fields input[type="text"]::placeholder,
.search-warp .search-fields input[type="text"]::placeholder {
    color: #adb5bd !important;
}

/* 搜索按钮 */
.search-bg .search-fields button,
.search-warp .search-fields button {
    width: 110px !important;
    height: 56px !important;
    background: linear-gradient(90deg, #ff6b6b 0%, #feca57 100%) !important;
    border: none !important;
    border-radius: 0 50px 50px 0 !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #ffffff !important;
    font-size: 0 !important;
    font-weight: 700 !important;
    transition: all 0.3s ease !important;
    letter-spacing: 3px !important;
    margin: 0 !important;
    position: relative !important;
    z-index: 2 !important;
    box-shadow: none !important;
    padding: 0 !important;
}

/* 隐藏按钮原始文字 */
.search-bg .search-fields button span,
.search-warp .search-fields button span,
.search-bg .search-fields button span::before,
.search-warp .search-fields button span::before,
.search-bg .search-fields button span::after,
.search-warp .search-fields button span::after,
.search-bg .search-fields button::after,
.search-warp .search-fields button::after {
    display: none !important;
    content: '' !important;
}

.search-bg .search-fields button:hover,
.search-warp .search-fields button:hover {
    background: linear-gradient(90deg, #feca57 0%, #ff6b6b 100%) !important;
    transform: scale(1.03) !important;
    color: #ffffff !important;
}

.search-bg .search-fields button:active,
.search-warp .search-fields button:active {
    transform: scale(0.98) !important;
}

/* 移除搜索图标并显示文字 */
.search-bg .search-fields button i,
.search-warp .search-fields button i {
    display: none !important;
}

.search-bg .search-fields button::before,
.search-warp .search-fields button::before {
    content: '搜索' !important;
    display: block !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    letter-spacing: 3px !important;
}

/* 搜索热词 */
.search-bg .search-hots,
.search-warp .search-hots {
    text-align: center !important;
    margin-top: 20px !important;
}

.search-bg .search-hots > span:first-child,
.search-warp .search-hots > span:first-child {
    color: rgba(255, 255, 255, 0.8) !important;
    font-size: 14px !important;
    margin-right: 12px !important;
}

.search-bg .search-hots span:not(:first-child),
.search-warp .search-hots span:not(:first-child) {
    display: inline-block !important;
    margin: 4px 6px !important;
}

.search-bg .search-hots span:not(:first-child) a,
.search-warp .search-hots span:not(:first-child) a {
    display: inline-block !important;
    padding: 6px 16px !important;
    background: rgba(255, 255, 255, 0.15) !important;
    color: #ffffff !important;
    border-radius: 20px !important;
    font-size: 13px !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
    backdrop-filter: blur(10px) !important;
}

.search-bg .search-hots span:not(:first-child) a:hover,
.search-warp .search-hots span:not(:first-child) a:hover {
    background: rgba(255, 255, 255, 0.3) !important;
    transform: translateY(-2px) !important;
}

/* 移动端适配 */
@media (max-width: 768px) {
    .search-bg {
        padding: 60px 0 !important;
    }

    .search-bg .search-title {
        font-size: 24px !important;
        margin-bottom: 12px !important;
    }

    .search-bg .search-desc {
        font-size: 14px !important;
        margin-bottom: 20px !important;
    }

    .search-bg .search-form form,
    .search-warp .search-form form {
        border-radius: 2rem;
        padding: 2px !important;
    }

    .search-bg .search-form form:hover,
    .search-warp .search-form form:hover {
        transform: none !important;
    }

    .search-bg .search-select select.form-select,
    .search-warp .search-select select.form-select {
        width: 110px !important;
        padding-right: 24px !important;
        font-size: 13px !important;
        border-radius: 30px 0 0 30px !important;
        height: 46px !important;
    }

    .search-bg .search-fields input[type="text"],
    .search-warp .search-fields input[type="text"] {
        min-width: 150px !important;
        padding: 0 16px !important;
        font-size: 14px !important;
        height: 46px !important;
    }

    .search-bg .search-fields button,
    .search-warp .search-fields button {
        width: 85px !important;
        font-size: 0 !important;
        border-radius: 0 30px 30px 0 !important;
        height: 46px !important;
        letter-spacing: 2px !important;
    }

    .search-bg .search-fields button::before,
    .search-warp .search-fields button::before {
        font-size: 14px !important;
    }

    .search-bg .search-hots span:not(:first-child) a,
    .search-warp .search-hots span:not(:first-child) a {
        padding: 4px 12px !important;
        font-size: 12px !important;
    }
}

/* 平板端适配 */
@media (min-width: 769px) and (max-width: 1024px) {
    .search-bg .search-form form,
    .search-warp .search-form form {
        max-width: 700px !important;
    }

    .search-bg .search-select select.form-select,
    .search-warp .search-select select.form-select {
        width: 130px !important;
    }
}
