.confirm-dialog {
  --el-messagebox-width: 600px;
  @apply p-0 border-none rounded-lg;
  box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.15);

  & .custom-icon {
    margin-left: -3.5rem;
    margin-top: -2rem;
  }

  & .el-message-box__header {
    @apply pl-20 pt-8 pb-2;

    & .el-message-box__title {
      @apply text-black font-semibold text-base;
    }
  }

  & .el-message-box__content {
    @apply pl-20 pb-8 pr-6 pt-0;
  }

  & .el-message-box__btns {
    @apply px-6 py-4 flex justify-end items-center gap-4 bg-gray-50;
  }


  /* Custom stylesheets for confirmation dialogs */

  &--vertical {
    --el-messagebox-width: 400px;
    @apply p-6 border-none rounded-lg;
    box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.15);

    & .custom-icon {
      @apply m-0;
    }

    & .el-message-box__header {
      @apply hidden;
    }

    & .el-message-box__content {
      @apply pb-8 pt-0;
    }

    & .el-message-box__content {
      @apply px-0;
    }

    & .el-message-box__btns {
      @apply px-0 py-0 bg-transparent flex-col-reverse justify-center items-center gap-2;
      button {
        @apply m-0;
      }
    }
  }
}