.ss-canva-agreement {
  font-family: PingFangSC-Regular;
  font-size: 14px;
  color: #333;
  /deep/ .ss-dialog__body {
    min-height: 0;
  }
  .ss-canva-agreement-content {
    line-height: 22px;
    p {
      margin: 0;
    }
  }
  .ss-canva-agreement-check-box {
    display: flex;
    margin-top: 20px;
    margin-bottom: 10px;
    .ss-canva-agreement-check-box-content {
      margin: 0;
      margin-left: 9px;
      a {
        color: #1472ff;
        text-decoration: none;
        cursor: pointer;
      }
    }
  }
}

.ss-canva-type-pannel-container {
  font-family: PingFangSC;
  /deep/ .ss-dialog__body {
    padding: 0 7px 12px;
    overflow: hidden;
  }
  &.firefox {
    /deep/ .ss-dialog__body {
      padding: 0 0 12px 7px;
    }
  }
  .ss-canva-type-pannel-content {
    display: flex;
    flex-wrap: wrap;
    min-height: 50vh;
    max-height: 70vh;
    padding: 0 12px;
    padding-bottom: 0;
    border-left: 0;
    border-right: 0;
    border-radius: 0 0 4px 4px;
    overflow: auto;
    &::-webkit-scrollbar {
      width: 8px;
      height: 10px;
      margin: 24px 0;
      background-color: rgba(0, 0, 0, 0);
    }
    &::-webkit-scrollbar-thumb {
      border-radius: 6px;
      background-color: rgba(0, 0, 0, 0.2);
      transition: all 0.4s ease;
      -moz-transition: all 0.4s ease;
      -webkit-transition: all 0.4s ease;
      -o-transition: all 0.4s ease;
    }
    &::-webkit-scrollbar-track {
      background-color: rgba(0, 0, 0, 0);
    }
    .ss-canva-type-item {
      width: 188px;
      height: 180px;
      box-sizing: border-box;
      margin-top: 16px;
      padding: 7.8px;
      border: 1px solid transparent;
      border-radius: 4px;
      cursor: pointer;
      &:hover {
        .ss-canva-type-item-img-box {
          .ss-canva-type-item-mask {
            display: block;
            border: 1px solid #1472ff;
          }
        }
      }
      .ss-canva-type-item-img-box {
        position: relative;
        width: 100%;
        height: 112px;
        border-radius: 4px;
        overflow: hidden;
        .ss-canva-type-item-img {
          width: 100%;
          height: 100%;
          -webkit-user-drag: none;
        }
        .ss-canva-type-item-mask {
          display: none;
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          border-radius: 4px;
        }
      }
      .ss-canva-type-item-des {
        width: 100%;
        height: 55px;
        font-size: 14px;
        margin-top: 12px;
        .ss-canva-type-des-header {
          margin: 0;
          line-height: 22px;
          .ss-canva-type-des-title {
            font-family: PingFangSC-Medium;
            color: #333;
          }
          .ss-canva-type-des-size {
            margin-left: 4px;
            color: #666;
          }
        }
        .ss-canva-type-des-content {
          width: 100%;
          margin: 0;
          margin-top: 8px;
          font-size: 12px;
          color: #999;
          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap;
        }
      }
    }
  }
}