/* ============================================================
 * myinfo-tab-bar.css — 顶部标题栏独立样式模块（MyInfo/Cart 共用）
 * ============================================================ */

/* ── 容器：覆盖 fixed，回归文档流 ── */
.tab-bar {position: relative;
    flex-shrink: 0;
    z-index: auto;
    display: flex;
    align-items: center;
    justify-content: center;

    padding: 0.52rem 0.42rem 0.21rem 0.42rem;
    margin-bottom: 0.37rem;
    background: transparent;
}/* ============================================================
 * myinfo-tab-bar.css — 顶部标题栏独立样式模块（MyInfo/Cart 共用）
 * ============================================================ */

/* ── 容器：覆盖 fixed，回归文档流 ── */
.tab-bar > * + * { margin-left: 0.78rem; }

/* ── 标题按钮 ── */
.tab-bar .tab-btn {
    position: relative;
    border: none;
    background: transparent;
    border-radius: 0;
    color: #bbb;
    font-size: 0.37rem;
    font-weight: 380;
    padding: 0.21rem 0 0.16rem 0;
    margin: 0 0 0.10rem 0;
    line-height: 1;
    cursor: pointer;
    outline: none;
    -webkit-tap-highlight-color: transparent;
    transition: color 0.18s ease, font-weight 0.18s ease, transform 0.18s ease;
}
.tab-bar .tab-btn:focus,
.tab-bar .tab-btn:focus-visible,
.tab-bar .tab-btn:active {
    outline: none;
    background: transparent;
}

/* ── 激活态文字 ── */
.tab-bar .tab-btn.active {
    background: transparent;
    border: none;
    color: #555;
    font-weight: 400;
    transform: translateY(-0.04rem);
}

/* ── 激活态蓝点 ── */
.tab-bar .tab-btn.active::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 100%;
    margin-top: 0;
    width: 0.13rem;
    height: 0.13rem;
    border-radius: 50%;
    background: #2196f3;
    opacity: 0.5;
    transform: translateX(-50%);
}