/* ============================================================
 * 房飞布 · 全站顶栏统一样式  header-unify.css
 *
 * 目的：让所有页面的顶部搜索栏视觉完全一致。
 * 覆盖范围：
 *   - Index/new_top.html  → 首页、列表页、服务页、详情页等 14 个页面
 *   - Index/n_head.html   → 「我的」相关 12 个页面
 *
 * 设计语言：品牌橙渐变 #ff8a2b → #ff6e00，白色胶囊，圆角 20px。
 *
 * ⚠️ 本文件是**全局**样式（不带 body 作用域前缀），因为要统一全站。
 *    如需给某个页面单独定制，请在其 body 上加类名后在页面级 CSS 里覆盖。
 * ============================================================ */

/* ---------- 1. 顶栏底色 ---------- */
.top_banner {
    width: 100% !important;
    height: 60px !important;
    line-height: 60px !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    z-index: 9999 !important;
    background: linear-gradient(180deg, #ff8a2b 0%, #ff6e00 100%) !important;
    border-bottom: none !important;
    box-shadow: 0 2px 10px rgba(255, 110, 0, .22);
    box-sizing: border-box !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* ---------- 2. 内部胶囊容器 ---------- */
.top_banner .top_main_banner {
    height: 40px !important;
    line-height: 40px !important;
    margin: 10px 12px !important;
    padding: 0 !important;
    background: #fff !important;
    border: none !important;
    border-radius: 20px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .06);
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    overflow: hidden;
}

/* ---------- 3. 城市选择 ----------
 * 用 CSS 画下拉三角，不再依赖图片（图片在橙色/白色背景下对比度不稳）。
 * 注意：n_head.html 里原本有一个 ::after 三角 + position:relative，
 * 这里统一接管，避免出现两个箭头。 */
.top_banner .n_change_city {
    position: relative !important;
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100px !important;
    height: 40px !important;
    line-height: 40px !important;
    margin: 0 !important;
    padding: 0 24px 0 14px !important;
    text-indent: 0 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #333 !important;
    border-right: 1px solid #eef0f3 !important;
    background: none !important;
    background-image: none !important;
    box-sizing: border-box !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    float: none !important;
    display: block !important;
}
.top_banner .n_change_city a {
    color: #333 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    display: inline-block !important;
    max-width: 100% !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    vertical-align: top !important;
    line-height: 40px !important;
}
/* 下拉三角：只有一个，用 border 画，任意背景都清晰 */
.top_banner .n_change_city::after {
    content: '' !important;
    position: absolute !important;
    right: 10px !important;
    top: 50% !important;
    left: auto !important;
    width: 6px !important;
    height: 6px !important;
    margin: -5px 0 0 0 !important;
    border: none !important;
    border-right: 1.8px solid #9aa0aa !important;
    border-bottom: 1.8px solid #9aa0aa !important;
    transform: rotate(45deg) !important;
    background: none !important;
    display: block !important;
}

/* ---------- 4. 搜索框 ---------- */
.top_banner .search_input_top {
    position: static !important;
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    height: 30px !important;
    line-height: 30px !important;
    margin: 0 8px !important;
    padding: 0 !important;
    padding-left: 34px !important;
    text-indent: 0 !important;
    font-size: 13px !important;
    color: #9aa0aa !important;
    text-align: left !important;
    border: none !important;
    border-radius: 15px !important;
    background-color: #f4f5f7 !important;
    background-image: url("../images/index_icons.png") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    background-size: 13px !important;
    box-sizing: border-box !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    display: block !important;
    float: none !important;
    left: auto !important;
    top: auto !important;
}
/* n_head.html 里那个空心圆「假放大镜」统一隐藏，改用背景图图标 */
.top_banner .serch_btn_top {
    display: none !important;
}

/* ---------- 5. 老版本遗留：去掉顶层多余 wrapper 的干扰 ---------- */
.top_banner > div > div:first-child:not(.top_main_banner) {
    float: none !important;
    top: auto !important;
    position: static !important;
}