/* Scroll Lock */
.inveterate__scroll-lock {
  height: 100vh !important;
  overflow: hidden !important;
}

/* Popup */
.inveterate__popup {
  align-items: center;
  background-color: hsla(0, 0%, 0%, 0.2);
  display: none;
  height: 100vh;
  justify-content: center;
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 2147483647;
}

.inveterate__popup.inveterate__visible {
  display: flex;
}

.inveterate__popup__inner {
  background-color: #ffffff;
  border-radius: 10px;
  padding: 50px;
  max-height: 90vh;
  max-width: 95%;
  text-align: center;
  width: 600px;
}

.inveterate__popup__heading {
  color: black;
  font-size: 22px;
  line-height: 30px;
  margin-top: 0;
}

.inveterate__popup__body {
  color: black;
  font-size: 16px;
  margin-bottom: 50px;
  margin-top: 0;
}

.inveterate__popup__link {
  align-items: center;
  border-radius: 4px;
  display: inline-flex;
  font-size: 16px;
  justify-content: center;
  padding: 10px 20px;
  text-decoration: none;
}

/* Manage Membership Link */
.inveterate-manage-membership {
  opacity: 0;
  visibility: hidden;
}

.inveterate-manage-membership.inveterate-visible {
  opacity: 1;
  visibility: visible;
}

/* KEEP START  */
/*
  The `invetearte` typo is something that is also in the
  documentation merchants have used when adding the
  manage membership link. Due to this, we need to keep
  this code for legacy reasons even though we have the
  corrected version above.
*/
.invetearte-manage-membership {
  opacity: 0;
  visibility: hidden;
}
.invetearte-manage-membership.inveterate-visible {
  opacity: 1;
  visibility: visible;
}
/* KEEP END */