:root {
  --fr-scrollbar-width: 17px;
  --fr-modal-body-offset-vertical: 3rem;
  --fr-modal-body-offset-horizontal: 3rem;
}

.fr-modal {
  display: flex;
  align-items: center;
  justify-content: center;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1000;
  visibility: hidden;
  opacity: 0;
  padding-left: var(--fr-modal-body-offset-horizontal);
  padding-right: var(--fr-modal-body-offset-horizontal);
  padding-top: var(--fr-modal-body-offset-vertical);
  padding-bottom: var(--fr-modal-body-offset-vertical);
  /* pointer-events: none; */
}

.fr-modal--hide {
  display: none;
}

.fr-modal .fr-modal__body {
  transform: scale(0.99) translateY(.6rem);
}

.fr-modal.fr-modal--open .fr-modal__body {
  transform: scale(1) translateY(0);
}

.fr-modal__overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.fr-modal__trigger--higher-index {
  z-index: 99999999;
}


.fr-modal__body {
  position: relative;
  z-index: 1000;
  box-sizing: border-box;
  max-width: calc(100% - var(--fr-modal-body-offset-horizontal) * 2);
  max-height: calc(100% - var(--fr-modal-body-offset-vertical) * 2);
}

.fr-modal__close-icon-wrapper {
  position: absolute;
  aspect-ratio: 1;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  z-index: 1001;
}

.fr-modal__close-icon {
  line-height: 1
}

.fr-modal--open, .iframe .fr-modal {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;

}

.iframe .fr-modal {
    display: none;
  }

:focus {
  outline: 2px solid red;
}

/* Clicking outside modal breaks modal */

.iframe .fr-modal {
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
}

/* FIX Can't access children when there are more than 1 modals on page */

.iframe .fr-modal {
  display: flex!important;
 }

.iframe .fr-modal[fr-builder="hide"], .iframe [data-fr-modal="true"] {
 display: none!important;
 pointer-events: none!important;
 z-index: -1!important;
}

.fr-modal {
  z-index: 9999999;
}


.iframe .fr-modal:has(.fr-modal[fr-builder="hide"]) {
  display: none!important;
 }

 /*FIX Templated model that stays opened overlays other pages/tempaltes */

 .brx-body.iframe .fr-modal:not([data-index])
 {
  display: none;
}

.brx-body.iframe .brxe-fr-modal:not([data-index]) *,
.brx-body.iframe .brxe-fr-modal:not([data-index]) {
    display: none;
    pointer-events: none;
}

.iframe main.bricks-static-content {
  z-index: -1;
}

/* Scrollable modal */ 

.fr-modal[data-fr-modal-scroll="true"] .fr-modal__body {
  overflow-y: scroll;
}

.fr-modal[data-fr-modal-scrollbar="true"] .fr-modal__body::-webkit-scrollbar {
  display: none;
}

.fr-modal[data-fr-modal-scrollbar="true"] .fr-modal__body {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}


/* scrolling preventer */

body.fr-modal-prevent-scroll {
  overflow-y: hidden;  
}


body.fr-modal-body-padding {
  padding-right: var(--fr-scrollbar-width);
}