.p-dialog {
  @apply max-h-[90%] scale-100 drop-shadow-lg rounded-lg border-0 border-none;

  &-mask {
    @apply bg-gray-30;
  }

  &-header {
    @apply bg-white border-b border-solid border-gray-30 gap-4 rounded-t-lg p-4;

    .p-dialog-title {
      @apply text-body-1 font-semibold;
    }

    .p-dialog-header-icon {
      @apply h-6 w-6 text-gray-50;
    }
  }

  &-header-icons {
    @apply flex gap-4 items-center;
  }

  &-header-icon {
    @apply flex items-center justify-center overflow-hidden relative;

    &:enabled {
      &:hover,
      &:focus {
        @apply outline-none text-gray-90;
      }
    }
  }

  &-content {
    @apply overflow-y-auto bg-white overscroll-contain p-4;
  }

  &-header {
    @apply flex items-center justify-between flex-shrink-0;
  }

  &-footer {
    @apply flex-shrink-0 bg-gray-15 flex gap-4 justify-end rounded-b-lg p-4;
  }

  &-enter-active {
    @apply transition-all duration-150 ease-in;
  }

  &-leave-active {
    @apply transition-all duration-150 ease-out;
  }

  &-enter-from,
  &-leave-to {
    @apply opacity-0 scale-75;
  }
}

.p-dialog.p-confirm-dialog {
  .p-dialog-content {
    @apply flex gap-2;
  }
}
