@import '@/static/style/mixin-svg.scss';

.new-skuName-cell {
    box-sizing: border-box;
    padding: 30rpx;
    display: flex;
    align-items: center;
    background-color: rgb(255, 255, 255);

    #{&}-left {
        flex: none;
        margin-right: 20rpx;
        @include svg_icon(loading, 4EB331);
        background-repeat: no-repeat;
        background-position: center;
        background-size: 40rpx;

        .img {
            border-radius: 10rpx;
            width: 280rpx;
            height: 280rpx;
            border: 2rpx solid #efefef;
            // background: white;
        }
    }

    #{&}-right {
        flex: auto;
        height:280rpx;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    .skuNameId{
        color:#818181;
        font-size: 28rpx;
    }

    .name {
        font-size: 36rpx;
        color: #333;
    }

    .update-price {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .price {
        font-size: 38rpx;
        font-weight: 500;
        color: $jx-primary;
    }

    .btn-updatePrice {
        @include svg_icon(modify, 999);
        width: 60rpx;
        height: 60rpx;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 40rpx;
        background-color: white;
    }

    .tips {
        font-size: 28rpx;
        color: #999;
    }

    .check-display {
        color: #f44;
        font-size: 24rpx;
        font-weight: bold;
        animation: rubberBand 1s infinite alternate;
    }

    .update-price-input {
        box-sizing: border-box;
        padding: 20rpx;

        .top {
            font-size: 24rpx;
            color: #666;
        }

        .audit {
            color: red;
        }

        input {
            border: 1rpx solid #cdcdcd;
            border-radius: 10rpx;
            font-size: 36rpx;
            padding: 10rpx;
            text-align: center;
            color: #333;
        }
    }
}

.new-sku-cell {
    padding: 20rpx 0;
    border-bottom: 1rpx solid #cdcdcd;

    .flex-wrapper {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    #{&}-left {
        position: relative;
        // display: flex;
        text-align: center;
        // background: red;
        width: 200rpx;
    }

    #{&}-right {
        display: flex;
        font-size: 30rpx;
        color: #333;
        text-align: center;
    }

    .btn-status {
        // margin: 10rpx;
        background: #cdcdcd;
        border-radius: 10rpx;
        padding: 20rpx 30rpx;
        color: #333;
        font-size: 28rpx;

        &:nth-of-type(2) {
            border-left: 1rpx solid white;
            border-right: 1rpx solid white;
        }
    }

    .active {
        background: $jx-primary;
        color: white;
    }

    .promotion-price {
        color: $jx-primary;
    }

    .cell-bottom,
    .auto-at {
        text-align: center;
        font-size: 26rpx;
        color: #ccc;
    }

    .flex-wrapper-2 {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .cell-bottom {
        flex: auto;
    }

    .auto-at {
        flex: none;
        width: 460rpx;
        color: $jx-primary;
    }
}

// mask


.jx-popup-update {
    box-sizing: border-box;
    padding: 20rpx;
    background-color: #fff;
    border-radius: 0 0 15rpx 15rpx;

    .text {
        display: block;
        width: 100%;
        text-align: center;
        margin-bottom: 25rpx;
        padding-bottom: 10rpx;
        border-bottom: 2rpx solid rgb(234, 234, 234);
    }

    .tip {
        padding: 10rpx 0;

        .money {
            color: $jx-primary;
        }
    }

    .ipt {
        border: 2rpx solid rgb(209, 209, 209);
        text-align: center;
        height: 80rpx;
        border-radius: 5rpx;
    }

    .btn-root {
        display: flex;
        justify-content: space-between;
        margin: 40rpx 0 0rpx 0;

        .btn-esc,
        .btn-ok {
            text-align: center;
            width: 100%;
            padding: 15rpx 0;
            border-radius: 10rpx;
            border: 2rpx solid $jx-primary;
            color: $jx-primary;
        }

        .btn-ok {
            background-color: $jx-primary;
            color: #fff;
            margin-left: 10rpx;
        }

        .btn-esc {
            margin-right: 10rpx;
        }
    }
}