.hc-nav-back-bar {
    position: relative;
    display: flex;
    align-items: center;
    padding: 0.7rem 1.25rem;
    background: white;
    &.top {
        padding-top: calc(var(--status-bar-height) + 10rpx);
    }
    .back {
        position: absolute;
        display: flex;
        align-items: center;
        margin-left: -18rpx;
        color: var(--hc-nav-back, #484848);
        z-index: 2;
        .icon {
            font-size: 40rpx;
        }
        .text {
            margin-left: -8rpx;
        }
    }
    .title {
        flex: 1;
        z-index: 1;
        position: relative;
        text-align: center;
        padding: 0 150rpx;
    }
    .right {
        position: absolute;
        right: 1.25rem;
        z-index: 2;
        display: flex;
        align-items: center;
        justify-content: flex-end;
    }

    &.data-table-nav-bar {
        background: transparent;
        --hc-nav-back: white;
        color: white;
    }
}