/* ====== 共用选项卡模板（MyInfo/Messages/Cart/AllOrders/Order） ====== */

/* 全局禁用焦点蓝色边框 */
*:focus, *:focus-visible { outline: none !important; }
*, *::before, *::after { -webkit-tap-highlight-color: transparent !important; }/* 选项卡容器：默认 fixed 置顶（MyInfo、Messages 使用） */
.tab-bar {position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 99;
    display: flex;
    align-items: center;
    justify-content: center;

    padding: 0.52rem 0.42rem 0.21rem 0.42rem;
    background: transparent;
}/* 选项卡容器：默认 fixed 置顶（MyInfo、Messages 使用） */
.tab-bar > * + * { margin-left: 0.78rem; }

/* 选项卡按钮（可点击切换） */
.tab-btn {
    position: relative;
    border: none;
    background: transparent;
    color: #bbb;
    font-size: 0.37rem;
    font-weight: 380;
    padding: 0.21rem 0 0.16rem 0;
    line-height: 1;
    cursor: pointer;
    outline: none;
    -webkit-tap-highlight-color: transparent;
    transition: color .18s, font-weight .18s, transform .18s;
}
.tab-btn:focus,
.tab-btn:focus-visible,
.tab-btn:active {
    outline: none;
    background: transparent;
}
.tab-btn.active {
    color: #555;
    font-weight: 400;
    transform: translateY(-2px);
}
.tab-btn.active::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 100%;
    margin-top: 2px;
    width: 0.13rem;
    height: 0.13rem;
    border-radius: 50%;
    background: #2196f3;
    opacity: 0.5;
    transform: translateX(-50%);
}

/* 选项卡标题（不可点击的居中文本，AllOrders/Order 使用） */
.tab-title {
    position: relative;
    flex: 1;
    text-align: center;
    font-size: 0.37rem;
    font-weight: 400;
    color: #555;
    padding: 0.21rem 0 0.16rem 0;
    line-height: 1;
    transform: translateY(-2px);
}
.tab-title::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 100%;
    margin-top: 2px;
    width: 0.13rem;
    height: 0.13rem;
    border-radius: 50%;
    background: #2196f3;
    opacity: 0.5;
    transform: translateX(-50%);
}

/* 顶栏内联模式（Cart/AllOrders 等 tab-bar 在滚动容器内部时使用） */
.tab-bar-inline {
    position: static;
}/* 横向滚动模式（选项卡较多时左右滑动） */
.tab-bar-scroll {justify-content: flex-start;

    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
    white-space: nowrap;
    flex-wrap: nowrap;
    padding-left: 0.42rem;
    padding-right: 0.42rem;
}/* 横向滚动模式（选项卡较多时左右滑动） */
.tab-bar-scroll > * + * { margin-left: 0.52rem; }
.tab-bar-scroll::-webkit-scrollbar {
    display: none;
}
.tab-bar-scroll .tab-btn {
    flex-shrink: 0;
}/* 双组模式：前5个滚动 + 售后处理固定在右侧 */
.tab-bar-two-group {justify-content: flex-start;

    padding-left: 0.42rem;
    padding-right: 0.42rem;
    flex-wrap: nowrap;
}/* 双组模式：前5个滚动 + 售后处理固定在右侧 */
.tab-bar-two-group > * + * { margin-left: 0; }
.tab-bar-scroll-area {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    overflow: visible;
}
.tab-bar-scroll-inner {display: flex;
    align-items: center;

    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
    white-space: nowrap;
    padding-bottom: 0.18rem;
    margin-bottom: -0.18rem;
}
.tab-bar-scroll-inner > * + * { margin-left: 0.52rem; }
.tab-bar-scroll-inner::-webkit-scrollbar {
    display: none;
}
.tab-bar-scroll-inner .tab-btn {
    flex-shrink: 0;
}
.tab-bar-sep {
    flex: none;
    width: 1px;
    height: 0.42rem;
    background: #ddd;
    margin: 0 0.52rem;
    align-self: center;
}
.tab-btn-after {
    flex: none;
}

/* 顶栏中的规则/操作按钮 */
.tab-bar-spacer {
    width: 0;
    flex: none;
}

/* 带规则按钮模式：标题居中，规则按钮绝对定位于右侧 */
.tab-bar.tab-bar-has-rule {
    position: relative;
    justify-content: center;
}
.tab-bar-has-rule .tab-title {
    flex: 0 1 auto;
}
.tab-bar-right {
    position: absolute;
    right: 0.42rem;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
}
.tab-bar-link {
    display: none;
    width: 1.1rem;
    flex: none;
    border: none;
    background: transparent;
    color: #b0b0b0;
    font-size: 0.34rem;
    font-weight: 380;
    line-height: 1;
    padding: 0.21rem 0 0.16rem 0;
    transform: translateY(-2px);
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    outline: none;
}
.tab-bar-link:focus,
.tab-bar-link:focus-visible,
.tab-bar-link:active {
    outline: none;
    background: transparent;
}