/* ============================================================
   头部搜索栏 优化样式（独立文件，不影响其他模块）
   ============================================================ */

/* ---------- 搜索标签栏 ---------- */
.header .search-tabs {
    margin-bottom: 8px;
}

.header .search-tabs .btn {
    width: auto !important;
    min-width: 64px;
    padding: 0 15px !important;
    height: 28px !important;
    line-height: 28px !important;
    margin-right: 6px !important;
    border-radius: 8px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #5a6a80 !important;
    background: #eef2f7 !important;
    border: none !important;
    cursor: pointer;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    box-sizing: border-box;
}

.header .search-tabs .btn:hover {
    color: #0074D2 !important;
    background: #dcebf9 !important;
}

.header .search-tabs .btn.active {
    color: #fff !important;
    background: linear-gradient(135deg, #2b93ea 0%, #0074D2 100%) !important;
    box-shadow: 0 4px 12px rgba(0, 116, 210, 0.35);
}

/* ---------- 搜索框整体卡片 ---------- */
.header .search-box .search-form {
    height: 44px !important;
    line-height: 44px !important;
    border: 1.5px solid #d4e2f3 !important;
    border-right: 0 !important;
    border-radius: 12px !important;
    background: #fff !important;
    box-shadow: 0 4px 14px rgba(0, 80, 170, 0.08);
    transition: box-shadow 0.25s, border-color 0.25s;
    box-sizing: border-box;
}

/* 聚焦时蓝色发光（表单内任意元素获得焦点） */
.header .search-box .search-form:focus-within {
    border-color: #0074D2 !important;
    box-shadow: 0 6px 20px rgba(0, 116, 210, 0.16), 0 0 0 3px rgba(0, 116, 210, 0.1);
}

/* ---------- 左侧下拉选择 ---------- */
.header .search-box .search-select {
    height: 44px !important;
    line-height: 44px !important;
    margin-top: 0 !important;
    border-right: 1px solid #eef1f5 !important;
}

.header .search-box .search-select p {
    padding: 0 12px 0 16px !important;
    margin: 0;
    font-size: 13px;
    color: #43506a;
}

.header .search-box .search-select p .iconfont {
    font-size: 12px !important;
    color: #9aa5b5 !important;
}

/* ---------- 输入框 ---------- */
.header .search-box .search-input {
    line-height: 44px !important;
}

.header .search-box .search-input .el-input__inner {
    height: 42px !important;
    line-height: 42px !important;
    border: none !important;
    font-size: 13px !important;
    color: #2c3a4f;
}

.header .search-box .search-input .el-input__inner:focus {
    box-shadow: none !important;
}

/* 没有左侧下拉时（企业查询 / 域名注册 / 域名交易），输入框居首，留出左侧间距与圆角对齐 */
.header .search-box .search-form > .search-input:first-child .el-input__inner {
    padding-left: 16px !important;
}

/* ---------- 相机（图形搜索）按钮 ---------- */
.header .search-box .tuxing-btn {
    height: 44px !important;
}

.header .search-box .tuxing-btn .iconfont {
    line-height: 44px !important;
    margin-top: 0 !important;
    color: #93a0b2 !important;
    font-size: 19px !important;
    transition: color 0.25s;
}

.header .search-box .tuxing-btn:hover .iconfont {
    color: #0074D2 !important;
}

/* ---------- 全部分类下拉 ---------- */
.header .search-box .category-select {
    height: 44px !important;
    line-height: 44px !important;
}

.header .search-box .category-select p {
    padding: 0 10px !important;
    font-size: 13px;
    color: #43506a;
}

/* ---------- 免费查询主按钮 ---------- */
.header .search-box .search-btn {
    height: 44px !important;
    line-height: 44px !important;
    margin-top: 0 !important;
    border-radius: 0 12px 12px 0 !important;
    background: linear-gradient(135deg, #2b93ea 0%, #0074D2 100%) !important;
    border: none !important;
    color: #fff !important;
    font-size: 14px !important;
    cursor: pointer;
    transition: all 0.25s;
    box-sizing: border-box;
}

.header .search-box .search-btn strong {
    font-weight: 600 !important;
}

.header .search-box .search-btn:hover {
    background: linear-gradient(135deg, #1e86de 0%, #0064B5 100%) !important;
    box-shadow: 0 4px 14px rgba(0, 116, 210, 0.35);
}

/* ---------- 下拉弹层：外层保持透明（内部 ul 自带白底边框），避免异常大框 ---------- */
.header-popper {
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* 综合查询 / 商标名称 下拉框（内部 ul） */
.header-popper .header-search-item {
    width: 112px !important;
    padding: 6px !important;
    margin: -4px 0 0 -1px !important;
    background: #fff !important;
    border: 1px solid #d4e2f3 !important;
    border-top: 0 !important;
    border-radius: 0 0 10px 10px !important;
    box-shadow: 0 12px 32px rgba(20, 50, 100, 0.14) !important;
    box-sizing: border-box;
    height: auto !important;
}

.header-popper .header-search-item li {
    height: 34px !important;
    line-height: 34px !important;
    border-radius: 7px;
    font-size: 13px;
    color: #43506a;
    cursor: pointer;
    transition: all 0.2s;
}

.header-popper .header-search-item li:hover {
    background: #e8f1fb !important;
    color: #0074D2;
}

/* 全部分类 大弹层（内部容器）圆角与柔和阴影 */
.header-popper .header-category-item {
    border: 1px solid #d4e2f3 !important;
    border-top: 0 !important;
    border-radius: 0 0 12px 12px !important;
    box-shadow: 0 14px 36px rgba(20, 50, 100, 0.14) !important;
}