/* ===== Modal Slide/Fade Animations ===== */
.modal.fade:not(.show).right .modal-dialog {
 /* transform: translate3d(25%, 0, 0); */  /* start off-canvas to the right */
}

/* ===== Responsive Right Drawer ===== */
.modal.right .modal-dialog {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;                 /* <- keep it anchored to the right edge */
  margin: 0;
  height: 100vh;
  max-width: none;
  width: 90vw;              /* mobile default */
}

@media (min-width: 576px) {
  .modal.right .modal-dialog {
    width: 70vw;            /* tablet */
  }
}
@media (min-width: 992px) {
  .modal.right .modal-dialog {
    width: 40vw;            /* desktop */
  }
}

/* ===== Full-Height Content ===== */
.modal.right .modal-content {
  min-height: 100vh;
  border: 0;
}