.page-container {
  width: 100%;
  min-height: 100vh;
  box-sizing: border-box;

  .serach-container {
    width: 100%;

    .search-item {
      width: 100%;
      height: 40px;
      display: flex;
      justify-content: center;
      align-items: center;
      padding: 10px 20px;
      box-sizing: border-box;
      position: relative;

      &.mode-item-top {
        display: flex;
        align-items: center;

        .mode-text {
          margin-left: 10px;
          margin-right: 10px;
        }
      }

      &.last {
        height: auto;
      }

      &.radio-last {
        border-top: 1px solid #eee;
      }

      &.last-input {
        &::after {
          content: "";
          position: absolute;
          display: block;
          width: 100%;
          height: 10px;
          bottom: -10px;
          background-color: #ffffff;
        }
      }

      .item-title {
        flex: 1;
        margin-left: 10px;
        margin-bottom: 2px;
      }

      .item-text {
        width: 60%;
        display: flex;
        align-items: center;

        ::v-deep &.u-input {
          flex: none;
          text-align: right;
        }

        ::v-deep .u-radio {
          & + .u-radio {
            margin-left: 5px;
          }
        }
      }

      .left-icon {
        width: 30px;
        height: 30px;
        display: none;
      }

      .right-icon {
        width: 25px;
        height: 25px;
      }
    }
  }

  .body-container {
    height: 540px;
    // margin-top: 10px;

    .page-blank {
      margin-top: 50px;
    }

    .list-container {
      // margin-top: 10px;
      padding: 10px 10px;
      box-sizing: border-box;
      overflow: auto;
    }
  }

  .container-footer {
    width: 100%;
    position: fixed;
    bottom: 0px;
    background-color: #ffffff;

    .operate-choice {
      display: flex;
      align-items: center;
      box-sizing: border-box;
      height: 50px;
      padding-left: 5px;
      gap: 10%;
    }

    .operate-btn {
      width: 100%;
      height: 40px;
      display: flex;
      justify-content: center;
      align-items: center;

      .btn-item {
        width: 50%;
        height: 100%;
      }
    }
  }
}

.pick-select {
  position: absolute;
  z-index: 9999;
  top: 10px;
  left: 50%;
  transform: translate(-50%, 0);
  background: #eee;
  border-radius: 5px;
  padding: 0px 10px;
}

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

::v-deep .uni-modal__title {
  text-align: left;
}

::v-deep .uni-modal__textarea {
  font-size: 14px;
}

@for $i from 0 through 100 {
  .mt-#{$i} {
    margin-top: #{$i}px;
  }
}

@for $i from 0 through 100 {
  .ml-#{$i} {
    margin-left: #{$i}px;
  }
}

@for $i from 0 through 100 {
  .mr-#{$i} {
    margin-right: #{$i}px;
  }
}

@for $i from 0 through 100 {
  .mb-#{$i} {
    margin-bottom: #{$i}px;
  }
}

@mixin tabItem($number) {
  ::v-deep .u-tabs__wrapper__nav__item {
    width: calc(100% / $number);
  }
}
