$alert_radius: 18px;

/********************
 * GtkMessageDialog *
 ********************/

window.dialog.message {
  background-color: var(--dialog-bg-color);
  color: var(--dialog-fg-color);

  @media (prefers-contrast: more) {
    &.csd {
      outline: none;
    }
  }

  .titlebar {
    min-height: 32px;
    background: none;
    box-shadow: none;
  }

  box.dialog-vbox.vertical {
    > box > box > box > label.title {
      @extend .title-2;
    }
  }

  &.csd {
    &:not(.solid-csd) {
      border-radius: $alert_radius;
    }

    .dialog-action-area {
      margin: 0;
      padding: 24px;
      padding-top: 21px;
      border-spacing: 12px;

      > button {
        min-height: 24px;
        padding: 10px 20px;
        border-radius: 12px;
      }
    }
  }
}

/********************
 * AdwMessageDialog *
 ********************/

window.messagedialog,
dialog-host > dialog.alert sheet,
window.dialog-window.alert {
  background-color: var(--dialog-bg-color);
  color: var(--dialog-fg-color);
}

dialog-host > dialog.alert sheet {
  border-radius: $alert_radius;

  @media (prefers-contrast: more) {
    outline: none;
  }
}

window.messagedialog,
window.dialog-window.alert {
  &.csd:not(.solid-csd) {
    border-radius: $alert_radius;
  }

  @media (prefers-contrast: more) {
    &.csd {
      outline: none;
    }
  }
}

dialog-host > dialog.alert sheet,
window.dialog-window.alert {
  .body-scrolled-window scrollbar.vertical {
    padding-top: 6px;
  }

  .body-scrolled-window > viewport {
    border-top-left-radius: $alert_radius;
    border-top-right-radius: $alert_radius;
  }
}

window.messagedialog,
dialog.alert {
  .message-area {
    padding-top: 32px;
    padding-bottom: 9px;
    border-spacing: 24px;

    &.has-heading.has-body {
      border-spacing: 10px;

      > .child {
        margin-top: 8px;
      }
    }

    > .heading-bin, > .body, > .child {
      padding-left: 24px;
      padding-right: 24px;
    }
  }

  .response-area {
    padding: 24px;
    padding-top: 12px;
    border-spacing: 12px;

    > button {
      min-height: 24px;
      min-width: 60px;
      padding: 10px 20px;
      border-radius: 12px;
    }
  }

  &.short {
    .message-area {
      padding-top: 24px;
      border-spacing: 18px;

      > .heading-bin, > .body, > .child {
        padding-left: 18px;
        padding-right: 18px;
      }

      &.has-heading.has-body {
        border-spacing: 6px;
      }
    }

    .response-area {
      padding: 18px;
      padding-top: 9px;

      > button {
        min-width: 0;
        padding: 8px 16px;
      }
    }
  }
}
