.bezugsperson-dialog .mud-dialog-content {
  display: block;
  padding: 0 16px;
  overflow-y: scroll;
  scrollbar-width: none;
  max-height: calc(100dvh - 274px); /* height for button and title area + some space on top and bottom */

  /*different dialog style for xs breakpoint*/
  @media (max-width: 600px) {
    max-height: calc(100dvh - 242px);
    scrollbar-width: unset;
  }

  background: /* Shadow Cover TOP */ linear-gradient(white 30%, rgba(255, 255, 255, 0)) center top,
    /* Shadow Cover BOTTOM */ linear-gradient(rgba(255, 255, 255, 0), white 70%) center bottom,
    /* Shadow TOP */ radial-gradient(farthest-side at 50% 0, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0)) center top,
    /* Shadow BOTTOM */ radial-gradient(farthest-side at 50% 100%, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0)) center bottom;
  background-repeat: no-repeat;
  background-size: 100% 40px, 100% 40px, 200% 10px, 200% 10px;
  background-attachment: local, local, scroll, scroll;
}

.bezugsperson-dialog .mud-dialog-title {
  min-height: unset;
  padding: 16px;
}

.bezugsperson-dialog {
  border-radius: 16px;
  box-shadow: 1px 2px 20px -8px #0000004D;
  max-width: 620px;
  background-color: var(--uxi-color-background-light);

  /*different dialog style for xs breakpoint*/
  @media (max-width: 600px) {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    margin: 0;
    width: 100%;
    height: 100%;
    max-height: calc(100dvh - 113px);
  }
}

.bezugsperson-dialog .mud-dialog-actions {
  padding: 16px;
}

.mud-dialog-container:has(.bezugsperson-dialog) {
  /*different dialog style for xs breakpoint*/
  @media (max-width: 600px) {
    align-items: end;
  }
}