@import './../index.scss';

.ant-message {
  .ant-message-notice {
    .ant-message-notice-content {
      padding: 0;
      background: transparent;
      border-radius: 0;
      box-shadow: none;

      .ant-message-custom-content {
        max-width: 500px;
        min-width: 260px;
        min-height: 40px;
        padding: 15px 30px;
        font-size: $frame-second-fontsize;
        line-height: 26px;
        color: white;
        text-align: left;
        border: 0;
        border-radius: 6px;
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16);

        > i {
          display: none;
        }

        &.ant-message-success {
          background: $special-state-color-pass;
        }

        &.ant-message-error {
          background: $special-state-color-error;
        }

        &.ant-message-warning {
          background: $special-state-color-unknown;
        }
      }
    }
  }
}

.eb-tip-modal {
  .amos-modal-container {
    border-radius: 6px;
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.16);

    .eb-tip-modal-content {
      padding: 2px 0 16px;
      color: $frame-fourth-color;

      .eb-tip-modal-img {
        display: flex;
        width: 100%;
        height: 118px;
        align-items: center;
        justify-content: center;

        > img {
          height: 100%;
        }
      }

      .eb-tip-modal-msg {
        padding: 0 15px;
        margin-top: 15px;
        font-size: 15px;
        text-align: center;
        white-space: pre-line;
      }

      .eb-tip-check-input {
        position: relative;
        top: 2px;
        padding-top: 5px;
        font-size: $frame-second-fontsize;
        text-align: center;

        > input {
          position: relative;
          top: 2px;
        }
      }
    }

    .amos-modal-content {
      padding: 0;

      > div {
        .amos-modal-confirm-body {
          > i {
            display: none;
          }

          .amos-modal-confirm-title {
            display: flex;
            width: 100%;
            height: 30px;
            padding: 0 0 0 18px;
            font-size: $frame-second-fontsize;
            font-weight: normal;
            color: $frame-fourth-color;
            align-items: center;
            background: $modal-header-bg;
            border-bottom: $frame-main-bordercolor;
          }
        }

        .amos-modal-confirm-content {
          padding: 0;
          margin: 0;
        }
      }
    }

    .amos-modal-confirm-btns {
      display: flex;
      width: 100%;
      height: 60px;
      margin: 0;
      background: $modal-footer-bg;
      border-top: 1px solid $frame-main-bordercolor;
      align-items: center;
      justify-content: flex-end;

      .amos-btn {
        height: 32px;
        padding: 0 20px;
        font-size: $frame-second-fontsize;
        border: 0;
        border-radius: 6px;

        &:last-child {
          margin-right: 35px;
          margin-left: 32px;
          color: $frame-third-color;
          background: $frame-main-color;
        }

        &:first-child {
          position: absolute;
          top: 0;
          right: 0;
          display: flex;
          width: 30px;
          height: 30px;
          padding: 0;
          font-size: 12px;
          color: transparent;
          background: red;
          border-radius: 0 6px 0 0;
          align-items: center;
          justify-content: center;

          &::after {
            position: absolute;
            display: block;
            width: 20px;
            height: 20px;
            background-image: url('~@gm/graphmod-assets/assets/common/closeWhite.png');
            background-size: 100%;
            content: '';
          }
        }
      }
    }
  }
}

.mods-com-tip-modal {
  .amos-modal-container {
    background: $background-transparent;
    border-radius: 6px;
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.16);

    .amos-modal-content {
      position: relative;
      padding: 0;

      .amos-modal-ghost-title {
        display: block;
        width: 100%;
        height: 30px;
        padding-left: 23px;
        font-size: 15px;
        font-weight: normal;
        line-height: 30px;
        // color: #333;
        color: $font-color-333333;
        // background-image: linear-gradient(180deg, #f6f6f6 0%, #eee 100%);
        // border-bottom: solid 1px #eaeaea;
        background: $tip-modal-title-background;
        border-bottom: solid 1px $border-color-eaeaea;
      }

      .amos-modal-ghost-content {
        padding: 0;
        margin: 0;
      }

      .mods-com-tip-modal-img {
        display: flex;
        height: 120px;
        align-items: center;

        img {
          max-height: 100%;
          object-fit: contain;
        }
      }

      .mods-com-tip-modal-content {
        display: flex;
        align-items: center;
        flex-direction: column;
        padding: 10px 20px 15px;
        font-size: 14px;
        line-height: 21px;
        // color: #3d3d3d;
        color: $font-color-3d3d3d;
        background: $tip-modal-content-background;

        .mods-com-tip-modal-msg {
          margin-top: 10px;
        }
      }

      .amos-modal-ghost-btns {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        width: 100%;
        height: 60px;
        padding: 0;
        margin: 0;
        // background-color: #f2f2f2;
        // border: solid 1px #eaeaea;
        background: $tip-modal-footer-background;
        border: solid 1px $border-color-eaeaea;

        .amos-btn {
          height: 32px;
          padding: 0 20px;
          font-size: $frame-second-fontsize;
          border: 0;
          border-radius: 6px;

          &.mods-com-tip-modal-ok {
            margin-right: 22px;
            margin-left: 32px;
            // color: $frame-third-color;
            // background: $frame-main-color;
            background: $eb-modal-btn-save-background;
          }

          &.mods-com-tip-modal-cancel {
            // color: #999;
            // background: white;
            // border: solid 1px #deddde;
            color: $font-color-999999;
            background: $eb-modal-btn-cancel-background;
            border: 1px solid $eb-modal-btn-cancel-border;
          }
        }
      }

      .mods-com-tip-modal-close {
        position: absolute;
        top: 0;
        right: 0;
        display: inline-block;
        width: 30px;
        height: 30px;
        background: red;
        background-image: url('~@gm/graphmod-assets/assets/common/closeWhite.png');
        background-position: center;
        background-size: 80%;
        border-radius: 0 5px 0 0;
      }
    }
  }
}
