/* ---------------------------------- */
/*  Dialog V2                         */
/* ---------------------------------- */

.application.dialog {
  padding: 0;
  margin: 0;
  // height: fit-content (from dialog UA) + flex: 1 on children behaves badly in Safari.
  height: auto;
  // The dialog:modal UA rule sets inset-block-end: 0; combined with our inline top and height: auto that stretches
  // the dialog to fill the viewport. We position modals via inline top/left, so clear the bottom inset.
  &:modal { inset-block-end: auto; }
  &:not([open]) { display: none; }
}

/* ----------------------------------------- */
/* Dialog Windows                            */
/* ----------------------------------------- */

.dialog {
  .dialog-content {
    font-size: var(--font-size-14);
  }
  .dialog-buttons {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-top: 1rem;
    button {
      --button-size: var(--input-height);
      flex: 2;
      &.default {
        flex: 3;
      }
    }
  }
}