.p-dialog-mask.p-component-overlay {
  .stepped-dialog {
    padding: 0;

    $iconColor: #d4c4ed;

    &.stepped-dialog--panel {
      .dialog-step {
        padding: 20px;
      }
    }

    .p-dialog-content {
      border-radius: 24px;
      padding: 0 !important;
      height: 100%;
      overflow-x: hidden;

      .dialog-step {
        &__button {
          background: none;
          border: none;
          padding: 3px !important;
          width: auto;
          height: auto;

          &:hover,
          &:active,
          &:focus {
            background: none !important;
            border: none !important;
            box-shadow: none !important;
            color: rgba(255, 255, 255, 0.8) !important;
          }
        }
      }
    }

    .dialog-step {
      padding: 24px;
      display: flex;
      flex-direction: column;
      height: 100%;

      &__header {
        display: flex;
        align-items: center !important;
        padding-bottom: 16px;
        padding-top: 4px;
        min-height: 24px;
      }

      &__footer {
        margin-top: auto;
      }

      &__content {
        display: flex;
        flex-direction: column;
        height: 100%;
        overflow: auto;
        overflow-x: hidden;
        margin: 0 -15px;
        padding: 0 15px;
      }

      &__title {
        box-sizing: border-box;
        font-weight: 600;
        font-size: 20px;
        color: var(--ls-text-color);
      }

      &__divider {
        opacity: 0.15;
        border-bottom: 1px solid var(--ls-text-color);
        margin: 0 -20px;
      }

      &__button {
        background: none;
        border: none;
        padding: 3px !important;
        width: auto;
        height: auto;
        color: transparentize($iconColor, 0.5) !important;

        &:hover,
        &:active,
        &:focus {
          background: none !important;
          border: none !important;
          box-shadow: none !important;
          color: transparentize($iconColor, 0.2) !important;
        }
      }
    }
  }
}