@import '../index.less';
@ant-modal: ~'@{ant-prefix}-modal';
@btri-modal: ~'@{ant-prefix}-btri-modal';
@btri-icon: ~'@{ant-prefix}-btri-icon';

.title() {
  padding-bottom: 16px;
  font-size: 16px;
  line-height: 24px;
  font-weight: 600;
  color: var(--title-font);
}

.@{btri-modal} {
  &-box {
    border-radius: var(--border-radius-base);
  }
  &-box--biggest {
    padding-bottom: 0 !important;
  }
  &-footer {
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }
  &-footer-okBtn {
    margin-left: 12px !important;
  }
  &-cancelBtn {
    display: inline-block !important;
    margin-right: 4px;
    &.@{ant-prefix}-btri-btn-secondary.@{ant-prefix}-btn {
      background-color: var(--primary-1) !important;
      border: 2px solid var(--primary-1) !important;
      color: var(--primary-6) !important;
      border-color: var(--primary-1) !important;
      &:hover {
        background-color: var(--primary-2);
        border: 2px solid var(--primary-2);
      }
      &:focus {
        background-color: var(--primary-2);
        border: 2px solid var(--primary-2);
        outline: none;
      }
    }
  }
}

.@{btri-modal}-box {
  &--biggest {
    .@{ant-modal} {
      &-content {
        max-height: calc(100vh - 80px);
      }
    }
  }

  .@{ant-modal} {
    &-content {
      padding: 24px;
    }
    &-header,
    &-body,
    &-footer {
      padding: 0 !important;
      border: 0;
    }
    &-title {
      .title();
    }
    &-body {
      margin-bottom: 24px;
      font-size: 14px;
      line-height: 22px;
      color: var(--body-font);
    }
    &-close {
      top: 11px;
      right: 10px;
    }
  }
}
.@{btri-modal}-noContent {
  .@{ant-modal}-title {
    padding-bottom: 0;
  }
}

.@{btri-modal}-noFooter {
  .@{ant-modal}-body {
    margin-bottom: 0px;
  }
  .@{ant-modal}-content {
    padding-bottom: 32px;
  }
}

.@{btri-modal}-confirm {
  &-title {
    display: flex;
    align-items: center;
    gap: 8px;
    .title();
  }

  &-noIcon {
    .@{ant-modal}-confirm-content {
      padding-left: 0;
    }
  }

  .@{ant-modal} {
    &-body {
      padding: 0 !important;
      margin-bottom: 0 !important;
    }
    &-confirm-content {
      margin-top: 0 !important;
      padding-left: 32px;
    }
    &-close {
      top: 12px;
    }
  }
}