span {
    vertical-align: baseline;
}

.red {
    color: red;
}

.loading {
    width: 100vw;
    height: 100vh;
    position: fixed;
    background: rgba(0, 0, 0, 0);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    display: none;
}

.loading img {
    width: 2rem;
}

.dialog {
    width: 100vw;
    height: 100vh;
    position: fixed;
    left: 0;
    top: 0;
    background: rgba(0, 0, 0, 0.8);
    z-index: 999;
    box-sizing: border-box;
}

.dialog-main {
    width: 5.47rem;
    height: 7.36rem;
    border-radius: 0.04rem;
    border: 0.23rem solid rgba(255, 255, 255, 0.55);
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-size: 0.2rem;
    /* overflow: auto; */
}

.dialog-main-con {
    width: 100%;
    height: 100%;
}

.dialog-close {
    width: 0.2rem;
    height: 0.2rem;
    position: absolute;
    right: 0.2rem;
    top: 0.2rem;
    background: url(../../img/mo/pop_close.png) no-repeat top center;
    background-size: 100%;
}

.dialog-q-content {
    width: 100%;
    display: flex;
}

.dialog-q-content img {
    width: 100%;
}

.dialog-q .dialog-main {
    height: 6.81rem;
}

.dialog-q .dialog-close {
    right: -0.21rem;
    top: -0.21rem;
}

.dialog-rule .dialog-main-con {
    padding: 0.35rem 0.3rem;
    line-height: 0.27rem;
    box-sizing: border-box;
    overflow: auto;
}

.dialog-info .dialog-main {
    text-align: center;
    height: 2rem;
    /* line-height: 2rem; */
    overflow: initial;
    font-size: 0.24rem;

}

.dialog-info .dialog-main-con {
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 0.5rem;
    /* text-align: center;
    box-sizing: border-box;
    padding-top: 0.6rem; */
}

.dialog-info .dialog-main span {
    /* word-break: break-all; */
}

.dialog-code .dialog-main {
    height: 5.47rem;
}

.dialog-code-title {
    font-size: 0.4rem;
    text-align: center;
    margin-top: 0.4rem;
}

#qrcode {
    width: 3.6rem;
    height: 3.6rem;
    margin: 0 auto;
    margin-top: 0.4rem;
}

#qrcode img {
    width: 100%;
    height: 100%;
}

.zfb-code {
    color: #1677FF;
}

.wx-code {
    color: #09BB07;
}

.pay-success-con {
    text-align: center;
}

.pay-success-img {
    width: 35%;
    margin-top: 0.8rem;
}

.pay-success-info {
    font-size: 0.4rem;
    color: #22242E;
    margin-top: 0.4rem;
}

.zfb-code .pay-success-info>span {
    color: #1677FF;
    cursor: pointer;
}

.wx-code .pay-success-info>span {
    color: #09BB07;
    cursor: pointer;
}

.dialog-inPayment .dialog-main {
    height: 5.47rem;

}

.dialog-inPayment .dialog-main-con {
    width: 100%;
    height: 100%;
}

.dialog-inPayment-img {
    width: 2.84rem;
    height: 1.56rem;
    background: url(../../img/pc/in_payment.png) no-repeat top center;
    background-size: 100%;
    margin: 0 auto;
    margin-top: 0.79rem;
}

.dialog-inPayment-info1 {
    font-weight: bold;
    font-size: 0.27rem;
    text-align: center;
    color: #2F2F2F;
    margin-top: 0.28rem;
}

.dialog-inPayment-info2 {
    font-size: 0.22rem;
    text-align: center;
    color: #2F2F2F;
    line-height: 0.48rem;
    width: 4.04rem;
    margin: 0 auto;
    margin-top: 0.5rem;
}

/* 登录 */
.dialog-sign-in .dialog-main {
    width: 7.69rem;
    height: 7.64rem;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0.8);
    background: url(../../img/pop/login_bg.png) no-repeat top center;
    background-size: 100% 100%;
    padding: 1.7rem 0.4rem 0;
    box-sizing: border-box;
    border: none;
}

.dialog-close2 {
    width: 0.49rem;
    height: 0.54rem;
    background: url(../../img/pop/close.png) no-repeat top center;
    background-size: 100%;
    position: absolute;
    right: 0rem;
    top: -0.74rem;
    cursor: pointer;
}

.dialog-sign-in .account-form {
    margin: 0.2rem 0;

}

.account-form input {
    width: 100%;
    height: 0.8rem;
    border-radius: 0.06rem;
    background: #FFFFFF;
    box-shadow: 0px 1px 3px 0px rgba(184, 183, 201, 0.43);
    font-size: 0.3rem;
    padding-left: 0.16rem;
    border: none;
    margin-top: 0.15rem;
}

.sign-in-btn {
    width: 2.75rem;
    height: 0.79rem;
    background: url(../../img/pop/login_btn.png) no-repeat top center;
    background-size: 100%;
    margin: 0 auto;
    text-align: center;
    line-height: 0.82rem;
    color: #FFFFFF;
    font-size: 0.4rem;
    margin-top: 0.5rem;
}

.sign-in-other {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 0.17rem;
}

.sign-in-other1 {
    margin-top: 0.4rem;
}

.sign-in-other>div {
    width: 3.07rem;
    height: 0.6rem;
}

.sign-in-google {
    background: url(../../img/pop/login_google.png) no-repeat top center;
    background-size: 100%;
    cursor: pointer;
}

.sign-in-fb {
    background: url(../../img/pop/login_facebook.png) no-repeat top center;
    background-size: 100%;
    cursor: pointer;
}

.sign-in-line {
    background: url(../../img/pop/login_line.png) no-repeat top center;
    background-size: 100%;
    cursor: pointer;
}

.sign-in-apple {
    background: url(../../img/pop/login_apple.png) no-repeat top center;
    background-size: 100%;
    cursor: pointer;
}


.dialog-sign-in .tips {
    font-size: 0.19rem;
    margin-top: 0.4rem;
    text-align: center;
    line-height: 0.38rem;
    color: #454546;
}

.dialog-sign-in .protocol {
    display: flex;
    justify-content: center;
}

.dialog-sign-in .protocol a {
    color: #454546;
    text-decoration: underline;
}

.dialog-sign-in .checkbox-btn,
.dialog-sign-in .checkbox-btn.checked {
    width: 0.38rem;
    height: 0.38rem;
    background: url(../../img/pop/pop_select.png) no-repeat top center;
    background-size: 100%;
    margin-right: 0.1rem;
    cursor: pointer;
}

.dialog-sign-in .checkbox-btn.checked {
    background: url(../../img/pop/pop_select1.png) no-repeat top center;
    background-size: 100%;
}


/* 角色 */

.dialog-roles .dialog-main {
    width: 15.03rem;
    height: 7.64rem;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(0.8);
    background: url(../../img/pop/role_bg.png) no-repeat top center;
    background-size: 100%;
    border: none;

}

.dialog-roles .dialog-close2 {
    top: -0.6rem;
}

.dialog-roles .dialog-main-con2 {
    padding: 0.47rem 0 0 1.4rem;
}

.dialog-roles .role-title {
    width: 2.62rem;
    height: 0.8rem;
    background: url(../../img/pop/role_title.png) no-repeat top center;
    background-size: 100%;
}

.dialog-roles .role-list {
    margin-top: 0.4rem;
    width: 13.5rem;
    height: 4.6rem;
    display: flex;
    flex-wrap: wrap;
    overflow-y: auto;
}

.dialog-roles .role-item {
    width: 4.43rem;
    height: 1.57rem;
    background: url(../../img/pop/role_item_bg.png) no-repeat top center;
    background-size: 100%;
    padding: 0.2rem 0 0 0.36rem;
    box-sizing: border-box;
    cursor: pointer;
    position: relative;
}

.dialog-roles .role-item>div {
    max-width: 90%;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.dialog-roles .role-name {
    font-size: 0.3rem;
    color: #2b2826;
}

.dialog-roles .role-id {
    font-size: 0.26rem;
    color: #2b2826;
}

.dialog-roles .role-server {
    font-size: 0.2rem;
    color: #fff;
    margin-top: 0.26rem;
    text-align: right;
    position: absolute;
    right: 0.26rem;
    top: 0.85rem;
}

/* 信息提示 */
.dialog-msg .dialog-main {
    width: 6.69rem;
    height: 2.81rem;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(0.8);
    background: url(../../img/pop/msg_bg.png) no-repeat top center;
    background-size: 100%;
    border: none;
}

.dialog-info-content {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 2.7rem;
    font-size: 0.23rem;
    padding: 0 0.7rem 0 0.8rem;
}

.dialog-info-content div {
    word-break: break-all;

}

.dialog-info-text {
    /* flex: 1; */
}


.dialog-info-icon {
    width: 0.71rem;
    height: 0.43rem;
    background: url(../../img/pop/msg_icon.png) no-repeat top center;
    background-size: 100%;
    margin-right: 0.1rem;
}

.dialog-logout .dialog-info-content {
    display: flex;
    flex-direction: column;
    margin-top: 0.2rem;
}

.dialog-info-btns {
    display: flex;
    justify-content: space-between;
    margin-top: 0.3rem;
    gap: 0.8rem;
}

.dialog-info-btn {
    width: 1.4rem;
    height: 0.53rem;
    line-height: 0.53rem;
    text-align: center;
    cursor: pointer;
    background: url(../../img/pop/pop_btn_ca.png) no-repeat top center;
    background-size: 100%;
}

.dialog-info-btn-ok {
    background: url(../../img/pop/pop_btn_ok.png) no-repeat top center;
    background-size: 100%;
    color: #FFFFFF;
}

.dialog-info-btn-cancel {
    color: #22242E;
}

.dialog-activity-main {
    border: none;
    width: 8rem;
    height: auto;
    display: flex;
    justify-content: center;
}

.dialog-activity-main img {
    width: 100%;
    height: auto;
    max-height: 80vh;
    object-fit: contain;
    display: block;
}

/* ====== 订单表格（合并整理） ====== */
.dialog-order .dialog-main {
    width: 9.76rem;
    height: 8.62rem;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(0.8);
    background: url(../../img/pop/order_bg.png) no-repeat top center;
    background-size: 100%;
    border: none;
    padding: 0.2rem;
}

.order-table-wrap {
    max-height: 7.4rem;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    box-sizing: border-box;
    margin-top: 0.2rem;
}

.order-table {
    width: 100%;
    border-collapse: separate;
    /* 使用 separate 支持行间隙 */
    border-spacing: 0 0.2rem;
    /* 横向 0，纵向 0.2rem 的行间隙 */
    margin-top: -0.2rem;
    table-layout: fixed;
    /* 列宽由 colgroup 决定 */
}

/* 表头（sticky） */
.order-table thead th {
    position: sticky;
    top: 0;
    z-index: 50;
    /* 确保覆盖滚动内容 */
    background: RGBA(255, 235, 233, 1);
    padding: 0.12rem 0.16rem;
    text-align: center;
    font-size: 0.27rem;
    font-weight: normal;
    line-height: 0.36rem;
}

/* 单元格通用（只保留一份） */
.order-table th,
.order-table td {
    box-sizing: border-box;
    padding: 0.12rem 0.05rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 0.21rem;
}

/* 行高与垂直居中 */
.order-table tbody tr {
    height: 0.36rem;
    line-height: 0.36rem;
    font-size: 0.21rem;
}

/* 可换行的列（例如商品名称） */
.order-table td.product-name {
    white-space: normal;
    word-break: break-word;
    line-height: 0.44rem;
}

/* 展开行 */
.order-expand-row {
    height: auto;
}

.order-expand-row td {
    white-space: normal;
    line-height: 0.22rem;
    background: rgba(0, 0, 0, 0);
}

.order-expand-row td:first-child,
.order-expand-row td:last-child {
    border-radius: 0.12rem;
}

/* 行背景与圆角（背景应用到 td） */
.order-row {
    background: transparent;
}

.order-row td {
    background: rgba(255, 127, 14, 0.2);
    overflow: hidden;
    text-align: center;
}

.order-row td:first-child {
    border-top-left-radius: 0.12rem;
    border-bottom-left-radius: 0.12rem;
    padding-left: 0.16rem;
}

.order-row td:last-child {
    border-top-right-radius: 0.12rem;
    border-bottom-right-radius: 0.12rem;
    padding-right: 0.16rem;
}

/* 恢复 tbody 默认行为，避免旧规则冲突 */
.order-table tbody,
.order-table tbody tr {
    height: auto;
    overflow: visible;
}

/* 操作与分页 */
.order-actions .btn-link {
    cursor: pointer;
    display: inline-block;
    width: 0.16rem;
    height: 0.19rem;
    background: url(../../img/pop/pop_arrow.png) no-repeat top center;
    background-size: 100%;
    margin-top: 0.1rem;
}

.btn-link.expanded {
    transform: rotate(90deg);
}

.order-expand-row td {
    padding: 0 0.05rem
}

.order-detail {
    display: flex;

}

.order-detail-left {
    width: 3rem;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.order-detail-left-img {
    width: 1.46rem;
    height: 1.46rem;
    background: url(../../img/pop/order_img.png) no-repeat top center;
    background-size: 100%;
    /* margin-bottom: 0.1rem; */
    position: relative;
}

.order-detail-left-img-num {
    position: absolute;
    font-size: 0.24rem;
    bottom: 0;
    right: -0.36rem;
}

.order-detail-left-img .product-info-tip2 {
    top: 1.14rem;
    width: 1.25rem;
    height: 0.2rem;
    line-height: 0.2rem;
    font-size: 0.13rem;
}

.order-detail-left-img>img {
    width: 100%;
    height: 100%;
}

.order-detail-center {
    flex: 1;
    font-size: 0.21rem;
    line-height: 0.36rem;
}

.order-detail-right {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: right;
    margin-right: 0.1rem;
}

.order-detail-right-status {
    color: #548235;
    font-size: 0.19rem;
    text-align: right;
}

.order-detail-right-btn {}


.order-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    margin-top: 0.12rem;
    position: absolute;
    bottom: 0.4rem;
    left: 50%;
    transform: translateX(-50%);
}

.page-btn {
    padding: 0.06rem 0.14rem;
    border-radius: 0.06rem;
    border: 1px solid rgba(0, 0, 0, 0.08);
    background: #fff;
    cursor: pointer;
}

.page-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

.page-info {
    font-size: 0.22rem;
    color: #333;
}

.order-empty,
.order-loading {
    text-align: center;
    padding: 0.4rem 0;
    color: #666;
    font-size: 0.22rem;
}

.dialog-rule-main {
    width: 7.69rem;
    height: 7.64rem;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0.8);
    background: url(../../img/pop/pop_rule.png) no-repeat top center;
    background-size: 100% 100%;
    padding: 1.1rem 0.4rem 0.4rem;
    box-sizing: border-box;
    border: none;
}

.dialog-rule-title {
    font-size: 0.4rem;
    text-align: center;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 0.4rem;
    width: 100%;
}

.dialog-rule-content {
    height: 5.9rem;
    overflow-y: auto;
    line-height: 0.3rem;
    font-size: 0.19rem;
}

.mt-10 {
    margin-top: 0.1rem;
}

/* 下拉列表 */

.dropdown {
    position: relative;
    cursor: pointer;
}

.dropdown-menu {
    display: none;
    position: absolute;
    right: 50%;
    transform: translateX(50%);
    top: 100%;
    background: rgba(255, 201, 147, 0.42);
    min-width: 1.48rem;
    z-index: 1000;
    overflow: hidden;
}

.dropdown:hover .dropdown-menu {
    display: block;
}

.dropdown-item {
    display: block;
    padding: 0.11rem 0.12rem;
    color: #2F2F2F;
    font-size: 0.24rem;
    line-height: 0.24rem;
}

.dropdown-item:hover {
    background: rgba(255, 201, 147, 0.62);
}

.dialog-pay-success .dialog-info-content {
    padding: 0;
}