miniProgram/subpagesTwo/seeAlso/seeAico.wxss

page {
    background: #F8F9FA;
}

.content {
    width: 100vw;
    display: flex;
    flex-direction: column;
    padding: 30rpx;
    position: relative;
    box-sizing: border-box;
}

.see-aico-info {
    width: 630rpx;
    height: 84rpx;
    padding: 0 30rpx;
    background: #FFFFFF;
    box-shadow: 20rpx 8rpx 20rpx 0rpx rgba(219, 225, 231, 0.2);
    border-radius: 12rpx 12rpx 12rpx 12rpx;
}

.flex-level-center {
    display: flex;
    /*水平居中*/
    justify-content: center;
}

.flex-vertical-center {
    display: flex;
    /*垂直居中*/
    align-items: center;
}
.flex-column{
    display: flex;
    flex-direction: column;
}
.flex-space-between {
    display: flex;
    justify-content: space-between;
}

.see-aico-item {
    display: flex;
    flex: 1;
    height: 100%;

}

.see-aico-img {
    width: 36rpx;
    height: 36rpx;
    margin-right: 12rpx;
}

.see-aico-text {
    height: 36rpx;
    font-weight: 400;
    font-size: 30rpx;
    color: #333333;
    line-height: 36rpx;
    text-align: left;
    font-style: normal;
    text-transform: none;
    align-items: center;
}

.data-box {
    width: 100%;
}

.start-see-aico {
    margin-top: 440rpx;
    width: 436rpx;
    height: 144rpx;
    background: #FFFFFF;
    box-shadow: 0rpx 8rpx 48rpx 0rpx #E3E4E5;
    border-radius: 40rpx 40rpx 40rpx 40rpx;
    border: 4rpx solid #F6F9FD;
}

.in-see-aico {
    width: 100%;
}

.in-see-aico-prompt {
    display: flex;
    margin: 40rpx 0;
}

.in-see-aico-img {
    width: 60rpx;
    height: 60rpx;
    margin-right: 16rpx;
    animation: rotate 2s linear infinite;
}

.in-see-aico-list {
    width: 100%;
    background: #FFFFFF;
    box-shadow: 20rpx 8rpx 20rpx 0rpx rgba(219, 225, 231, 0.2);
    border-radius: 12rpx 12rpx 12rpx 12rpx;
    margin-bottom: 16rpx;
    box-sizing: border-box;
    padding: 0 30rpx;
}

.input-img {
    height: 30rpx;
    width: 30rpx;
    margin-right: 16rpx;
}

.bindNotesInput {
    height: 40rpx;
    width: 100%;
    font-weight: 400;
    font-size: 26rpx;
    color: #888888;
    line-height: 40rpx;
    text-align: left;
    font-style: normal;
    text-transform: none;
}

.in-see-aico-list-tbm {
    padding-top: 20rpx;
    padding-bottom: 20rpx;
}

.device-name {
    font-weight: 400;
    font-size: 32rpx;
    color: #333333;
    line-height: 36rpx;
    text-align: left;
    font-style: normal;
    text-transform: none;
    margin-right: 20rpx;
}

.device-status-img {
    width: 32rpx;
    height: 32rpx;
}

.in-see-aico-btn {
    width: 116rpx;
    height: 56rpx;
    background: #FFFFFF;
    border-radius: 8rpx 8rpx 8rpx 8rpx;

    font-weight: 400;
    font-size: 28rpx;
    line-height: 36rpx;
    text-align: left;
    font-style: normal;
    text-transform: none;
}

.in-see-aico-submit {
    width: 630rpx;
    height: 90rpx;
    background: linear-gradient(315deg, #0ABCA4 0%, rgba(11, 195, 170, 0.8) 100%);
    border-radius: 292rpx 292rpx 292rpx 292rpx;
    font-weight: 400;
    font-size: 32rpx;
    color: #FFFFFF;
    line-height: 42rpx;
    text-align: center;
    font-style: normal;
    text-transform: none;
    margin: 40rpx auto 0;
}

.c-888 {
    color: #888888;
    border: 1rpx solid #888888;
}

.c-F76666 {
    color: #F76666;
    border: 1rpx solid #F76666;
}

.c-3AA {
    color: #0BC3AA;
    border: 1rpx solid #0BC3AA;
}

/* 定义一个旋转动画 */
@keyframes rotate {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}


.in-see-aico-prompt-box {
    width: 408rpx;
}

.in-see-aico-prompt-title {
    font-weight: 400;
    font-size: 32rpx;
    color: #333333;
    line-height: 48rpx;
    text-align: left;
    font-style: normal;
    text-transform: none;
}

.in-see-aico-prompt-text {
    font-weight: 400;
    font-size: 24rpx;
    color: #888888;
    line-height: 36rpx;
    text-align: left;
    font-style: normal;
    text-transform: none;
}

.start-img {
    width: 72rpx;
    height: 72rpx;
    margin-right: 30rpx;
}

.start-text {
    width: 144rpx;
    height: 36rpx;
    font-weight: 400;
    font-size: 36rpx;
    color: #0BC3AA;
    line-height: 36rpx;
    text-align: left;
    font-style: normal;
    text-transform: none;
}

.end-see-aico-prompt-title {
    font-weight: 400;
    font-size: 32rpx;
    color: #666666;
    line-height: 48rpx;
    text-align: left;
    font-style: normal;
    text-transform: none;
}

.end-see-aico-img {
    width: 60rpx;
    height: 60rpx;
    margin-right: 20rpx;
}

.end-see-aico-list-tbm-1 {
    padding-top: 40rpx;
    padding-bottom: 40rpx;
}

.end-see-aico-list-tbm-2 {
    padding-top: 24rpx;
    padding-bottom: 24rpx;
    width: 100%;
}

.end-see-aico-item {
    width: 100%;
    font-weight: 400;
    font-size: 30rpx;
    color: #333333;
    line-height: 40rpx;
    text-align: left;
    font-style: normal;
    text-transform: none;
}

.see-aico-d-count {
    font-size: 36rpx;
    color: #333333;
    line-height: 40rpx;
}

.normal-d-count {
    font-size: 36rpx;
    color: #0BC3AA;
    line-height: 40rpx;
}

.abnormal-d-count {
    font-size: 36rpx;
    color: #F76666;
    line-height: 40rpx;
}

.mb36 {
    margin-bottom: 36rpx;
}

.end-see-aico-btn-box {
    margin-top: 80rpx;
}
.end-see-aico-btn-1{
    width: 330rpx;
    height: 80rpx;
    background: linear-gradient( 315deg, #0ABCA4 0%, rgba(11,195,170,0.8) 100%);
    border-radius: 292rpx 292rpx 292rpx 292rpx;
}
.end-see-aico-btn-color-1{
    background: linear-gradient( 315deg, #0ABCA4 0%, rgba(11,195,170,0.8) 100%);
}
.end-see-aico-btn-color-2{
    background: linear-gradient( 315deg, #FF6C2E 0%, #FF9B71 100%);
}
.end-see-aico-btn{
    width: 330rpx;
    height: 80rpx;
    border-radius: 292rpx 292rpx 292rpx 292rpx;
    font-weight: 400;
    font-size: 30rpx;
    color: #FFFFFF;
    line-height: 42rpx;
    text-align: center;
    font-style: normal;
    text-transform: none;
}
.popup-box-1{
    width: 572rpx;
    height: 352rpx;
    padding:  0 40rpx;
    background: #FFFFFF;
    border-radius: 24rpx 24rpx 24rpx 24rpx;
    box-sizing: border-box;
}
.popup-box-2{
    width: 572rpx;
    height: 352rpx;
    padding:  0 62rpx;
    background: #FFFFFF;
    border-radius: 24rpx 24rpx 24rpx 24rpx;
    box-sizing: border-box;
}
.popup-title-1{
    font-weight: 400;
    font-size: 32rpx;
    color: #333333;
    line-height: 40rpx;
    text-align: center;
    font-style: normal;
    text-transform: none;
}
.popup-text-1{
    color: #777777;
    margin: 40rpx 0;
    text-align: center;
    text-overflow: ellipsis;
}
.popup-btn-1{
    width: 236rpx;
    height: 72rpx;
    border-radius: 292rpx 292rpx 292rpx 292rpx;
    font-weight: 400;
    font-size: 28rpx;
    color: #FFFFFF;
    line-height: 40rpx;
    text-align: center;
    font-style: normal;
    text-transform: none;
}
.popup-btn-2{
    width: 276rpx;
    height: 72rpx;
    border-radius: 292rpx 292rpx 292rpx 292rpx;
    font-weight: 400;
    font-size: 28rpx;
    color: #FFFFFF;
    line-height: 40rpx;
    text-align: center;
    font-style: normal;
    text-transform: none;
}
.popup-abnormal-img {
    height: 48rpx;
    width: 48rpx;
    margin-right: 16rpx;
}