/**  index.wxss  **/
@import "../../../config/styles/mp/index.less";
@import "../../../config/styles/mp/mixins.less";

.page-body {
    height: 100vh;
    display: flex;
    flex: 1;
    flex-direction: column;
    background-color: @oak-bg-color-page;
    box-sizing: border-box;
    .safe-area-inset-bottom();
}

.avatar {
    margin: 10rpx 0;
}


.col {
    margin-top: 20rpx;
    display: flex;
    flex-direction: column;
    padding: 0rpx 10rpx;
    background-color: #fff;

    .left {
        display: flex;
        flex-direction: row;
    }

    .icon {
        width: 16rpx;
        margin-left: 6rpx;
        margin-right: 26rpx;
        text-align: center;
    }

    .label {
        color: @oak-text-color-primary;
    }

    .value {
        color: @oak-text-color-secondary;
        margin-right: 16rpx;

        .primary {
            background-color: @oak-color-primary;
        }

        .success {
            background-color: @oak-color-success;
        }

        .danger {
            background-color: @oak-color-error;
        }

        .warning {
            background-color: @oak-color-warning;
        }
    }
}


.pupop-content {
    display: flex;
    flex-direction: column;
    background-color: #fff;
    min-height: 300rpx;
    .safe-area-inset-bottom();

    .pupop-header {
        padding: 20rpx;
        display: flex;
        flex-direction: column;
        align-items: flex-end;


        .close {
            display: block;
        }
    }

    .pupop-form {
        display: flex;
        flex-direction: column;
        flex: 1;
    }
}