@import "../../style/index.scss";

$modal-max-width: 50vw;
$modal-top-position: 10vh;
$modal-max-height: 80vh;

.amp-dialog {
  .MuiDialog-paper {
    box-shadow: none;
    border-radius: var(--default-border-radius);
    border: $border-dark;
    width: max-content !important;
    max-width: $modal-max-width;
    min-width: var(--modal-min-width);
    max-height: $modal-max-height !important;
    overflow: auto;
    margin-top: $modal-top-position !important;
    margin-bottom: 0 !important;
    background-color: var(--gray-90) !important;
    padding: var(--double-spacing);
    box-sizing: border-box;
  }

  .MuiDialog-container {
    align-items: flex-start;
  }

  &__title {
    font-size: 18px;
    font-weight: 600;
  }

  & &__header {
    @include semiBold;
    color: var(--gray-base);
    background-color: transparent;
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: none;
    border-radius: var(--default-border-radius) var(--default-border-radius) 0 0;
    margin-bottom: var(--large-spacing);
  }

  & &__body {
    background-color: transparent;
    box-sizing: border-box;
    color: var(--gray-base);

    .amp-form {
      .select-field {
        max-width: none;
      }

      .text-input input {
        max-width: none;
      }
    }
  }

  &--warning {
    .MuiDialog-paper {
      border-top: 3px solid var(--theme-orange);
    }
  }

  &--success {
    .MuiDialog-paper {
      border-top: 3px solid var(--theme-green);
    }
  }

  &--error {
    .MuiDialog-paper {
      border-top: 3px solid var(--theme-red);
    }
  }
}
