.mat-mdc-dialog-panel{
  .mat-mdc-dialog-container{
    --mat-dialog-transition-duration: 0ms !important;
    padding: 16px !important;
    margin: 0 !important;
    background-color: var(--color-surface-neutral-idle) !important;
    border-radius: var(--border-radius-interface) !important;
  }
  .mat-mdc-dialog-title{
    font-size: var(--font-size-l) !important;
    font-weight: var(--font-weight-700) !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .mdc-dialog__title::before{
    display: none;
  }
  .subtitle{
    font-size: var(--font-size-m);
    color: var(--color-on-surface-neutral-secondary)
  }
  .mat-mdc-dialog-content{
    color: var(--color-on-surface-neutral-primary) !important;
  }
}


.full-bleed-dialog .mat-mdc-dialog-container {
  padding: var(--spacing-large) 0 !important;
  background-color: transparent !important;
}

.mat-mdc-dialog-container .mat-mdc-tab-body-content{
  font-family: var(--font-families-body);
}

.no-padding-dialog {
  .mat-mdc-dialog-container {
    padding: var(--spacing-medium) 0 !important;
  }

  td.mat-cell:first-of-type, th.mat-header-cell:first-of-type {
    padding-left: var(--spacing-medium) !important;
  }

  .mat-mdc-dialog-content {
    margin: 0;
  }

  .mat-mdc-dialog-content {
    padding: 0;
  }

  .mat-mdc-dialog-actions {
    padding: var(--spacing-medium) !important;
    padding-bottom: 0 !important;
  }
}

.full-screen-modal {
  width: 100%;

  .mat-mdc-dialog-container {
    border-radius: var(--border-radius-zero);
    height: 100vh;
    padding: 0 !important;
    overflow: hidden;
  }
}

.mat-mdc-dialog-container {
  .mdc-card {
    padding: 0 !important;
  }

  .mat-mdc-tab-body-content {
    max-height: 65vh;
    overflow-y: auto !important;
  }
}

.close-dialog {
  position: absolute;
  right: 0;
  top: 16px;
}

.mat-mdc-dialog-container .close-button:hover {
  color: var(--color-on-surface-brand);
}

/* Dialogs */
.mat-mdc-dialog-container .mdc-dialog__surface{
  box-shadow: none !important;
  border-radius: 0 !important;
  background-color: transparent !important;
}
.mat-mdc-dialog-container .mdc-dialog__container{
  transition-duration: 0ms !important;
}
.mdc-dialog__container{
  transform: scale(1) !important;
}

.mdc-dialog .mdc-dialog__content{
  padding: 0 !important;
}
.mat-mdc-dialog-container .mdc-dialog__title{
  padding: 0 !important;
}
.mat-mdc-dialog-container {
  position: relative;
  background: var(--color-surface-default-default) !important;
  width: 100% !important;
  max-width: 600px !important;
  margin: var(--spacing-medium);
  padding: var(--spacing-medium) !important;
  padding-top: 0 !important;
  border-radius: var(--border-radius-interface) !important;
  h6.mat-mdc-dialog-title{
    font-family: var(--typography-h6-font-family);
    font-weight: var(--typography-h6-font-weight);
    line-height: var(--typography-h6-line-height);
    font-size: var(--typography-h6-font-size);
    letter-spacing: var(--typography-h6-letter-spacing);
    color: var(--color-on-surface-default)
  }
  @media screen and (max-width: 640px) {
    min-width: initial !important;
    width: 96% !important;
    margin: 0 auto;
  }

  .mat-mdc-dialog-actions {
    padding: var(--spacing-medium) 0;
    padding-bottom: 0 !important;
    button {
      margin-left: var(--spacing-small) !important;
    }
    button.mat-button{
      min-width: initial;
    }
  }

  .close-dialog {
    position: absolute;
    right: 0;
    top: 0;
    cursor: pointer;
  }
  .tabs-navigation{
    position: absolute;
    z-index: 3;
    right: 0;
    top: 12px;
  }
}

/* Dialog sizes */

.mat-mdc-dialog-panel{
  max-width: 400px !important;
}

.dialog-small{
  .mat-mdc-dialog-container{
    max-width: 400px !important;
  }
}
.dialog-medium{
  .mat-mdc-dialog-container,
  &.mat-mdc-dialog-panel{
    max-width: 600px !important;
  }
}
.dialog-big{
  .mat-mdc-dialog-container,
  &.mat-mdc-dialog-panel{
    max-width: 800px !important;
  }
}
.dialog-large{
  .mat-mdc-dialog-container,
  &.mat-mdc-dialog-panel{
    max-width: 1600px !important;
  }
}
.dialog-full-screen{
  .mat-mdc-dialog-container,
  &.mat-mdc-dialog-panel{
    max-width: 100% !important;
    height: 100vh !important;
    margin: 0;
    border-radius: var(--border-radius-zero);
  }
}

.dialog-navigation-steps{
  .mat-mdc-tab-header{
    margin-left: -36px;
    width: calc(100% + 72px);
  }
  .mat-mdc-tab-label-container{
    padding-right: 250px;
    padding-left: 36px;
    .mdc-tab-indicator .mdc-tab-indicator__content{
      display: none;
    }
    .mdc-tab{
      padding: 0;
      min-width: initial;
      font-size: var(--font-sizes-medium);
      position: relative;
      font-weight: var(--font-weights-500);
      font-family: var(--font-families-body);
      &:after{
        display: inline-block;
        font-family: 'unicons-line';
        speak: none;
        text-transform: none;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        vertical-align: top;
        content: "\eb6d";
        position: absolute;
        top: 13px;
        right: 2px;
        color: var(--color-surface-default-default);
        font-size: var(--font-sizes-2xl);
      }
      &:last-of-type:after{
        display: none
      }
    }
    .mdc-tab.mdc-tab--active{
      border-bottom: 2px solid transparent !important;
    }
  }
  .mat-tab-body{
    padding-top: var(--spacing-medium);
  }
}

.mat-mdc-dialog-container{
  pre{
    background-color: var(--color-surface-alt-default);
    border-radius: var(--border-radius-interface);
    padding: 0 var(--spacing-medium);
    code{
      color: var(--color-on-surface-alternative);
      font-size: var(--font-sizes-small);
      padding: 0;
    }
  }
}

.dialog-navigation-steps .mat-mdc-tab-label-container .mdc-tab:after{
  right: 0;
  top: 19px;
}

.dialog-navigation-steps {
  .mat-mdc-tab-labels{
    margin-bottom: 12px;
  }
  .mat-mdc-tab-header {
    margin-left: -24px;
    width: calc(100% + 48px);
  }
  .mat-mdc-tab-label-container {
    padding: 0 8px !important;
  }
  &.mat-tertiary .mat-mdc-tab-label-container {
    background-color: var(--color-surface-default-default) !important;
    .mdc-tab:after {
      color: var(--color-on-surface-neutral) !important;
      right: -8px;
    }
    .mdc-tab {
      color: var(--color-on-surface-default) !important;
      &.mdc-tab--active {
        color: var(--color-on-surface-brand) !important;
      }
    }
  }
}

.dialog-no-padding,
.no-padding{
  .mat-mdc-dialog-container {
    padding: 0 !important;
    overflow-x: hidden;
  }
  .mat-mdc-dialog-content{
    padding: 0 48px 24px !important;
  }
  .close-dialog{
    right: 16px;
  }
}

.dialog-full-screen .mat-mdc-dialog-content {
  max-height: calc(100vh - 24px) !important;
}
.dialog-full-screen {
  .mat-mdc-dialog-container {
    padding: 24px !important;
  }
  .close-dialog {
    top: 0 !important;
  }
}

.mat-mdc-dialog-container .empty-state-card {
  box-shadow: none !important;
}
